diff --git a/README.md b/README.md index 491df7a03108cc0535409918f6ad5c63c6c6ed33..434fe86d2852ac5f1eae38ae109a4cbaed6debbd 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,6 @@ +<<<<<<< HEAD + **TIPS:** 切换到 `dev` 分支进行下一步 +======= ### 完成下列事项即可通过测试 1. 运行项目 @@ -13,4 +16,5 @@ ![输入图片说明](src/static/ezgif-1-369ae55892.gif) 4. 提交PR - 合并到`dev`分支 - - 请将姓名及联系方式写在PR说明中(写在描述里面, 不要写在标题, 以免泄漏个人信息), 以便收取下轮面试通知 \ No newline at end of file + - 请将姓名及联系方式写在PR说明中(写在描述里面, 不要写在标题, 以免泄漏个人信息), 以便收取下轮面试通知 +>>>>>>> b88fe97a41f9e9174fd679fd027c03a38189ee32 diff --git a/src/App.vue b/src/App.vue index 1f7026feb10b5240b1a5596b02bfc19fb5923cee..2d5fa0a71066f9f92556ddefd15d7ec07795ea43 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,15 +1,15 @@ - - + + diff --git a/src/components/TodoItem.vue b/src/components/TodoItem.vue index 924601c5091f500342c6ae99f4e18c015d00ec69..3dde4f31e4a53c3242a1c312bdbd0bdfccc5768f 100644 --- a/src/components/TodoItem.vue +++ b/src/components/TodoItem.vue @@ -1,31 +1,47 @@ + .item { + padding: 12rpx; + display: flex; + align-items: center; + justify-content: space-between; + border: 1px solid #000; + margin-top: 32rpx; + border-radius: 12rpx; + background-color: #fff; + } + .indexTl { + position: -webkit-sticky; + position: sticky; + z-index: 1; + } + .boxleftTo20RX { + transform: translateX(110%) !important; + opacity: 0 !important; + transition: all 1s ease; + } + .boxtestenterX { + transform: translateX(0%) ; + opacity: 1 ; + } + \ No newline at end of file diff --git a/src/main.ts b/src/main.ts index bbbfee515dbf10f47f13fb7bc093c906bded89f5..b12c1ee789e612bf9288cebd46aaf6d771c91fcf 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1,8 +1,8 @@ -import { createSSRApp } from "vue"; -import App from "./App.vue"; -export function createApp() { - const app = createSSRApp(App); - return { - app, - }; -} +import { createSSRApp } from "vue"; +import App from "./App.vue"; +export function createApp() { + const app = createSSRApp(App); + return { + app, + }; +} diff --git a/src/pages.json b/src/pages.json index 59303da17c3092c3950fefd8779014ae05944660..125f0c992fc7762712f7b4e75ae242e3237bc60d 100644 --- a/src/pages.json +++ b/src/pages.json @@ -1,22 +1,22 @@ -{ - "easycom": { - "autoscan": true, - "custom": { - "^uni-(.*)": "@dcloudio/uni-ui/lib/uni-$1/uni-$1.vue" - } - }, - "pages": [ - { - "path": "pages/index", - "style": { - "navigationBarTitleText": "quiz" - } - } - ], - "globalStyle": { - "navigationBarTextStyle": "black", - "navigationBarTitleText": "uni-app", - "navigationBarBackgroundColor": "#F8F8F8", - "backgroundColor": "#F8F8F8" - } -} +{ + "easycom": { + "autoscan": true, + "custom": { + "^uni-(.*)": "@dcloudio/uni-ui/lib/uni-$1/uni-$1.vue" + } + }, + "pages": [ + { + "path": "pages/index", + "style": { + "navigationBarTitleText": "quiz" + } + } + ], + "globalStyle": { + "navigationBarTextStyle": "black", + "navigationBarTitleText": "uni-app", + "navigationBarBackgroundColor": "#F8F8F8", + "backgroundColor": "#F8F8F8" + } +} diff --git a/src/pages/index.vue b/src/pages/index.vue index a2f3de7cbad112b7e28bde04a3f13d6f3ba5530b..0bdeb9ece4c25ec97d489e6b03116bdf66c846c4 100644 --- a/src/pages/index.vue +++ b/src/pages/index.vue @@ -17,14 +17,17 @@ const newTodo = ref(''); const todos = ref([]); const addTodo = () => { - if (newTodo.value && !todos.value.some(todo => todo.text === newTodo.value)) { - todos.value.push({ text: newTodo.value, completed: false }); - newTodo.value = ''; + if (newTodo.value && !todos.value.some(todo => todo.text.trim() === newTodo.value.trim()) && newTodo.value.trim().length > 0) { + todos.value.push({ text: newTodo.value, completed: false }); + newTodo.value = ''; } } const toggleTodo = (index) => { - todos.value.splice(index, 1); + todos.value[index].completed=true + setTimeout(() => { + todos.value.splice(index, 1); + }, 1000); } diff --git a/src/uni.scss b/src/uni.scss index 76c85f52956c05f578b65f9c92dcb290303cd03b..fb36e0745994100616498a2d999987e6f4a43355 100644 --- a/src/uni.scss +++ b/src/uni.scss @@ -1,89 +1,89 @@ -/** - * 这里是uni-app内置的常用样式变量 - * - * uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量 - * 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App - * - */ - -/** - * 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能 - * - * 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件 - */ - -/* 颜色变量 */ - -/* 行为相关颜色 */ -$uni-color-primary: #007aff; -$uni-color-success: #4cd964; -$uni-color-warning: #f0ad4e; -$uni-color-error: #dd524d; - -/* 文字基本颜色 */ -$uni-text-color: #333; // 基本色 -$uni-text-color-inverse: #fff; // 反色 -$uni-text-color-grey: #999; // 辅助灰色，如加载更多的提示信息 -$uni-text-color-placeholder: #808080; -$uni-text-color-disable: #c0c0c0; - -/* 背景颜色 */ -$uni-bg-color: #fff; -$uni-bg-color-grey: #f8f8f8; -$uni-bg-color-hover: #f1f1f1; // 点击状态颜色 -$uni-bg-color-mask: rgba(0, 0, 0, 0.4); // 遮罩颜色 - -/* 边框颜色 */ -$uni-border-color: #c8c7cc; - -/* 尺寸变量 */ - -/* 文字尺寸 */ -$uni-font-size-sm: 12px; -$uni-font-size-base: 14px; -$uni-font-size-lg: 16; - -/* 图片尺寸 */ -$uni-img-size-sm: 20px; -$uni-img-size-base: 26px; -$uni-img-size-lg: 40px; - -/* Border Radius */ -$uni-border-radius-sm: 2px; -$uni-border-radius-base: 3px; -$uni-border-radius-lg: 6px; -$uni-border-radius-circle: 50%; - -/* 水平间距 */ -$uni-spacing-row-sm: 5px; -$uni-spacing-row-base: 10px; -$uni-spacing-row-lg: 15px; - -/* 垂直间距 */ -$uni-spacing-col-sm: 4px; -$uni-spacing-col-base: 8px; -$uni-spacing-col-lg: 12px; - -/* 透明度 */ -$uni-opacity-disabled: 0.3; // 组件禁用态的透明度 - -/* 文章场景相关 */ -$uni-color-title: #2c405a; // 文章标题颜色 -$uni-font-size-title: 20px; -$uni-color-subtitle: #555; // 二级标题颜色 -$uni-font-size-subtitle: 18px; -$uni-color-paragraph: #3f536e; // 文章段落颜色 -$uni-font-size-paragraph: 15px; - -body { - font-family: Arial, sans-serif; -} - -.btn { - background: transparent; - height: auto; - margin-left: 32rpx; - padding: 12rpx 32rpx; - border: 1px solid #ccc; - border-radius: 12rpx; +/** + * 这里是uni-app内置的常用样式变量 + * + * uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量 + * 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App + * + */ + +/** + * 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能 + * + * 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件 + */ + +/* 颜色变量 */ + +/* 行为相关颜色 */ +$uni-color-primary: #007aff; +$uni-color-success: #4cd964; +$uni-color-warning: #f0ad4e; +$uni-color-error: #dd524d; + +/* 文字基本颜色 */ +$uni-text-color: #333; +$uni-text-color-inverse: #fff; +$uni-text-color-grey: #999; +$uni-text-color-placeholder: #808080; +$uni-text-color-disable: #c0c0c0; + +/* 背景颜色 */ +$uni-bg-color: #fff; +$uni-bg-color-grey: #f8f8f8; +$uni-bg-color-hover: #f1f1f1; +$uni-bg-color-mask: rgba(0, 0, 0, 0.4); + +/* 边框颜色 */ +$uni-border-color: #c8c7cc; + +/* 尺寸变量 */ + +/* 文字尺寸 */ +$uni-font-size-sm: 12px; +$uni-font-size-base: 14px; +$uni-font-size-lg: 16; + +/* 图片尺寸 */ +$uni-img-size-sm: 20px; +$uni-img-size-base: 26px; +$uni-img-size-lg: 40px; + +/* Border Radius */ +$uni-border-radius-sm: 2px; +$uni-border-radius-base: 3px; +$uni-border-radius-lg: 6px; +$uni-border-radius-circle: 50%; + +/* 水平间距 */ +$uni-spacing-row-sm: 5px; +$uni-spacing-row-base: 10px; +$uni-spacing-row-lg: 15px; + +/* 垂直间距 */ +$uni-spacing-col-sm: 4px; +$uni-spacing-col-base: 8px; +$uni-spacing-col-lg: 12px; + +/* 透明度 */ +$uni-opacity-disabled: 0.3; + +/* 文章场景相关 */ +$uni-color-title: #2c405a; +$uni-font-size-title: 20px; +$uni-color-subtitle: #555; +$uni-font-size-subtitle: 18px; +$uni-color-paragraph: #3f536e; +$uni-font-size-paragraph: 15px; + +body { + font-family: Arial, sans-serif; +} + +.btn { + background: transparent; + height: auto; + margin-left: 32rpx; + padding: 12rpx 32rpx; + border: 1px solid #ccc; + border-radius: 12rpx; } \ No newline at end of file