├── src ├── assets │ ├── css │ │ ├── theme │ │ │ ├── el-form-item.css │ │ │ ├── el-menu-item.css │ │ │ ├── el-submenu.css │ │ │ ├── el-tab-pane.css │ │ │ ├── el-breadcrumb-item.css │ │ │ ├── el-button-group.css │ │ │ ├── el-checkbox-button.css │ │ │ ├── el-checkbox-group.css │ │ │ ├── el-collapse-item.css │ │ │ ├── el-dropdown-item.css │ │ │ ├── el-dropdown-menu.css │ │ │ ├── el-infinite-scroll.css │ │ │ ├── el-infiniteScroll.css │ │ │ ├── el-menu-item-group.css │ │ │ ├── el-collapse-transition.css │ │ │ ├── el-affix.css │ │ │ ├── el-radio-group.css │ │ │ ├── el-aside.css │ │ │ ├── el-footer.css │ │ │ ├── el-header.css │ │ │ ├── fonts │ │ │ │ ├── element-icons.ttf │ │ │ │ └── element-icons.woff │ │ │ ├── el-timeline.css │ │ │ ├── el-descriptions-item.css │ │ │ ├── el-overlay.css │ │ │ ├── el-main.css │ │ │ ├── el-space.css │ │ │ ├── el-popconfirm.css │ │ │ ├── el-steps.css │ │ │ ├── el-container.css │ │ │ ├── el-backtop.css │ │ │ ├── el-card.css │ │ │ ├── el-check-tag.css │ │ │ ├── el-option-group.css │ │ │ ├── el-virtual-list.css │ │ │ ├── el-option.css │ │ │ ├── el-avatar.css │ │ │ ├── el-rate.css │ │ │ ├── el-page-header.css │ │ │ ├── el-divider.css │ │ │ ├── el-empty.css │ │ │ ├── el-reset.css │ │ │ ├── el-badge.css │ │ │ ├── el-result.css │ │ │ ├── el-spinner.css │ │ │ ├── el-skeleton-item.css │ │ │ ├── el-row.css │ │ │ ├── display.css │ │ │ ├── el-breadcrumb.css │ │ │ ├── el-carousel-item.css │ │ │ ├── el-scrollbar.css │ │ │ ├── el-timeline-item.css │ │ │ ├── el-popper.css │ │ │ ├── el-skeleton.css │ │ │ ├── el-descriptions.css │ │ │ ├── el-loading.css │ │ │ ├── el-notification.css │ │ │ ├── el-alert.css │ │ │ ├── el-switch.css │ │ │ ├── el-message.css │ │ │ ├── el-link.css │ │ │ ├── el-popover.css │ │ │ ├── el-radio-button.css │ │ │ ├── el-carousel.css │ │ │ ├── el-select-dropdown.css │ │ │ ├── el-progress.css │ │ │ ├── el-tooltip.css │ │ │ ├── el-form.css │ │ │ ├── el-image-viewer.css │ │ │ ├── el-radio.css │ │ │ ├── el-dialog.css │ │ │ ├── el-image.css │ │ │ ├── el-drawer.css │ │ │ ├── el-tag.css │ │ │ ├── el-step.css │ │ │ ├── el-collapse.css │ │ │ ├── el-input.css │ │ │ ├── el-checkbox.css │ │ │ ├── el-color-picker.css │ │ │ ├── el-menu.css │ │ │ └── el-button.css │ │ ├── base.css │ │ ├── loginPage.css │ │ └── normalize.css │ ├── images │ │ └── logo.png │ └── fonts │ │ ├── iconfont.ttf │ │ ├── iconfont.woff │ │ ├── iconfont.woff2 │ │ ├── iconfont.css │ │ └── iconfont.json ├── store │ ├── action.js │ ├── mutations.js │ ├── getters.js │ └── index.js ├── network │ ├── oss.js │ ├── header.js │ ├── home.js │ ├── user.js │ ├── request.js │ └── order.js ├── plugins │ └── element.js ├── main.js ├── App.vue ├── components │ └── content │ │ ├── OrderList.vue │ │ ├── Captcha.vue │ │ ├── OrderPage.vue │ │ ├── MyFooter.vue │ │ ├── Order.vue │ │ └── MyHeader.vue ├── views │ ├── user-center │ │ ├── MyHistory.vue │ │ ├── MyReceived.vue │ │ ├── MyPublished.vue │ │ ├── UserCenter.vue │ │ ├── Security.vue │ │ ├── Complain.vue │ │ └── UserInfo.vue │ ├── home │ │ ├── HomeRecommend.vue │ │ └── Home.vue │ ├── login │ │ ├── LoginPage.vue │ │ ├── LoginForm.vue │ │ └── RegisterForm.vue │ ├── SearchResult.vue │ ├── PublishOrder.vue │ └── UpdateOrder.vue ├── utils │ └── formRules.js └── router │ └── index.js ├── public ├── favicon.ico └── index.html ├── babel.config.js ├── .gitignore ├── vue.config.js ├── package.json └── README.md /src/assets/css/theme/el-form-item.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-menu-item.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-submenu.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-tab-pane.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-breadcrumb-item.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-button-group.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-checkbox-button.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-checkbox-group.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-collapse-item.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-dropdown-item.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-dropdown-menu.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-infinite-scroll.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-infiniteScroll.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-menu-item-group.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-collapse-transition.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-affix.css: -------------------------------------------------------------------------------- 1 | .el-affix--fixed{position:fixed} -------------------------------------------------------------------------------- /src/store/action.js: -------------------------------------------------------------------------------- 1 | const actions = {}; 2 | 3 | export default actions; -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bubble-419/vue3-gofor-practice/HEAD/public/favicon.ico -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | '@vue/cli-plugin-babel/preset' 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /src/assets/images/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bubble-419/vue3-gofor-practice/HEAD/src/assets/images/logo.png -------------------------------------------------------------------------------- /src/assets/css/theme/el-radio-group.css: -------------------------------------------------------------------------------- 1 | .el-radio-group{display:inline-block;line-height:1;vertical-align:middle;font-size:0} -------------------------------------------------------------------------------- /src/assets/fonts/iconfont.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bubble-419/vue3-gofor-practice/HEAD/src/assets/fonts/iconfont.ttf -------------------------------------------------------------------------------- /src/assets/fonts/iconfont.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bubble-419/vue3-gofor-practice/HEAD/src/assets/fonts/iconfont.woff -------------------------------------------------------------------------------- /src/assets/fonts/iconfont.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bubble-419/vue3-gofor-practice/HEAD/src/assets/fonts/iconfont.woff2 -------------------------------------------------------------------------------- /src/assets/css/theme/el-aside.css: -------------------------------------------------------------------------------- 1 | .el-aside{overflow:auto;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-negative:0;flex-shrink:0} -------------------------------------------------------------------------------- /src/assets/css/theme/el-footer.css: -------------------------------------------------------------------------------- 1 | .el-footer{padding:0 20px;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-negative:0;flex-shrink:0} -------------------------------------------------------------------------------- /src/assets/css/theme/el-header.css: -------------------------------------------------------------------------------- 1 | .el-header{padding:0 20px;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-negative:0;flex-shrink:0} -------------------------------------------------------------------------------- /src/assets/css/theme/fonts/element-icons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bubble-419/vue3-gofor-practice/HEAD/src/assets/css/theme/fonts/element-icons.ttf -------------------------------------------------------------------------------- /src/assets/css/theme/fonts/element-icons.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bubble-419/vue3-gofor-practice/HEAD/src/assets/css/theme/fonts/element-icons.woff -------------------------------------------------------------------------------- /src/assets/css/theme/el-timeline.css: -------------------------------------------------------------------------------- 1 | .el-timeline{margin:0;font-size:14px;list-style:none}.el-timeline .el-timeline-item:last-child .el-timeline-item__tail{display:none} -------------------------------------------------------------------------------- /src/network/oss.js: -------------------------------------------------------------------------------- 1 | import {request} from './request'; 2 | 3 | export function policy() { 4 | return request({ 5 | url:'/aliyun/oss/policy', 6 | method:'get' 7 | }) 8 | } -------------------------------------------------------------------------------- /src/assets/css/theme/el-descriptions-item.css: -------------------------------------------------------------------------------- 1 | .el-descriptions__label.is-bordered-label{font-weight:700;color:#909399;background:#fafafa}.el-descriptions__label:not(.is-bordered-label){margin-right:10px} -------------------------------------------------------------------------------- /src/assets/css/theme/el-overlay.css: -------------------------------------------------------------------------------- 1 | .el-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2000;height:100%;background-color:rgba(0,0,0,.5);overflow:auto}.el-overlay .el-overlay-root{height:0} -------------------------------------------------------------------------------- /src/assets/css/theme/el-main.css: -------------------------------------------------------------------------------- 1 | .el-main{display:block;-webkit-box-flex:1;-ms-flex:1;flex:1;-ms-flex-preferred-size:auto;flex-basis:auto;overflow:auto;-webkit-box-sizing:border-box;box-sizing:border-box;padding:20px} -------------------------------------------------------------------------------- /src/network/header.js: -------------------------------------------------------------------------------- 1 | import { 2 | request 3 | } from './request'; 4 | 5 | // 搜索订单 6 | export function searchByKeywords(params) { 7 | return request({ 8 | url: `/orders/search`, 9 | params 10 | }) 11 | } -------------------------------------------------------------------------------- /src/assets/css/theme/el-space.css: -------------------------------------------------------------------------------- 1 | .el-space{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.el-space--vertical{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column} -------------------------------------------------------------------------------- /src/network/home.js: -------------------------------------------------------------------------------- 1 | import { 2 | request 3 | } from './request'; 4 | 5 | // 获取首页随机订单 6 | export function getHomeRecommendList() { 7 | return request({ 8 | url: '/orders/randomOrders', 9 | params: {time: new Date()}, 10 | }) 11 | } -------------------------------------------------------------------------------- /src/store/mutations.js: -------------------------------------------------------------------------------- 1 | const mutations = { 2 | setIsLogin(state, payload) { 3 | state.user.isLogin = payload; 4 | }, 5 | 6 | setUser(state, payload) { 7 | state.user = payload.user; 8 | }, 9 | }; 10 | 11 | export default mutations; -------------------------------------------------------------------------------- /src/plugins/element.js: -------------------------------------------------------------------------------- 1 | import ElementPlus from 'element-plus' 2 | import 'element-plus/lib/theme-chalk/index.css' 3 | import locale from 'element-plus/lib/locale/lang/zh-cn' 4 | 5 | export default (app) => { 6 | app.use(ElementPlus, { locale }) 7 | } 8 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-popconfirm.css: -------------------------------------------------------------------------------- 1 | .el-popconfirm__main{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.el-popconfirm__icon{margin-right:5px}.el-popconfirm__action{text-align:right;margin:0} -------------------------------------------------------------------------------- /src/assets/css/theme/el-steps.css: -------------------------------------------------------------------------------- 1 | .el-steps{display:-webkit-box;display:-ms-flexbox;display:flex}.el-steps--simple{padding:13px 8%;border-radius:4px;background:#F5F7FA}.el-steps--horizontal{white-space:nowrap}.el-steps--vertical{height:100%;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column;flex-flow:column} -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | /dist 4 | 5 | 6 | # local env files 7 | .env.local 8 | .env.*.local 9 | 10 | # Log files 11 | npm-debug.log* 12 | yarn-debug.log* 13 | yarn-error.log* 14 | pnpm-debug.log* 15 | 16 | # Editor directories and files 17 | .idea 18 | .vscode 19 | *.suo 20 | *.ntvs* 21 | *.njsproj 22 | *.sln 23 | *.sw? 24 | -------------------------------------------------------------------------------- /src/store/getters.js: -------------------------------------------------------------------------------- 1 | const getters = { 2 | getOrderCategory: (state) => (cateId) => { 3 | if (cateId) { 4 | return state.orderCategory.find(cate => cate.id == cateId).name; 5 | } 6 | }, 7 | getOrderStatus: (state) => (statusId) => { 8 | return state.orderStatus.find(s => s.id == statusId).label; 9 | } 10 | }; 11 | 12 | export default getters; -------------------------------------------------------------------------------- /src/main.js: -------------------------------------------------------------------------------- 1 | import { 2 | createApp 3 | } from 'vue' 4 | import App from './App.vue' 5 | import router from './router' 6 | import store from './store' 7 | import installElementPlus from './plugins/element' 8 | 9 | import 'assets/css/theme/index.css' 10 | import "assets/css/base.css" 11 | import "assets/fonts/iconfont.css"; 12 | 13 | 14 | const app = createApp(App) 15 | installElementPlus(app) 16 | app.use(store).use(router).mount('#app') -------------------------------------------------------------------------------- /src/assets/css/theme/el-container.css: -------------------------------------------------------------------------------- 1 | .el-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-flex:1;-ms-flex:1;flex:1;-ms-flex-preferred-size:auto;flex-basis:auto;-webkit-box-sizing:border-box;box-sizing:border-box;min-width:0}.el-container.is-vertical{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column} -------------------------------------------------------------------------------- /src/assets/css/theme/el-backtop.css: -------------------------------------------------------------------------------- 1 | .el-backtop{position:fixed;background-color:#FFF;width:40px;height:40px;border-radius:50%;color:#9DC3C1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-size:20px;-webkit-box-shadow:0 0 6px rgba(0,0,0,.12);box-shadow:0 0 6px rgba(0,0,0,.12);cursor:pointer;z-index:5}.el-backtop:hover{background-color:#F2F6FC} -------------------------------------------------------------------------------- /src/assets/css/theme/el-card.css: -------------------------------------------------------------------------------- 1 | .el-card{border-radius:4px;border:1px solid #EBEEF5;background-color:#FFF;overflow:hidden;color:#303133;-webkit-transition:.3s;transition:.3s}.el-card.is-always-shadow,.el-card.is-hover-shadow:focus,.el-card.is-hover-shadow:hover{-webkit-box-shadow:0 2px 12px 0 rgba(0,0,0,.1);box-shadow:0 2px 12px 0 rgba(0,0,0,.1)}.el-card__header{padding:18px 20px;border-bottom:1px solid #EBEEF5;-webkit-box-sizing:border-box;box-sizing:border-box}.el-card__body{padding:20px} -------------------------------------------------------------------------------- /src/assets/css/theme/el-check-tag.css: -------------------------------------------------------------------------------- 1 | .el-check-tag{background-color:#F5F7FA;border-radius:4px;color:#909399;cursor:pointer;display:inline-block;font-size:14px;line-height:14px;padding:7px 15px;-webkit-transition:all .3s cubic-bezier(.645,.045,.355,1);transition:all .3s cubic-bezier(.645,.045,.355,1);font-weight:700}.el-check-tag:hover{background-color:#dcdfe6}.el-check-tag.is-checked{background-color:#DEEDFC;color:rgb(167, 201, 199)}.el-check-tag.is-checked:hover{background-color:rgb(226, 237, 236)} -------------------------------------------------------------------------------- /src/assets/css/theme/el-option-group.css: -------------------------------------------------------------------------------- 1 | .el-select-group{margin:0;padding:0}.el-select-group__wrap{position:relative;list-style:none;margin:0;padding:0}.el-select-group__wrap:not(:last-of-type){padding-bottom:24px}.el-select-group__wrap:not(:last-of-type)::after{content:"";position:absolute;display:block;left:20px;right:20px;bottom:12px;height:1px;background:#E4E7ED}.el-select-group__title{padding-left:20px;font-size:12px;color:#909399;line-height:30px}.el-select-group .el-select-dropdown__item{padding-left:20px} -------------------------------------------------------------------------------- /src/assets/css/theme/el-virtual-list.css: -------------------------------------------------------------------------------- 1 | .el-vl__viewport{overflow:auto}.el-vl__content{overflow:hidden;will-change:transform;position:relative}.el-vl__item-container{will-change:transform;display:-webkit-box;display:-ms-flexbox;display:flex}.el-vl__item-container[data-direction=v]{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.el-vl__item-container[data-direction=h]{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row} -------------------------------------------------------------------------------- /src/App.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 16 | 17 | 30 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-option.css: -------------------------------------------------------------------------------- 1 | .el-select-dropdown__item{font-size:14px;padding:0 20px;position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#606266;height:34px;line-height:34px;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer}.el-select-dropdown__item.is-disabled{color:#C0C4CC;cursor:not-allowed}.el-select-dropdown__item.is-disabled:hover{background-color:#FFF}.el-select-dropdown__item.hover,.el-select-dropdown__item:hover{background-color:#F5F7FA}.el-select-dropdown__item.selected{color:#9DC3C1;font-weight:700} -------------------------------------------------------------------------------- /src/assets/css/theme/el-avatar.css: -------------------------------------------------------------------------------- 1 | .el-avatar{display:inline-block;-webkit-box-sizing:border-box;box-sizing:border-box;text-align:center;overflow:hidden;color:#fff;background:#C0C4CC;width:40px;height:40px;line-height:40px;font-size:14px}.el-avatar>img{display:block;height:100%;vertical-align:middle}.el-avatar--circle{border-radius:50%}.el-avatar--square{border-radius:4px}.el-avatar--icon{font-size:18px}.el-avatar--large{width:40px;height:40px;line-height:40px}.el-avatar--medium{width:36px;height:36px;line-height:36px}.el-avatar--small{width:28px;height:28px;line-height:28px} -------------------------------------------------------------------------------- /src/assets/css/theme/el-rate.css: -------------------------------------------------------------------------------- 1 | .el-rate__icon,.el-rate__item{position:relative;display:inline-block}.el-rate{height:20px;line-height:1}.el-rate:active,.el-rate:focus{outline-width:0}.el-rate__item{font-size:0;vertical-align:middle}.el-rate__icon{font-size:18px;margin-right:6px;color:#C0C4CC;-webkit-transition:.3s;transition:.3s}.el-rate__decimal,.el-rate__icon .path2{position:absolute;top:0;left:0}.el-rate__icon.hover{-webkit-transform:scale(1.15);transform:scale(1.15)}.el-rate__decimal{display:inline-block;overflow:hidden}.el-rate__text{font-size:14px;vertical-align:middle} -------------------------------------------------------------------------------- /src/components/content/OrderList.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 30 | 31 | -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | <%= htmlWebpackPlugin.options.title %> 9 | 10 | 11 | 14 |
15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-page-header.css: -------------------------------------------------------------------------------- 1 | .el-page-header{display:-webkit-box;display:-ms-flexbox;display:flex;line-height:24px}.el-page-header__left{display:-webkit-box;display:-ms-flexbox;display:flex;cursor:pointer;margin-right:40px;position:relative}.el-page-header__left::after{content:"";position:absolute;width:1px;height:16px;right:-20px;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);background-color:#DCDFE6}.el-page-header__icon{font-size:18px;margin-right:6px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.el-page-header__title{font-size:14px;font-weight:500}.el-page-header__content{font-size:18px;color:#303133} -------------------------------------------------------------------------------- /src/assets/css/theme/el-divider.css: -------------------------------------------------------------------------------- 1 | .el-divider{background-color:#DCDFE6;position:relative}.el-divider--horizontal{display:block;height:1px;width:100%;margin:24px 0}.el-divider--vertical{display:inline-block;width:1px;height:1em;margin:0 8px;vertical-align:middle;position:relative}.el-divider__text{position:absolute;background-color:#FFF;padding:0 20px;font-weight:500;color:#303133;font-size:14px}.el-divider__text.is-left{left:20px;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.el-divider__text.is-center{left:50%;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%)}.el-divider__text.is-right{right:20px;-webkit-transform:translateY(-50%);transform:translateY(-50%)} -------------------------------------------------------------------------------- /src/assets/fonts/iconfont.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: "iconfont"; /* Project id 2588964 */ 3 | src: url('./iconfont.woff2?t=1622703953858') format('woff2'), 4 | url('./iconfont.woff?t=1622703953858') format('woff'), 5 | url('./iconfont.ttf?t=1622703953858') format('truetype'); 6 | } 7 | 8 | .iconfont { 9 | font-family: "iconfont" !important; 10 | font-size: 16px; 11 | font-style: normal; 12 | -webkit-font-smoothing: antialiased; 13 | -moz-osx-font-smoothing: grayscale; 14 | } 15 | 16 | .icon-huawei:before { 17 | content: "\e82e"; 18 | } 19 | 20 | .icon-gitee-fill-round:before { 21 | content: "\e686"; 22 | } 23 | 24 | .icon-GitHub:before { 25 | content: "\e600"; 26 | } 27 | -------------------------------------------------------------------------------- /vue.config.js: -------------------------------------------------------------------------------- 1 | //新建代理对象 2 | let proxyObj = {}; 3 | 4 | //所有需要代理的路径 5 | proxyObj['/'] = { 6 | //websocket 7 | ws: false, 8 | //目标地址 9 | target: 'http://localhost:8081', 10 | //发送请求头host会被设置target（目标地址） 11 | changeOrigin: true, 12 | //不重写请求地址 13 | pathReWrite: { 14 | '^/': '/' 15 | } 16 | } 17 | 18 | module.exports = { 19 | configureWebpack: { 20 | resolve: { 21 | // 文件夹别名 22 | alias: { 23 | 'assets': '@/assets', 24 | 'components': '@/components', 25 | 'views': '@/views', 26 | 'network': '@/network', 27 | 'utils': '@/utils' 28 | } 29 | } 30 | }, 31 | devServer: { 32 | host: 'localhost', 33 | port: 8080, 34 | proxy: proxyObj 35 | } 36 | } -------------------------------------------------------------------------------- /src/assets/fonts/iconfont.json: -------------------------------------------------------------------------------- 1 | { 2 | "id": "2588964", 3 | "name": "gofor", 4 | "font_family": "iconfont", 5 | "css_prefix_text": "icon-", 6 | "description": "", 7 | "glyphs": [ 8 | { 9 | "icon_id": "1403428", 10 | "name": "华为", 11 | "font_class": "huawei", 12 | "unicode": "e82e", 13 | "unicode_decimal": 59438 14 | }, 15 | { 16 | "icon_id": "13743932", 17 | "name": "gitee-fill-round", 18 | "font_class": "gitee-fill-round", 19 | "unicode": "e686", 20 | "unicode_decimal": 59014 21 | }, 22 | { 23 | "icon_id": "20278967", 24 | "name": "GitHub", 25 | "font_class": "GitHub", 26 | "unicode": "e600", 27 | "unicode_decimal": 58880 28 | } 29 | ] 30 | } 31 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-empty.css: -------------------------------------------------------------------------------- 1 | .el-empty{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box;padding:40px 0}.el-empty__image{width:160px}.el-empty__image img,.el-empty__image svg{width:100%;height:100%;vertical-align:top}.el-empty__image img{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-o-object-fit:contain;object-fit:contain}.el-empty__image svg{fill:#DCDDE0}.el-empty__description{margin-top:20px}.el-empty__description p{margin:0;font-size:14px;color:#909399}.el-empty__bottom{margin-top:20px} -------------------------------------------------------------------------------- /src/assets/css/theme/el-reset.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8";body{font-family:"Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;font-weight:400;font-size:14px;color:#000;-webkit-font-smoothing:antialiased}a{color:#9DC3C1;text-decoration:none}a:focus,a:hover{color:rgb(177, 207, 205)}a:active{color:rgb(141, 176, 174)}h1,h2,h3,h4,h5,h6{color:#606266;font-weight:inherit}h1:first-child,h2:first-child,h3:first-child,h4:first-child,h5:first-child,h6:first-child,p:first-child{margin-top:0}h1:last-child,h2:last-child,h3:last-child,h4:last-child,h5:last-child,h6:last-child,p:last-child{margin-bottom:0}h1{font-size:20px}h2{font-size:18px}h3{font-size:16px}h4,h5,h6,p{font-size:inherit}p{line-height:1.8}sub,sup{font-size:13px}small{font-size:12px}hr{margin-top:20px;margin-bottom:20px;border:0;border-top:1px solid #eee} -------------------------------------------------------------------------------- /src/assets/css/theme/el-badge.css: -------------------------------------------------------------------------------- 1 | .el-badge{position:relative;vertical-align:middle;display:inline-block}.el-badge__content{background-color:#F56C6C;border-radius:10px;color:#FFF;display:inline-block;font-size:12px;height:18px;line-height:18px;padding:0 6px;text-align:center;white-space:nowrap;border:1px solid #FFF}.el-badge__content.is-fixed{position:absolute;top:0;right:10px;-webkit-transform:translateY(-50%) translateX(100%);transform:translateY(-50%) translateX(100%)}.el-badge__content.is-fixed.is-dot{right:5px}.el-badge__content.is-dot{height:8px;width:8px;padding:0;right:0;border-radius:50%}.el-badge__content--primary{background-color:#9DC3C1}.el-badge__content--success{background-color:#67C23A}.el-badge__content--warning{background-color:#E6A23C}.el-badge__content--info{background-color:#909399}.el-badge__content--danger{background-color:#F56C6C} -------------------------------------------------------------------------------- /src/assets/css/theme/el-result.css: -------------------------------------------------------------------------------- 1 | .el-result{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box;padding:40px 30px}.el-result__icon svg{width:64px;height:64px}.el-result__title{margin-top:20px}.el-result__title p{margin:0;font-size:20px;color:#303133;line-height:1.3}.el-result__subtitle{margin-top:10px}.el-result__subtitle p{margin:0;font-size:14px;color:#606266;line-height:1.3}.el-result__extra{margin-top:30px}.el-result .icon-success{fill:#67C23A}.el-result .icon-error{fill:#F56C6C}.el-result .icon-info{fill:#909399}.el-result .icon-warning{fill:#E6A23C} -------------------------------------------------------------------------------- /src/assets/css/theme/el-spinner.css: -------------------------------------------------------------------------------- 1 | .el-time-spinner{width:100%;white-space:nowrap}.el-spinner{display:inline-block;vertical-align:middle}.el-spinner-inner{-webkit-animation:rotate 2s linear infinite;animation:rotate 2s linear infinite;width:50px;height:50px}.el-spinner-inner .path{stroke:#ececec;stroke-linecap:round;-webkit-animation:dash 1.5s ease-in-out infinite;animation:dash 1.5s ease-in-out infinite}@-webkit-keyframes rotate{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotate{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}100%{stroke-dasharray:90,150;stroke-dashoffset:-124}}@keyframes dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}100%{stroke-dasharray:90,150;stroke-dashoffset:-124}} -------------------------------------------------------------------------------- /src/components/content/Captcha.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 28 | 29 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-skeleton-item.css: -------------------------------------------------------------------------------- 1 | .el-skeleton__item{background:#f2f2f2;display:inline-block;height:16px;border-radius:4px;width:100%}.el-skeleton__circle{border-radius:50%;width:36px;height:36px;line-height:36px}.el-skeleton__circle--lg{width:40px;height:40px;line-height:40px}.el-skeleton__circle--md{width:28px;height:28px;line-height:28px}.el-skeleton__button{height:40px;width:64px;border-radius:4px}.el-skeleton__p{width:100%}.el-skeleton__p.is-last{width:61%}.el-skeleton__p.is-first{width:33%}.el-skeleton__text{width:100%;height:13px}.el-skeleton__caption{height:12px}.el-skeleton__h1{height:20px}.el-skeleton__h3{height:18px}.el-skeleton__h5{height:16px}.el-skeleton__image{width:unset;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;border-radius:0}.el-skeleton__image svg{fill:#DCDDE0;width:22%;height:22%} -------------------------------------------------------------------------------- /src/assets/css/theme/el-row.css: -------------------------------------------------------------------------------- 1 | .el-row{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;position:relative;-webkit-box-sizing:border-box;box-sizing:border-box}.el-row::after,.el-row::before{display:table;content:""}.el-row::after{clear:both}.el-row--flex{display:-webkit-box;display:-ms-flexbox;display:flex}.el-row--flex:after,.el-row--flex:before{display:none}.el-row--flex.is-justify-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.el-row--flex.is-justify-end{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.el-row--flex.is-justify-space-between{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.el-row--flex.is-justify-space-around{-ms-flex-pack:distribute;justify-content:space-around}.el-row--flex.is-align-middle{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.el-row--flex.is-align-bottom{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end} -------------------------------------------------------------------------------- /src/assets/css/base.css: -------------------------------------------------------------------------------- 1 | @import "./normalize.css"; 2 | 3 | :root { 4 | --theme-light-green: #D8E6E7; 5 | --theme-medium-green: #9DC3C1; 6 | --theme-dark-green: #77AAAD; 7 | --font-title-color: #6E7783; 8 | --font-color: #494949; 9 | --bg-color: #f4f7f7; 10 | --price-color: #FE5B1A; 11 | } 12 | 13 | * { 14 | margin: 0; 15 | padding: 0; 16 | } 17 | 18 | body { 19 | background-color: var(--bg-color); 20 | color: var(--font-color); 21 | } 22 | 23 | main, 24 | .w { 25 | width: 1000px; 26 | margin: auto; 27 | } 28 | 29 | a { 30 | color: var(--font-color); 31 | text-decoration: none; 32 | } 33 | 34 | li { 35 | list-style: none; 36 | } 37 | 38 | button, 39 | input:focus { 40 | outline: 0; 41 | } 42 | 43 | .el-descriptions :not(.is-bordered) td { 44 | padding-bottom: 20px; 45 | font-size: 1.1em; 46 | } 47 | 48 | .el-descriptions__label { 49 | padding-right: 35px; 50 | } 51 | 52 | .el-descriptions__content { 53 | font-weight: 700; 54 | 55 | } -------------------------------------------------------------------------------- /src/assets/css/theme/display.css: -------------------------------------------------------------------------------- 1 | @media only screen and (max-width:768px){.hidden-xs-only{display:none!important}}@media only screen and (min-width:768px){.hidden-sm-and-up{display:none!important}}@media only screen and (min-width:768px) and (max-width:992px){.hidden-sm-only{display:none!important}}@media only screen and (max-width:992px){.hidden-sm-and-down{display:none!important}}@media only screen and (min-width:992px){.hidden-md-and-up{display:none!important}}@media only screen and (min-width:992px) and (max-width:1200px){.hidden-md-only{display:none!important}}@media only screen and (max-width:1200px){.hidden-md-and-down{display:none!important}}@media only screen and (min-width:1200px){.hidden-lg-and-up{display:none!important}}@media only screen and (min-width:1200px) and (max-width:1920px){.hidden-lg-only{display:none!important}}@media only screen and (max-width:1920px){.hidden-lg-and-down{display:none!important}}@media only screen and (min-width:1920px){.hidden-xl-only{display:none!important}} -------------------------------------------------------------------------------- /src/assets/css/theme/el-breadcrumb.css: -------------------------------------------------------------------------------- 1 | .el-breadcrumb{font-size:14px;line-height:1}.el-breadcrumb::after,.el-breadcrumb::before{display:table;content:""}.el-breadcrumb::after{clear:both}.el-breadcrumb__separator{margin:0 9px;font-weight:700;color:#C0C4CC}.el-breadcrumb__separator[class*=icon]{margin:0 6px;font-weight:400}.el-breadcrumb__item{float:left}.el-breadcrumb__inner{color:#606266}.el-breadcrumb__inner a,.el-breadcrumb__inner.is-link{font-weight:700;text-decoration:none;-webkit-transition:color .2s cubic-bezier(.645,.045,.355,1);transition:color .2s cubic-bezier(.645,.045,.355,1);color:#303133}.el-breadcrumb__inner a:hover,.el-breadcrumb__inner.is-link:hover{color:#9DC3C1;cursor:pointer}.el-breadcrumb__item:last-child .el-breadcrumb__inner,.el-breadcrumb__item:last-child .el-breadcrumb__inner a,.el-breadcrumb__item:last-child .el-breadcrumb__inner a:hover,.el-breadcrumb__item:last-child .el-breadcrumb__inner:hover{font-weight:400;color:#606266;cursor:text}.el-breadcrumb__item:last-child .el-breadcrumb__separator{display:none} -------------------------------------------------------------------------------- /src/assets/css/theme/el-carousel-item.css: -------------------------------------------------------------------------------- 1 | .el-carousel__item,.el-carousel__mask{position:absolute;height:100%;top:0;left:0}.el-carousel__item{width:100%;display:inline-block;overflow:hidden;z-index:0}.el-carousel__item.is-active{z-index:2}.el-carousel__item.is-animating{-webkit-transition:-webkit-transform .4s ease-in-out;transition:-webkit-transform .4s ease-in-out;transition:transform .4s ease-in-out;transition:transform .4s ease-in-out,-webkit-transform .4s ease-in-out}.el-carousel__item--card{width:50%;-webkit-transition:-webkit-transform .4s ease-in-out;transition:-webkit-transform .4s ease-in-out;transition:transform .4s ease-in-out;transition:transform .4s ease-in-out,-webkit-transform .4s ease-in-out}.el-carousel__item--card.is-in-stage{cursor:pointer;z-index:1}.el-carousel__item--card.is-in-stage.is-hover .el-carousel__mask,.el-carousel__item--card.is-in-stage:hover .el-carousel__mask{opacity:.12}.el-carousel__item--card.is-active{z-index:2}.el-carousel__mask{width:100%;background-color:#FFF;opacity:.24;-webkit-transition:.2s;transition:.2s} -------------------------------------------------------------------------------- /src/views/user-center/MyHistory.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 42 | 43 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-scrollbar.css: -------------------------------------------------------------------------------- 1 | .el-scrollbar{overflow:hidden;position:relative;height:100%}.el-scrollbar__wrap{overflow:auto;height:100%}.el-scrollbar__wrap--hidden-default{scrollbar-width:none}.el-scrollbar__wrap--hidden-default::-webkit-scrollbar{display:none}.el-scrollbar__thumb{position:relative;display:block;width:0;height:0;cursor:pointer;border-radius:inherit;background-color:rgba(144,147,153,.3);-webkit-transition:.3s background-color;transition:.3s background-color}.el-scrollbar__thumb:hover{background-color:rgba(144,147,153,.5)}.el-scrollbar__bar{position:absolute;right:2px;bottom:2px;z-index:1;border-radius:4px}.el-scrollbar__bar.is-vertical{width:6px;top:2px}.el-scrollbar__bar.is-vertical>div{width:100%}.el-scrollbar__bar.is-horizontal{height:6px;left:2px}.el-scrollbar__bar.is-horizontal>div{height:100%}.el-scrollbar-fade-enter-active{-webkit-transition:opacity 340ms ease-out;transition:opacity 340ms ease-out}.el-scrollbar-fade-leave-active{-webkit-transition:opacity 120ms ease-out;transition:opacity 120ms ease-out}.el-scrollbar-fade-enter-from,.el-scrollbar-fade-leave-active{opacity:0} -------------------------------------------------------------------------------- /src/utils/formRules.js: -------------------------------------------------------------------------------- 1 | export function checkUsername(rules, value, callback) { 2 | if (!value) { 3 | return callback(new Error("学号不能为空")); 4 | } else if (!Number.isInteger(value)) { 5 | return callback(new Error("学号必须为10位数字")); 6 | } else if (/^\d{10}$/.test(value) == false) { 7 | return callback(new Error("学号必须为10位数字")); 8 | // 对学号格式的判断 9 | } else if (/^(3[12])\d{8}$/.test(value) == false) { 10 | return callback(new Error("请输入合法的学号")); 11 | } else callback(); 12 | } 13 | 14 | export function checkPwd(rules, value, callback) { 15 | if (!value) { 16 | return callback(new Error("密码不能为空")); 17 | } else if ( 18 | // 对密码的判断 19 | /^(?!^\d+$)(?!^[a-zA-Z]+$)[0-9a-zA-Z]{8,16}$/.test(value) == false 20 | ) { 21 | return callback(new Error("密码必须为8-16位的字母+数字的组合")); 22 | } else callback(); 23 | } 24 | 25 | export function checkPhone(rules, value, callback) { 26 | if (!value) { 27 | return callback(new Error("手机号码不能为空")); 28 | } else if ( 29 | /^(1)\d{10}$/.test(value) == false 30 | ) { 31 | return callback(new Error("请输入正确的手机号码")); 32 | } else callback(); 33 | } -------------------------------------------------------------------------------- /src/assets/css/loginPage.css: -------------------------------------------------------------------------------- 1 | #login, 2 | #register { 3 | background-color: #fff; 4 | padding: 60px 60px; 5 | box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); 6 | } 7 | 8 | #login, 9 | #register, 10 | .el-form { 11 | display: flex; 12 | flex-direction: column; 13 | align-items: center; 14 | justify-content: center; 15 | } 16 | 17 | h2 { 18 | color: var(--font-title-color); 19 | margin: 30px 0; 20 | } 21 | 22 | .el-input, 23 | .el-button { 24 | width: 250px; 25 | height: 50px; 26 | } 27 | 28 | .el-button { 29 | background-color: var(--theme-medium-green); 30 | color: #fff; 31 | font-size: 1.2em; 32 | font-weight: 700; 33 | letter-spacing: 2px; 34 | transition: .3s; 35 | } 36 | 37 | .el-button:hover { 38 | color: #fff; 39 | background-color: var(--theme-dark-green); 40 | text-shadow: -1px -1px 0 rgba(0, 0, 0, .3); 41 | box-shadow: inset 1px 1px 2px rgba(0, 0, 0, .2); 42 | } 43 | 44 | a { 45 | font-size: .9em; 46 | } 47 | 48 | .input-captcha { 49 | position: relative; 50 | height: 40px; 51 | } 52 | 53 | .input-captcha input { 54 | width: 120px; 55 | left: 0; 56 | top: 0; 57 | } 58 | 59 | .input-captcha .captcha { 60 | position: absolute; 61 | right: 0; 62 | top: 0; 63 | } -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "gofor-gdut-front", 3 | "version": "0.1.0", 4 | "private": true, 5 | "scripts": { 6 | "serve": "vue-cli-service serve", 7 | "build": "vue-cli-service build", 8 | "lint": "vue-cli-service lint" 9 | }, 10 | "dependencies": { 11 | "axios": "^0.21.1", 12 | "core-js": "^3.6.5", 13 | "element-plus": "^1.0.2-beta.44", 14 | "vue": "^3.0.0", 15 | "vue-router": "^4.0.0-0", 16 | "vuex": "^4.0.0-0" 17 | }, 18 | "devDependencies": { 19 | "@vue/cli-plugin-babel": "~4.5.0", 20 | "@vue/cli-plugin-eslint": "~4.5.0", 21 | "@vue/cli-plugin-router": "~4.5.0", 22 | "@vue/cli-plugin-vuex": "~4.5.0", 23 | "@vue/cli-service": "~4.5.0", 24 | "@vue/compiler-sfc": "^3.0.0", 25 | "babel-eslint": "^10.1.0", 26 | "eslint": "^6.7.2", 27 | "eslint-plugin-vue": "^7.0.0", 28 | "vue-cli-plugin-element-plus": "0.0.13" 29 | }, 30 | "eslintConfig": { 31 | "root": true, 32 | "env": { 33 | "node": true 34 | }, 35 | "extends": [ 36 | "plugin:vue/vue3-essential", 37 | "eslint:recommended" 38 | ], 39 | "parserOptions": { 40 | "parser": "babel-eslint" 41 | }, 42 | "rules": {} 43 | }, 44 | "browserslist": [ 45 | "> 1%", 46 | "last 2 versions", 47 | "not dead" 48 | ] 49 | } 50 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-timeline-item.css: -------------------------------------------------------------------------------- 1 | .el-timeline-item{position:relative;padding-bottom:20px}.el-timeline-item__wrapper{position:relative;padding-left:28px;top:-3px}.el-timeline-item__tail{position:absolute;left:4px;height:100%;border-left:2px solid #E4E7ED}.el-timeline-item__icon{color:#FFF;font-size:13px}.el-timeline-item__node{position:absolute;background-color:#E4E7ED;border-radius:50%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.el-timeline-item__node--normal{left:-1px;width:12px;height:12px}.el-timeline-item__node--large{left:-2px;width:14px;height:14px}.el-timeline-item__node--primary{background-color:#9DC3C1}.el-timeline-item__node--success{background-color:#67C23A}.el-timeline-item__node--warning{background-color:#E6A23C}.el-timeline-item__node--danger{background-color:#F56C6C}.el-timeline-item__node--info{background-color:#909399}.el-timeline-item__dot{position:absolute;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.el-timeline-item__content{color:#303133}.el-timeline-item__timestamp{color:#909399;line-height:1;font-size:13px}.el-timeline-item__timestamp.is-top{margin-bottom:8px;padding-top:4px}.el-timeline-item__timestamp.is-bottom{margin-top:8px} -------------------------------------------------------------------------------- /src/views/home/HomeRecommend.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 43 | 44 | -------------------------------------------------------------------------------- /src/network/user.js: -------------------------------------------------------------------------------- 1 | import { 2 | request 3 | } from './request'; 4 | 5 | // 登录 6 | export function login(data) { 7 | return request({ 8 | url: '/login', 9 | method: 'post', 10 | data 11 | }) 12 | } 13 | 14 | // 注册 15 | export function register(params, data) { 16 | return request({ 17 | url: '/register', 18 | method: 'post', 19 | params, 20 | data 21 | }) 22 | } 23 | 24 | // 退出 25 | export function logout() { 26 | return request({ 27 | url: '/logout', 28 | method: 'post', 29 | }) 30 | } 31 | 32 | // 获取当前用户信息 33 | export function getUserInfo() { 34 | return request({ 35 | url: '/info', 36 | }) 37 | } 38 | 39 | // 根据id获取用户信息 40 | export function getUserInfoById(params) { 41 | return request({ 42 | url: '/admin/getUserById', 43 | params 44 | }) 45 | } 46 | 47 | // 修改用户信息 48 | export function updateUserInfo(data) { 49 | return request({ 50 | url: '/users/userinfo', 51 | method: 'put', 52 | data 53 | }) 54 | } 55 | 56 | // 获取验证码 57 | export function getCaptcha() { 58 | return request({ 59 | url: '/captcha?time=' + new Date(), 60 | }) 61 | } 62 | 63 | // 修改密码 64 | export function updatePwd(data) { 65 | return request({ 66 | url: '/users/userpwd', 67 | method: 'put', 68 | data 69 | }) 70 | } 71 | 72 | // 用户进行投诉反馈 73 | export function complain(data) { 74 | return request({ 75 | url: '/complains/complain', 76 | method: 'post', 77 | data 78 | }) 79 | } -------------------------------------------------------------------------------- /src/assets/css/theme/el-popper.css: -------------------------------------------------------------------------------- 1 | .el-popper__arrow,.el-popper__arrow::before{position:absolute;width:10px;height:10px;z-index:-1}.el-popper{position:absolute;border-radius:4px;padding:10px;z-index:2000;font-size:12px;line-height:1.2;min-width:10px;word-wrap:break-word;visibility:visible}.el-popper.is-dark{color:#FFF;background:#303133}.el-popper.is-dark .el-popper__arrow::before{background:#303133;right:0}.el-popper.is-light{background:#FFF;border:1px solid #E4E7ED}.el-popper.is-light .el-popper__arrow::before{border:1px solid #E4E7ED;background:#FFF;right:0}.el-popper.is-pure{padding:0}.el-popper__arrow::before{content:" ";-webkit-transform:rotate(45deg);transform:rotate(45deg);background:#303133;-webkit-box-sizing:border-box;box-sizing:border-box}.el-popper[data-popper-placement^=top]>.el-popper__arrow{bottom:-5px}.el-popper[data-popper-placement^=bottom]>.el-popper__arrow{top:-5px}.el-popper[data-popper-placement^=left]>.el-popper__arrow{right:-5px}.el-popper[data-popper-placement^=right]>.el-popper__arrow{left:-5px}.el-popper.is-light[data-popper-placement^=top] .el-popper__arrow::before{border-top-color:transparent;border-left-color:transparent}.el-popper.is-light[data-popper-placement^=bottom] .el-popper__arrow::before{border-bottom-color:transparent;border-right-color:transparent}.el-popper.is-light[data-popper-placement^=left] .el-popper__arrow::before{border-left-color:transparent;border-bottom-color:transparent}.el-popper.is-light[data-popper-placement^=right] .el-popper__arrow::before{border-right-color:transparent;border-top-color:transparent} -------------------------------------------------------------------------------- /src/assets/css/theme/el-skeleton.css: -------------------------------------------------------------------------------- 1 | .el-skeleton__item{background:#f2f2f2;display:inline-block;height:16px;border-radius:4px;width:100%}.el-skeleton__circle{border-radius:50%;width:36px;height:36px;line-height:36px}.el-skeleton__circle--lg{width:40px;height:40px;line-height:40px}.el-skeleton__circle--md{width:28px;height:28px;line-height:28px}.el-skeleton__button{height:40px;width:64px;border-radius:4px}.el-skeleton__p{width:100%}.el-skeleton__p.is-last{width:61%}.el-skeleton__p.is-first{width:33%}.el-skeleton__text{width:100%;height:13px}.el-skeleton__caption{height:12px}.el-skeleton__h1{height:20px}.el-skeleton__h3{height:18px}.el-skeleton__h5{height:16px}.el-skeleton__image{width:unset;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;border-radius:0}.el-skeleton__image svg{fill:#DCDDE0;width:22%;height:22%}@-webkit-keyframes el-skeleton-loading{0%{background-position:100% 50%}100%{background-position:0 50%}}@keyframes el-skeleton-loading{0%{background-position:100% 50%}100%{background-position:0 50%}}.el-skeleton{width:100%}.el-skeleton__first-line,.el-skeleton__paragraph{height:16px;margin-top:16px;background:#f2f2f2}.el-skeleton.is-animated .el-skeleton__item{background:-webkit-gradient(linear,left top,right top,color-stop(25%,#f2f2f2),color-stop(37%,#e6e6e6),color-stop(63%,#f2f2f2));background:linear-gradient(90deg,#f2f2f2 25%,#e6e6e6 37%,#f2f2f2 63%);background-size:400% 100%;-webkit-animation:el-skeleton-loading 1.4s ease infinite;animation:el-skeleton-loading 1.4s ease infinite} -------------------------------------------------------------------------------- /src/views/user-center/MyReceived.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 58 | 59 | -------------------------------------------------------------------------------- /src/views/user-center/MyPublished.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 58 | 59 | -------------------------------------------------------------------------------- /src/components/content/OrderPage.vue: -------------------------------------------------------------------------------- 1 | 18 | 19 | 64 | 65 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-descriptions.css: -------------------------------------------------------------------------------- 1 | .el-descriptions__label.is-bordered-label{font-weight:700;color:#909399;background:#fafafa}.el-descriptions__label:not(.is-bordered-label){margin-right:10px}.el-descriptions{-webkit-box-sizing:border-box;box-sizing:border-box;font-size:14px;color:#303133}.el-descriptions__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-bottom:20px}.el-descriptions__title{font-size:16px;font-weight:700}.el-descriptions--mini,.el-descriptions--small{font-size:12px}.el-descriptions__body{color:#606266;background-color:#FFF}.el-descriptions__body table{border-collapse:collapse;width:100%}.el-descriptions__body table td,.el-descriptions__body table th{text-align:left;font-weight:400;line-height:1.5}.el-descriptions .is-bordered td,.el-descriptions .is-bordered th{border:1px solid #EBEEF5;padding:12px 10px}.el-descriptions :not(.is-bordered) td,.el-descriptions :not(.is-bordered) th{padding-bottom:12px}.el-descriptions--medium.is-bordered td,.el-descriptions--medium.is-bordered th{padding:10px}.el-descriptions--medium:not(.is-bordered) td,.el-descriptions--medium:not(.is-bordered) th{padding-bottom:10px}.el-descriptions--small.is-bordered td,.el-descriptions--small.is-bordered th{padding:8px 10px}.el-descriptions--small:not(.is-bordered) td,.el-descriptions--small:not(.is-bordered) th{padding-bottom:8px}.el-descriptions--mini.is-bordered td,.el-descriptions--mini.is-bordered th{padding:6px 10px}.el-descriptions--mini:not(.is-bordered) td,.el-descriptions--mini:not(.is-bordered) th{padding-bottom:6px} -------------------------------------------------------------------------------- /src/assets/css/theme/el-loading.css: -------------------------------------------------------------------------------- 1 | .el-loading-parent--relative{position:relative!important}.el-loading-parent--hidden{overflow:hidden!important}.el-loading-mask{position:absolute;z-index:2000;background-color:rgba(255,255,255,.9);margin:0;top:0;right:0;bottom:0;left:0;-webkit-transition:opacity .3s;transition:opacity .3s}.el-loading-mask.is-fullscreen{position:fixed}.el-loading-mask.is-fullscreen .el-loading-spinner{margin-top:-25px}.el-loading-mask.is-fullscreen .el-loading-spinner .circular{height:50px;width:50px}.el-loading-spinner{top:50%;margin-top:-21px;width:100%;text-align:center;position:absolute}.el-loading-spinner .el-loading-text{color:#9DC3C1;margin:3px 0;font-size:14px}.el-loading-spinner .circular{height:42px;width:42px;-webkit-animation:loading-rotate 2s linear infinite;animation:loading-rotate 2s linear infinite}.el-loading-spinner .path{-webkit-animation:loading-dash 1.5s ease-in-out infinite;animation:loading-dash 1.5s ease-in-out infinite;stroke-dasharray:90,150;stroke-dashoffset:0;stroke-width:2;stroke:#9DC3C1;stroke-linecap:round}.el-loading-spinner i{color:#9DC3C1}.el-loading-fade-enter-from,.el-loading-fade-leave-to{opacity:0}@-webkit-keyframes loading-rotate{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes loading-rotate{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes loading-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-40px}100%{stroke-dasharray:90,150;stroke-dashoffset:-120px}}@keyframes loading-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-40px}100%{stroke-dasharray:90,150;stroke-dashoffset:-120px}} -------------------------------------------------------------------------------- /src/components/content/MyFooter.vue: -------------------------------------------------------------------------------- 1 | 38 | 39 | 44 | 45 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-notification.css: -------------------------------------------------------------------------------- 1 | .el-notification{display:-webkit-box;display:-ms-flexbox;display:flex;width:330px;padding:14px 26px 14px 13px;border-radius:8px;-webkit-box-sizing:border-box;box-sizing:border-box;border:1px solid #EBEEF5;position:fixed;background-color:#FFF;-webkit-box-shadow:0 2px 12px 0 rgba(0,0,0,.1);box-shadow:0 2px 12px 0 rgba(0,0,0,.1);-webkit-transition:opacity .3s,left .3s,right .3s,top .4s,bottom .3s,-webkit-transform .3s;transition:opacity .3s,left .3s,right .3s,top .4s,bottom .3s,-webkit-transform .3s;transition:opacity .3s,transform .3s,left .3s,right .3s,top .4s,bottom .3s;transition:opacity .3s,transform .3s,left .3s,right .3s,top .4s,bottom .3s,-webkit-transform .3s;overflow-wrap:anywhere;overflow:hidden;z-index:9999}.el-notification.right{right:16px}.el-notification.left{left:16px}.el-notification__group{margin-left:13px;margin-right:8px}.el-notification__title{font-weight:700;font-size:16px;line-height:24px;color:#303133;margin:0}.el-notification__content{font-size:14px;line-height:24px;margin:6px 0 0;color:#606266;text-align:justify}.el-notification__content p{margin:0}.el-notification__icon{height:24px;width:24px;font-size:24px}.el-notification__closeBtn{position:absolute;top:18px;right:15px;cursor:pointer;color:#909399;font-size:16px}.el-notification__closeBtn:hover{color:#606266}.el-notification .el-icon-success{color:#67C23A}.el-notification .el-icon-error{color:#F56C6C}.el-notification .el-icon-info{color:#909399}.el-notification .el-icon-warning{color:#E6A23C}.el-notification-fade-enter-from.right{right:0;-webkit-transform:translateX(100%);transform:translateX(100%)}.el-notification-fade-enter-from.left{left:0;-webkit-transform:translateX(-100%);transform:translateX(-100%)}.el-notification-fade-leave-to{opacity:0} -------------------------------------------------------------------------------- /src/network/request.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios'; 2 | import { 3 | ElMessage 4 | } from 'element-plus'; 5 | import router from '@/router'; 6 | 7 | export function request(config) { 8 | // axios实例，接受config参数 9 | const instance = axios.create({ 10 | // 部署url 11 | // baseURL: 'http://39.108.133.73:8080', 12 | // 本机url 13 | baseURL:'http://localhost:8080', 14 | timeout: 6000, 15 | }); 16 | 17 | // 请求拦截 18 | instance.interceptors.request.use(config => { 19 | // 判断登陆权限 20 | const token = window.localStorage.getItem('token'); 21 | if (token) { 22 | config.headers.Authorization = 'Bearer ' + token; 23 | } 24 | return config; 25 | }, err => { 26 | console.log(err); 27 | }); 28 | 29 | // 响应拦截 30 | instance.interceptors.response.use(res => { 31 | // 成功调用接口，但后端返回了一些错误提示 32 | if (res.status && res.status == 200) { 33 | // 业务逻辑错误 34 | if (res.data.code == 500 || res.data.code == 401 || res.data.code == 403) { 35 | ElMessage.error({ 36 | message: res.data.message 37 | }); 38 | return Promise.reject(res); 39 | } 40 | // 成功提示 41 | else if (res.data.message) { 42 | ElMessage.success({ 43 | message: res.data.message 44 | }); 45 | } 46 | // 要记得返回response的数据（此处只返回了res.data) 47 | return res.data; 48 | } 49 | }, err => { 50 | // 没有调用到接口 51 | // 401权限错误，转到登录页 52 | if (err.response.code == 504 || err.response.code == 404) { 53 | ElMessage.error({ 54 | message: '找不到服务器！' 55 | }) 56 | } else if (err.response.code == 403) { 57 | ElMessage.error({ 58 | message: '权限不足！' 59 | }) 60 | } else if (err.response.code == '401') { 61 | ElMessage.warning({ 62 | message: '请先登录', 63 | }) 64 | router.push({ 65 | name: 'LoginPage' 66 | }); 67 | } 68 | }); 69 | 70 | return instance(config); 71 | } -------------------------------------------------------------------------------- /src/store/index.js: -------------------------------------------------------------------------------- 1 | import { 2 | createStore 3 | } from 'vuex' 4 | import mutations from './mutations' 5 | import actions from './action' 6 | import getters from './getters' 7 | 8 | const state = { 9 | // 用户信息 10 | user: { 11 | isLogin: window.localStorage.getItem('token') ? true : false, 12 | userId: window.localStorage.getItem('user') ? JSON.parse(window.localStorage.getItem('user')).userId : 0, 13 | username: window.localStorage.getItem('user') ? JSON.parse(window.localStorage.getItem('user')).username : "", 14 | roleId: window.localStorage.getItem('user') ? JSON.parse(window.localStorage.getItem('user')).roleId : 3, 15 | userIcon: window.localStorage.getItem('user') ? JSON.parse(window.localStorage.getItem('user')).userIcon : "", 16 | }, 17 | // 订单类型 18 | orderCategory: [{ 19 | name: "帮拿外卖", 20 | id: 1 21 | }, 22 | { 23 | name: "帮取快递", 24 | id: 2 25 | }, 26 | { 27 | name: "饭堂打包", 28 | id: 3 29 | }, 30 | { 31 | name: "帮忙打印", 32 | id: 4 33 | }, 34 | { 35 | name: "帮带物品", 36 | id: 5 37 | }, 38 | { 39 | name: "其他", 40 | id: 6 41 | } 42 | ], 43 | // 订单状态 44 | orderStatus: [{ 45 | id: 0, 46 | label: "未接单" 47 | }, 48 | { 49 | id: 1, 50 | label: "已接单" 51 | }, 52 | { 53 | id: 2, 54 | label: "待评价" 55 | }, 56 | { 57 | id: 3, 58 | label: "已评价" 59 | }, 60 | { 61 | id: 4, 62 | label: "已取消" 63 | }, 64 | ], 65 | // 用户所在地 66 | positions: [{ 67 | label: "大学城校区", 68 | value: "大学城校区", 69 | }, 70 | { 71 | label: "龙洞校区", 72 | value: "龙洞校区", 73 | }, 74 | { 75 | label: "东风路校区", 76 | value: "东风路校区", 77 | }, 78 | ] 79 | } 80 | 81 | //默认配置 82 | export default createStore({ 83 | //全局对象：用于保存所有组件的公共数据 84 | state, 85 | //同步执行 86 | mutations, 87 | //异步执行 88 | actions, 89 | getters, 90 | }) -------------------------------------------------------------------------------- /src/assets/css/theme/el-alert.css: -------------------------------------------------------------------------------- 1 | .el-alert{width:100%;padding:8px 16px;margin:0;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:4px;position:relative;background-color:#FFF;overflow:hidden;opacity:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:opacity .2s;transition:opacity .2s}.el-alert.is-light .el-alert__closebtn{color:#C0C4CC}.el-alert.is-dark .el-alert__closebtn,.el-alert.is-dark .el-alert__description{color:#FFF}.el-alert.is-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.el-alert--success.is-light{background-color:#f0f9eb;color:#67C23A}.el-alert--success.is-light .el-alert__description{color:#67C23A}.el-alert--success.is-dark{background-color:#67C23A;color:#FFF}.el-alert--info.is-light{background-color:#f4f4f5;color:#909399}.el-alert--info.is-dark{background-color:#909399;color:#FFF}.el-alert--info .el-alert__description{color:#909399}.el-alert--warning.is-light{background-color:#fdf6ec;color:#E6A23C}.el-alert--warning.is-light .el-alert__description{color:#E6A23C}.el-alert--warning.is-dark{background-color:#E6A23C;color:#FFF}.el-alert--error.is-light{background-color:#fef0f0;color:#F56C6C}.el-alert--error.is-light .el-alert__description{color:#F56C6C}.el-alert--error.is-dark{background-color:#F56C6C;color:#FFF}.el-alert__content{display:table-cell;padding:0 8px}.el-alert__icon{font-size:16px;width:16px}.el-alert__icon.is-big{font-size:28px;width:28px}.el-alert__title{font-size:13px;line-height:18px}.el-alert__title.is-bold{font-weight:700}.el-alert .el-alert__description{font-size:12px;margin:5px 0 0}.el-alert__closebtn{font-size:12px;opacity:1;position:absolute;top:12px;right:15px;cursor:pointer}.el-alert__closebtn.is-customed{font-style:normal;font-size:13px;top:9px}.el-alert-fade-enter-from,.el-alert-fade-leave-active{opacity:0} -------------------------------------------------------------------------------- /src/views/login/LoginPage.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 38 | 39 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-switch.css: -------------------------------------------------------------------------------- 1 | .el-switch{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:relative;font-size:14px;line-height:20px;height:20px;vertical-align:middle}.el-switch.is-disabled .el-switch__core,.el-switch.is-disabled .el-switch__label{cursor:not-allowed}.el-switch__core,.el-switch__label{display:inline-block;cursor:pointer;vertical-align:middle}.el-switch__label{-webkit-transition:.2s;transition:.2s;height:20px;font-size:14px;font-weight:500;color:#303133}.el-switch__label.is-active{color:#9DC3C1}.el-switch__label--left{margin-right:10px}.el-switch__label--right{margin-left:10px}.el-switch__label *{line-height:1;font-size:14px;display:inline-block}.el-switch__input{position:absolute;width:0;height:0;opacity:0;margin:0}.el-switch__core{margin:0;position:relative;width:40px;height:20px;border:1px solid #DCDFE6;outline:0;border-radius:10px;-webkit-box-sizing:border-box;box-sizing:border-box;background:#DCDFE6;-webkit-transition:border-color .3s,background-color .3s;transition:border-color .3s,background-color .3s}.el-switch__core .el-switch__action{position:absolute;top:1px;left:1px;border-radius:100%;-webkit-transition:all .3s;transition:all .3s;width:16px;height:16px;background-color:#FFF;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:#DCDFE6}.el-switch.is-checked .el-switch__core{border-color:#9DC3C1;background-color:#9DC3C1}.el-switch.is-checked .el-switch__core .el-switch__action{left:100%;margin-left:-17px;color:#9DC3C1}.el-switch.is-disabled{opacity:.6}.el-switch--wide .el-switch__label.el-switch__label--left span{left:10px}.el-switch--wide .el-switch__label.el-switch__label--right span{right:10px}.el-switch .label-fade-enter-from,.el-switch .label-fade-leave-active{opacity:0} -------------------------------------------------------------------------------- /src/assets/css/theme/el-message.css: -------------------------------------------------------------------------------- 1 | .el-message{min-width:380px;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:4px;border-width:1px;border-style:solid;border-color:#EBEEF5;position:fixed;left:50%;top:20px;-webkit-transform:translateX(-50%);transform:translateX(-50%);background-color:#edf2fc;-webkit-transition:opacity .3s,top .4s,-webkit-transform .4s;transition:opacity .3s,top .4s,-webkit-transform .4s;transition:opacity .3s,transform .4s,top .4s;transition:opacity .3s,transform .4s,top .4s,-webkit-transform .4s;overflow:hidden;padding:15px 15px 15px 20px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.el-message.is-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.el-message.is-closable .el-message__content{padding-right:16px}.el-message p{margin:0}.el-message--info .el-message__content{color:#909399}.el-message--success{background-color:#f0f9eb;border-color:#e1f3d8}.el-message--success .el-message__content{color:#67C23A}.el-message--warning{background-color:#fdf6ec;border-color:#faecd8}.el-message--warning .el-message__content{color:#E6A23C}.el-message--error{background-color:#fef0f0;border-color:#fde2e2}.el-message--error .el-message__content{color:#F56C6C}.el-message__icon{margin-right:10px}.el-message__content{padding:0;font-size:14px;line-height:1}.el-message__content:focus{outline-width:0}.el-message__closeBtn{position:absolute;top:50%;right:15px;-webkit-transform:translateY(-50%);transform:translateY(-50%);cursor:pointer;color:#C0C4CC;font-size:16px}.el-message__closeBtn:focus{outline-width:0}.el-message__closeBtn:hover{color:#909399}.el-message .el-icon-success{color:#67C23A}.el-message .el-icon-error{color:#F56C6C}.el-message .el-icon-info{color:#909399}.el-message .el-icon-warning{color:#E6A23C}.el-message-fade-enter-from,.el-message-fade-leave-to{opacity:0;-webkit-transform:translate(-50%,-100%);transform:translate(-50%,-100%)} -------------------------------------------------------------------------------- /src/views/SearchResult.vue: -------------------------------------------------------------------------------- 1 | 17 | 18 | 67 | 68 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-link.css: -------------------------------------------------------------------------------- 1 | .el-link{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;vertical-align:middle;position:relative;text-decoration:none;outline:0;cursor:pointer;padding:0;font-size:14px;font-weight:500}.el-link.is-underline:hover:after{content:"";position:absolute;left:0;right:0;height:0;bottom:0;border-bottom:1px solid #9DC3C1}.el-link.el-link--default:after,.el-link.el-link--primary.is-underline:hover:after,.el-link.el-link--primary:after{border-color:#9DC3C1}.el-link.is-disabled{cursor:not-allowed}.el-link [class*=el-icon-]+span{margin-left:5px}.el-link.el-link--default{color:#606266}.el-link.el-link--default:hover{color:#9DC3C1}.el-link.el-link--default.is-disabled{color:#C0C4CC}.el-link.el-link--primary{color:#9DC3C1}.el-link.el-link--primary:hover{color:rgb(177, 207, 205)}.el-link.el-link--primary.is-disabled{color:rgb(206, 225, 224)}.el-link.el-link--danger.is-underline:hover:after,.el-link.el-link--danger:after{border-color:#F56C6C}.el-link.el-link--danger{color:#F56C6C}.el-link.el-link--danger:hover{color:#f78989}.el-link.el-link--danger.is-disabled{color:#fab6b6}.el-link.el-link--success.is-underline:hover:after,.el-link.el-link--success:after{border-color:#67C23A}.el-link.el-link--success{color:#67C23A}.el-link.el-link--success:hover{color:#85ce61}.el-link.el-link--success.is-disabled{color:#b3e19d}.el-link.el-link--warning.is-underline:hover:after,.el-link.el-link--warning:after{border-color:#E6A23C}.el-link.el-link--warning{color:#E6A23C}.el-link.el-link--warning:hover{color:#ebb563}.el-link.el-link--warning.is-disabled{color:#f3d19e}.el-link.el-link--info.is-underline:hover:after,.el-link.el-link--info:after{border-color:#909399}.el-link.el-link--info{color:#909399}.el-link.el-link--info:hover{color:#a6a9ad}.el-link.el-link--info.is-disabled{color:#c8c9cc} -------------------------------------------------------------------------------- /src/views/user-center/UserCenter.vue: -------------------------------------------------------------------------------- 1 | 36 | 37 | 61 | 62 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-popover.css: -------------------------------------------------------------------------------- 1 | .el-popper{position:absolute;border-radius:4px;padding:10px;z-index:2000;font-size:12px;line-height:1.2;min-width:10px;word-wrap:break-word;visibility:visible}.el-popper__arrow,.el-popper__arrow::before{position:absolute;width:10px;height:10px;z-index:-1}.el-popper.is-dark{color:#FFF;background:#303133}.el-popper.is-dark .el-popper__arrow::before{background:#303133;right:0}.el-popper.is-light{background:#FFF;border:1px solid #E4E7ED}.el-popper.is-light .el-popper__arrow::before{border:1px solid #E4E7ED;background:#FFF;right:0}.el-popper.is-pure{padding:0}.el-popper__arrow::before{content:" ";-webkit-transform:rotate(45deg);transform:rotate(45deg);background:#303133;-webkit-box-sizing:border-box;box-sizing:border-box}.el-popper[data-popper-placement^=top]>.el-popper__arrow{bottom:-5px}.el-popper[data-popper-placement^=bottom]>.el-popper__arrow{top:-5px}.el-popper[data-popper-placement^=left]>.el-popper__arrow{right:-5px}.el-popper[data-popper-placement^=right]>.el-popper__arrow{left:-5px}.el-popper.is-light[data-popper-placement^=top] .el-popper__arrow::before{border-top-color:transparent;border-left-color:transparent}.el-popper.is-light[data-popper-placement^=bottom] .el-popper__arrow::before{border-bottom-color:transparent;border-right-color:transparent}.el-popper.is-light[data-popper-placement^=left] .el-popper__arrow::before{border-left-color:transparent;border-bottom-color:transparent}.el-popper.is-light[data-popper-placement^=right] .el-popper__arrow::before{border-right-color:transparent;border-top-color:transparent}.el-popover.el-popper{background:#FFF;min-width:150px;border-radius:4px;border:1px solid #EBEEF5;padding:12px;z-index:2000;color:#606266;line-height:1.4;text-align:justify;font-size:14px;-webkit-box-shadow:0 2px 12px 0 rgba(0,0,0,.1);box-shadow:0 2px 12px 0 rgba(0,0,0,.1);word-break:break-all}.el-popover.el-popper--plain{padding:18px 20px}.el-popover__title{color:#303133;font-size:16px;line-height:1;margin-bottom:12px}.el-popover.el-popper:focus,.el-popover.el-popper:focus:active,.el-popover__reference:focus:hover,.el-popover__reference:focus:not(.focusing){outline-width:0} -------------------------------------------------------------------------------- /src/assets/css/theme/el-radio-button.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8";.el-radio-button,.el-radio-button__inner{display:inline-block;position:relative;outline:0}.el-radio-button__inner{line-height:1;white-space:nowrap;vertical-align:middle;background:#FFF;border:1px solid #DCDFE6;font-weight:500;border-left:0;color:#606266;-webkit-appearance:none;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;cursor:pointer;-webkit-transition:all .3s cubic-bezier(.645,.045,.355,1);transition:all .3s cubic-bezier(.645,.045,.355,1);padding:12px 20px;font-size:14px;border-radius:0}.el-radio-button__inner.is-round{padding:12px 20px}.el-radio-button__inner:hover{color:#9DC3C1}.el-radio-button__inner [class*=el-icon-]{line-height:.9}.el-radio-button__inner [class*=el-icon-]+span{margin-left:5px}.el-radio-button:first-child .el-radio-button__inner{border-left:1px solid #DCDFE6;border-radius:4px 0 0 4px;-webkit-box-shadow:none!important;box-shadow:none!important}.el-radio-button__orig-radio{opacity:0;outline:0;position:absolute;z-index:-1}.el-radio-button__orig-radio:checked+.el-radio-button__inner{color:#FFF;background-color:#9DC3C1;border-color:#9DC3C1;-webkit-box-shadow:-1px 0 0 0 #9DC3C1;box-shadow:-1px 0 0 0 #9DC3C1}.el-radio-button__orig-radio:disabled+.el-radio-button__inner{color:#C0C4CC;cursor:not-allowed;background-image:none;background-color:#FFF;border-color:#EBEEF5;-webkit-box-shadow:none;box-shadow:none}.el-radio-button__orig-radio:disabled:checked+.el-radio-button__inner{background-color:#F2F6FC}.el-radio-button:last-child .el-radio-button__inner{border-radius:0 4px 4px 0}.el-radio-button:first-child:last-child .el-radio-button__inner{border-radius:4px}.el-radio-button--medium .el-radio-button__inner{padding:10px 20px;font-size:14px;border-radius:0}.el-radio-button--medium .el-radio-button__inner.is-round{padding:10px 20px}.el-radio-button--small .el-radio-button__inner{padding:9px 15px;font-size:12px;border-radius:0}.el-radio-button--small .el-radio-button__inner.is-round{padding:9px 15px}.el-radio-button--mini .el-radio-button__inner{padding:7px 15px;font-size:12px;border-radius:0}.el-radio-button--mini .el-radio-button__inner.is-round{padding:7px 15px}.el-radio-button:focus:not(.is-focus):not(:active):not(.is-disabled){-webkit-box-shadow:0 0 2px 2px #9DC3C1;box-shadow:0 0 2px 2px #9DC3C1} -------------------------------------------------------------------------------- /src/network/order.js: -------------------------------------------------------------------------------- 1 | import { 2 | request 3 | } from './request'; 4 | 5 | // 获取订单详情 6 | export function getDetail(params) { 7 | return request({ 8 | url: '/orders/detail', 9 | params 10 | }) 11 | } 12 | 13 | // 创建订单 14 | export function publishOrder(data) { 15 | return request({ 16 | url: '/orders/publish', 17 | method: 'post', 18 | data 19 | }) 20 | } 21 | 22 | // 获取用户发布的定单 23 | export function publishedOrders(params) { 24 | return request({ 25 | url: '/orders/publishOrders', 26 | params 27 | }) 28 | } 29 | // 获取用户接受的定单 30 | export function receivedOrders(params) { 31 | return request({ 32 | url: '/orders/receiveOrders', 33 | params 34 | }) 35 | } 36 | 37 | // 修改订单信息 38 | export function updateOrder(data) { 39 | return request({ 40 | url: '/orders/update', 41 | method: 'put', 42 | data 43 | }) 44 | } 45 | 46 | // 取消订单 47 | export function cancelOrder(data) { 48 | return request({ 49 | url: '/orders/cancel', 50 | method: 'put', 51 | data 52 | }) 53 | } 54 | 55 | // 接受订单 56 | export function receiveOrder(params,data) { 57 | return request({ 58 | url: '/orders/receive', 59 | method: 'put', 60 | params, 61 | data 62 | }) 63 | } 64 | 65 | // 完成订单 66 | export function finishOrder(data) { 67 | return request({ 68 | url: '/orders/finish', 69 | method: 'put', 70 | data 71 | }) 72 | } 73 | 74 | // 评价订单 75 | export function commentOrder(data) { 76 | return request({ 77 | url: '/orders-comment/comment', 78 | method: 'post', 79 | data 80 | }) 81 | } 82 | 83 | // 回复评价 84 | export function commentRepalyOrder(data) { 85 | return request({ 86 | url: '/orders-comment-replay/replay', 87 | method: 'post', 88 | data 89 | }) 90 | } 91 | 92 | // 获取评价 93 | export function getComment(params) { 94 | return request({ 95 | url: '/orders-comment/getComment', 96 | params 97 | }) 98 | } 99 | 100 | //获取回复 101 | export function getRepay(params) { 102 | return request({ 103 | url: '/orders-comment-replay/getReplay', 104 | params 105 | }) 106 | } 107 | // 历史浏览 108 | export function getHistory(params) { 109 | return request({ 110 | url: '/orders/history', 111 | params 112 | }) 113 | } -------------------------------------------------------------------------------- /src/assets/css/theme/el-carousel.css: -------------------------------------------------------------------------------- 1 | .el-carousel{position:relative}.el-carousel--horizontal{overflow-x:hidden}.el-carousel--vertical{overflow-y:hidden}.el-carousel__container{position:relative;height:300px}.el-carousel__arrow{border:none;outline:0;padding:0;margin:0;height:36px;width:36px;cursor:pointer;-webkit-transition:.3s;transition:.3s;border-radius:50%;background-color:rgba(31,45,61,.11);color:#FFF;position:absolute;top:50%;z-index:10;-webkit-transform:translateY(-50%);transform:translateY(-50%);text-align:center;font-size:12px}.el-carousel__arrow--left{left:16px}.el-carousel__arrow--right{right:16px}.el-carousel__arrow:hover{background-color:rgba(31,45,61,.23)}.el-carousel__arrow i{cursor:pointer}.el-carousel__indicators{position:absolute;list-style:none;margin:0;padding:0;z-index:2}.el-carousel__indicators--horizontal{bottom:0;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.el-carousel__indicators--vertical{right:0;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.el-carousel__indicators--outside{bottom:26px;text-align:center;position:static;-webkit-transform:none;transform:none}.el-carousel__indicators--outside .el-carousel__indicator:hover button{opacity:.64}.el-carousel__indicators--outside button{background-color:#C0C4CC;opacity:.24}.el-carousel__indicators--labels{left:0;right:0;-webkit-transform:none;transform:none;text-align:center}.el-carousel__indicators--labels .el-carousel__button{height:auto;width:auto;padding:2px 18px;font-size:12px}.el-carousel__indicators--labels .el-carousel__indicator{padding:6px 4px}.el-carousel__indicator{background-color:transparent;cursor:pointer}.el-carousel__indicator:hover button{opacity:.72}.el-carousel__indicator--horizontal{display:inline-block;padding:12px 4px}.el-carousel__indicator--vertical{padding:4px 12px}.el-carousel__indicator--vertical .el-carousel__button{width:2px;height:15px}.el-carousel__indicator.is-active button{opacity:1}.el-carousel__button{display:block;opacity:.48;width:30px;height:2px;background-color:#FFF;border:none;outline:0;padding:0;margin:0;cursor:pointer;-webkit-transition:.3s;transition:.3s}.carousel-arrow-left-enter-from,.carousel-arrow-left-leave-active{-webkit-transform:translateY(-50%) translateX(-10px);transform:translateY(-50%) translateX(-10px);opacity:0}.carousel-arrow-right-enter-from,.carousel-arrow-right-leave-active{-webkit-transform:translateY(-50%) translateX(10px);transform:translateY(-50%) translateX(10px);opacity:0} -------------------------------------------------------------------------------- /src/assets/css/theme/el-select-dropdown.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8";.el-popper{position:absolute;border-radius:4px;padding:10px;z-index:2000;font-size:12px;line-height:1.2;min-width:10px;word-wrap:break-word;visibility:visible}.el-popper.is-pure,.el-select-dropdown .el-scrollbar.is-empty .el-select-dropdown__list{padding:0}.el-popper.is-dark{color:#FFF;background:#303133}.el-popper.is-dark .el-popper__arrow::before{background:#303133;right:0}.el-popper.is-light{background:#FFF;border:1px solid #E4E7ED}.el-popper.is-light .el-popper__arrow::before{border:1px solid #E4E7ED;background:#FFF;right:0}.el-popper__arrow{position:absolute;width:10px;height:10px;z-index:-1}.el-popper__arrow::before{position:absolute;width:10px;height:10px;z-index:-1;content:" ";-webkit-transform:rotate(45deg);transform:rotate(45deg);background:#303133;-webkit-box-sizing:border-box;box-sizing:border-box}.el-popper[data-popper-placement^=top]>.el-popper__arrow{bottom:-5px}.el-popper[data-popper-placement^=bottom]>.el-popper__arrow{top:-5px}.el-popper[data-popper-placement^=left]>.el-popper__arrow{right:-5px}.el-popper[data-popper-placement^=right]>.el-popper__arrow{left:-5px}.el-popper.is-light[data-popper-placement^=top] .el-popper__arrow::before{border-top-color:transparent;border-left-color:transparent}.el-popper.is-light[data-popper-placement^=bottom] .el-popper__arrow::before{border-bottom-color:transparent;border-right-color:transparent}.el-popper.is-light[data-popper-placement^=left] .el-popper__arrow::before{border-left-color:transparent;border-bottom-color:transparent}.el-popper.is-light[data-popper-placement^=right] .el-popper__arrow::before{border-right-color:transparent;border-top-color:transparent}.el-select-dropdown{z-index:1001;border-radius:4px;-webkit-box-sizing:border-box;box-sizing:border-box}.el-select-dropdown.is-multiple .el-select-dropdown__item.selected{color:#9DC3C1;background-color:#FFF}.el-select-dropdown.is-multiple .el-select-dropdown__item.selected.hover{background-color:#F5F7FA}.el-select-dropdown.is-multiple .el-select-dropdown__item.selected::after{position:absolute;right:20px;font-family:element-icons;content:"";font-size:12px;font-weight:700;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.el-select-dropdown__empty{padding:10px 0;margin:0;text-align:center;color:#999;font-size:14px}.el-select-dropdown__wrap{max-height:274px}.el-select-dropdown__list{list-style:none;padding:6px 0;margin:0;-webkit-box-sizing:border-box;box-sizing:border-box} -------------------------------------------------------------------------------- /src/assets/css/theme/el-progress.css: -------------------------------------------------------------------------------- 1 | .el-progress{position:relative;line-height:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.el-progress__text{font-size:14px;color:#606266;margin-left:5px;min-width:50px;line-height:1}.el-progress__text i{vertical-align:middle;display:block}.el-progress--circle,.el-progress--dashboard{display:inline-block}.el-progress--circle .el-progress__text,.el-progress--dashboard .el-progress__text{position:absolute;top:50%;left:0;width:100%;text-align:center;margin:0;-webkit-transform:translate(0,-50%);transform:translate(0,-50%)}.el-progress--circle .el-progress__text i,.el-progress--dashboard .el-progress__text i{vertical-align:middle;display:inline-block}.el-progress--without-text .el-progress__text{display:none}.el-progress--without-text .el-progress-bar{padding-right:0;margin-right:0;display:block}.el-progress--text-inside .el-progress-bar{padding-right:0;margin-right:0}.el-progress.is-success .el-progress-bar__inner{background-color:#67C23A}.el-progress.is-success .el-progress__text{color:#67C23A}.el-progress.is-warning .el-progress-bar__inner{background-color:#E6A23C}.el-progress.is-warning .el-progress__text{color:#E6A23C}.el-progress.is-exception .el-progress-bar__inner{background-color:#F56C6C}.el-progress.is-exception .el-progress__text{color:#F56C6C}.el-progress-bar{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-sizing:border-box;box-sizing:border-box}.el-progress-bar__outer{height:6px;border-radius:100px;background-color:#EBEEF5;overflow:hidden;position:relative;vertical-align:middle}.el-progress-bar__inner{position:absolute;left:0;top:0;height:100%;background-color:#9DC3C1;text-align:right;border-radius:100px;line-height:1;white-space:nowrap;-webkit-transition:width .6s ease;transition:width .6s ease}.el-progress-bar__inner::after{display:inline-block;content:"";height:100%;vertical-align:middle}.el-progress-bar__inner--indeterminate{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-animation:indeterminate 3s infinite;animation:indeterminate 3s infinite}.el-progress-bar__innerText{display:inline-block;vertical-align:middle;color:#FFF;font-size:12px;margin:0 5px}@-webkit-keyframes progress{0%{background-position:0 0}100%{background-position:32px 0}}@keyframes progress{0%{background-position:0 0}100%{background-position:32px 0}}@-webkit-keyframes indeterminate{0%{left:-100%}100%{left:100%}}@keyframes indeterminate{0%{left:-100%}100%{left:100%}} -------------------------------------------------------------------------------- /src/assets/css/theme/el-tooltip.css: -------------------------------------------------------------------------------- 1 | .el-tooltip:focus:hover,.el-tooltip:focus:not(.focusing){outline-width:0}.el-tooltip__popper{position:absolute;border-radius:4px;padding:10px;z-index:2000;font-size:12px;line-height:1.2;min-width:10px;word-wrap:break-word}.el-tooltip__popper .popper__arrow,.el-tooltip__popper .popper__arrow::after{position:absolute;display:block;width:0;height:0;border-color:transparent;border-style:solid}.el-tooltip__popper .popper__arrow{border-width:6px}.el-tooltip__popper .popper__arrow::after{content:" ";border-width:5px}.el-tooltip__popper[x-placement^=top]{margin-bottom:12px}.el-tooltip__popper[x-placement^=top] .popper__arrow{bottom:-6px;border-top-color:#303133;border-bottom-width:0}.el-tooltip__popper[x-placement^=top] .popper__arrow::after{bottom:1px;margin-left:-5px;border-top-color:#303133;border-bottom-width:0}.el-tooltip__popper[x-placement^=bottom]{margin-top:12px}.el-tooltip__popper[x-placement^=bottom] .popper__arrow{top:-6px;border-top-width:0;border-bottom-color:#303133}.el-tooltip__popper[x-placement^=bottom] .popper__arrow::after{top:1px;margin-left:-5px;border-top-width:0;border-bottom-color:#303133}.el-tooltip__popper[x-placement^=right]{margin-left:12px}.el-tooltip__popper[x-placement^=right] .popper__arrow{left:-6px;border-right-color:#303133;border-left-width:0}.el-tooltip__popper[x-placement^=right] .popper__arrow::after{bottom:-5px;left:1px;border-right-color:#303133;border-left-width:0}.el-tooltip__popper[x-placement^=left]{margin-right:12px}.el-tooltip__popper[x-placement^=left] .popper__arrow{right:-6px;border-right-width:0;border-left-color:#303133}.el-tooltip__popper[x-placement^=left] .popper__arrow::after{right:1px;bottom:-5px;margin-left:-5px;border-right-width:0;border-left-color:#303133}.el-tooltip__popper.is-dark{background:#303133;color:#FFF}.el-tooltip__popper.is-light{background:#FFF;border:1px solid #303133}.el-tooltip__popper.is-light[x-placement^=top] .popper__arrow{border-top-color:#303133}.el-tooltip__popper.is-light[x-placement^=top] .popper__arrow::after{border-top-color:#FFF}.el-tooltip__popper.is-light[x-placement^=bottom] .popper__arrow{border-bottom-color:#303133}.el-tooltip__popper.is-light[x-placement^=bottom] .popper__arrow::after{border-bottom-color:#FFF}.el-tooltip__popper.is-light[x-placement^=left] .popper__arrow{border-left-color:#303133}.el-tooltip__popper.is-light[x-placement^=left] .popper__arrow::after{border-left-color:#FFF}.el-tooltip__popper.is-light[x-placement^=right] .popper__arrow{border-right-color:#303133}.el-tooltip__popper.is-light[x-placement^=right] .popper__arrow::after{border-right-color:#FFF} -------------------------------------------------------------------------------- /src/assets/css/theme/el-form.css: -------------------------------------------------------------------------------- 1 | .el-form--inline .el-form-item,.el-form--inline .el-form-item__content{display:inline-block;vertical-align:top}.el-form-item::after,.el-form-item__content::after{clear:both}.el-form--label-left .el-form-item__label{text-align:left}.el-form--label-top .el-form-item__label{float:none;display:inline-block;text-align:left;padding:0 0 10px}.el-form--inline .el-form-item{margin-right:10px}.el-form--inline .el-form-item__label{float:none;display:inline-block}.el-form--inline.el-form--label-top .el-form-item__content{display:block}.el-form-item::after,.el-form-item::before,.el-form-item__content::after,.el-form-item__content::before{display:table;content:""}.el-form-item{margin-bottom:22px}.el-form-item .el-form-item{margin-bottom:0}.el-form-item--mini.el-form-item,.el-form-item--small.el-form-item{margin-bottom:18px}.el-form-item .el-input__validateIcon{display:none}.el-form-item--medium .el-form-item__content,.el-form-item--medium .el-form-item__label{line-height:36px}.el-form-item--small .el-form-item__content,.el-form-item--small .el-form-item__label{line-height:32px}.el-form-item--small .el-form-item__error{padding-top:2px}.el-form-item--mini .el-form-item__content,.el-form-item--mini .el-form-item__label{line-height:28px}.el-form-item--mini .el-form-item__error{padding-top:1px}.el-form-item__label-wrap{float:left}.el-form-item__label-wrap .el-form-item__label{display:inline-block;float:none}.el-form-item__label{text-align:right;vertical-align:middle;float:left;font-size:14px;color:#606266;line-height:40px;padding:0 12px 0 0;-webkit-box-sizing:border-box;box-sizing:border-box}.el-form-item__content{line-height:40px;position:relative;font-size:14px}.el-form-item__content .el-input-group{vertical-align:top}.el-form-item__error{color:#F56C6C;font-size:12px;line-height:1;padding-top:4px;position:absolute;top:100%;left:0}.el-form-item__error--inline{position:relative;top:auto;left:auto;display:inline-block;margin-left:10px}.el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap>.el-form-item__label:before,.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:before{content:"*";color:#F56C6C;margin-right:4px}.el-form-item.is-error .el-input__inner,.el-form-item.is-error .el-input__inner:focus,.el-form-item.is-error .el-textarea__inner,.el-form-item.is-error .el-textarea__inner:focus{border-color:#F56C6C}.el-form-item.is-error .el-input-group__append .el-input__inner,.el-form-item.is-error .el-input-group__prepend .el-input__inner{border-color:transparent}.el-form-item.is-error .el-input__validateIcon{color:#F56C6C}.el-form-item--feedback .el-input__validateIcon{display:inline-block} -------------------------------------------------------------------------------- /src/assets/css/theme/el-image-viewer.css: -------------------------------------------------------------------------------- 1 | .el-image-viewer__wrapper{position:fixed;top:0;right:0;bottom:0;left:0}.el-image-viewer__btn{position:absolute;z-index:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;border-radius:50%;opacity:.8;cursor:pointer;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.el-image-viewer__close{top:40px;right:40px}.el-image-viewer__canvas{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.el-image-viewer__actions{left:50%;bottom:30px;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:282px;height:44px;padding:0 23px;background-color:#606266;border-color:#fff;border-radius:22px}.el-image-viewer__actions__inner{width:100%;height:100%;text-align:justify;cursor:default;font-size:23px;color:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:distribute;justify-content:space-around}.el-image-viewer__close,.el-image-viewer__next,.el-image-viewer__prev{width:44px;height:44px;font-size:24px;color:#fff;background-color:#606266;border-color:#fff}.el-image-viewer__prev{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);left:40px}.el-image-viewer__next{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);right:40px;text-indent:2px}.el-image-viewer__mask{position:absolute;width:100%;height:100%;top:0;left:0;opacity:.5;background:#000}.viewer-fade-enter-active{-webkit-animation:viewer-fade-in .3s;animation:viewer-fade-in .3s}.viewer-fade-leave-active{-webkit-animation:viewer-fade-out .3s;animation:viewer-fade-out .3s}@-webkit-keyframes viewer-fade-in{0%{-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0);opacity:0}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@keyframes viewer-fade-in{0%{-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0);opacity:0}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@-webkit-keyframes viewer-fade-out{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}100%{-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0);opacity:0}}@keyframes viewer-fade-out{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}100%{-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0);opacity:0}} -------------------------------------------------------------------------------- /src/assets/css/theme/el-radio.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8";.el-radio,.el-radio--medium.is-bordered .el-radio__label{font-size:14px}.el-radio,.el-radio__input{white-space:nowrap;line-height:1;outline:0}.el-radio,.el-radio__inner,.el-radio__input{position:relative;display:inline-block}.el-radio{color:#606266;font-weight:500;cursor:pointer;margin-right:30px;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.el-radio.is-bordered{padding:12px 20px 0 10px;border-radius:4px;border:1px solid #DCDFE6;-webkit-box-sizing:border-box;box-sizing:border-box;height:40px}.el-radio.is-bordered.is-checked{border-color:#9DC3C1}.el-radio.is-bordered.is-disabled{cursor:not-allowed;border-color:#EBEEF5}.el-radio__input.is-disabled .el-radio__inner,.el-radio__input.is-disabled.is-checked .el-radio__inner{background-color:#F5F7FA;border-color:#E4E7ED}.el-radio.is-bordered+.el-radio.is-bordered{margin-left:10px}.el-radio--medium.is-bordered{padding:10px 20px 0 10px;border-radius:4px;height:36px}.el-radio--medium.is-bordered .el-radio__inner{height:14px;width:14px}.el-radio--small.is-bordered{padding:8px 15px 0 10px;border-radius:3px;height:32px}.el-radio--small.is-bordered .el-radio__label{font-size:12px}.el-radio--small.is-bordered .el-radio__inner{height:12px;width:12px}.el-radio--mini.is-bordered{padding:6px 15px 0 10px;border-radius:3px;height:28px}.el-radio--mini.is-bordered .el-radio__label{font-size:12px}.el-radio--mini.is-bordered .el-radio__inner{height:12px;width:12px}.el-radio:last-child{margin-right:0}.el-radio__input{cursor:pointer;vertical-align:middle}.el-radio__input.is-disabled .el-radio__inner{cursor:not-allowed}.el-radio__input.is-disabled .el-radio__inner::after{cursor:not-allowed;background-color:#F5F7FA}.el-radio__input.is-disabled .el-radio__inner+.el-radio__label{cursor:not-allowed}.el-radio__input.is-disabled.is-checked .el-radio__inner::after{background-color:#C0C4CC}.el-radio__input.is-disabled+span.el-radio__label{color:#C0C4CC;cursor:not-allowed}.el-radio__input.is-checked .el-radio__inner{border-color:#9DC3C1;background:#9DC3C1}.el-radio__input.is-checked .el-radio__inner::after{-webkit-transform:translate(-50%,-50%) scale(1);transform:translate(-50%,-50%) scale(1)}.el-radio__input.is-checked+.el-radio__label{color:#9DC3C1}.el-radio__input.is-focus .el-radio__inner{border-color:#9DC3C1}.el-radio__inner{border:1px solid #DCDFE6;border-radius:100%;width:14px;height:14px;background-color:#FFF;cursor:pointer;-webkit-box-sizing:border-box;box-sizing:border-box}.el-radio__inner:hover{border-color:#9DC3C1}.el-radio__inner::after{width:4px;height:4px;border-radius:100%;background-color:#FFF;content:"";position:absolute;left:50%;top:50%;-webkit-transform:translate(-50%,-50%) scale(0);transform:translate(-50%,-50%) scale(0);-webkit-transition:-webkit-transform .15s ease-in;transition:-webkit-transform .15s ease-in;transition:transform .15s ease-in;transition:transform .15s ease-in,-webkit-transform .15s ease-in}.el-radio__original{opacity:0;outline:0;position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;margin:0}.el-radio:focus:not(.is-focus):not(:active):not(.is-disabled) .el-radio__inner{-webkit-box-shadow:0 0 2px 2px #9DC3C1;box-shadow:0 0 2px 2px #9DC3C1}.el-radio__label{font-size:14px;padding-left:10px} -------------------------------------------------------------------------------- /src/assets/css/theme/el-dialog.css: -------------------------------------------------------------------------------- 1 | .el-overlay,.v-modal{position:fixed;height:100%;left:0}.el-dialog__wrapper,.el-overlay{top:0;right:0;bottom:0;overflow:auto}.v-modal-enter{-webkit-animation:v-modal-in .2s ease;animation:v-modal-in .2s ease}.v-modal-leave{-webkit-animation:v-modal-out .2s ease forwards;animation:v-modal-out .2s ease forwards}@-webkit-keyframes v-modal-in{0%{opacity:0}}@keyframes v-modal-in{0%{opacity:0}}@-webkit-keyframes v-modal-out{100%{opacity:0}}@keyframes v-modal-out{100%{opacity:0}}.v-modal{top:0;width:100%;opacity:.5;background:#000}.el-popup-parent--hidden{overflow:hidden}.el-overlay{z-index:2000;background-color:rgba(0,0,0,.5)}.el-overlay .el-overlay-root{height:0}.el-dialog{position:relative;margin:0 auto 50px;background:#FFF;border-radius:2px;-webkit-box-shadow:0 1px 3px rgba(0,0,0,.3);box-shadow:0 1px 3px rgba(0,0,0,.3);-webkit-box-sizing:border-box;box-sizing:border-box;width:50%}.el-dialog.is-fullscreen{width:100%;margin-top:0;margin-bottom:0;height:100%;overflow:auto}.el-dialog__wrapper{position:fixed;left:0;margin:0}.el-dialog__header{padding:20px 20px 10px}.el-dialog__headerbtn{position:absolute;top:20px;right:20px;padding:0;background:0 0;border:none;outline:0;cursor:pointer;font-size:16px}.el-dialog__headerbtn .el-dialog__close{color:#909399}.el-dialog__headerbtn:focus .el-dialog__close,.el-dialog__headerbtn:hover .el-dialog__close{color:#9DC3C1}.el-dialog__title{line-height:24px;font-size:18px;color:#303133}.el-dialog__body{padding:30px 20px;color:#606266;font-size:14px;word-break:break-all}.el-dialog__footer{padding:10px 20px 20px;text-align:right;-webkit-box-sizing:border-box;box-sizing:border-box}.el-dialog--center{text-align:center}.el-dialog--center .el-dialog__body{text-align:initial;padding:25px 25px 30px}.el-dialog--center .el-dialog__footer{text-align:inherit}.dialog-fade-enter-active{-webkit-animation:modal-fade-in .3s!important;animation:modal-fade-in .3s!important}.dialog-fade-enter-active .el-dialog{-webkit-animation:dialog-fade-in .3s;animation:dialog-fade-in .3s}.dialog-fade-leave-active{-webkit-animation:modal-fade-out .3s;animation:modal-fade-out .3s}.dialog-fade-leave-active .el-dialog{-webkit-animation:dialog-fade-out .3s;animation:dialog-fade-out .3s}@-webkit-keyframes dialog-fade-in{0%{-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0);opacity:0}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@keyframes dialog-fade-in{0%{-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0);opacity:0}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@-webkit-keyframes dialog-fade-out{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}100%{-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0);opacity:0}}@keyframes dialog-fade-out{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}100%{-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0);opacity:0}}@-webkit-keyframes modal-fade-in{0%{opacity:0}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@keyframes modal-fade-in{0%{opacity:0}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@-webkit-keyframes modal-fade-out{0%{opacity:1}100%{opacity:0}}@keyframes modal-fade-out{0%{opacity:1}100%{opacity:0}} -------------------------------------------------------------------------------- /src/assets/css/theme/el-image.css: -------------------------------------------------------------------------------- 1 | .el-image-viewer__wrapper{position:fixed;top:0;right:0;bottom:0;left:0}.el-image-viewer__btn{position:absolute;z-index:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;border-radius:50%;opacity:.8;cursor:pointer;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.el-image-viewer__close{top:40px;right:40px}.el-image-viewer__canvas{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.el-image-viewer__actions{left:50%;bottom:30px;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:282px;height:44px;padding:0 23px;background-color:#606266;border-color:#fff;border-radius:22px}.el-image-viewer__actions__inner{width:100%;height:100%;text-align:justify;cursor:default;font-size:23px;color:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:distribute;justify-content:space-around}.el-image-viewer__close,.el-image-viewer__next,.el-image-viewer__prev{width:44px;height:44px;font-size:24px;color:#fff;background-color:#606266;border-color:#fff}.el-image-viewer__prev{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);left:40px}.el-image-viewer__next{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);right:40px;text-indent:2px}.el-image-viewer__mask,.el-image__error,.el-image__inner,.el-image__placeholder{width:100%;height:100%}.el-image-viewer__mask{position:absolute;top:0;left:0;opacity:.5;background:#000}.el-image__error,.el-image__placeholder{background:#F5F7FA}.viewer-fade-enter-active{-webkit-animation:viewer-fade-in .3s;animation:viewer-fade-in .3s}.viewer-fade-leave-active{-webkit-animation:viewer-fade-out .3s;animation:viewer-fade-out .3s}@-webkit-keyframes viewer-fade-in{0%{-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0);opacity:0}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@keyframes viewer-fade-in{0%{-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0);opacity:0}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@-webkit-keyframes viewer-fade-out{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}100%{-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0);opacity:0}}@keyframes viewer-fade-out{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}100%{-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0);opacity:0}}.el-image{position:relative;display:inline-block;overflow:hidden}.el-image__inner{vertical-align:top}.el-image__inner--center{position:relative;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);display:block}.el-image__error{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:14px;color:#C0C4CC;vertical-align:middle}.el-image__preview{cursor:pointer} -------------------------------------------------------------------------------- /src/views/login/LoginForm.vue: -------------------------------------------------------------------------------- 1 | 29 | 30 | 102 | 103 | -------------------------------------------------------------------------------- /src/router/index.js: -------------------------------------------------------------------------------- 1 | import { 2 | createRouter, 3 | createWebHashHistory 4 | } from 'vue-router' 5 | 6 | import store from '@/store/index.js' 7 | 8 | const routes = [{ 9 | path: '/', 10 | redirect: '/home' 11 | }, 12 | { 13 | path: '/home', 14 | name: 'Home', 15 | component: () => import('views/home/Home.vue'), 16 | }, 17 | { 18 | path: '/login', 19 | name: "LoginPage", 20 | component: () => import('views/login/LoginPage.vue'), 21 | meta: { 22 | title: 'gdut-gofor | 登录' 23 | } 24 | }, 25 | { 26 | path: '/publish', 27 | name: 'PublishOrder', 28 | component: () => import('views/PublishOrder.vue'), 29 | meta: { 30 | requiresAuth: true, 31 | title: 'gdut-gofor | 发布订单' 32 | }, 33 | }, 34 | { 35 | path: '/orders/detail/:orderId(\\d+)', 36 | name: 'Detail', 37 | component: () => import('views/Detail.vue'), 38 | meta: { 39 | requiresAuth: true, 40 | title: 'gdut-gofor | 订单详情' 41 | }, 42 | }, { 43 | path: '/orders/update/:orderId(\\d+)', 44 | name: 'UpdateOrder', 45 | component: () => import('views/UpdateOrder.vue'), 46 | meta: { 47 | requiresAuth: true, 48 | title: 'gdut-gofor | 修改订单详情' 49 | }, 50 | }, 51 | { 52 | path: '/center', 53 | name: 'UserCenter', 54 | component: () => import('views/user-center/UserCenter.vue'), 55 | meta: { 56 | requiresAuth: true, 57 | title: 'gdut-gofor | 个人中心页' 58 | }, 59 | children: [{ 60 | path: '/userinfo', 61 | name: 'UserInfo', 62 | component: () => import('views/user-center/UserInfo.vue'), 63 | props: { 64 | user: false 65 | } 66 | }, 67 | { 68 | path: '/my-received', 69 | name: 'MyReceived', 70 | component: () => import('views/user-center/MyReceived.vue'), 71 | }, { 72 | path: '/my-published', 73 | name: 'MyPublished', 74 | component: () => import('views/user-center/MyPublished.vue'), 75 | }, { 76 | path: '/history', 77 | name: 'MyHistory', 78 | component: () => import('views/user-center/MyHistory.vue'), 79 | }, { 80 | path: '/security', 81 | name: 'Security', 82 | component: () => import('views/user-center/Security.vue'), 83 | }, { 84 | path: '/complain', 85 | name: 'Complain', 86 | component: () => import('views/user-center/Complain.vue'), 87 | } 88 | ] 89 | }, 90 | { 91 | path: '/search/:keywords', 92 | name: "SearchResult", 93 | component: () => import('views/SearchResult.vue'), 94 | meta: { 95 | title: 'gdut-gofor | 搜索结果' 96 | } 97 | } 98 | ] 99 | 100 | const router = createRouter({ 101 | history: createWebHashHistory(), 102 | routes 103 | }) 104 | 105 | // 全局前置守卫，判断路由权限 106 | router.beforeEach((to, from, next) => { 107 | if (to.meta.requiresAuth && !store.state.user.isLogin) { 108 | next({ 109 | name: 'LoginPage' 110 | }) 111 | } else { 112 | next(); 113 | } 114 | }); 115 | 116 | // 全局后置守卫，修改页面title 117 | router.afterEach((to) => { 118 | if (to.meta.title) { 119 | document.title = to.meta.title; 120 | } else { 121 | document.title = 'gdut-gofor | 广工人的跑腿系统'; 122 | } 123 | }) 124 | 125 | export default router -------------------------------------------------------------------------------- /src/views/home/Home.vue: -------------------------------------------------------------------------------- 1 | 25 | 26 | 63 | 64 | -------------------------------------------------------------------------------- /src/views/user-center/Security.vue: -------------------------------------------------------------------------------- 1 | 29 | 30 | 111 | 112 | -------------------------------------------------------------------------------- /src/components/content/Order.vue: -------------------------------------------------------------------------------- 1 | 37 | 38 | 82 | 83 | -------------------------------------------------------------------------------- /src/assets/css/theme/el-drawer.css: -------------------------------------------------------------------------------- 1 | .el-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2000;height:100%;background-color:rgba(0,0,0,.5);overflow:auto}.el-overlay .el-overlay-root{height:0}@-webkit-keyframes el-drawer-fade-in{0%{opacity:0}100%{opacity:1}}@keyframes el-drawer-fade-in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes rtl-drawer-animation{0%{-webkit-transform:translate(0,0);transform:translate(0,0)}100%{-webkit-transform:translate(100%,0);transform:translate(100%,0)}}@keyframes rtl-drawer-animation{0%{-webkit-transform:translate(0,0);transform:translate(0,0)}100%{-webkit-transform:translate(100%,0);transform:translate(100%,0)}}@-webkit-keyframes ltr-drawer-animation{0%{-webkit-transform:translate(0,0);transform:translate(0,0)}100%{-webkit-transform:translate(-100%,0);transform:translate(-100%,0)}}@keyframes ltr-drawer-animation{0%{-webkit-transform:translate(0,0);transform:translate(0,0)}100%{-webkit-transform:translate(-100%,0);transform:translate(-100%,0)}}@-webkit-keyframes ttb-drawer-animation{0%{-webkit-transform:translate(0,0);transform:translate(0,0)}100%{-webkit-transform:translate(0,-100%);transform:translate(0,-100%)}}@keyframes ttb-drawer-animation{0%{-webkit-transform:translate(0,0);transform:translate(0,0)}100%{-webkit-transform:translate(0,-100%);transform:translate(0,-100%)}}@-webkit-keyframes btt-drawer-animation{0%{-webkit-transform:translate(0,0);transform:translate(0,0)}100%{-webkit-transform:translate(0,100%);transform:translate(0,100%)}}@keyframes btt-drawer-animation{0%{-webkit-transform:translate(0,0);transform:translate(0,0)}100%{-webkit-transform:translate(0,100%);transform:translate(0,100%)}}.el-drawer{position:absolute;-webkit-box-sizing:border-box;box-sizing:border-box;background-color:#FFF;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-shadow:0 8px 10px -5px rgba(0,0,0,.2),0 16px 24px 2px rgba(0,0,0,.14),0 6px 30px 5px rgba(0,0,0,.12);box-shadow:0 8px 10px -5px rgba(0,0,0,.2),0 16px 24px 2px rgba(0,0,0,.14),0 6px 30px 5px rgba(0,0,0,.12);overflow:hidden}.el-drawer-fade-enter-active .el-drawer.rtl{animation:rtl-drawer-animation .3s linear reverse}.el-drawer-fade-leave-active .el-drawer.rtl{-webkit-animation:rtl-drawer-animation .3s linear;animation:rtl-drawer-animation .3s linear}.el-drawer-fade-enter-active .el-drawer.ltr{animation:ltr-drawer-animation .3s linear reverse}.el-drawer-fade-leave-active .el-drawer.ltr{-webkit-animation:ltr-drawer-animation .3s linear;animation:ltr-drawer-animation .3s linear}.el-drawer-fade-enter-active .el-drawer.ttb{animation:ttb-drawer-animation .3s linear reverse}.el-drawer-fade-leave-active .el-drawer.ttb{-webkit-animation:ttb-drawer-animation .3s linear;animation:ttb-drawer-animation .3s linear}.el-drawer-fade-enter-active .el-drawer.btt{animation:btt-drawer-animation .3s linear reverse}.el-drawer-fade-leave-active .el-drawer.btt{-webkit-animation:btt-drawer-animation .3s linear;animation:btt-drawer-animation .3s linear}.el-drawer__header{-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:#72767b;display:-webkit-box;display:-ms-flexbox;display:flex;margin-bottom:32px;padding:20px 20px 0}.el-drawer__header>:first-child{-webkit-box-flex:1;-ms-flex:1;flex:1}.el-drawer__title{margin:0;-webkit-box-flex:1;-ms-flex:1;flex:1;line-height:inherit;font-size:1rem}.el-drawer__close-btn{border:none;cursor:pointer;font-size:20px;color:inherit;background-color:transparent;outline:0}.el-drawer__close-btn:hover i{color:#9DC3C1}.el-drawer__body{-webkit-box-flex:1;-ms-flex:1;flex:1}.el-drawer__body>*{-webkit-box-sizing:border-box;box-sizing:border-box}.el-drawer.ltr,.el-drawer.rtl{height:100%;top:0;bottom:0}.el-drawer.btt,.el-drawer.ttb{width:100%;left:0;right:0}.el-drawer.ltr{left:0}.el-drawer.rtl{right:0}.el-drawer.ttb{top:0}.el-drawer.btt{bottom:0}.el-drawer-fade-enter-active{-webkit-animation:el-drawer-fade-in .3s;animation:el-drawer-fade-in .3s;overflow:hidden!important}.el-drawer-fade-leave-active{overflow:hidden!important;animation:el-drawer-fade-in .3s reverse} -------------------------------------------------------------------------------- /src/views/PublishOrder.vue: -------------------------------------------------------------------------------- 1 | 48 | 49 | 117 | 118 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | [toc] 2 | 3 | # 项目背景 4 | 5 | 大二下学期的小组项目作业，我们小组做的项目是校园跑腿系统，系统分为前台（面向用户）和后台（面向管理员）两个部分。前台系统是所有用户的系统入口（包括管理员），主要提供给普通用户发布、浏览和接受跑腿订单；后台系统则是面向管理员，用于帮助其掌握系统运营信息的。 6 | 7 | 由于我们组采用的是前后端分离的开发模式，且我负责的是系统前台部分的前端开发工作，所以本项目只涵盖**校园跑腿系统前台部分（面向用户）的前端代码**。 8 | 9 | 这是我第一次用Vue3做项目，可以说这个项目有很多不完美的地方需要改进，但是Vue3和Vue2相比少了很多可参考的经验，加上我们的时间比较紧迫，所以做到这个份上我也能原谅我自己。 10 | 11 | **复盘从这个项目中学到了什么，自己总结出一些方法论，再从不足中确定自己需要学习的方向**，这才是我认为重要的地方，也是写下这篇文档的初衷。 12 | 13 | 本文档作为复盘，只会进行一些总结，具体的项目细节在源码中含有大量注释，请结合食用。前端新手捡破烂，希望有大佬指点迷津~ 14 | 15 | ## 技术栈 16 | 17 | - 编程语言：JavaScript 18 | - 前端框架：Vue3.x 19 | - 路由工具：Vue Router 4.x 20 | - 状态管理：Vuex 4.x 21 | - UI组件库：Element Plus 22 | - HTTP库：axios 23 | 24 | ## 项目展示 25 | 26 | 由于我们组的部署工作只完成了前端部分，所以不能线上预览系统，项目展示部分只能之后再更新。 27 | 28 | 在此简要概述一下前台各页面功能： 29 | 30 | - 首页：展示随机六条订单（提供换一组功能）、搜索订单、个人中心入口、发布订单 31 | - 个人中心页：修改个人信息、修改密码、提交投诉反馈、查看我发布的/我接受的/历史浏览订单 32 | - 订单详情页：接单、修改订单状态、修改订单信息（根据订单和用户的状态展示不同信息） 33 | 34 | 未实现：我的投诉、线上支付。 35 | 36 | # 如何规划项目结构 37 | 38 | ``` 39 | |- /assets 资源文件夹 40 | |- /css 41 | |- /fonts 字体图标 42 | |- /images 存放网页结构相关图片 43 | |- /components 可复用组件文件夹 44 | |- /common 存放可被其他项目复用的组件 45 | |- /content 存放本项目多处复用的组件 46 | |- /router 路由配置 47 | |- index.js 48 | |- /plugins 插件 49 | |- /utils 工具文件夹 50 | |- /store vuex配置，项目简单所以没有分模块配置 51 | |- index.js 52 | |- getter.js 53 | |- mutations.js 54 | |- actions.js 55 | |- /views 页面组件文件夹，内部二级文件夹以页面来划分，再存放子组件 56 | |- /network 封装网络请求 57 | |- request.js 通用网络请求配置，目录下子文件都要导入 58 | |- home.js/cart.js ... 按照模块划分网络请求配置文件 59 | ``` 60 | 61 | # 准备工作 62 | 63 | ## 基础样式 64 | 65 | 1. 引入[normalize.css](https://github.com/necolas/normalize.css)，让样式兼容各个不同的浏览器 66 | 2. 完成`base.css`，定义一些基础共用样式并引入进`main.js`或`App.vue` 67 | 3. 如果有的话，引入组件库的主题样式 68 | 69 | ## 相关配置 70 | 71 | ### Webpack配置 72 | 73 | 1. 目前只接触了别名配置：可以在Webpack配置中指定文件夹的别名，方便修改路径。 74 | 75 | ### axios配置 76 | 77 | 1. 通过`axios.create({...})`来新建一个axios实例并配置`baseURL`等属性，通过实例来封装网络请求 78 | 2. 通过`instance.interceptors.request/response.use(config =>{...}`来配置请求/响应拦截器 79 | - 请求拦截器可以判断用户的登录权限并进行处理，有登陆权限就让请求头携带token 80 | - 响应拦截器可以先判断响应的`status`（200则调用接口成功），再通过`code`去判断一层业务的逻辑是否合法，在此处可以统一对后端返回的错误信息进行提示 81 | 82 | ### 路由配置 83 | 84 | 1. 定义全局前置守卫，可以判断用户是否有跳转路由的权限（没登陆就跳去登录页） 85 | 86 | > 注意区分此处的判断用户登录权限和axios中的，一个是页面跳转的权限一个是发送网络请求的权限 87 | 88 | 2. 定义全局后置守卫，可以利用后置守卫修改document的title，注意后置守卫没有`then`方法 89 | 90 | ### 定义Vuex全局状态管理数据 91 | 92 | 1. 存放一些全局公用数据，比如订单种类、订单状态对象等等 93 | 2. 注意存放用户信息时，刷新会导致Vuex里的信息丢失 94 | 95 | ### 跨域代理 96 | 97 | 1. 在`vue.config.js`中利用代理对象，把请求交给后端代理来解决跨域问题 98 | 99 | # 如何划分页面逻辑 100 | 101 | > 刚开始做项目时，打开一个页面总会有不知道从哪里开始下手的感觉，做完以后就有了一点自己的小心得，在此把心得进行总结。 102 | 103 | 1. **第一步，在`