Commit 80d9e7d9 authored by guo's avatar guo

项目初始化

parents
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
.DS_Store
dist
dist-ssr
coverage
*.local
/cypress/videos/
/cypress/screenshots/
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
*.tsbuildinfo
registry=https://registry.npmmirror.com/
{
"printWidth": 80,
"singleQuote": true,
"trailingComma": "all",
"semi": false,
"proseWrap": "never",
"overrides": [{ "files": ".prettierrc", "options": { "parser": "json" } }],
"plugins": ["prettier-plugin-organize-imports", "prettier-plugin-packagejson"]
}
{
"recommendations": ["Vue.volar"]
}
# smart-grader-h5
This template should help get you started developing with Vue 3 in Vite.
## Recommended IDE Setup
[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur).
## Customize configuration
See [Vite Configuration Reference](https://vite.dev/config/).
## Project Setup
```sh
npm install
```
### Compile and Hot-Reload for Development
```sh
npm run dev
```
### Compile and Minify for Production
```sh
npm run build
```
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="UTF-8">
<link rel="icon" href="/favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vite App</title>
</head>
<body>
<div id="app"></div>
<script type="module" src="/src/main.js"></script>
</body>
</html>
{
"compilerOptions": {
"paths": {
"@/*": ["./src/*"]
}
},
"exclude": ["node_modules", "dist"]
}
{
"name": "smart-grader-h5",
"version": "0.0.0",
"private": true,
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
},
"dependencies": {
"axios": "^1.8.2",
"dayjs": "^1.11.13",
"mitt": "^3.0.1",
"pinia": "^3.0.1",
"postcss-px-to-viewport": "^1.1.1",
"sass-embedded": "^1.79.4",
"vant": "^4.9.17",
"vue": "^3.5.13",
"vue-router": "^4.5.0"
},
"devDependencies": {
"@vitejs/plugin-vue": "^5.2.1",
"vite": "^6.1.0",
"vite-plugin-vue-devtools": "^7.7.2"
}
}
<script setup>
import { RouterLink, RouterView, useRoute } from "vue-router"
import { ref, watchEffect } from "vue"
import bus from '@/utils/mitt'
const route = ref(useRoute())
const title = ref("")
function addChildren() {
bus.emit("addChildren")
}
const active = ref(0)
watchEffect(() => {
title.value = route.value?.meta?.title || ""
document.title = title.value
})
</script>
<template>
<van-nav-bar :title="title" left-arrow fixed placeholder :border="false">
<template #right>
<span class="btn" v-if="$route.path === '/parents/home'" @click="addChildren">添加孩子</span>
</template>
</van-nav-bar>
<RouterView />
<van-tabbar v-model="active" active-color="#15A4B8" class="b-tabbar">
<van-tabbar-item>
<span>首页</span>
<template #icon="props">
<svg class="b-svg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
viewBox="64 64 896 896" width="32" height="32" style="" filter="none">
<g>
<path
d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
></path>
</g>
</svg>
</template>
</van-tabbar-item>
<van-tabbar-item>
<span>课程</span>
<template #icon="props">
<svg class="b-svg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
viewBox="0 0 32 32" width="40" height="40" style="" filter="none">
<g>
<path
d="M31.296 10.016c-4.64-1.44-9.28-2.912-13.888-4.352-0.256-0.096-0.512-0.16-0.768-0.256h-0.128c-0.128 0.064-0.256 0.096-0.352 0.128-2.432 0.736-4.832 1.44-7.232 2.176-6.663 1.921-9.027 2.685-11.385 3.464l4.281-1.224c-0.192 0.032-0.352 0.128-0.512 0.224-0.384 0.224-0.416 0.608-0.064 0.896 0.192 0.16 0.448 0.32 0.736 0.384 1.44 0.48 2.88 0.896 4.352 1.344 0.096 0.032 0.256-0.032 0.384-0.096 0.32-0.256 0.608-0.544 0.928-0.768 1.845-1.394 4.129-2.302 6.613-2.493l0.043-0.003c0.96-0.096 1.952-0.032 2.912-0.032 0.512 0.032 0.832 0.384 0.8 0.896 0 0.448-0.384 0.768-0.864 0.768-0.192-0.032-0.384-0.032-0.544-0.032-2.272-0.128-4.416 0.224-6.432 1.28-0.608 0.288-1.152 0.672-1.76 1.056 0.096 0.064 0.128 0.096 0.16 0.096-0.881-0.144 1.475 0.599 3.839 1.324l3.233 0.852c0.672 0.192 1.344 0.224 2.016 0 4.544-1.44 9.088-2.88 13.632-4.352 0.256-0.096 0.48-0.32 0.704-0.512v-0.288c-0.224-0.16-0.448-0.384-0.704-0.48zM14.304 10.816c0.928-0.096 1.888-0.032 2.816-0.032 0.32 0 0.576-0.192 0.608-0.48s-0.16-0.512-0.48-0.576c-0.064-0.032-0.16-0.032-0.224-0.032-1.248-0.064-2.464-0.064-3.712 0.16-3.2 0.544-5.824 2.080-7.84 4.608-0.16 0.224-0.32 0.352-0.608 0.384-0.512 0.128-0.864 0.448-0.992 0.992s-0.032 0.96 0.384 1.312c0.192 0.192 0.224 0.416 0.224 0.672-0.099 1.087-0.505 2.063-1.129 2.86l0.009-0.012c-0.864 1.152-1.792 2.272-2.688 3.392-0.064 0.096-0.16 0.16-0.224 0.256 1.408-0.96 2.432-2.24 3.2-3.712 0.288 0.032 0.288 0.192 0.192 0.352-0.416 0.608-0.768 1.28-1.216 1.888-0.736 1.024-1.6 1.92-2.624 2.624v0.064c0.352 0.224 0.736 0.416 1.088 0.64 0.064-0.064 0.096-0.096 0.128-0.096 0.896-1.088 1.76-2.208 2.368-3.488 0.064-0.16 0.16-0.288 0.352-0.096-0.416 1.44-1.024 2.816-2.080 4 0.288 0.032 0.544 0.064 0.768 0.064 0.864 0.032 1.6-0.224 2.016-1.056 0.096-0.256 0.256-0.48 0.352-0.736 0.96-2.336 1.408-4.704 1.088-7.232-0.032-0.128 0.032-0.288 0.096-0.384 0.448-0.512 0.544-1.152 0.16-1.728-0.096-0.16-0.096-0.256 0.032-0.384 2.080-2.528 4.736-3.904 7.936-4.256zM8.384 17.568c0.768 0.384 1.568 0.8 2.368 1.088 2.784 0.992 5.664 1.152 8.544 0.608 2.010-0.373 3.803-1.052 5.424-1.995l-0.080 0.043c0.16-0.096 0.256-0.192 0.16-0.416-0.096-0.352-0.192-0.736-0.288-1.12-0.096-0.448-0.224-0.896-0.352-1.344-0.064 0.032-0.064 0.032-0.096 0.032-2.112 0.544-4.192 1.12-6.304 1.664-0.48 0.16-0.992 0.256-1.536 0.128-0.992-0.224-1.984-0.416-2.976-0.672-1.44-0.352-2.88-0.768-4.32-1.152-0.032 0.032-0.064 0.064-0.064 0.096-0.224 0.928-0.448 1.824-0.64 2.72-0.032 0.096 0.064 0.288 0.16 0.32zM8.16 18.112c-0.192 0.608-0.192 0.608 0.288 1.024 0.896 0.8 1.92 1.44 3.008 1.984 1.984 0.896 4.032 1.312 6.176 1.024 2.72-0.352 5.056-1.568 7.072-3.392 0.384-0.352 0.416-0.448 0.16-0.928-5.504 2.976-11.072 3.232-16.704 0.288z"
></path>
</g>
</svg>
</template>
</van-tabbar-item>
<van-tabbar-item>
<span>我的</span>
<template #icon="props">
<svg class="b-svg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
viewBox="64 64 896 896" width="32" height="32" style="" filter="none">
<g>
<path
d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
></path>
</g>
</svg>
</template>
</van-tabbar-item>
</van-tabbar>
</template>
<style scoped lang="scss">
.btn {
font-size: 14px;
color: #03a9f4;
}
.b-svg {
// font-size: 15px;
width: 30px;
height: 30px;
}
.b-tabbar {
// padding: 10px 0;
height: 60px;
z-index: 9999;
.b-svg{
fill: #999;
}
:deep(.van-tabbar-item--active) .b-svg{
fill: #15A4B8;
}
:deep(.van-tabbar-item) {
color: #999;
}
}
</style>
import request from '@/utils/request'
export const send = (data: any = {}) => {
return request.post({
url: '/api/xxxxxxxxxxxxxxxxxxxxxxxxx',
data: data
})
}
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="64 64 896 896" width="32" height="32" style="" filter="none">
<g>
<path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z" fill="rgba(191,191,191,1)"></path>
</g>
</svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32" width="40" height="40" style="" filter="none">
<g>
<path d="M31.296 10.016c-4.64-1.44-9.28-2.912-13.888-4.352-0.256-0.096-0.512-0.16-0.768-0.256h-0.128c-0.128 0.064-0.256 0.096-0.352 0.128-2.432 0.736-4.832 1.44-7.232 2.176-6.663 1.921-9.027 2.685-11.385 3.464l4.281-1.224c-0.192 0.032-0.352 0.128-0.512 0.224-0.384 0.224-0.416 0.608-0.064 0.896 0.192 0.16 0.448 0.32 0.736 0.384 1.44 0.48 2.88 0.896 4.352 1.344 0.096 0.032 0.256-0.032 0.384-0.096 0.32-0.256 0.608-0.544 0.928-0.768 1.845-1.394 4.129-2.302 6.613-2.493l0.043-0.003c0.96-0.096 1.952-0.032 2.912-0.032 0.512 0.032 0.832 0.384 0.8 0.896 0 0.448-0.384 0.768-0.864 0.768-0.192-0.032-0.384-0.032-0.544-0.032-2.272-0.128-4.416 0.224-6.432 1.28-0.608 0.288-1.152 0.672-1.76 1.056 0.096 0.064 0.128 0.096 0.16 0.096-0.881-0.144 1.475 0.599 3.839 1.324l3.233 0.852c0.672 0.192 1.344 0.224 2.016 0 4.544-1.44 9.088-2.88 13.632-4.352 0.256-0.096 0.48-0.32 0.704-0.512v-0.288c-0.224-0.16-0.448-0.384-0.704-0.48zM14.304 10.816c0.928-0.096 1.888-0.032 2.816-0.032 0.32 0 0.576-0.192 0.608-0.48s-0.16-0.512-0.48-0.576c-0.064-0.032-0.16-0.032-0.224-0.032-1.248-0.064-2.464-0.064-3.712 0.16-3.2 0.544-5.824 2.080-7.84 4.608-0.16 0.224-0.32 0.352-0.608 0.384-0.512 0.128-0.864 0.448-0.992 0.992s-0.032 0.96 0.384 1.312c0.192 0.192 0.224 0.416 0.224 0.672-0.099 1.087-0.505 2.063-1.129 2.86l0.009-0.012c-0.864 1.152-1.792 2.272-2.688 3.392-0.064 0.096-0.16 0.16-0.224 0.256 1.408-0.96 2.432-2.24 3.2-3.712 0.288 0.032 0.288 0.192 0.192 0.352-0.416 0.608-0.768 1.28-1.216 1.888-0.736 1.024-1.6 1.92-2.624 2.624v0.064c0.352 0.224 0.736 0.416 1.088 0.64 0.064-0.064 0.096-0.096 0.128-0.096 0.896-1.088 1.76-2.208 2.368-3.488 0.064-0.16 0.16-0.288 0.352-0.096-0.416 1.44-1.024 2.816-2.080 4 0.288 0.032 0.544 0.064 0.768 0.064 0.864 0.032 1.6-0.224 2.016-1.056 0.096-0.256 0.256-0.48 0.352-0.736 0.96-2.336 1.408-4.704 1.088-7.232-0.032-0.128 0.032-0.288 0.096-0.384 0.448-0.512 0.544-1.152 0.16-1.728-0.096-0.16-0.096-0.256 0.032-0.384 2.080-2.528 4.736-3.904 7.936-4.256zM8.384 17.568c0.768 0.384 1.568 0.8 2.368 1.088 2.784 0.992 5.664 1.152 8.544 0.608 2.010-0.373 3.803-1.052 5.424-1.995l-0.080 0.043c0.16-0.096 0.256-0.192 0.16-0.416-0.096-0.352-0.192-0.736-0.288-1.12-0.096-0.448-0.224-0.896-0.352-1.344-0.064 0.032-0.064 0.032-0.096 0.032-2.112 0.544-4.192 1.12-6.304 1.664-0.48 0.16-0.992 0.256-1.536 0.128-0.992-0.224-1.984-0.416-2.976-0.672-1.44-0.352-2.88-0.768-4.32-1.152-0.032 0.032-0.064 0.064-0.064 0.096-0.224 0.928-0.448 1.824-0.64 2.72-0.032 0.096 0.064 0.288 0.16 0.32zM8.16 18.112c-0.192 0.608-0.192 0.608 0.288 1.024 0.896 0.8 1.92 1.44 3.008 1.984 1.984 0.896 4.032 1.312 6.176 1.024 2.72-0.352 5.056-1.568 7.072-3.392 0.384-0.352 0.416-0.448 0.16-0.928-5.504 2.976-11.072 3.232-16.704 0.288z" fill="rgba(191,191,191,1)"></path>
</g>
</svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="64 64 896 896" width="32" height="32" style="" filter="none">
<g>
<path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z" fill="rgba(191,191,191,1)"></path>
</g>
</svg>
\ No newline at end of file
import { createApp } from 'vue'
import { createPinia } from 'pinia'
import Vant from 'vant';
// 2. 引入组件样式
import 'vant/lib/index.css';
import './styles/index.scss'
// 3. 注册你需要的组件
import App from './App.vue'
import router from './router'
const app = createApp(App)
app.use(Vant);
app.use(createPinia())
app.use(router)
app.mount('#app')
import { createRouter, createWebHistory } from 'vue-router'
const router = createRouter({
history: createWebHistory(import.meta.env.BASE_URL),
routes: [
{
path: '/learnMore',
name: 'learnMore',
component: () => import('../views/learnMore/index.vue'),
},
{
path: '/parents/home',
name: 'parentsHome',
meta: {
title: '全部功能',
},
component: () => import('../views/parents/home/index.vue'),
},
{
path: '/parents/homeWorkStatistics',
name: 'homeWorkStatistics',
meta: {
title: '作业统计',
},
component: () => import('../views/parents/homeWorkStatistics/index.vue'),
},
],
})
export default router
import { ref, computed } from 'vue'
import { defineStore } from 'pinia'
export const useCounterStore = defineStore('counter', () => {
const count = ref(0)
const doubleCount = computed(() => count.value * 2)
function increment() {
count.value++
}
return { count, doubleCount, increment }
})
html,
body {
height: 100%;
background: linear-gradient(179.15deg,
rgba(204, 238, 247, 1) 0.66%,
rgba(247, 251, 251, 0) 99.8%);
}
* {
box-sizing: border-box;
}
.hr {
height: 10px;
}
.van-nav-bar {
background: #cdeef7;
z-index: 9999;
}
.van-nav-bar .van-icon {
color: #000;
}
.van-tabs__nav {
background: inherit;
}
.van-tab--active {
color: #15A4B8;
}
.van-tabs__line {
background: #15A4B8;
}
#app {
padding-bottom: 65px;
}
.van-calendar__selected-day {
background: inherit;
}
// .van-calendar__day .day{
.van-calendar__day .day {
width: 32px;
height: 32px;
line-height: 32px;
border-radius: 50%;
}
.van-calendar__day .today{
background:#a6d2ff;
color: #fff;
}
.van-calendar__day .danger{
background:red;
color: #fff;
}
.van-calendar__selected-day .day{
background: var(--van-primary-color) !important;
}
.van-calendar__day .day-tip {
position: absolute;
left: 50%;
margin-left: -2px;
bottom: 0;
width: 4px;
height: 4px;
border-radius: 50%;
background: #296bdb;
}
.van-calendar__day .danger.day-tip{
background: red;
}
:deep(.van-calendar__day--selected) {}
:deep(.van-calendar__header) {
box-shadow: inherit;
}
\ No newline at end of file
// 创建一个EventBus.js
// 事件总线第三方库:
import mitt from 'mitt';
const bus = mitt();
export default bus;
\ No newline at end of file
import router from '@/router'
type Method = 'GET' | 'POST' | 'PUT' | 'DELETE'
type ResponseType = 'arraybuffer' | 'blob' | 'document' | 'json' | 'text' | 'stream'
interface AxiosRequest {
baseURL?: string
url: string
data?: any
params?: any
method?: Method
headers?: any
timeout?: number
responseType?: ResponseType
}
import axios from 'axios'
// 定义接口
interface PendingType {
url?: string
method?: Method
params: any
data: any
cancel: Function
}
// 取消重复请求
const pending: Array<PendingType> = []
const CancelToken = axios.CancelToken
// axios 实例
const instance = axios.create({
timeout: 60000,
responseType: 'json'
})
// 添加请求拦截器
instance.interceptors.request.use(
(request: any) => {
// TODO: handle loading
request.headers['Authorization'] = 'Bearer ' + sessionStorage['token']
return request
},
(error: any) => {
return Promise.reject(error)
}
)
const errorHandle = (error: any) => {
// ElMessage.error(error?.msg || '服务器错误')
switch (error?.status) {
case 401:
sessionStorage['token'] = ''
router.push('/login')
// token失效
break
case 403:
// 没有权限
break
case 500:
// 服务端错误
break
case 503:
// 服务端错误
break
default:
break
}
}
// 添加响应拦截器
instance.interceptors.response.use(
(response: any) => {
return response
},
(error: any) => {
const response = error.response
// 根据返回的http状态码做不同的处理
errorHandle(response)
return Promise.reject(response || { msg: error.msg })
}
)
class BaseHttp {
// 外部传入的baseUrl
private baseURL: string = ''
// 自定义header头
private headers: object = {
ContentType: 'application/json;charset=UTF-8'
}
private apiAxios({
baseURL = this.baseURL,
headers = this.headers,
method,
url,
data,
params,
responseType
}: AxiosRequest): Promise<any> {
return new Promise((resolve, reject) => {
instance({
baseURL,
headers,
method,
url,
params,
data,
responseType
})
.then((res: any) => {
// 200:服务端业务处理正常结束
resolve(res.data)
// if (res.data.code == 200 || res.data.type === 'application/octet-stream') {
// // TODO ...
// resolve(res.data)
// } else {
// console.log(res?.data?.code, 'res?.data?.code res?.data?.code ')
// errorHandle({
// status: res?.data?.code || 500,
// msg: res.data?.msg || url + '请求失败',
// data: null
// })
// reject({ status: false, msg: res.data?.msg || url + '请求失败', data: null })
// }
})
.catch((err: any) => {
console.log('🚀 ~ BaseHttp ~ returnnewPromise ~ err:', err)
const msg = err?.data?.msg || err?.msg || url + '请求失败'
// eslint-disable-next-line
reject({ status: false, msg, data: null })
})
})
}
/**
* GET类型的网络请求
*/
get({ baseURL, headers, url, data, params, responseType }: AxiosRequest) {
return this.apiAxios({
baseURL,
headers,
method: 'GET',
url,
data,
params,
responseType
})
}
/**
* POST类型的网络请求
*/
post({ baseURL, headers, url, data, params, responseType }: AxiosRequest) {
return this.apiAxios({
baseURL,
headers,
method: 'POST',
url,
data,
params,
responseType
})
}
/**
* PUT类型的网络请求
*/
put({ baseURL, headers, url, data, params, responseType }: AxiosRequest) {
return this.apiAxios({
baseURL,
headers,
method: 'PUT',
url,
data,
params,
responseType
})
}
/**
* DELETE类型的网络请求
*/
delete({ baseURL, headers, url, data, params, responseType }: AxiosRequest) {
return this.apiAxios({
baseURL,
headers,
method: 'DELETE',
url,
data,
params,
responseType
})
}
}
export default new BaseHttp()
<template>
<div id="main">
<div class="title">
开始学习前 <br> 让我们多了解你一点
</div>
<van-form @submit="onSubmit">
<div class="form-item">
<div class="tip">请输入孩子的姓名</div>
<van-field v-model="form.name" name="name" />
</div>
<div class="form-item">
<div class="tip">请选择孩子的性别</div>
<div class="select-btns">
<div :class="`btn ${form.gender === item.value ? 'on' : ''}`" @click="form.gender = item.value"
v-for="(item, index) in options1" :key="'options1' + index">
{{ item.label }}
</div>
</div>
</div>
<div class="form-item">
<div class="tip">请选择孩子的年级</div>
<div class="select-btns">
<div :class="`btn ${form.grade === item.value ? 'on' : ''}`" @click="form.grade = item.value"
v-for="(item, index) in options2" :key="'options2' + index">
{{ item.label }}
</div>
</div>
</div>
<div class="form-item">
<div class="tip">孩子的性格</div>
</div>
<div class="form-item">
<div class="bg">
<div class="tip">孩子的性格</div>
<div class="m-btns">
<div :class="`btn ${form.character.includes(item.value) ? 'on' : ''}`"
@click="setCharacter(item.value)" v-for="(item, index) in options3"
:key="'options3' + index">
{{ item.label }}
</div>
</div>
</div>
</div>
<div style="margin: 16px;">
<van-button round block type="primary" native-type="submit" class="send">
保存
</van-button>
</div>
</van-form>
</div>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { showFailToast } from 'vant'
import { send } from '@/apis/api'
const form = ref({
name: '',
gender: '',
grade: '',
character: []
})
const options1 = ref([{
label: '女',
value: '1'
}, {
label: '男',
value: '2'
}])
const options2 = ref([
{
label: '一年级',
value: 1
},
{
label: '二年级',
value: 2
},
{
label: '三年级',
value: 3
},
{
label: '四年级',
value: 4
},
{
label: '五年级',
value: 5
},
{
label: '六年级',
value: 6
},
])
const options3 = ref([
{
label: '自觉、自制力强',
value: 1
},
{
label: '专注力弱',
value: 2
},
{
label: '拖拉',
value: 3
},
{
label: '马虎',
value: 4
},
{
label: '急躁',
value: 5
},
])
function onSubmit() {
if (!form.value.name.trim()) {
showFailToast('请输入孩子的姓名')
return
}
if (!form.value.gender) {
showFailToast('请选择孩子的性别')
return
}
if (!form.value.grade) {
showFailToast('请选择孩子的年级')
return
}
console.log('submit');
send(form.value)
}
function setCharacter(value: number) {
if (form.value.character.includes(value)) {
form.value.character = form.value.character.filter(item => item !== value)
} else {
form.value.character.push(value)
}
}
</script>
<style scoped>
#main {
background: #e6f6f6;
height: 100vh;
padding: 50px 30px;
}
.title {
line-height: 1.2;
font-size: 24px;
color: #122f2f;
font-weight: bold;
margin-bottom: 20px;
}
.form-item .tip {
position: relative;
font-size: 16px;
padding-left: 10px;
line-height: 30px;
margin-bottom: 10px;
}
.form-item .tip::before {
content: '';
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 4px;
height: 15px;
background: #4FBBB2;
border-radius: 4px;
}
.form-item {
margin-bottom: 20px;
}
.select-btns .btn {
display: inline-block;
width: 80px;
text-align: center;
line-height: 40px;
background: #fff;
margin-bottom: 10px;
margin-right: 10px;
font-size: 15px;
}
.bg {
background: #fff;
padding: 10px;
border-radius: 10px;
}
.m-btns .btn {
display: inline-block;
text-align: center;
padding: 0 10px;
line-height: 30px;
background: #f0f4f4;
margin-bottom: 10px;
margin-right: 10px;
font-size: 14px;
border-radius: 6px;
}
.btn.on {
background: #009688;
color: #fff;
}
.send {
background: linear-gradient(to right, #57c1ce, #6ddbb2);
border: 0;
}
</style>
\ No newline at end of file
<template>
<div>
<div class="content">
<div class="title">
<span>首页功能</span>
</div>
<div class="items">
<div class="item c1">
<div class="t">专业辅导作业</div>
<img src="@/assets/images/icon1.png" alt="">
</div>
<div class="item c2">
<div class="t">情绪管理培养</div>
<img src="@/assets/images/icon2.png" alt="">
</div>
</div>
</div>
<div class="hr"></div>
<div class="content">
<div class="title">
<span>更多功能</span>
</div>
<div class="tip">英语</div>
<div class="items">
<div class="item c1">
<div class="t">每日一练</div>
<img src="@/assets/images/icon3.png" alt="">
</div>
<div class="item c3">
<div class="t">背单词</div>
<img src="@/assets/images/icon7.png" alt="">
</div>
<div class="item c4">
<div class="t">作业批改</div>
<img src="@/assets/images/icon9.png" alt="">
</div>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { onUnmounted } from 'vue';
import bus from '@/utils/mitt'
bus.on("addChildren", () => {
console.log('addd')
})
onUnmounted(() => {
bus.off("addChildren")
})
</script>
<style scoped lang="scss">
.content {
padding: 30px 20px;
/* background: #fff; */
.title {
position: relative;
font-size: 20px;
font-weight: bold;
line-height: 30px;
margin-bottom: 30px;
&::before {
content: "";
position: absolute;
left: 0;
bottom: 2px;
width: 30px;
height: 10px;
background: rgba(79, 187, 178, 0.57);
border-radius: 4px;
z-index: 1;
}
span {
position: relative;
z-index: 10;
}
}
.items {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
width: 100%;
.item {
position: relative;
width: calc(50% - 10px);
height: 120px;
padding-top: 20px;
padding-left: 20px;
font-size: 18px;
font-weight: bold;
border-radius: 10px;
margin-bottom: 10px;
color: #fff;
img {
position: absolute;
right: 20px;
bottom: 10px;
max-width: 50px;
}
&.c1 {
background: linear-gradient(135.12deg,
rgba(1, 197, 190, 1) 1.55%,
rgba(1, 197, 196, 0.07) 100.55%,
rgba(1, 197, 197, 0) 100.55%);
}
&.c2 {
background: linear-gradient(134.69deg, rgba(220, 169, 71, 1) 0.09%, rgba(255, 255, 255, 1) 100.55%);
}
&.c3 {
background: linear-gradient(135.12deg, rgba(109, 119, 250, 1) 1.55%, rgba(255, 255, 255, 1) 100.55%, rgba(252, 253, 253, 1) 100.55%);
}
&.c4 {
background: linear-gradient(134.69deg,
#673ab7 0.09%,
rgba(255, 255, 255, 1) 100.55%);
}
}
}
.tip {
position: relative;
line-height: 20px;
font-size: 15px;
padding-left: 10px;
margin-bottom: 20px;
&::before {
content: "";
position: absolute;
left: 0;
top: 2px;
width: 4px;
height: 14px;
border-radius: 4px;
background: #00bcd4;
}
}
}
</style>
<template>
<div class="main">
<van-tabs v-model:active="active">
<van-tab :title="item.name" v-for="(item, index) in people" :key="'p_' + index">
<div style="height: 10px;"></div>
<div class="content">
<van-calendar :poppable="false" row-height="55px" type="single" :show-mark="false"
:show-confirm="false" switch-mode="year-month" @confirm="onConfirm(item)">
<template #title>
<div class="_title"> <img src="@/assets/images/icon1212.png" class="img" alt=""> {{
item.name }}{{ item.grade }}</div>
</template>
<template #text="day">
<div :class="`day ${isToday(day.date) ? 'today' : ''} ${day.text == '5' ? 'danger' : ''}`">
{{ day.text }}
</div>
<span :class="`day-tip ${day.text == '5' ? 'danger' : ''}`"></span>
</template>
</van-calendar>
</div>
<div class="info-con">
<div class="t1">2025年 02.25 <span>(查看详情)</span></div>
<div class="t2">
<div class="t3">每日总评</div>
<div class="t4">
作业内容语言流畅,结构信息,层次分明,成功找出材料中的谬误点。论述中逻辑链条完成,但部分论证略显单薄。建议在论证过程中增加更多势力和细节,以增强说服力,同时,进一步提升表达的精炼度。
</div>
</div>
</div>
</van-tab>
</van-tabs>
</div>
</template>
<script setup lang="ts">
import dayjs from 'dayjs'
import { ref } from 'vue';
const people = ref([
{
name: '张三',
age: 18,
grade: '六年级'
},
{
name: '李四',
age: 19,
grade: '六年级'
},
]);
const active = ref(0);
const show = ref(true);
function isToday(date) {
return dayjs().isSame(date, 'day');
}
function onConfirm(item) { }
</script>
<style lang="scss" scoped>
.main {
padding: 20px 10px;
.content {
padding: 10px 10px;
background: #fff;
border-radius: 10px;
margin-bottom: 10px;
._title {
text-align: left;
line-height: 30px;
padding-left: 10px;
padding-bottom: 10px;
border-bottom: 1px solid #ccc;
.img {
vertical-align: middle;
display: inline-block;
margin-right: 5px;
}
}
}
.info-con {
padding: 10px 10px;
.t1 {
font-weight: bold;
color: #000;
font-size: 15px;
line-height: 30px;
margin-bottom: 5px;
span {
color: var(--van-calendar-selected-day-background);
}
}
.t2 {
background: linear-gradient(180deg, rgba(181, 225, 65, 0.36) 0%, rgba(181, 225, 225, 0) 47%);
box-shadow: 0pt 2pt 6pt 0pt rgba(0, 0, 0, 0.1);
border-radius: 5px;
padding: 10px;
border-radius: 10px;
.t3 {
font-size: 15px;
line-height: 1.4;
margin-bottom: 5px;
}
.t4 {
font-size: 12px;
line-height: 1.4;
}
}
}
}
</style>
\ No newline at end of file
import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import vueDevTools from 'vite-plugin-vue-devtools'
import postcsspxtoviewport from 'postcss-px-to-viewport'
// https://vite.dev/config/
export default defineConfig({
plugins: [
vue(),
// vueDevTools(),
],
server: {
host: '0.0.0.0',
proxy: {
'^/api': {
target: 'http://192.12.12.1:8088',
changeOrigin: true, // 是否改变源地址
rewrite: (path) => path.replace(/^\/api/, ''),
// 可以配置更多选项,如 logLevel, timeout 等
}
}
},
css: {
postcss: {
plugins: [
postcsspxtoviewport({
// 要转化的单位
unitToConvert: 'px',
// UI设计稿的大小
viewportWidth: 375,
// 转换后的精度
unitPrecision: 6,
// 转换后的单位
viewportUnit: 'vw',
// 字体转换后的单位
fontViewportUnit: 'vw',
// 能转换的属性,*表示所有属性,!border表示border不转
propList: ['*'],
// 指定不转换为视窗单位的类名,
selectorBlackList: ['ignore-'],
// 最小转换的值,小于等于1不转
minPixelValue: 1,
// 是否在媒体查询的css代码中也进行转换,默认false
mediaQuery: false,
// 是否转换后直接更换属性值
replace: true,
// 忽略某些文件夹下的文件或特定文件,例如 'node_modules' 下的文件
exclude: [],
// 包含那些文件或者特定文件
include: [],
// 是否处理横屏情况
landscape: false
}),
]
}
},
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url))
},
},
})
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment