1 jaar geleden · 2d48d7ef92
--- a/.browserslistrc
+++ b/.browserslistrc
@@ -0,0 +1,4 @@
 
				+> 1%
			
 
				+last 2 versions
			
 
				+not dead
			
 
				+not ie 11
			
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,23 @@
 
				+.DS_Store
			
 
				+node_modules
			
 
				+/dist
			
 
				+
			
 
				+
			
 
				+# local env files
			
 
				+.env.local
			
 
				+.env.*.local
			
 
				+
			
 
				+# Log files
			
 
				+npm-debug.log*
			
 
				+yarn-debug.log*
			
 
				+yarn-error.log*
			
 
				+pnpm-debug.log*
			
 
				+
			
 
				+# Editor directories and files
			
 
				+.idea
			
 
				+.vscode
			
 
				+*.suo
			
 
				+*.ntvs*
			
 
				+*.njsproj
			
 
				+*.sln
			
 
				+*.sw?
			
--- a/README.md
+++ b/README.md
@@ -0,0 +1,19 @@
 
				+# jia-zhen
			
 
				+
			
 
				+## Project setup
			
 
				+```
			
 
				+npm install
			
 
				+```
			
 
				+
			
 
				+### Compiles and hot-reloads for development
			
 
				+```
			
 
				+npm run serve
			
 
				+```
			
 
				+
			
 
				+### Compiles and minifies for production
			
 
				+```
			
 
				+npm run build
			
 
				+```
			
 
				+
			
 
				+### Customize configuration
			
 
				+See [Configuration Reference](https://cli.vuejs.org/config/).
			
--- a/babel.config.js
+++ b/babel.config.js
@@ -0,0 +1,5 @@
 
				+module.exports = {
			
 
				+  presets: [
			
 
				+    '@vue/cli-plugin-babel/preset'
			
 
				+  ]
			
 
				+}
			
--- a/jsconfig.json
+++ b/jsconfig.json
@@ -0,0 +1,19 @@
 
				+{
			
 
				+  "compilerOptions": {
			
 
				+    "target": "es5",
			
 
				+    "module": "esnext",
			
 
				+    "baseUrl": "./",
			
 
				+    "moduleResolution": "node",
			
 
				+    "paths": {
			
 
				+      "@/*": [
			
 
				+        "src/*"
			
 
				+      ]
			
 
				+    },
			
 
				+    "lib": [
			
 
				+      "esnext",
			
 
				+      "dom",
			
 
				+      "dom.iterable",
			
 
				+      "scripthost"
			
 
				+    ]
			
 
				+  }
			
 
				+}
			
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -0,0 +1,37 @@
 
				+{
			
 
				+  "name": "jia-zhen",
			
 
				+  "version": "0.1.0",
			
 
				+  "private": true,
			
 
				+  "scripts": {
			
 
				+    "serve": "vue-cli-service serve",
			
 
				+    "build": "vue-cli-service build"
			
 
				+  },
			
 
				+  "dependencies": {
			
 
				+    "@element-plus/icons-vue": "^2.0.10",
			
 
				+    "axios": "^1.2.2",
			
 
				+    "core-js": "^3.8.3",
			
 
				+    "element-china-area-data": "^5.0.2",
			
 
				+    "element-plus": "^2.2.28",
			
 
				+    "form-data": "^4.0.0",
			
 
				+    "jquery": "^3.6.3",
			
 
				+    "less": "^4.1.3",
			
 
				+    "less-loader": "^11.1.0",
			
 
				+    "nprogress": "^0.2.0",
			
 
				+    "postcss-plugin-px2rem": "^0.8.1",
			
 
				+    "postcss-px2rem": "^0.3.0",
			
 
				+    "register-service-worker": "^1.7.2",
			
 
				+    "vue": "^3.2.13",
			
 
				+    "vue-axios": "^3.5.2",
			
 
				+    "vue-router": "^4.0.3",
			
 
				+    "vuex": "^4.1.0"
			
 
				+  },
			
 
				+  "devDependencies": {
			
 
				+    "@vue/cli-plugin-babel": "~5.0.0",
			
 
				+    "@vue/cli-plugin-pwa": "~5.0.0",
			
 
				+    "@vue/cli-plugin-router": "~5.0.0",
			
 
				+    "@vue/cli-plugin-vuex": "~5.0.0",
			
 
				+    "@vue/cli-service": "~5.0.0",
			
 
				+    "sass": "^1.32.7",
			
 
				+    "sass-loader": "^12.0.0"
			
 
				+  }
			
 
				+}
			
--- a/public/favicon.ico
+++ b/public/favicon.ico
--- a/public/img/icons/android-chrome-192x192.png
+++ b/public/img/icons/android-chrome-192x192.png
--- a/public/img/icons/android-chrome-512x512.png
+++ b/public/img/icons/android-chrome-512x512.png
--- a/public/img/icons/android-chrome-maskable-192x192.png
+++ b/public/img/icons/android-chrome-maskable-192x192.png
--- a/public/img/icons/android-chrome-maskable-512x512.png
+++ b/public/img/icons/android-chrome-maskable-512x512.png
--- a/public/img/icons/apple-touch-icon-120x120.png
+++ b/public/img/icons/apple-touch-icon-120x120.png
--- a/public/img/icons/apple-touch-icon-152x152.png
+++ b/public/img/icons/apple-touch-icon-152x152.png
--- a/public/img/icons/apple-touch-icon-180x180.png
+++ b/public/img/icons/apple-touch-icon-180x180.png
--- a/public/img/icons/apple-touch-icon-60x60.png
+++ b/public/img/icons/apple-touch-icon-60x60.png
--- a/public/img/icons/apple-touch-icon-76x76.png
+++ b/public/img/icons/apple-touch-icon-76x76.png
--- a/public/img/icons/apple-touch-icon.png
+++ b/public/img/icons/apple-touch-icon.png
--- a/public/img/icons/favicon-16x16.png
+++ b/public/img/icons/favicon-16x16.png
--- a/public/img/icons/favicon-32x32.png
+++ b/public/img/icons/favicon-32x32.png
--- a/public/img/icons/msapplication-icon-144x144.png
+++ b/public/img/icons/msapplication-icon-144x144.png
--- a/public/img/icons/mstile-150x150.png
+++ b/public/img/icons/mstile-150x150.png
--- a/public/img/icons/safari-pinned-tab.svg
+++ b/public/img/icons/safari-pinned-tab.svg
@@ -0,0 +1,3 @@
 
				+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
			
 
				+<path d="M8.00251 14.9297L0 1.07422H6.14651L8.00251 4.27503L9.84583 1.07422H16L8.00251 14.9297Z" fill="black"/>
			
 
				+</svg>
			
--- a/public/index.html
+++ b/public/index.html
@@ -0,0 +1,31 @@
 
				+<!DOCTYPE html>
			
 
				+<html lang="">
			
 
				+  <head>
			
 
				+    <link
			
 
				+      href="http://fonts.googleapis.com/css?family=Cookie"
			
 
				+      rel="stylesheet"
			
 
				+      type="text/css"
			
 
				+    />
			
 
				+
			
 
				+    <meta charset="utf-8" />
			
 
				+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
			
 
				+    <meta
			
 
				+      name="viewport"
			
 
				+      content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=yes"
			
 
				+    />
			
 
				+
			
 
				+    <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
			
 
				+    <title>智慧家政预约</title>
			
 
				+  </head>
			
 
				+  <body>
			
 
				+    <noscript>
			
 
				+      <strong
			
 
				+        >We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work
			
 
				+        properly without JavaScript enabled. Please enable it to
			
 
				+        continue.</strong
			
 
				+      >
			
 
				+    </noscript>
			
 
				+    <div id="app"></div>
			
 
				+    <!-- built files will be auto injected -->
			
 
				+  </body>
			
 
				+</html>
			
--- a/public/robots.txt
+++ b/public/robots.txt
@@ -0,0 +1,2 @@
 
				+User-agent: *
			
 
				+Disallow:
			
--- a/src/App.vue
+++ b/src/App.vue
@@ -0,0 +1,47 @@
 
				+<template>
			
 
				+  <div id="app">
			
 
				+    <theHeader v-show="$route.meta.isShow"></theHeader>
			
 
				+    <router-view />
			
 
				+  </div>
			
 
				+</template>
			
 
				+<script>
			
 
				+import theHeader from "./components/TheHeader.vue";
			
 
				+export default {
			
 
				+  name: "App",
			
 
				+  components: {
			
 
				+    theHeader: theHeader,
			
 
				+  },
			
 
				+  created() {
			
 
				+    window.addEventListener(
			
 
				+      "mousewheel",
			
 
				+      function (event) {
			
 
				+        if (event.ctrlKey === true || event.metaKey) {
			
 
				+          event.preventDefault();
			
 
				+        }
			
 
				+      },
			
 
				+      { passive: false }
			
 
				+    );
			
 
				+
			
 
				+    //firefox
			
 
				+    window.addEventListener(
			
 
				+      "DOMMouseScroll",
			
 
				+      function (event) {
			
 
				+        if (event.ctrlKey === true || event.metaKey) {
			
 
				+          event.preventDefault();
			
 
				+        }
			
 
				+      },
			
 
				+      { passive: false }
			
 
				+    );
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+<style>
			
 
				+#app {
			
 
				+  font-family: "Avenir", Helvetica, Arial, sans-serif;
			
 
				+  -webkit-font-smoothing: antialiased;
			
 
				+  -moz-osx-font-smoothing: grayscale;
			
 
				+  text-align: center;
			
 
				+  color: #2c3e50;
			
 
				+  width: 100%;
			
 
				+}
			
 
				+</style>
			
--- a/src/api/index.js
+++ b/src/api/index.js
@@ -0,0 +1,225 @@
 
				+//api接口统一管理
			
 
				+
			
 
				+import request from "./request";
			
 
				+
			
 
				+//用户注册
			
 
				+export const UserRegis = (params) =>
			
 
				+  request({
			
 
				+    url: "/user/register",
			
 
				+    method: "post",
			
 
				+    data: params,
			
 
				+  });
			
 
				+//用户登录
			
 
				+export const UserLogin = (params) =>
			
 
				+  request({
			
 
				+    url: "/user/login",
			
 
				+    method: "post",
			
 
				+    data: params,
			
 
				+  });
			
 
				+//用户退出登录
			
 
				+export const Logout = () =>
			
 
				+  request({
			
 
				+    url: "/user/logout",
			
 
				+    method: "post",
			
 
				+  });
			
 
				+//发表评论
			
 
				+export const Comment = (params) =>
			
 
				+  request({
			
 
				+    url: "/comment/addComment",
			
 
				+    method: "post",
			
 
				+    data: params,
			
 
				+  });
			
 
				+// 对家政订单进行模糊查询
			
 
				+export const searchByIntroduction = (params) =>
			
 
				+  request({
			
 
				+    url: "/user/selectServerByIntroduction",
			
 
				+    method: "get",
			
 
				+    params: params,
			
 
				+  });
			
 
				+  //家政人员显示评论
			
 
				+export const serverCommentList = (p) =>
			
 
				+request({
			
 
				+  url: "/comment/serverCommentList",
			
 
				+  method: "get",
			
 
				+  params: p,
			
 
				+});
			
 
				+//显示雇主评论
			
 
				+export const BossComment = (p) =>
			
 
				+  request({
			
 
				+    url: "/comment/commentList",
			
 
				+    method: "get",
			
 
				+    params: p,
			
 
				+  });
			
 
				+
			
 
				+//显示家政信息
			
 
				+export const ServerList = () =>
			
 
				+  request({
			
 
				+    url: "/user/serverList",
			
 
				+    method: "get",
			
 
				+  });
			
 
				+//显示个人信息
			
 
				+export const userInfo = () =>
			
 
				+  request({
			
 
				+    url: "/user/userInfo",
			
 
				+    method: "get",
			
 
				+  });
			
 
				+//更新个人信息
			
 
				+export const convertInfo = (params) =>
			
 
				+  request({
			
 
				+    url: "/user/userInfo",
			
 
				+    method: "put",
			
 
				+    data: params,
			
 
				+  });
			
 
				+//上传头像
			
 
				+export const avatarUp = (params) =>
			
 
				+  request({
			
 
				+    url: "/user/upload",
			
 
				+    method: "post",
			
 
				+    data: params,
			
 
				+  });
			
 
				+//修改密码
			
 
				+export const changePwd = (parmas) =>
			
 
				+  request({
			
 
				+    url: "	user/userPassword",
			
 
				+    method: "post",
			
 
				+    data: parmas,
			
 
				+  });
			
 
				+//发布状态
			
 
				+export const postStatus = (params) =>
			
 
				+  request({
			
 
				+    url: "/condition/refineCondition",
			
 
				+    method: "post",
			
 
				+    data: params,
			
 
				+  });
			
 
				+//搜索家政人员
			
 
				+export const searchServer = (p) =>
			
 
				+  request({
			
 
				+    url: "/user/selectUserByConditonPage",
			
 
				+    method: "get",
			
 
				+    params: p,
			
 
				+  });
			
 
				+//无条件查询家政人员
			
 
				+export const searchServerWithNoCondition = (p) =>
			
 
				+  request({
			
 
				+    url: "/user/selectServerWithoutCondition",
			
 
				+    method: "get",
			
 
				+    params: p,
			
 
				+  });
			
 
				+//显示家政人员详细详细
			
 
				+export const serverDetailApi = (p) =>
			
 
				+  request({
			
 
				+    url: "/user/cheackUserInfo",
			
 
				+    method: "get",
			
 
				+    params: {
			
 
				+      serverId: p,
			
 
				+    },
			
 
				+  });
			
 
				+//显示搜索栏的家政分类
			
 
				+
			
 
				+export const categoryListApi = () =>
			
 
				+  request({
			
 
				+    url: "/category/categoryList",
			
 
				+    method: "get",
			
 
				+  });
			
 
				+//雇主通过orderId查询响应订单
			
 
				+export const getBossOrderByOrderId = (p) =>
			
 
				+  request({
			
 
				+    url: "/comment/serverCommentListByOrderIdAndUserId",
			
 
				+    method: "get",
			
 
				+    params: p,
			
 
				+  });
			
 
				+//雇主显示订单
			
 
				+export const getBossOrder = (p) =>
			
 
				+  request({
			
 
				+    url: "/user/order/getUserOrder",
			
 
				+    method: "get",
			
 
				+    params: p,
			
 
				+  });
			
 
				+//显示家政人员订单
			
 
				+export const getServerOrder = (p) =>
			
 
				+  request({
			
 
				+    url: "/user/order/getServerOrder",
			
 
				+    method: "get",
			
 
				+    params: p,
			
 
				+  });
			
 
				+
			
 
				+//提交订单
			
 
				+export const generatePayCode = (p) =>
			
 
				+  request({
			
 
				+    url: "/user/pay/generatePayCode",
			
 
				+    method: "post",
			
 
				+    data: p,
			
 
				+  });
			
 
				+
			
 
				+//取消订单
			
 
				+export const cancelOrderById = (p) =>
			
 
				+  request({
			
 
				+    url: "/user/order/cancelOrder",
			
 
				+    method: "post",
			
 
				+    params: p,
			
 
				+  });
			
 
				+// 完成订单
			
 
				+export const finishOrder = (params) =>
			
 
				+  request({
			
 
				+    url: "/user/order/completeOrder",
			
 
				+    method: "post",
			
 
				+    params: params,
			
 
				+  });
			
 
				+//支付
			
 
				+export const requestPay = (p) =>
			
 
				+  request({
			
 
				+    url: "/user/pay/requestPay",
			
 
				+    method: "get",
			
 
				+    parmas: p,
			
 
				+  });
			
 
				+// 在我的订单页中去支付
			
 
				+export const toPay = (p) =>
			
 
				+  request({
			
 
				+    url: "/user/pay/getPayNoByOrderId",
			
 
				+    method: "post",
			
 
				+    params: p
			
 
				+  });
			
 
				+//手机号登陆获取验证码
			
 
				+export const phoneValidate = (p) =>
			
 
				+  request({
			
 
				+    url: "/user/loginByTelephone",
			
 
				+    method: "post",
			
 
				+    data: p,
			
 
				+  });
			
 
				+//手机号登陆
			
 
				+export const phoneLogin = (params) =>
			
 
				+  request({
			
 
				+    url: "/user/handleCode",
			
 
				+    method: "post",
			
 
				+    data: params,
			
 
				+  });
			
 
				+
			
 
				+//邮箱获取验证码
			
 
				+export const emailValidate = (p) =>
			
 
				+  request({
			
 
				+    url: "/user/loginByEmail",
			
 
				+    method: "post",
			
 
				+    data: p,
			
 
				+  });
			
 
				+//邮箱登陆
			
 
				+export const emailLogin = (p) =>
			
 
				+  request({
			
 
				+    url: "/user/handleCode",
			
 
				+    method: "post",
			
 
				+    data: p,
			
 
				+  });
			
 
				+
			
 
				+//检查token是否过期
			
 
				+export const checkToken = () =>
			
 
				+  request({
			
 
				+    url: "/user/checkToken",
			
 
				+    method: "post",
			
 
				+  });
			
 
				+
			
 
				+//查看发布状态
			
 
				+export const getCondition = (p) =>
			
 
				+  request({
			
 
				+    url: "/condition/getCondition",
			
 
				+    method: "get",
			
 
				+    params: p,
			
 
				+  });
			
--- a/src/api/request.js
+++ b/src/api/request.js
@@ -0,0 +1,68 @@
 
				+import axios from "axios";
			
 
				+import router from "@/router";
			
 
				+import "nprogress/nprogress.css";
			
 
				+import popmessage from "@/components/tip/index.js";
			
 
				+
			
 
				+const requests = axios.create({
			
 
				+  baseURL: "http://localhost:7777",
			
 
				+  timeout: 25000,
			
 
				+});
			
 
				+
			
 
				+requests.interceptors.request.use(
			
 
				+  function (config) {
			
 
				+    // 在发送请求之前做些什么
			
 
				+    var token = localStorage.getItem("token");
			
 
				+
			
 
				+    if (token == "" || token == null || token == "undefined") {
			
 
				+    } else {
			
 
				+      config.headers.token = localStorage.getItem("token");
			
 
				+    }
			
 
				+    return config;
			
 
				+  },
			
 
				+  function (error) {
			
 
				+    // 对请求错误做些什么
			
 
				+    return Promise.reject(error);
			
 
				+  }
			
 
				+);
			
 
				+
			
 
				+// 添加响应拦截器 => 后端给前端的数据【后端返回给前端的东西】
			
 
				+requests.interceptors.response.use(
			
 
				+  function (response) {
			
 
				+    // 对响应数据做点什么
			
 
				+    if (response.data.code == 401) {
			
 
				+      localStorage.removeItem("token");
			
 
				+      popmessage({ type: "error", str: "登陆已过期，请重新登录" });
			
 
				+      router.push("/loginView");
			
 
				+      setTimeout(() => {
			
 
				+        router.go(0);
			
 
				+      }, 1000);
			
 
				+    }
			
 
				+    return response;
			
 
				+  },
			
 
				+  function (error) {
			
 
				+    // 对响应错误做点什么
			
 
				+    return Promise.reject(error);
			
 
				+  }
			
 
				+);
			
 
				+
			
 
				+// requests.interceptors.request.use((config) => {
			
 
				+//   //进度条开始动
			
 
				+//   nprogress.start();
			
 
				+//   if (localStorage.getItem("token")) {
			
 
				+//     // config.headers.token = localStorage.getItem("token");
			
 
				+//   }
			
 
				+//   return config;
			
 
				+// });
			
 
				+// //响应拦截器
			
 
				+// requests.interceptors.response.use(
			
 
				+//   (res) => {
			
 
				+//     //进度条结束
			
 
				+//     nprogress.done();
			
 
				+//     return res.data;
			
 
				+//   },
			
 
				+//   (err) => {
			
 
				+//     return Promise.reject(new Error("faile"));
			
 
				+//   }
			
 
				+// );
			
 
				+
			
 
				+export default requests;
			
--- a/src/assets/2.png
+++ b/src/assets/2.png
--- a/src/assets/Logo3.png
+++ b/src/assets/Logo3.png
--- a/src/assets/logo.jpg
+++ b/src/assets/logo.jpg
--- a/src/assets/头像.png
+++ b/src/assets/头像.png
--- a/src/components/HelloWorld.vue
+++ b/src/components/HelloWorld.vue
@@ -0,0 +1,60 @@
 
				+<template>
			
 
				+  <div class="hello">
			
 
				+    <h1>{{ msg }}</h1>
			
 
				+    <p>
			
 
				+      For a guide and recipes on how to configure / customize this project,<br>
			
 
				+      check out the
			
 
				+      <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
			
 
				+    </p>
			
 
				+    <h3>Installed CLI Plugins</h3>
			
 
				+    <ul>
			
 
				+      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
			
 
				+      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa" target="_blank" rel="noopener">pwa</a></li>
			
 
				+      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router" target="_blank" rel="noopener">router</a></li>
			
 
				+      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex" target="_blank" rel="noopener">vuex</a></li>
			
 
				+    </ul>
			
 
				+    <h3>Essential Links</h3>
			
 
				+    <ul>
			
 
				+      <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
			
 
				+      <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
			
 
				+      <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
			
 
				+      <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
			
 
				+      <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
			
 
				+    </ul>
			
 
				+    <h3>Ecosystem</h3>
			
 
				+    <ul>
			
 
				+      <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
			
 
				+      <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
			
 
				+      <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
			
 
				+      <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
			
 
				+      <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
			
 
				+    </ul>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: 'HelloWorld',
			
 
				+  props: {
			
 
				+    msg: String
			
 
				+  }
			
 
				+}
			
 
				+</script>
			
 
				+
			
 
				+<!-- Add "scoped" attribute to limit CSS to this component only -->
			
 
				+<style scoped lang="scss">
			
 
				+h3 {
			
 
				+  margin: 40px 0 0;
			
 
				+}
			
 
				+ul {
			
 
				+  list-style-type: none;
			
 
				+  padding: 0;
			
 
				+}
			
 
				+li {
			
 
				+  display: inline-block;
			
 
				+  margin: 0 10px;
			
 
				+}
			
 
				+a {
			
 
				+  color: #42b983;
			
 
				+}
			
 
				+</style>
			
--- a/src/components/RightNav/img/3.1回到顶部.png
+++ b/src/components/RightNav/img/3.1回到顶部.png
--- a/src/components/RightNav/img/客服.png
+++ b/src/components/RightNav/img/客服.png
--- a/src/components/RightNav/img/微信.png
+++ b/src/components/RightNav/img/微信.png
--- a/src/components/RightNav/index.vue
+++ b/src/components/RightNav/index.vue
@@ -0,0 +1,55 @@
 
				+<template>
			
 
				+  <!-- 侧边导航栏 -->
			
 
				+  <div class="right_nav">
			
 
				+    <div class="service">
			
 
				+      <img src="./img/客服.png" />
			
 
				+      <p>专属客服</p>
			
 
				+    </div>
			
 
				+    <div class="wechat">
			
 
				+      <img class="wechat" src="./img/微信.png" />
			
 
				+      <p>微信咨询</p>
			
 
				+    </div>
			
 
				+    <div @click="go_top" class="to_top">
			
 
				+      <img src="./img/3.1回到顶部.png" />
			
 
				+      <p>回到顶部</p>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: "RightNav",
			
 
				+  methods: {
			
 
				+    go_top() {
			
 
				+      document.documentElement.scrollTop = 0;
			
 
				+    },
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+<style scoped>
			
 
				+img {
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+
			
 
				+.right_nav {
			
 
				+  width: 4.5rem;
			
 
				+  background-color: rgb(250, 249, 249);
			
 
				+  position: fixed;
			
 
				+  top: 24rem;
			
 
				+  right: 1rem;
			
 
				+  border-radius: 10px;
			
 
				+  cursor: pointer;
			
 
				+  z-index: 999;
			
 
				+}
			
 
				+.right_nav img {
			
 
				+  margin-top: 10px;
			
 
				+  height: 2rem;
			
 
				+  width: auto;
			
 
				+}
			
 
				+.right_nav {
			
 
				+  transition: 1s;
			
 
				+}
			
 
				+.right_nav div :hover {
			
 
				+  transform: scale(1.2);
			
 
				+}
			
 
				+</style>
			
--- a/src/components/TheHeader.vue
+++ b/src/components/TheHeader.vue
@@ -0,0 +1,340 @@
 
				+<template>
			
 
				+  <div>
			
 
				+    <div id="header">
			
 
				+      <div class="box">
			
 
				+        <div class="img"><img src="../assets/Logo3.png" /></div>
			
 
				+        <nav>
			
 
				+          <router-link active-class="active" to="/search">找家政</router-link>
			
 
				+          <!--  <router-link active-class="active" to="/loginView"
			
 
				+            >登录/注册</router-link
			
 
				+          >
			
 
				+          <router-link active-class="active" to="/percent" @click="toPercent"
			
 
				+            >个人中心</router-link
			
 
				+          > -->
			
 
				+          <router-link active-class="active" to="/UserHelp">帮助中心</router-link>
			
 
				+        </nav>
			
 
				+      </div>
			
 
				+      <!-- <div class="box">
			
 
				+        <input class="text" type="text" placeholder="请输入关键词~~~" name="search" v-model="parmas.introduction" />
			
 
				+        <input class="button" type="button" value="搜索" @click="searchServer" />
			
 
				+      </div> -->
			
 
				+      <div class="loginBox">
			
 
				+        <div v-if="!this.isLogin" @click="toLogin">
			
 
				+          <h2>登陆</h2>
			
 
				+        </div>
			
 
				+        <el-dropdown v-if="this.isLogin">
			
 
				+          <span class="el-dropdown-link">
			
 
				+            <img :src="this.avatar" class="avatar" />
			
 
				+            <el-icon class="el-icon--right">
			
 
				+              <arrow-down />
			
 
				+            </el-icon>
			
 
				+          </span>
			
 
				+          <template #dropdown>
			
 
				+            <el-dropdown-menu :class="[selfbutton]">
			
 
				+              <el-dropdown-item :style="listStyle" @click="toPercent">个人中心</el-dropdown-item>
			
 
				+              <el-dropdown-item :class="[selfbutton]" :style="listStyle" @click="convertUserType">切换角色</el-dropdown-item>
			
 
				+              <el-dropdown-item :class="[selfbutton]" :style="listStyle" @click="logOut">退出登录</el-dropdown-item>
			
 
				+            </el-dropdown-menu>
			
 
				+          </template>
			
 
				+        </el-dropdown>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { userInfo, Logout, checkToken, searchByIntroduction } from "@/api";
			
 
				+import { setCookie, delCookie } from "@/util/cookie";
			
 
				+import { mapMutations } from "vuex";
			
 
				+import popmessage from "@/components/tip/index.js";
			
 
				+export default {
			
 
				+  name: "TheHeader",
			
 
				+  data() {
			
 
				+    return {
			
 
				+      content: '',
			
 
				+      isLogin: false,
			
 
				+      avatar: "",
			
 
				+      isShow: true,
			
 
				+      listStyle: {
			
 
				+        padding: "6px 65px",
			
 
				+      },
			
 
				+      parmas: {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 5,
			
 
				+        nickName: "",
			
 
				+        salaryOrder: 0,
			
 
				+        categoryName: "不限",
			
 
				+        salary: 0,
			
 
				+        stay: 0,
			
 
				+        userType: 0,
			
 
				+        workArea: "",
			
 
				+        stay: '',
			
 
				+        serverType: "",
			
 
				+        introduction: ''
			
 
				+      },
			
 
				+      selfbutton: "self-button",
			
 
				+    };
			
 
				+  },
			
 
				+  created() {
			
 
				+    this.token = localStorage.getItem("token");
			
 
				+    if (this.token == "" || this.token == null || this.token == "undefined") {
			
 
				+      this.isLogin = false;
			
 
				+    } else {
			
 
				+      checkToken().then((response) => {
			
 
				+        if (response.data.code === 200) {
			
 
				+          userInfo().then((response) => {
			
 
				+            if (response.data.code === 200) {
			
 
				+              this.avatar = response.data.data.avatar;
			
 
				+              setCookie("userId", response.data.data.id);
			
 
				+              this.isLogin = true;
			
 
				+            }
			
 
				+          });
			
 
				+        } else if (response.data.code === 401) {
			
 
				+          this.isLogin = false;
			
 
				+          popmessage({ type: "warning", str: "登录信息错误" });
			
 
				+          this.$router.push("/loginView");
			
 
				+        }else {
			
 
				+          this.isLogin = false;
			
 
				+          popmessage({ type: "warning", str: "未登录" });
			
 
				+          this.$router.push("/loginView");
			
 
				+        }
			
 
				+      });
			
 
				+    }
			
 
				+  },
			
 
				+
			
 
				+  methods: {
			
 
				+    ...mapMutations("SearchStore", ["setParmas", "setList", "setTotal"]),
			
 
				+    // 搜索框
			
 
				+    searchServer() {
			
 
				+      this.setParmas(this.parmas);
			
 
				+      let param = {
			
 
				+        introduction: this.parmas.introduction,
			
 
				+        pageSize: this.parmas.pageSize,
			
 
				+        pageNum: this.parmas.pageNum
			
 
				+      }
			
 
				+      searchByIntroduction(param).then((response) => {
			
 
				+        if (response.data.code == 200) {
			
 
				+          this.content = response.data.data.rows;
			
 
				+          this.setTotal(response.data.data.total);
			
 
				+          this.setList(this.content);
			
 
				+          // 跳转路由
			
 
				+          this.$router.push("./search");
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+    //切换角色（登出并切换登录界面）
			
 
				+    convertUserType() {
			
 
				+      if (window.confirm("切换身份需要登出账号,确定要执行此操作吗？")) {
			
 
				+        // 用户点击了“确定”按钮
			
 
				+        Logout().then((res) => {
			
 
				+          if (res.data.code === 200) {
			
 
				+            localStorage.clear()
			
 
				+            delCookie("userId");
			
 
				+            this.isLogin = false;
			
 
				+            setTimeout(() => {
			
 
				+              this.$router.go(0);
			
 
				+            }, 300);
			
 
				+            popmessage({ type: "success", str: "退出成功" });
			
 
				+            this.$router.push("/loginView");
			
 
				+          }
			
 
				+        });
			
 
				+      } else {
			
 
				+        // 用户点击了“取消”按钮
			
 
				+      }
			
 
				+    },
			
 
				+    toPercent() {
			
 
				+      this.userType = localStorage.getItem("userType");
			
 
				+      if (this.userType == 1) {
			
 
				+        this.$router.push("/percent");
			
 
				+      } else if (this.userType == 2) {
			
 
				+        this.$router.push("/boss_per_cent");
			
 
				+      }
			
 
				+    },
			
 
				+    toLogin() {
			
 
				+      this.$router.push("/loginView");
			
 
				+    },
			
 
				+    logOut() {
			
 
				+      Logout().then(res => {
			
 
				+        if (res.data.code === 200) {
			
 
				+          localStorage.clear()
			
 
				+          delCookie("userId");
			
 
				+          setTimeout(() => {
			
 
				+            this.$router.go(0);
			
 
				+          }, 500);
			
 
				+          popmessage({ type: "success", str: "退出成功" });
			
 
				+          this.$router.replace("/introduce");
			
 
				+          this.isLogin = false;
			
 
				+        }
			
 
				+      })
			
 
				+    },
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+
			
 
				+<style lang="scss" scoped>
			
 
				+#header {
			
 
				+  position: -webkit-sticky;
			
 
				+  position: fixed;
			
 
				+  top: 0;
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  justify-content: space-between;
			
 
				+  height: 3.5rem;
			
 
				+  width: 100%;
			
 
				+  background-color: #40a46f;
			
 
				+  color: #ffffff;
			
 
				+  z-index: 2000;
			
 
				+}
			
 
				+
			
 
				+.box {
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+}
			
 
				+
			
 
				+h1 {
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  font: normal 1.5556rem Cookie, Arial, Helvetica, sans-serif;
			
 
				+  padding: 0px 1.1111rem;
			
 
				+}
			
 
				+
			
 
				+nav {
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  word-break: keep-all;
			
 
				+  white-space: nowrap;
			
 
				+  margin: 0px 1.8333rem;
			
 
				+  font: 0.8889rem Arial, Helvetica, sans-serif;
			
 
				+}
			
 
				+
			
 
				+nav a {
			
 
				+  padding: 0 0.8333rem;
			
 
				+  width: 3.5rem;
			
 
				+  text-decoration: none;
			
 
				+  color: #ffffff;
			
 
				+  font-size: 1.05rem;
			
 
				+  font-weight: normal;
			
 
				+  opacity: 0.9;
			
 
				+}
			
 
				+
			
 
				+nav a:hover {
			
 
				+  opacity: 1;
			
 
				+}
			
 
				+
			
 
				+.active {
			
 
				+  color: #1b1d21;
			
 
				+  pointer-events: none;
			
 
				+  opacity: 1;
			
 
				+}
			
 
				+
			
 
				+.text {
			
 
				+  height: 1.2222rem;
			
 
				+  font-size: 1rem;
			
 
				+
			
 
				+  border: 1px solid #ccc;
			
 
				+  padding: 0.1667rem 0.8889rem;
			
 
				+  border-bottom-left-radius: 1.1111rem;
			
 
				+  border-top-left-radius: 1.1111rem;
			
 
				+}
			
 
				+
			
 
				+.text:focus {
			
 
				+  outline: none;
			
 
				+  border-color: rgba(82, 168, 236, 0.8);
			
 
				+  box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.075),
			
 
				+    0 0 8px rgba(82, 168, 236, 0.6);
			
 
				+}
			
 
				+
			
 
				+.button {
			
 
				+  width: 3rem;
			
 
				+  height: 1.6667rem;
			
 
				+  font-size: 0.7778rem;
			
 
				+  margin-right: 1.9444rem;
			
 
				+  border: 1px solid #fbce2d;
			
 
				+  background-color: #fbce2d;
			
 
				+  border-top-right-radius: 1.1111rem;
			
 
				+  border-bottom-right-radius: 1.1111rem;
			
 
				+  color: white;
			
 
				+}
			
 
				+
			
 
				+img {
			
 
				+  height: 3rem;
			
 
				+  width: 100%;
			
 
				+}
			
 
				+
			
 
				+.img {
			
 
				+  margin-left: 1.1111rem;
			
 
				+}
			
 
				+
			
 
				+.loginBox h2 {
			
 
				+  font-size: 1.2rem;
			
 
				+  font-weight: 400;
			
 
				+  margin-right: 3rem;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+.avatar {
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+
			
 
				+/* 
			
 
				+.loginBox {
			
 
				+  position: relative;
			
 
				+  right: -20rem;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+.avatarHead {
			
 
				+  width: 2.5rem;
			
 
				+  height: 2.5rem;
			
 
				+  background: #000000;
			
 
				+  border-radius: 1.5rem;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+.list {
			
 
				+  background-color: rgb(93, 170, 100);
			
 
				+  position: relative;
			
 
				+  top: 3.5rem;
			
 
				+  left: 0rem;
			
 
				+}
			
 
				+.list ul {
			
 
				+  padding: 1rem;
			
 
				+  margin: 0;
			
 
				+  list-style: none;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+.list ul li {
			
 
				+  padding-bottom: 0.5rem;
			
 
				+} */
			
 
				+.loginBox img {
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+
			
 
				+.el-dropdown-link {
			
 
				+  overflow: hidden;
			
 
				+  width: 3rem;
			
 
				+  height: 3rem;
			
 
				+  border-radius: 2rem;
			
 
				+  margin-right: 2rem;
			
 
				+  background-color: #ccc;
			
 
				+}
			
 
				+
			
 
				+.el-dropdown-menu__item {
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  white-space: nowrap;
			
 
				+  list-style: none;
			
 
				+  line-height: 22px;
			
 
				+  padding: 5px 56px;
			
 
				+  margin: 0;
			
 
				+  font-size: larger !important;
			
 
				+  color: var(--el-text-color-regular);
			
 
				+  cursor: pointer;
			
 
				+  outline: 0;
			
 
				+}
			
 
				+
			
 
				+.self-button {
			
 
				+  font-size: larger !important;
			
 
				+}
			
 
				+</style>
			
--- a/src/components/tip/index.js
+++ b/src/components/tip/index.js
@@ -0,0 +1,25 @@
 
				+//      引入创建虚拟节点和渲染方法
			
 
				+import { createVNode, render } from "vue";
			
 
				+import tip from "./tip.vue";
			
 
				+
			
 
				+//      定义一个div容器
			
 
				+const div = document.createElement("div");
			
 
				+//      将定义的容器添加到dom上
			
 
				+document.body.appendChild(div);
			
 
				+
			
 
				+//      定义定时器：一定时间后清除
			
 
				+let timer = null;
			
 
				+
			
 
				+export default ({ str, type }) => {
			
 
				+  //      调用创建虚拟节点方法
			
 
				+  //      第一个参数为要创建的虚拟节点即编写好的vue组件
			
 
				+  //      第二个参数为props的参数
			
 
				+  const vnode = createVNode(tip, { str, type });
			
 
				+  //      调用渲染方法：将虚拟节点渲染到dom中
			
 
				+  render(vnode, div);
			
 
				+  //      开启定时器，若原先存在则先进行清除
			
 
				+  timer && clearTimeout(timer);
			
 
				+  timer = setTimeout(() => {
			
 
				+    render(null, div);
			
 
				+  }, 2000);
			
 
				+};
			
--- a/src/components/tip/tip.vue
+++ b/src/components/tip/tip.vue
@@ -0,0 +1,93 @@
 
				+<template>
			
 
				+  <div class="pop-message" :style="style[type]" v-show="visible">
			
 
				+    <i class="icon" :class="[style[type].icon]"></i>
			
 
				+    <span class="text">{{ str }}</span>
			
 
				+  </div>
			
 
				+</template>
			
 
				+<script>
			
 
				+import { onMounted, ref } from "vue";
			
 
				+export default {
			
 
				+  name: "popmessage",
			
 
				+  //	这个是传值方法，通过父级组件传入提示状态以及提示文本
			
 
				+  //	可以根据不同业务自定义更多的状态
			
 
				+  props: {
			
 
				+    type: {
			
 
				+      type: String,
			
 
				+      //	success 成功
			
 
				+      //	warn 警告
			
 
				+      //	error 错误
			
 
				+      default: "success",
			
 
				+    },
			
 
				+    str: {
			
 
				+      type: String,
			
 
				+      default: "登陆成功",
			
 
				+    },
			
 
				+  },
			
 
				+  setup() {
			
 
				+    //	定义一个对象，包含三种情况的样式，对象key就是类型字符串
			
 
				+    //	icon图标这一部分省略了，有需要的可以自己加入
			
 
				+    const style = {
			
 
				+      warn: {
			
 
				+        // icon: "icon-warning",
			
 
				+        color: "#E6A23C",
			
 
				+        backgroundColor: "rgb(253, 246, 236)",
			
 
				+        borderColor: "rgb(250, 236, 216)",
			
 
				+      },
			
 
				+      error: {
			
 
				+        // icon: "icon-shanchu",
			
 
				+        color: "#F56C6C",
			
 
				+        backgroundColor: "rgb(254, 240, 240)",
			
 
				+        borderColor: "rgb(253, 226, 226)",
			
 
				+      },
			
 
				+      success: {
			
 
				+        // icon: "icon-queren2",
			
 
				+        color: "#67C23A",
			
 
				+        backgroundColor: "rgb(240, 249, 235)",
			
 
				+        borderColor: "rgb(225, 243, 216)",
			
 
				+      },
			
 
				+    };
			
 
				+    const visible = ref(false);
			
 
				+    onMounted(() => {
			
 
				+      visible.value = true;
			
 
				+    });
			
 
				+    return { style, visible };
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+
			
 
				+<style scoped lang="less">
			
 
				+//	css样式部分可以根据需求自定义
			
 
				+.pop-message {
			
 
				+  position: absolute;
			
 
				+  z-index: 2000;
			
 
				+  left: 50%;
			
 
				+  margin-left: -150px;
			
 
				+  top: 50px;
			
 
				+  display: flex;
			
 
				+  justify-content: center;
			
 
				+  align-items: center;
			
 
				+  width: 300px;
			
 
				+  height: 50px;
			
 
				+  border: 1px solid #e4e4e4;
			
 
				+  background: #f5f5f5;
			
 
				+  color: #999;
			
 
				+  border-radius: 4px;
			
 
				+  //	以下是过渡动画，如不需要可删去亦可改进
			
 
				+  animation: move 0.38s linear forwards;
			
 
				+  @keyframes move {
			
 
				+    0% {
			
 
				+      transform: translate3d(0, -75px, 0);
			
 
				+      opacity: 0.16;
			
 
				+    }
			
 
				+
			
 
				+    50% {
			
 
				+      opacity: 0.68;
			
 
				+    }
			
 
				+
			
 
				+    100% {
			
 
				+      transform: none;
			
 
				+      opacity: 1;
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/src/main.js
+++ b/src/main.js
@@ -0,0 +1,25 @@
 
				+import { createApp } from "vue";
			
 
				+import App from "./App.vue";
			
 
				+import "./registerServiceWorker";
			
 
				+import router from "./router";
			
 
				+import store from "./store";
			
 
				+import axios from "axios";
			
 
				+import VueAxios from "vue-axios";
			
 
				+import "./util/rem";
			
 
				+import ElementPlus from "element-plus";
			
 
				+import "element-plus/theme-chalk/index.css";
			
 
				+import locale from "element-plus/lib/locale/lang/zh-cn";
			
 
				+
			
 
				+import * as ElIcon from "@element-plus/icons-vue";
			
 
				+axios.defaults.baseURL = "http://localhost:7777";
			
 
				+const app = createApp(App);
			
 
				+app
			
 
				+  .use(store)
			
 
				+  .use(router)
			
 
				+  .use(VueAxios, axios)
			
 
				+  .use(ElementPlus, { locale })
			
 
				+  .mount("#app");
			
 
				+
			
 
				+for (const [key, component] of Object.entries(ElIcon)) {
			
 
				+  app.component(key, component);
			
 
				+}
			
--- a/src/registerServiceWorker.js
+++ b/src/registerServiceWorker.js
@@ -0,0 +1,32 @@
 
				+/* eslint-disable no-console */
			
 
				+
			
 
				+import { register } from 'register-service-worker'
			
 
				+
			
 
				+if (process.env.NODE_ENV === 'production') {
			
 
				+  register(`${process.env.BASE_URL}service-worker.js`, {
			
 
				+    ready () {
			
 
				+      console.log(
			
 
				+        'App is being served from cache by a service worker.\n' +
			
 
				+        'For more details, visit https://goo.gl/AFskqB'
			
 
				+      )
			
 
				+    },
			
 
				+    registered () {
			
 
				+      console.log('Service worker has been registered.')
			
 
				+    },
			
 
				+    cached () {
			
 
				+      console.log('Content has been cached for offline use.')
			
 
				+    },
			
 
				+    updatefound () {
			
 
				+      console.log('New content is downloading.')
			
 
				+    },
			
 
				+    updated () {
			
 
				+      console.log('New content is available; please refresh.')
			
 
				+    },
			
 
				+    offline () {
			
 
				+      console.log('No internet connection found. App is running in offline mode.')
			
 
				+    },
			
 
				+    error (error) {
			
 
				+      console.error('Error during service worker registration:', error)
			
 
				+    }
			
 
				+  })
			
 
				+}
			
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -0,0 +1,136 @@
 
				+import { createRouter, createWebHashHistory } from "vue-router";
			
 
				+import TheHome from "../views/TheHome";
			
 
				+import UserLogin from "../views/UserLogin";
			
 
				+import PerCent from "../views/PreCent";
			
 
				+import UserReg from "../views/UserReg";
			
 
				+import Introduce from "../views/Introduce";
			
 
				+import BossHome from "../views/BossHome";
			
 
				+import BossPerCent from "../views/BossPerCent";
			
 
				+import Search from "../views/Search";
			
 
				+import ServeDetail from "../views/ServeDetail";
			
 
				+import ConfirmOrder from "../views/Search/ConfirmOrder";
			
 
				+import UserHelp from "../views/UserHelp";
			
 
				+
			
 
				+const routes = [
			
 
				+  {
			
 
				+    path: "/",
			
 
				+    redirect: {
			
 
				+      name: "introduce",
			
 
				+    },
			
 
				+    meta: {
			
 
				+      isShow: true,
			
 
				+    },
			
 
				+  },
			
 
				+  {
			
 
				+    path: "/loginview",
			
 
				+    name: "loginview",
			
 
				+    component: UserLogin,
			
 
				+    meta: {
			
 
				+      isShow: true,
			
 
				+    },
			
 
				+  },
			
 
				+  {
			
 
				+    path: "/thehome",
			
 
				+    name: "thehome",
			
 
				+    component: TheHome,
			
 
				+    meta: {
			
 
				+      isShow: true,
			
 
				+    },
			
 
				+  },
			
 
				+  {
			
 
				+    path: "/percent",
			
 
				+    name: "percent",
			
 
				+    component: PerCent,
			
 
				+    meta: {
			
 
				+      isShow: true,
			
 
				+    },
			
 
				+  },
			
 
				+  {
			
 
				+    path: "/userreg",
			
 
				+    name: "userreg",
			
 
				+    component: UserReg,
			
 
				+    meta: {
			
 
				+      isShow: true,
			
 
				+    },
			
 
				+  },
			
 
				+
			
 
				+  {
			
 
				+    path: "/bosshome/:username",
			
 
				+    name: "bosshome",
			
 
				+    component: BossHome,
			
 
				+    meta: {
			
 
				+      isShow: true,
			
 
				+    },
			
 
				+  },
			
 
				+  {
			
 
				+    path: "/introduce",
			
 
				+    name: "introduce",
			
 
				+    component: Introduce,
			
 
				+    meta: {
			
 
				+      isShow: true,
			
 
				+    },
			
 
				+  },
			
 
				+  {
			
 
				+    path: "/boss_per_cent",
			
 
				+    name: "boss_per_cent",
			
 
				+    component: BossPerCent,
			
 
				+    meta: {
			
 
				+      isShow: true,
			
 
				+    },
			
 
				+  },
			
 
				+  {
			
 
				+    path: "/search",
			
 
				+    name: "search",
			
 
				+    component: Search,
			
 
				+    meta: {
			
 
				+      isShow: true,
			
 
				+    },
			
 
				+  },
			
 
				+  {
			
 
				+    path: "/serve_detail",
			
 
				+    name: "serve_detail",
			
 
				+    component: ServeDetail,
			
 
				+    meta: {
			
 
				+      isShow: true,
			
 
				+    },
			
 
				+  },
			
 
				+  {
			
 
				+    path: "/confirm_order",
			
 
				+    name: "confirm_order",
			
 
				+    component: ConfirmOrder,
			
 
				+    meta: {
			
 
				+      isShow: true,
			
 
				+    },
			
 
				+  },
			
 
				+  {
			
 
				+    path: "/UserHelp",
			
 
				+    name: "UserHelp",
			
 
				+    component: UserHelp,
			
 
				+    meta: {
			
 
				+      isShow: true,
			
 
				+    },
			
 
				+  },
			
 
				+
			
 
				+];
			
 
				+
			
 
				+const router = createRouter({
			
 
				+  mode: "history",
			
 
				+  history: createWebHashHistory(),
			
 
				+  routes,
			
 
				+  base: "./liang",
			
 
				+});
			
 
				+router.beforeEach((to, from, next) => {
			
 
				+  let token = localStorage.getItem("token");
			
 
				+
			
 
				+  if (token == "") {
			
 
				+    if (to.fullPath == "/boss_per_cent" || to.fullPath == "/percent") {
			
 
				+      alert("未登录不能进入此页面");
			
 
				+    } else {
			
 
				+      next();
			
 
				+    }
			
 
				+  } else {
			
 
				+    next();
			
 
				+  }
			
 
				+});
			
 
				+
			
 
				+export default router;
			
--- a/src/store/LoginStore.js
+++ b/src/store/LoginStore.js
@@ -0,0 +1,19 @@
 
				+const state = {
			
 
				+  login_name: "",
			
 
				+  tokenStore: "",
			
 
				+};
			
 
				+const mutations = {
			
 
				+  setLoginName(state, name) {
			
 
				+    state.login_name = name;
			
 
				+  },
			
 
				+};
			
 
				+const actions = {};
			
 
				+const getters = {};
			
 
				+
			
 
				+export default {
			
 
				+  namespaced: true,
			
 
				+  state,
			
 
				+  mutations,
			
 
				+  actions,
			
 
				+  getters,
			
 
				+};
			
--- a/src/store/OrderStore.js
+++ b/src/store/OrderStore.js
@@ -0,0 +1,41 @@
 
				+const state = {
			
 
				+  orderStatus: '全部',
			
 
				+  pageNum: 1,
			
 
				+  pageSize: 2,
			
 
				+  total: 0,
			
 
				+};
			
 
				+const mutations = {
			
 
				+  setStatus(state, s) {
			
 
				+    state.orderStatus = s;
			
 
				+  },
			
 
				+  changePageNum(state, n) {
			
 
				+    state.pageNum = n;
			
 
				+  },
			
 
				+  setTotal(state, t) {
			
 
				+    state.total = t;
			
 
				+  },
			
 
				+  changeCurrentPageSize(state, t) {
			
 
				+    state.pageSize = t;
			
 
				+  },
			
 
				+};
			
 
				+const getters = {
			
 
				+  getTotal(state) {
			
 
				+    return state.total;
			
 
				+  },
			
 
				+  getStatus(state) {
			
 
				+    return state.orderStatus;
			
 
				+  },
			
 
				+  getCurrentPage(state) {
			
 
				+    return state.pageNum;
			
 
				+  },
			
 
				+  getCurrentPageSize(state) {
			
 
				+    return state.pageSize;
			
 
				+  },
			
 
				+};
			
 
				+
			
 
				+export default {
			
 
				+  namespaced: true,
			
 
				+  state,
			
 
				+  mutations,
			
 
				+  getters,
			
 
				+};
			
--- a/src/store/PerCent.js
+++ b/src/store/PerCent.js
@@ -0,0 +1,89 @@
 
				+const state = {
			
 
				+  //个人中心的路由导航
			
 
				+  showBasic: true,
			
 
				+  showExperience: false,
			
 
				+  showPwd: false,
			
 
				+  showComment: false,
			
 
				+  showStatus: false,
			
 
				+  showOrder: false,
			
 
				+  serverId: "",
			
 
				+  orderTotal: null,
			
 
				+  orderList: [],
			
 
				+  defaultIndex: "1-1",
			
 
				+};
			
 
				+const mutations = {
			
 
				+  //订单总数
			
 
				+  setOrderTotal(state, t) {
			
 
				+    state.orderTotal = t;
			
 
				+  },
			
 
				+  //设置订单信息
			
 
				+  setOrderList(state, l) {
			
 
				+    state.orderList = l;
			
 
				+  },
			
 
				+  //改变路由的方法
			
 
				+  convertIndex(state, index) {
			
 
				+    state.defaultIndex = index
			
 
				+    if (index == "1-1") {
			
 
				+      state.showBasic = true;
			
 
				+      state.showExperience = false;
			
 
				+      state.showPwd = false;
			
 
				+      state.showComment = false;
			
 
				+      state.showStatus = false;
			
 
				+      state.showOrder = false;
			
 
				+    } else if (index == "1-2") {
			
 
				+      state.showBasic = false;
			
 
				+      state.showExperience = true;
			
 
				+      state.showPwd = false;
			
 
				+      state.showComment = false;
			
 
				+      state.showStatus = false;
			
 
				+      state.showOrder = false;
			
 
				+    } else if (index == "0-1") {
			
 
				+      state.showBasic = false;
			
 
				+      state.showExperience = false;
			
 
				+      state.showPwd = true;
			
 
				+      state.showComment = false;
			
 
				+      state.showStatus = false;
			
 
				+      state.showOrder = false;
			
 
				+    } else if (index == "2") {
			
 
				+      state.showOrder = false;
			
 
				+      state.showBasic = false;
			
 
				+      state.showExperience = false;
			
 
				+      state.showPwd = false;
			
 
				+      state.showComment = false;
			
 
				+      state.showStatus = true;
			
 
				+    } else if (index == "4") {
			
 
				+      state.showOrder = false;
			
 
				+      state.showBasic = false;
			
 
				+      state.showExperience = false;
			
 
				+      state.showPwd = false;
			
 
				+      state.showComment = true;
			
 
				+      state.showStatus = false;
			
 
				+    } else if (index == "3") {
			
 
				+      state.showBasic = false;
			
 
				+      state.showExperience = false;
			
 
				+      state.showPwd = false;
			
 
				+      state.showComment = false;
			
 
				+      state.showStatus = false;
			
 
				+      state.showOrder = true;
			
 
				+    }
			
 
				+  },
			
 
				+};
			
 
				+const actions = {
			
 
				+  /*   async postComment({ commit }, { parmas, t }) {
			
 
				+    let result = await Comment(params, t);
			
 
				+    if (result.data.code) {
			
 
				+      return "ok";
			
 
				+    } else {
			
 
				+      return Promise.reject(new Error("faile"));
			
 
				+    }
			
 
				+  }, */
			
 
				+};
			
 
				+const getters = {};
			
 
				+
			
 
				+export default {
			
 
				+  namespaced: true,
			
 
				+  state,
			
 
				+  mutations,
			
 
				+  actions,
			
 
				+  getters,
			
 
				+};
			
--- a/src/store/SearchStore.js
+++ b/src/store/SearchStore.js
@@ -0,0 +1,79 @@
 
				+const state = {
			
 
				+  currentPage: 1,
			
 
				+  currentPageSize: 3,
			
 
				+  parmas: {
			
 
				+    pageNum: 1,
			
 
				+    pageSize: 3,
			
 
				+    nickName: "",
			
 
				+    salaryOrder: 0,
			
 
				+    categoryName: "不限",
			
 
				+    salary: 0,
			
 
				+    stay: 0,
			
 
				+    userType: 0,
			
 
				+    workArea: "",
			
 
				+    introdction: '',
			
 
				+  },
			
 
				+  searchList: null,
			
 
				+  total: 0,
			
 
				+  id: null,
			
 
				+  isByCondition: false
			
 
				+};
			
 
				+const mutations = {
			
 
				+  setList(state, List) {
			
 
				+    state.searchList = List;
			
 
				+  },
			
 
				+  changePageNum(state, val) {
			
 
				+    state.parmas.pageNum = val;
			
 
				+    state.currentPage = val;
			
 
				+  },
			
 
				+  changePageSize(state, val) {
			
 
				+    state.parmas.pageSize = val;
			
 
				+    state.currentPageSize = val;
			
 
				+  },
			
 
				+  setId(state, i) {
			
 
				+    state.id = i;
			
 
				+  },
			
 
				+  setSalary(state, p) {
			
 
				+    state.parmas.salary = p;
			
 
				+  },
			
 
				+  setParmas(state, p) {
			
 
				+    state.parmas = p;
			
 
				+  },
			
 
				+  setTotal(state, t) {
			
 
				+    state.total = t;
			
 
				+  },
			
 
				+  changeIsByCondition(state,t){
			
 
				+    state.isByCondition = t
			
 
				+  }
			
 
				+};
			
 
				+
			
 
				+const actions = {
			
 
				+};
			
 
				+const getters = {
			
 
				+  getSearchList(state) {
			
 
				+    return state.searchList;
			
 
				+  },
			
 
				+  getPageNum(state) {
			
 
				+    return state.currentPage;
			
 
				+  },
			
 
				+  getPageSize(state) {
			
 
				+    return state.currentPageSize;
			
 
				+  },
			
 
				+  getParmas(state) {
			
 
				+    return state.parmas;
			
 
				+  },
			
 
				+  getTotal(state) {
			
 
				+    return state.total;
			
 
				+  },
			
 
				+  getId(state) {
			
 
				+    return state.id;
			
 
				+  },
			
 
				+};
			
 
				+
			
 
				+export default {
			
 
				+  namespaced: true,
			
 
				+  state,
			
 
				+  mutations,
			
 
				+  actions,
			
 
				+  getters,
			
 
				+};
			
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -0,0 +1,21 @@
 
				+import { createStore } from "vuex";
			
 
				+import LoginStore from "./LoginStore";
			
 
				+import PerCent from "./PerCent";
			
 
				+import SearchStore from "./SearchStore";
			
 
				+import OrderStore from "./OrderStore";
			
 
				+export default createStore({
			
 
				+  state: {
			
 
				+    userTypeStore: "",
			
 
				+  },
			
 
				+  mutations: {
			
 
				+    changeType(state, p) {
			
 
				+      state.userTypeStore = p;
			
 
				+    },
			
 
				+  },
			
 
				+  modules: {
			
 
				+    LoginStore: LoginStore,
			
 
				+    PerCent: PerCent,
			
 
				+    SearchStore: SearchStore,
			
 
				+    OrderStore: OrderStore,
			
 
				+  },
			
 
				+});
			
--- a/src/util/cookie.js
+++ b/src/util/cookie.js
@@ -0,0 +1,47 @@
 
				+//cookie的设置
			
 
				+var setCookie = function (name, value, day) {
			
 
				+  var strCookie = "";
			
 
				+  //判断name和value是否存在
			
 
				+  if (name && value) {
			
 
				+    strCookie =
			
 
				+      encodeURIComponent(name) + "=" + encodeURIComponent(value) + ";";
			
 
				+  }
			
 
				+  //判断时间
			
 
				+  if (typeof day == "number") {
			
 
				+    var date = new Date();
			
 
				+    date.setDate(date.getDate() + day);
			
 
				+    strCookie += "expires=" + date.toUTCString() + ";";
			
 
				+  }
			
 
				+
			
 
				+  return (document.cookie = strCookie);
			
 
				+};
			
 
				+
			
 
				+//获取cookie
			
 
				+var getCookie = function (name) {
			
 
				+  var cookieStr = decodeURIComponent(document.cookie);
			
 
				+  var arr1 = cookieStr.split(";"); //[aa="xxx",bb="xxx"]
			
 
				+  for (var i = 0; i < arr1.length; i++) {
			
 
				+    var arr2 = arr1[i].split("=");
			
 
				+    if (arr2[0].trim() === name) {
			
 
				+      return arr2[1];
			
 
				+    }
			
 
				+  }
			
 
				+};
			
 
				+
			
 
				+//删除cookie
			
 
				+var delCookie = function (name) {
			
 
				+  setCookie(name, 1, -1);
			
 
				+};
			
 
				+
			
 
				+var deleteAllCookies =function () {
			
 
				+  var cookies = document.cookie.split(';');
			
 
				+  for (var i = 0; i < cookies.length; i++) {
			
 
				+    var cookie = cookies[i];
			
 
				+    var eqPos = cookie.indexOf('=');
			
 
				+    var name = eqPos > -1 ? cookie.substr(0, eqPos) : cookie;
			
 
				+    document.cookie = name + "=;expires=Thu, 01 Jan 1970 00:00:00 GMT";
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+//导出
			
 
				+export { setCookie, getCookie, delCookie };
			
--- a/src/util/rem.js
+++ b/src/util/rem.js
@@ -0,0 +1,17 @@
 
				+// rem等比适配配置文件
			
 
				+// 基准大小
			
 
				+const baseSize = 20;
			
 
				+// 设置 rem 函数
			
 
				+function setRem() {
			
 
				+  // 当前页面宽度相对于 1920宽的缩放比例，可根据自己需要修改。
			
 
				+  const scale = document.documentElement.clientWidth / 1920;
			
 
				+  // 设置页面根节点字体大小（“Math.min(scale, 2)” 指最高放大比例为2，可根据实际业务需求调整）
			
 
				+  document.documentElement.style.fontSize =
			
 
				+    baseSize * Math.min(scale, 2) + "px";
			
 
				+}
			
 
				+// 初始化
			
 
				+setRem();
			
 
				+// 改变窗口大小时重新设置 rem
			
 
				+window.onresize = function () {
			
 
				+  setRem();
			
 
				+};
			
--- a/src/views/BossHome/index.vue
+++ b/src/views/BossHome/index.vue
@@ -0,0 +1,12 @@
 
				+<template>
			
 
				+  <h1>这里是预约人员的首页</h1>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: "BossHome",
			
 
				+  created() {
			
 
				+    /*     this.$router.go(0); */
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
--- a/src/views/BossPerCent/PerLeft/index.vue
+++ b/src/views/BossPerCent/PerLeft/index.vue
@@ -0,0 +1,230 @@
 
				+<template>
			
 
				+  <div class="left">
			
 
				+    <div class="top">
			
 
				+      <div class="headPortrait">
			
 
				+        <input type="file" ref="avatarInput" style="display: none" @change="uploadAvatar" accept="img/png img/jpg" />
			
 
				+        <img @click.native="selectAvatar" :src="this.avatar" title="更换头像" class="upAvatar" />
			
 
				+      </div>
			
 
				+      <div class="message">
			
 
				+        <h2>{{ this.nickName }}</h2>
			
 
				+        <div class="threebox">
			
 
				+          <div @click="changeIndex('0-1')">修改密码</div>
			
 
				+          &nbsp;
			
 
				+        </div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <el-row class="tac">
			
 
				+      <el-col :span="50">
			
 
				+        <el-menu default-active="1-1" class="el-menu-vertical-demo">
			
 
				+          <el-menu-item @click="changeIndex('1-1')" index="1">
			
 
				+            <el-icon>
			
 
				+              <Avatar />
			
 
				+            </el-icon>
			
 
				+            <span>个人信息</span>
			
 
				+          </el-menu-item>
			
 
				+          <el-menu-item @click="changeIndex('3')" index="3">
			
 
				+            <el-icon>
			
 
				+              <document />
			
 
				+            </el-icon>
			
 
				+            <span>我的订单</span>
			
 
				+          </el-menu-item>
			
 
				+          <el-menu-item @click="changeIndex('4')" index="4">
			
 
				+            <el-icon>
			
 
				+              <ZoomOut />
			
 
				+            </el-icon>
			
 
				+            <span>我的评价</span>
			
 
				+          </el-menu-item>
			
 
				+          <el-menu-item @click="showHelp" index="5">
			
 
				+            <el-icon>
			
 
				+              <QuestionFilled />
			
 
				+            </el-icon>
			
 
				+            <span>帮助中心</span>
			
 
				+          </el-menu-item>
			
 
				+          <img id="becomeServer" src="../img/becomeServer.png" />
			
 
				+          <input id="toAuthenticate" value="去认证家政人员" type="button" />
			
 
				+        </el-menu>
			
 
				+      </el-col>
			
 
				+    </el-row>
			
 
				+  </div>
			
 
				+  <div class="clear"></div>
			
 
				+</template>
			
 
				+<script>
			
 
				+import {
			
 
				+  Avatar,
			
 
				+  Document,
			
 
				+  Menu as IconMenu,
			
 
				+  Location,
			
 
				+  ZoomOut,
			
 
				+} from "@element-plus/icons-vue";
			
 
				+import { mapMutations } from "vuex";
			
 
				+import { mapState } from "vuex";
			
 
				+import { userInfo, avatarUp } from "@/api";
			
 
				+export default {
			
 
				+  name: "PerLeft",
			
 
				+  data() {
			
 
				+    return {
			
 
				+      nickName: "",
			
 
				+      avatar: "",
			
 
				+      imgSize: ''
			
 
				+    };
			
 
				+  },
			
 
				+  created() {
			
 
				+    this.init()
			
 
				+  },
			
 
				+  computed: {
			
 
				+    ...mapState("LoginStore", ["login_name"]),
			
 
				+  },
			
 
				+  components: {
			
 
				+    Avatar,
			
 
				+    Document,
			
 
				+    IconMenu,
			
 
				+    Location,
			
 
				+    ZoomOut,
			
 
				+  },
			
 
				+  methods: {
			
 
				+    ...mapMutations("PerCent", ["convertIndex"]),
			
 
				+    init() {
			
 
				+      userInfo().then((response) => {
			
 
				+        if ((response.data.code === 200)) {
			
 
				+          this.avatar = response.data.data.avatar;
			
 
				+          this.nickName = response.data.data.nickName;
			
 
				+        } else {
			
 
				+          alert("服务器出错了，请重试!");
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+    changeIndex(i) {
			
 
				+      this.convertIndex(i);
			
 
				+    },
			
 
				+    selectAvatar() {
			
 
				+      if (confirm('确定要修改头像吗')) {
			
 
				+        // 用户点击了确定按钮
			
 
				+        this.$refs.avatarInput.click();
			
 
				+      } else { }
			
 
				+    },
			
 
				+    uploadAvatar(event) {
			
 
				+      const file = event.target.files[0];
			
 
				+      const formData = new FormData();
			
 
				+      formData.append('img', file);
			
 
				+      if (file !== undefined) {
			
 
				+        avatarUp(formData).then((response) => {
			
 
				+          if (response.data.code === 200) {
			
 
				+            this.init()
			
 
				+            alert("修改头像成功！");
			
 
				+          } else if (response.data.code == 507) {
			
 
				+            alert(response.data.msg);
			
 
				+          } else {
			
 
				+            alert("头像上传失败!");
			
 
				+          }
			
 
				+        });
			
 
				+      }
			
 
				+    },
			
 
				+    showHelp() {
			
 
				+      this.$router.push("/UserHelp");
			
 
				+    }
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+
			
 
				+<style scoped>
			
 
				+.el-menu-vertical-demo {
			
 
				+  z-index: 200;
			
 
				+}
			
 
				+
			
 
				+.left {
			
 
				+  border: 1px solid gray;
			
 
				+  border-radius: 10px;
			
 
				+  overflow: hidden;
			
 
				+  width: 23%;
			
 
				+  display: inline-block;
			
 
				+  margin: 0;
			
 
				+  float: left;
			
 
				+  margin-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+.top {
			
 
				+  position: relative;
			
 
				+  width: 100%;
			
 
				+  height: 8rem;
			
 
				+  background-color: rgb(246, 248, 247);
			
 
				+  border-bottom: 1px solid gray;
			
 
				+}
			
 
				+
			
 
				+.headPortrait {
			
 
				+  width: 80px;
			
 
				+  height: 80px;
			
 
				+  background-color: antiquewhite;
			
 
				+  border-radius: 40px;
			
 
				+  position: absolute;
			
 
				+  top: 1rem;
			
 
				+  left: 1rem;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+
			
 
				+.message {
			
 
				+  position: absolute;
			
 
				+  top: 0.5rem;
			
 
				+  left: 9rem;
			
 
				+}
			
 
				+
			
 
				+.message h2 {
			
 
				+  font-size: 1.3rem;
			
 
				+  margin-left: -0.5rem;
			
 
				+}
			
 
				+
			
 
				+.message div {
			
 
				+  border: 0.5px solid rgb(162, 160, 160);
			
 
				+  font-size: 0.7rem;
			
 
				+  margin-left: 0rem;
			
 
				+  display: inline-block;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+.message .threebox {
			
 
				+  border: none;
			
 
				+}
			
 
				+
			
 
				+[class*="el-col-"] {
			
 
				+  box-sizing: border-box;
			
 
				+  width: 20rem;
			
 
				+}
			
 
				+
			
 
				+.el-sub-menu .el-menu-item {
			
 
				+  height: var(--el-menu-sub-item-height);
			
 
				+  line-height: var(--el-menu-sub-item-height);
			
 
				+  margin-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+.upAvatar {
			
 
				+  width: 100%;
			
 
				+  height: auto;
			
 
				+}
			
 
				+
			
 
				+img {
			
 
				+  width: 100%;
			
 
				+  height: auto;
			
 
				+}
			
 
				+
			
 
				+/* 导航栏图片 */
			
 
				+#becomeServer {
			
 
				+  width: 90%;
			
 
				+  height: auto;
			
 
				+}
			
 
				+
			
 
				+/* 认证按钮 */
			
 
				+#toAuthenticate {
			
 
				+  width: 17rem;
			
 
				+  height: 2.7rem;
			
 
				+  font-size: 1.3rem;
			
 
				+  font-weight: 500;
			
 
				+  background-color: #f4ed97;
			
 
				+  border: none;
			
 
				+  border-radius: 4rem;
			
 
				+  margin-bottom: 3rem;
			
 
				+}
			
 
				+
			
 
				+/* 清除浮动 */
			
 
				+.clear {
			
 
				+  clear: both;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/BossPerCent/PerRight/BasicInfo/index.vue
+++ b/src/views/BossPerCent/PerRight/BasicInfo/index.vue
@@ -0,0 +1,499 @@
 
				+<template>
			
 
				+  <div v-if="show" class="right">
			
 
				+    <div class="showTitle">
			
 
				+      <el-icon>
			
 
				+        <Tickets />
			
 
				+      </el-icon>
			
 
				+      <h2>基本信息</h2>
			
 
				+      <input type="button" v-if="isCancel" value="取消" />
			
 
				+      <input type="button" @click="convertMsg($event)" value="修改" />
			
 
				+    </div>
			
 
				+    <table class="bigtable">
			
 
				+      <tr>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <el-icon>
			
 
				+              <User />
			
 
				+            </el-icon>
			
 
				+            <h3>账户名</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input type="text" v-model="username" disabled />
			
 
				+        </td>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <el-icon>
			
 
				+              <Avatar />
			
 
				+            </el-icon>
			
 
				+            <h3>用户名</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input v-model="this.nickName" type="text" disabled />
			
 
				+        </td>
			
 
				+      </tr>
			
 
				+      <tr>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <el-icon>
			
 
				+              <Clock />
			
 
				+            </el-icon>
			
 
				+            <h3>年龄</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input type="text" disabled v-model="age" />
			
 
				+        </td>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <el-icon>
			
 
				+              <UserFilled />
			
 
				+            </el-icon>
			
 
				+            <h3>性别</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td>
			
 
				+          <select id="gender" disabled v-model="sex">
			
 
				+            <option value="">请选择</option>
			
 
				+            <option value="0">男</option>
			
 
				+            <option value="1">女</option>
			
 
				+          </select>
			
 
				+        </td>
			
 
				+      </tr>
			
 
				+      <tr>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <el-icon>
			
 
				+              <Iphone />
			
 
				+            </el-icon>
			
 
				+            <h3>手机号</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input v-model="this.phone" type="text" disabled />
			
 
				+        </td>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <el-icon>
			
 
				+              <Location />
			
 
				+            </el-icon>
			
 
				+            <h3>地区</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input v-model="this.area" type="text" disabled />
			
 
				+        </td>
			
 
				+      </tr>
			
 
				+      <tr>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <el-icon><img class="vipImg" src="../../img/VIP.png" /></el-icon>
			
 
				+            <h3>Vip</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input v-model="this.vip" type="text" disabled />
			
 
				+        </td>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <el-icon>
			
 
				+              <InfoFilled />
			
 
				+            </el-icon>
			
 
				+            <h3>积分</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input v-model="this.points" type="text" disabled />
			
 
				+        </td>
			
 
				+      </tr>
			
 
				+    </table>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import {
			
 
				+  Tickets,
			
 
				+  PictureFilled,
			
 
				+  Avatar,
			
 
				+  UserFilled,
			
 
				+  Iphone,
			
 
				+  Location,
			
 
				+  Clock,
			
 
				+  User,
			
 
				+  InfoFilled,
			
 
				+} from "@element-plus/icons-vue";
			
 
				+import { userInfo, convertInfo } from "@/api";
			
 
				+import { mapState, mapMutations } from "vuex";
			
 
				+
			
 
				+/* import $ from 'jquery' */
			
 
				+export default {
			
 
				+  name: "BasicInfo",
			
 
				+  data() {
			
 
				+    return {
			
 
				+      isCancel: false,
			
 
				+      show: true,
			
 
				+      avatar: "",
			
 
				+      age: "",
			
 
				+      username: "",
			
 
				+      nickName: "",
			
 
				+      area: "",
			
 
				+      sex: "",
			
 
				+      phone: "",
			
 
				+      vip: "",
			
 
				+      points: "",
			
 
				+    };
			
 
				+  },
			
 
				+  components: {
			
 
				+    InfoFilled,
			
 
				+    User,
			
 
				+    Clock,
			
 
				+    Location,
			
 
				+    Tickets,
			
 
				+    PictureFilled,
			
 
				+    Avatar,
			
 
				+    UserFilled,
			
 
				+    Iphone,
			
 
				+  },
			
 
				+  computed: {
			
 
				+    ...mapState("LoginStore", ["tokenStore"]),
			
 
				+  },
			
 
				+  created() {
			
 
				+    //页面加载时就从本地通过localstorage获取存储的token值
			
 
				+    if (localStorage.getItem("token")) {
			
 
				+      this.token = localStorage.getItem("token");
			
 
				+    }
			
 
				+    this.getInfo()
			
 
				+  },
			
 
				+  methods: {
			
 
				+    ...mapMutations("PerCent", ["convertMsgStore"]),
			
 
				+    ...mapMutations("LoginStore", ["setLoginName"]),
			
 
				+    getInfo(){
			
 
				+      userInfo().then((response) => {
			
 
				+      if (response.data.code === 200) {
			
 
				+        this.age = response.data.data.age;
			
 
				+        this.avatar = response.data.data.avatar;
			
 
				+        this.username = response.data.data.userName;
			
 
				+        this.nickName = response.data.data.nickName;
			
 
				+        this.area = response.data.data.area;
			
 
				+        this.sex = response.data.data.sex;
			
 
				+        this.phone = response.data.data.phone;
			
 
				+        this.points = response.data.data.points;
			
 
				+        this.vip = response.data.data.vip;
			
 
				+        this.setLoginName(this.nickName)
			
 
				+      } else {
			
 
				+        alert("服务器出错了，请重试!");
			
 
				+      }
			
 
				+    });
			
 
				+    },
			
 
				+    validate() {
			
 
				+      let errMsg = "";
			
 
				+      const phoneRegx =
			
 
				+        /^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:9[1589]))\d{8}$/;
			
 
				+      if (this.age < 0) {
			
 
				+        errMsg = "年龄不能小于0岁<br/>";
			
 
				+      }
			
 
				+      if (!phoneRegx.test(this.phone)) {
			
 
				+        errMsg += "手机号格式不正确<br/>";
			
 
				+      }
			
 
				+      if (errMsg != "") {
			
 
				+        alert(errMsg);
			
 
				+        return false;
			
 
				+      } else {
			
 
				+        return true;
			
 
				+      }
			
 
				+    },
			
 
				+    convertMsg(e) {
			
 
				+      //修改信息
			
 
				+      if (e.currentTarget.getAttribute("value") == "确认修改") {
			
 
				+        //更新个人基础信息
			
 
				+        const params = {
			
 
				+          age: this.age,
			
 
				+          username: this.username,
			
 
				+          nickName: this.nickName,
			
 
				+          area: this.area,
			
 
				+          sex: this.sex,
			
 
				+          phone: this.phone,
			
 
				+          points: this.points,
			
 
				+        };
			
 
				+        if (this.validate()) {
			
 
				+          convertInfo(params).then((response) => {
			
 
				+            if (response.data.code === 200) {
			
 
				+              this.show = false;
			
 
				+              this.getInfo()
			
 
				+              alert("修改成功");
			
 
				+              this.$router.go(0)
			
 
				+              this.show = true;
			
 
				+            } else {
			
 
				+              alert("修改失败");
			
 
				+            }
			
 
				+            this.isCancel = false;
			
 
				+          });
			
 
				+        }
			
 
				+        const n = document.documentElement
			
 
				+          .getElementsByTagName("table")[0]
			
 
				+          .getElementsByTagName("input").length;
			
 
				+        for (var i = 1; i < n; i++) {
			
 
				+          document.documentElement
			
 
				+            .getElementsByTagName("table")[0]
			
 
				+            .getElementsByTagName("input")
			
 
				+          [i].setAttribute("disabled", "disabled");
			
 
				+        }
			
 
				+        document.documentElement
			
 
				+          .getElementsByTagName("select")[0]
			
 
				+          .setAttribute("disabled", "disabled");
			
 
				+        e.currentTarget.setAttribute("value", "修改");
			
 
				+      } //退出修改信息
			
 
				+      else if (e.currentTarget.getAttribute("value") == "修改") {
			
 
				+        this.isCancel = true
			
 
				+        // document.documentElement
			
 
				+        //   .getElementsByClassName("upAvatar")[0]
			
 
				+        //   .setAttribute("style", "display:block");
			
 
				+        const n = document.documentElement
			
 
				+          .getElementsByTagName("table")[0]
			
 
				+          .getElementsByTagName("input").length;
			
 
				+        for (var i = 2; i < n - 2; i++) {
			
 
				+          document.documentElement
			
 
				+            .getElementsByTagName("table")[0]
			
 
				+            .getElementsByTagName("input")
			
 
				+          [i].removeAttribute("disabled");
			
 
				+        }
			
 
				+        document.documentElement
			
 
				+          .getElementsByTagName("select")[0]
			
 
				+          .removeAttribute("disabled");
			
 
				+        //vip不可以修改
			
 
				+        document.documentElement;
			
 
				+        document.documentElement
			
 
				+          .getElementsByTagName("table")[0]
			
 
				+          .getElementsByTagName("input")[6]
			
 
				+          .setAttribute("disabled", "disabled");
			
 
				+        e.currentTarget.setAttribute("value", "确认修改");
			
 
				+      }
			
 
				+    },
			
 
				+    cancel(e){
			
 
				+      document.documentElement
			
 
				+          .getElementsByClassName("upAvatar")[0]
			
 
				+          .setAttribute("style", "display:none");
			
 
				+        const n = document.documentElement
			
 
				+          .getElementsByTagName("table")[0]
			
 
				+          .getElementsByTagName("input").length;
			
 
				+        for (var i = 2; i < n - 2; i++) {
			
 
				+          document.documentElement
			
 
				+            .getElementsByTagName("table")[0]
			
 
				+            .getElementsByTagName("input")
			
 
				+          [i].setAttribute("disabled", "disabled");
			
 
				+        }
			
 
				+        document.documentElement
			
 
				+          .getElementsByTagName("select")[0]
			
 
				+          .setAttribute("disabled", "disabled");
			
 
				+        //vip不可以修改
			
 
				+        document.documentElement;
			
 
				+        document.documentElement
			
 
				+          .getElementsByTagName("table")[0]
			
 
				+          .getElementsByTagName("input")[6]
			
 
				+          .setAttribute("disabled", "disabled");
			
 
				+        this.isCancel = false
			
 
				+      }
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+<style scoped>
			
 
				+.right {
			
 
				+  width: 59rem;
			
 
				+  background-color: rgb(255, 255, 255);
			
 
				+  /* top: 1rem; */
			
 
				+  /* left: 24rem; */
			
 
				+  border: 1px solid gray;
			
 
				+  border-radius: 10px;
			
 
				+  display: inline-block;
			
 
				+  margin: 0;
			
 
				+  margin-left: 25rem;
			
 
				+  float: left;
			
 
				+  margin-top: -43rem;
			
 
				+}
			
 
				+
			
 
				+.showTitle {
			
 
				+  position: relative;
			
 
				+  width: 100%;
			
 
				+  height: 3rem;
			
 
				+  border-bottom: 1px solid rgb(165, 162, 162);
			
 
				+  box-sizing: border-box;
			
 
				+  text-align: start;
			
 
				+  padding-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+.showTitle h2 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+}
			
 
				+
			
 
				+table {
			
 
				+  width: 95%;
			
 
				+  margin: 0 auto;
			
 
				+  margin-top: 3rem;
			
 
				+  font-size: small;
			
 
				+  font-weight: bolder;
			
 
				+  border-collapse: separate;
			
 
				+  /* 控制是否合并边框 */
			
 
				+  border-spacing: 0;
			
 
				+  /* 控制单元格之间的距离 */
			
 
				+  border: solid 2px rgb(215, 215, 215);
			
 
				+  /*控制外边框*/
			
 
				+  border-radius: 20px;
			
 
				+  overflow: hidden;
			
 
				+  margin-bottom: 8rem;
			
 
				+}
			
 
				+
			
 
				+td {
			
 
				+  text-align: left;
			
 
				+  padding: 0.5rem;
			
 
				+  border-top: 1px solid rgb(213, 213, 213);
			
 
				+}
			
 
				+
			
 
				+td:last-child,
			
 
				+th:last-child {
			
 
				+  border-right-color: transparent;
			
 
				+}
			
 
				+
			
 
				+.title {
			
 
				+  width: 4rem;
			
 
				+  background-color: rgb(245, 245, 245);
			
 
				+  padding-left: 1rem;
			
 
				+  margin: 0;
			
 
				+}
			
 
				+
			
 
				+.headPortrait {
			
 
				+  height: 6rem;
			
 
				+}
			
 
				+
			
 
				+td,
			
 
				+th {
			
 
				+  border-right: 2px solid rgb(213, 213, 213);
			
 
				+}
			
 
				+
			
 
				+.el-icon {
			
 
				+  --color: inherit;
			
 
				+  height: 1em;
			
 
				+  width: 1em;
			
 
				+  line-height: 1em;
			
 
				+  fill: currentColor;
			
 
				+  color: var(--color);
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+  font-size: large;
			
 
				+}
			
 
				+
			
 
				+table td h3 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1rem;
			
 
				+}
			
 
				+
			
 
				+table td .el-icon {
			
 
				+  --color: inherit;
			
 
				+  height: 1em;
			
 
				+  width: 1em;
			
 
				+  line-height: 1em;
			
 
				+  fill: currentColor;
			
 
				+  color: var(--color);
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+  font-size: large;
			
 
				+  position: absolute;
			
 
				+  top: 1.1rem;
			
 
				+  left: -0.4rem;
			
 
				+}
			
 
				+
			
 
				+table td div {
			
 
				+  position: relative;
			
 
				+  text-align: justify;
			
 
				+  padding-left: 1rem;
			
 
				+}
			
 
				+
			
 
				+input[type="button"] {
			
 
				+  background-color: #409eff;
			
 
				+  width: 6rem;
			
 
				+  height: 2rem;
			
 
				+  border-radius: 1rem;
			
 
				+  position: absolute;
			
 
				+  right: 2rem;
			
 
				+  border: none;
			
 
				+  top: 0.5rem;
			
 
				+  color: white;
			
 
				+  text-aselcectlign: center;
			
 
				+  letter-spacing: 0.3rem;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+/* 输入框的样式 */
			
 
				+table input[data-v-b263d3c0] {
			
 
				+  display: inline-block;
			
 
				+  padding: 0;
			
 
				+  margin: 0;
			
 
				+  width: 90%;
			
 
				+  height: 2rem;
			
 
				+  border: none;
			
 
				+  /* outline: none; */
			
 
				+  color: rgb(63, 62, 62);
			
 
				+  font-size: 1rem;
			
 
				+  font-weight: bold;
			
 
				+  padding-left: 0.5rem;
			
 
				+}
			
 
				+
			
 
				+.input {
			
 
				+  padding: 0;
			
 
				+  padding-left: 0.4rem;
			
 
				+}
			
 
				+
			
 
				+table select {
			
 
				+  width: 5rem;
			
 
				+  font-size: 1rem;
			
 
				+  border: none;
			
 
				+}
			
 
				+
			
 
				+table select:disabled {
			
 
				+  width: 5rem;
			
 
				+  color: black;
			
 
				+  font-size: 1rem;
			
 
				+  border: none;
			
 
				+  font-weight: bold;
			
 
				+}
			
 
				+
			
 
				+/* 头像样式 */
			
 
				+.avatarParent {
			
 
				+  position: relative;
			
 
				+}
			
 
				+
			
 
				+.avatar {
			
 
				+  margin-top: 0.5rem;
			
 
				+  width: 5rem;
			
 
				+  height: 5rem;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+
			
 
				+table input[type="file"] {
			
 
				+  display: none;
			
 
				+  position: absolute;
			
 
				+  top: -1.5rem;
			
 
				+  left: 8rem;
			
 
				+  /*   background-color: #409eff;
			
 
				+  border: none;
			
 
				+  color: white; */
			
 
				+}
			
 
				+
			
 
				+table img {
			
 
				+  width: 100%;
			
 
				+  height: auto;
			
 
				+}
			
 
				+
			
 
				+/* vip图片 */
			
 
				+.vipImg {
			
 
				+  width: 1.4rem !important;
			
 
				+  height: auto !important;
			
 
				+  position: absolute;
			
 
				+  left: -0.1rem;
			
 
				+  top: -0.25rem;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/BossPerCent/PerRight/ConvertPwd/index.vue
+++ b/src/views/BossPerCent/PerRight/ConvertPwd/index.vue
@@ -0,0 +1,155 @@
 
				+<template>
			
 
				+  <div class="right">
			
 
				+    <div class="showTitle">
			
 
				+      <el-icon><Tickets /></el-icon>
			
 
				+      <h2>修改密码</h2>
			
 
				+    </div>
			
 
				+    <div class="buttom">
			
 
				+      <div>
			
 
				+        <h5>旧密码:</h5>
			
 
				+        <input type="password" />
			
 
				+      </div>
			
 
				+      <div>
			
 
				+        <h5>新密码:</h5>
			
 
				+        <input type="password" />
			
 
				+      </div>
			
 
				+      <div>
			
 
				+        <h5>确认密码:</h5>
			
 
				+        <input class="last" type="password" />
			
 
				+      </div>
			
 
				+      <input type="button" @click="convertMsg()" value="确认修改" />
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+<script>
			
 
				+import { changePwd } from "@/api";
			
 
				+
			
 
				+import { mapState } from "vuex";
			
 
				+export default {
			
 
				+  name: "ConvertMsg",
			
 
				+  computed: {
			
 
				+    ...mapState("LoginStore", ["tokenStore"]),
			
 
				+  },
			
 
				+  created() {
			
 
				+    //页面加载时就从本地通过localstorage获取存储的token值
			
 
				+    if (localStorage.getItem("token")) {
			
 
				+      this.token = localStorage.getItem("token");
			
 
				+    }
			
 
				+  },
			
 
				+  methods: {
			
 
				+    convertMsg() {
			
 
				+      //取出密码
			
 
				+      const prePwd = document.documentElement
			
 
				+        .getElementsByClassName("buttom")[0]
			
 
				+        .getElementsByTagName("input")[0].value;
			
 
				+      const pwd1 = document.documentElement
			
 
				+        .getElementsByClassName("buttom")[0]
			
 
				+        .getElementsByTagName("input")[1].value;
			
 
				+      const pwd2 = document.documentElement
			
 
				+        .getElementsByClassName("buttom")[0]
			
 
				+        .getElementsByTagName("input")[2].value;
			
 
				+      console.log("密码", prePwd, pwd1, pwd2);
			
 
				+
			
 
				+      var pPattern =
			
 
				+        /^.*(?=.{6,})(?=.*\d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*? ]).*$/;
			
 
				+      //判断是否为空
			
 
				+      if (prePwd.trim() == "" || pwd1.trim() == "" || pwd2.trim() == "") {
			
 
				+        alert("请填写完整信息!");
			
 
				+      }
			
 
				+      //判断密码是否一致
			
 
				+      else if (pwd1 != pwd2) {
			
 
				+        alert("前后密码不一致");
			
 
				+      } else if (!pPattern.test(pwd1)) {
			
 
				+        alert(
			
 
				+          "密码最少6位，包括至少1个大写字母，1个小写字母，1个数字，1个特殊字符"
			
 
				+        );
			
 
				+      } else {
			
 
				+        const params = {
			
 
				+          oldPW: prePwd,
			
 
				+          newPW: pwd1,
			
 
				+        };
			
 
				+
			
 
				+        changePwd(params).then((response) => {
			
 
				+          if (response.data.code == 200) {
			
 
				+            alert("修改成功!");
			
 
				+          } else {
			
 
				+            alert("修改失败，请重试");
			
 
				+          }
			
 
				+        });
			
 
				+      }
			
 
				+    },
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+
			
 
				+<style scoped>
			
 
				+.right {
			
 
				+  width: 59rem;
			
 
				+  height: 35rem;
			
 
				+  background-color: rgb(255, 255, 255);
			
 
				+  top: 1rem;
			
 
				+  left: 24rem;
			
 
				+  border: 1px solid gray;
			
 
				+  border-radius: 10px;
			
 
				+  margin-left: 25rem;
			
 
				+  float: left;
			
 
				+  margin-top: -43rem;
			
 
				+}
			
 
				+.showTitle {
			
 
				+  position: relative;
			
 
				+  width: 100%;
			
 
				+  height: 3rem;
			
 
				+  border-bottom: 1px solid rgb(165, 162, 162);
			
 
				+  box-sizing: border-box;
			
 
				+  text-align: start;
			
 
				+  padding-left: 2rem;
			
 
				+}
			
 
				+.showTitle h2 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+}
			
 
				+.buttom input[type="button"] {
			
 
				+  background-color: #409eff;
			
 
				+  width: 6rem;
			
 
				+  height: 2rem;
			
 
				+  border-radius: 1rem;
			
 
				+  font-size: 1rem;
			
 
				+  border: none;
			
 
				+  color: white;
			
 
				+  text-align: center;
			
 
				+  letter-spacing: 0.3rem;
			
 
				+  cursor: pointer;
			
 
				+  margin-left: 12rem;
			
 
				+}
			
 
				+.buttom {
			
 
				+  text-align: left;
			
 
				+}
			
 
				+.buttom h5 {
			
 
				+  font-size: 1.1rem;
			
 
				+  padding-left: 4rem;
			
 
				+  padding-right: 2rem;
			
 
				+  display: inline-block;
			
 
				+}
			
 
				+.buttom input {
			
 
				+  font-size: 1.1rem;
			
 
				+}
			
 
				+
			
 
				+.buttom input[type="button"][data-v-3e4046af][data-v-3e4046af] {
			
 
				+  background-color: #409eff;
			
 
				+  width: 7rem;
			
 
				+  height: 3rem;
			
 
				+  border-radius: 2rem;
			
 
				+  font-size: 0.8rem;
			
 
				+  border: none;
			
 
				+  color: white;
			
 
				+  text-align: center;
			
 
				+  letter-spacing: 0.3rem;
			
 
				+  cursor: pointer;
			
 
				+  margin-left: 12rem;
			
 
				+  margin-top: 1rem;
			
 
				+}
			
 
				+.last {
			
 
				+  margin-left: -1rem;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/BossPerCent/PerRight/MyComment/index.vue
+++ b/src/views/BossPerCent/PerRight/MyComment/index.vue
@@ -0,0 +1,423 @@
 
				+<!-- 我的评论页面 -->
			
 
				+<template>
			
 
				+  <div class="right">
			
 
				+    <div class="showTitle">
			
 
				+      <el-icon>
			
 
				+        <ZoomOut />
			
 
				+      </el-icon>
			
 
				+      <h2>我的评价</h2>
			
 
				+    </div>
			
 
				+    <div class="Comment" id="CommentMSg" v-for="(item, i) in this.rows">
			
 
				+      <div id="commentTitle">
			
 
				+        <h4 id="order">订单编号:</h4>
			
 
				+        <div id="orderDetail">
			
 
				+          <h4>{{ item.orderId }}</h4>
			
 
				+        </div>
			
 
				+        <h4 id="range">分类范围：</h4>
			
 
				+        <div id="rangeDetail">
			
 
				+          <h4>{{ item.categoryName }}</h4>
			
 
				+        </div>
			
 
				+        <h4 id="date">日期：</h4>
			
 
				+        <div id="dateDetail">
			
 
				+          <h4>{{ item.createTime }}</h4>
			
 
				+        </div>
			
 
				+        <br />
			
 
				+        <div id="commentMain">
			
 
				+          <div id="detailTop">
			
 
				+            <h6 id="nameDetail">{{ item.userName }}</h6>
			
 
				+            <h6 id="createTime" class="bigTime">{{ item.createTime }}</h6>
			
 
				+            <!-- <h6 id="reply" @click="replyPrompt($event, item.id)">回复</h6> -->
			
 
				+
			
 
				+            <br />
			
 
				+            <h4 id="commentContext">{{ item.content }}</h4>
			
 
				+            <div></div>
			
 
				+            <hr />
			
 
				+            <!-- TODO:回复楼 -->
			
 
				+            <div id="replyMsg" v-for="item2 in item.children">
			
 
				+              <h6 id="nameDetail">{{ item2.username }}</h6>
			
 
				+              <h6 id="nameDetail" class="textReply">回复</h6>
			
 
				+              <h6 id="nameDetail" class="theBoss">
			
 
				+                {{ item2.toCommentUserName }}
			
 
				+              </h6>
			
 
				+              <h6 id="createTime" class="littleTime">{{ item2.createTime }}</h6>
			
 
				+              <h6 id="reply" class="littleReply" @click="replyPrompt($event, item.id)">
			
 
				+                回复
			
 
				+              </h6>
			
 
				+              <br />
			
 
				+              <h6 class="replyContext">{{ item2.content }}</h6>
			
 
				+              <hr id="replyHr" />
			
 
				+            </div>
			
 
				+
			
 
				+            <br />
			
 
				+            <div class="showReply" id="replyMsg" v-if="visualFlag">
			
 
				+              <input type="text" /><input type="button" value="发布" @click="addComoment" />
			
 
				+            </div>
			
 
				+          </div>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <nav v-if="total * 1" style="text-align: -webkit-center">
			
 
				+      <el-pagination :total="total" :page-size="pageSize" :current-page="pageNum" :page-sizes="pageSizes"
			
 
				+        :loading="loading" layout="prev, pager, next" @size-change="handleSizeChange"
			
 
				+        @current-change="handleCurrentChange" />
			
 
				+    </nav>
			
 
				+    
			
 
				+    <div v-if="!(this.total * 1)">
			
 
				+      <img id="noImg" src="../img/noContent.png" />
			
 
				+      <h4>没有关于你的评价....</h4>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+  <div class="clear"></div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { BossComment, userInfo, Comment } from "@/api";
			
 
				+import { ZoomOut } from "@element-plus/icons-vue";
			
 
				+import popmessage from "@/components/tip/index.js";
			
 
				+export default {
			
 
				+  name: "MyComment",
			
 
				+  created() {
			
 
				+    if (localStorage.getItem("token")) {
			
 
				+      this.token = localStorage.getItem("token");
			
 
				+    }
			
 
				+    this.init()
			
 
				+  },
			
 
				+  data() {
			
 
				+    return {
			
 
				+      token: '',
			
 
				+      visualFlag: false,
			
 
				+      total: 0,
			
 
				+      serverId: '',
			
 
				+      pageNum: 1,
			
 
				+      pageSize: 4,
			
 
				+      rows: [],
			
 
				+      queryList: {
			
 
				+        orderId: '',
			
 
				+        userId: '',
			
 
				+        content: ''
			
 
				+      },
			
 
				+      pageSizes: [10, 20, 50, 100] // 分页下拉框选项
			
 
				+    };
			
 
				+  },
			
 
				+  components: {
			
 
				+    ZoomOut,
			
 
				+  },
			
 
				+
			
 
				+  methods: {
			
 
				+    init() {
			
 
				+      userInfo().then((response) => {
			
 
				+        if (response.data.code === 200) {
			
 
				+          this.serverId = response.data.data.id;
			
 
				+          this.queryList.userId = response.data.data.id
			
 
				+          this.showComment()
			
 
				+        } else {
			
 
				+          alert("获取用户id失败");
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+    showComment() {
			
 
				+      const params = {
			
 
				+        userId: this.serverId,
			
 
				+        pageNum: this.pageNum,
			
 
				+        pageSize: this.pageSize,
			
 
				+      };
			
 
				+      // 查询用户评论
			
 
				+      BossComment(params).then((response) => {
			
 
				+        if (response.data.code === 200) {
			
 
				+          console.log(response.data.data)
			
 
				+          this.rows = response.data.data.rows;
			
 
				+          this.total = parseInt(response.data.data.total);
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+    // 添加评论
			
 
				+    addComoment() {
			
 
				+      let params = {
			
 
				+        orderId: this.queryList.orderId,
			
 
				+        userId: this.queryList.userId,
			
 
				+        content: this.queryList.content
			
 
				+      }
			
 
				+      Comment(params).then(res => {
			
 
				+        if (res.data.code === 200) {
			
 
				+          console.log('评论成功')
			
 
				+          popmessage({ type: "success", str: "发布成功" });
			
 
				+        }
			
 
				+      })
			
 
				+      setTimeout(() => {
			
 
				+        this.visualFlag = false
			
 
				+      }, 200);
			
 
				+    },
			
 
				+    //回复弹窗
			
 
				+    replyPrompt(e, id) {
			
 
				+      this.visualFlag = true
			
 
				+      this.queryList.orderId = id
			
 
				+    },
			
 
				+    // 改变分页大小事件
			
 
				+    handleSizeChange(val) {
			
 
				+      this.pageSize = val
			
 
				+      this.init()
			
 
				+    },
			
 
				+    handleCurrentChange(val) {
			
 
				+      // 分页数改变事件
			
 
				+      this.pageNum = val
			
 
				+      this.init()
			
 
				+    },
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+<style scoped>
			
 
				+.right {
			
 
				+  width: 59rem;
			
 
				+  background-color: rgb(255, 255, 255);
			
 
				+  /* top: 1rem; */
			
 
				+  /* left: 24rem; */
			
 
				+  border: 1px solid gray;
			
 
				+  border-radius: 10px;
			
 
				+  display: inline-block;
			
 
				+  margin: 0;
			
 
				+  margin-left: 25rem;
			
 
				+  float: left;
			
 
				+  margin-top: -43.5rem;
			
 
				+}
			
 
				+
			
 
				+.showTitle {
			
 
				+  position: relative;
			
 
				+  width: 100%;
			
 
				+  height: 3rem;
			
 
				+  border-bottom: 1px solid rgb(165, 162, 162);
			
 
				+  box-sizing: border-box;
			
 
				+  text-align: start;
			
 
				+  padding-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+.showTitle h2 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+}
			
 
				+
			
 
				+/* 评价表 */
			
 
				+#commentTitle {
			
 
				+  /*   position: absolute; */
			
 
				+  margin: 0 auto;
			
 
				+  padding: 0;
			
 
				+  margin-top: 2rem;
			
 
				+  background-color: #f5f5f5;
			
 
				+  text-align: left;
			
 
				+  width: 85%;
			
 
				+  border-radius: 1rem;
			
 
				+}
			
 
				+
			
 
				+#commentTitle h4 {
			
 
				+  display: inline-block;
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+}
			
 
				+
			
 
				+#commentTitle #order {
			
 
				+  margin-left: 1rem;
			
 
				+  margin-top: 2rem;
			
 
				+}
			
 
				+
			
 
				+#commentTitle #detail {
			
 
				+  margin-left: 3em;
			
 
				+  color: #4c96b3;
			
 
				+}
			
 
				+
			
 
				+#commentTitle #date {
			
 
				+  margin-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+#commentTitle div {
			
 
				+  display: inline-block;
			
 
				+  /*   background-color: aqua; */
			
 
				+  position: relative;
			
 
				+  top: 0.3rem;
			
 
				+}
			
 
				+
			
 
				+#commentTitle #orderDetail {
			
 
				+  width: 8rem;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+
			
 
				+#commentTitle #range {
			
 
				+  margin-left: 0rem;
			
 
				+}
			
 
				+
			
 
				+#commentTitle #rangeDetail {
			
 
				+  top: 0.2rem;
			
 
				+  width: 4.5rem;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+
			
 
				+.bigTime {
			
 
				+  margin-left: 0rem !important;
			
 
				+}
			
 
				+
			
 
				+#commentTitle #dateDetail {
			
 
				+  position: relative;
			
 
				+  top: 0.3rem;
			
 
				+  width: 11rem;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+
			
 
				+#commentMain {
			
 
				+  background-color: #fdfdfd;
			
 
				+  margin: 0 auto;
			
 
				+  margin-left: 0.5rem;
			
 
				+  width: 98%;
			
 
				+  border-radius: 1rem;
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+#commentMain h6 {
			
 
				+  /*  background-color: #4c96b3; */
			
 
				+  color: #726f6f;
			
 
				+  font-size: 0.8rem;
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+  display: inline-block;
			
 
				+  margin-left: 1.5rem;
			
 
				+}
			
 
				+
			
 
				+#commentMain #nameDetail {
			
 
				+  width: 6rem;
			
 
				+  overflow: hidden;
			
 
				+  margin-top: 1rem;
			
 
				+}
			
 
				+
			
 
				+#commentMain #createTime {
			
 
				+  overflow: hidden;
			
 
				+  width: 11rem;
			
 
				+}
			
 
				+
			
 
				+#commentMain #reply {
			
 
				+  cursor: pointer;
			
 
				+  margin-left: 26rem;
			
 
				+}
			
 
				+
			
 
				+#commentMain hr {
			
 
				+  display: block;
			
 
				+  width: 95%;
			
 
				+  unicode-bidi: isolate;
			
 
				+  margin-block-start: 0.5em;
			
 
				+  margin-block-end: 0.5em;
			
 
				+  margin-inline-start: auto;
			
 
				+  margin-inline-end: auto;
			
 
				+  overflow: hidden;
			
 
				+  border-style: inset;
			
 
				+  border-width: 1px;
			
 
				+}
			
 
				+
			
 
				+#commentMain #commentContext {
			
 
				+  margin-top: 0.5rem;
			
 
				+  margin-left: 2rem;
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+/* #CommentMSg :nth-child(3) {
			
 
				+  margin-bottom: 5rem;
			
 
				+} */
			
 
				+::v-deep .el-pagination {
			
 
				+  --el-pagination-font-size: 14px;
			
 
				+  --el-pagination-bg-color: var(--el-fill-color-blank);
			
 
				+  --el-pagination-text-color: var(--el-text-color-primary);
			
 
				+  --el-pagination-border-radius: 2px;
			
 
				+  --el-pagination-button-color: var(--el-text-color-primary);
			
 
				+  --el-pagination-button-width: 32px;
			
 
				+  --el-pagination-button-height: 32px;
			
 
				+  --el-pagination-button-disabled-color: var(--el-text-color-placeholder);
			
 
				+  --el-pagination-button-disabled-bg-color: var(--el-fill-color-blank);
			
 
				+  --el-pagination-button-bg-color: var(--el-fill-color);
			
 
				+  --el-pagination-hover-color: var(--el-color-primary);
			
 
				+  --el-pagination-font-size-small: 12px;
			
 
				+  --el-pagination-button-width-small: 24px;
			
 
				+  --el-pagination-button-height-small: 24px;
			
 
				+  --el-pagination-item-gap: 16px;
			
 
				+  white-space: nowrap;
			
 
				+  color: var(--el-pagination-text-color);
			
 
				+  font-size: var(--el-pagination-font-size);
			
 
				+  font-weight: 400;
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  margin-top: 2rem;
			
 
				+  margin-bottom: 3rem;
			
 
				+  justify-content: center;
			
 
				+  /*   position: fixed;
			
 
				+  top: 56rem;
			
 
				+  left: 11rem; */
			
 
				+}
			
 
				+
			
 
				+/* 回复 */
			
 
				+.right #replyMsg {
			
 
				+  /*   display: none; */
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+input[type="button"] {
			
 
				+  background-color: #409eff;
			
 
				+  width: 6rem;
			
 
				+  height: 2rem;
			
 
				+  border-radius: 1rem;
			
 
				+
			
 
				+  right: 2rem;
			
 
				+  border: none;
			
 
				+
			
 
				+  color: white;
			
 
				+  text-align: center;
			
 
				+  letter-spacing: 0.3rem;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+#replyMsg input[type="text"] {
			
 
				+  width: 22rem;
			
 
				+  height: 1.7rem;
			
 
				+  font-size: 1.2rem;
			
 
				+  margin-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+/* 回复小框内容 */
			
 
				+.right #detailTop .textReply {
			
 
				+  margin-left: -1rem;
			
 
				+}
			
 
				+
			
 
				+.right #detailTop .theBoss {
			
 
				+  margin-left: -2rem;
			
 
				+}
			
 
				+
			
 
				+.right #detailTop .littleReply {
			
 
				+  margin-left: 14rem !important;
			
 
				+  padding-right: 2rem !important;
			
 
				+}
			
 
				+
			
 
				+.right #detailTop .replyContext {
			
 
				+  color: #282727;
			
 
				+  font-size: 1rem;
			
 
				+  margin-top: 1rem !important;
			
 
				+}
			
 
				+
			
 
				+.right #detailTop .replyHr {}
			
 
				+
			
 
				+.right #detailTop #replyMsg {
			
 
				+  padding-left: 4rem;
			
 
				+}
			
 
				+
			
 
				+.right #detailTop #replyMsg h6 {
			
 
				+  margin-top: 0rem;
			
 
				+}
			
 
				+
			
 
				+.right #detailTop .littleTime {
			
 
				+  margin-left: -1rem;
			
 
				+}
			
 
				+
			
 
				+/* 缺省页 */
			
 
				+#noImg {
			
 
				+  width: 26rem;
			
 
				+  margin-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+/* 清除浮动 */
			
 
				+.clear {
			
 
				+  clear: both;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/BossPerCent/PerRight/MyOrder/img/noContent.png
+++ b/src/views/BossPerCent/PerRight/MyOrder/img/noContent.png
--- a/src/views/BossPerCent/PerRight/MyOrder/index.vue
+++ b/src/views/BossPerCent/PerRight/MyOrder/index.vue
@@ -0,0 +1,576 @@
 
				+<template>
			
 
				+  <div class="right">
			
 
				+    <div class="showTitle">
			
 
				+      <el-icon>
			
 
				+        <document />
			
 
				+      </el-icon>
			
 
				+      <h2>我的订单</h2>
			
 
				+    </div>
			
 
				+    <div id="topNav">
			
 
				+      <h2 @click="orderChoose($event, '全部')">全部</h2>
			
 
				+      <h2 @click="orderChoose($event, '未支付')">未支付</h2>
			
 
				+      <h2 @click="orderChoose($event, '服务中')">服务中</h2>
			
 
				+      <h2 @click="orderChoose($event, '已完成')">已完成</h2>
			
 
				+      <h2 @click="orderChoose($event, '已取消')">已取消</h2>
			
 
				+    </div>
			
 
				+    <hr id="hr1" />
			
 
				+    <div id="choseMsg" class="statusMsg" v-for="item in this.list" :key="item.id">
			
 
				+      <div id="topContent">
			
 
				+        <label>订单号:</label>
			
 
				+        <label class="orderId">{{ item.id }}</label>
			
 
				+        <label>创建时间:</label>
			
 
				+        <label class="orderId">{{ item.createTime }}</label>
			
 
				+        <img id="statusImg" src="../../img/status.png" />
			
 
				+        <label id="statusSpan">{{ item.status }}</label>
			
 
				+      </div>
			
 
				+      <hr class="hr tophr" />
			
 
				+      <span>家政人员:</span>
			
 
				+      <input disabled v-model="item.serverName" class="theIn" type="text" />
			
 
				+
			
 
				+      <span class="rightSpan">分类范围:</span>
			
 
				+      <input disabled v-model="item.categoryName" class="theIn" type="text" />
			
 
				+      <br />
			
 
				+      <span>联系方式:</span>
			
 
				+      <input disabled v-model="item.serverPhone" class="theIn" type="text" />
			
 
				+      <span class="rightSpan">聘请类别:</span>
			
 
				+      <input disabled v-model="item.serverType" class="theIn" type="text" />
			
 
				+      <br />
			
 
				+      <span id="totalPrice" class="rightSpan">总价:</span>
			
 
				+      <input disabled v-model="item.totalPrice" class="theIn" type="text" />
			
 
				+
			
 
				+      <span class="rightSpan">服务时间</span>
			
 
				+      <input disabled v-model="item.serverTime" class="theIn" type="text" />
			
 
				+      <br />
			
 
				+      <span id="note">备注：</span>
			
 
				+      <textarea disabled v-model="item.treatment"></textarea>
			
 
				+      <div v-if="item.status == this.unpaid">
			
 
				+        <hr class="hr" />
			
 
				+        <input class="firstBotton" type="button" @click="convertMsg($event, item)" value="去支付" />
			
 
				+        <input class="secondBotton" type="button" @click="convertMsg($event, item)" value="取消订单" />
			
 
				+      </div>
			
 
				+
			
 
				+      <div v-if="item.status == this.serving">
			
 
				+        <hr class="hr" />
			
 
				+        <input class="threeBotton" type="button" @click="convertMsg($event, item)" value="服务完成" />
			
 
				+      </div>
			
 
				+      <div v-if="item.status == this.finished">
			
 
				+        <el-input v-if="compare(item.comment)" class="commentInput" v-model="item.comment" disabled="true"></el-input>
			
 
				+        <el-input v-else class="commentInput" v-model="queryList.content" placeholder="请输入评价"></el-input>
			
 
				+        <input class="commentButton" v-if="compare(item.comment)" type="button" value="已完成" />
			
 
				+        <input class="commentButton" v-else type="button" @click="addComment(item.id)" value="发表评价" />
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <nav v-if="this.getTotal * 1" style="text-align: -webkit-center">
			
 
				+      <el-pagination :page-size="this.getCurrentPageSize" style="width: max-content" :current-page="this.getCurrentPage"
			
 
				+        @current-change="handleCurrentChange" layout="prev, pager, next" :total="this.getTotal * 1" />
			
 
				+    </nav>
			
 
				+    <div v-if="!(this.getTotal * 1)">
			
 
				+      <img id="noImg" src="./img/noContent.png" />
			
 
				+      <h4>没有订单信息....</h4>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+  <div class="clear"></div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import {
			
 
				+  getBossOrder,
			
 
				+  cancelOrderById,
			
 
				+  Comment,
			
 
				+  finishOrder,
			
 
				+  toPay,
			
 
				+} from "@/api";
			
 
				+import {
			
 
				+  Menu as IconMenu,
			
 
				+  ArrowDownBold,
			
 
				+  ArrowUpBold,
			
 
				+} from "@element-plus/icons-vue";
			
 
				+import { mapMutations,mapGetters } from 'vuex'
			
 
				+import popmessage from "@/components/tip/index.js";
			
 
				+export default {
			
 
				+  name: "MyOrder",
			
 
				+  data() {
			
 
				+    return {
			
 
				+      queryList: {
			
 
				+        orderId: '',
			
 
				+        userId: '',
			
 
				+        content: ''
			
 
				+      },
			
 
				+      commentList: [],
			
 
				+      vaule1: '',
			
 
				+      unpaid: "未支付",
			
 
				+      serving: "服务中",
			
 
				+      finished: "已完成",
			
 
				+      list: [],
			
 
				+    };
			
 
				+  },
			
 
				+  computed: {
			
 
				+    ...mapGetters("OrderStore", ['getCurrentPageSize', 'getCurrentPage', 'getStatus', 'getTotal'])
			
 
				+  },
			
 
				+  methods: {
			
 
				+    ...mapMutations("OrderStore", ['changePageNum', 'setTotal', 'setStatus']),
			
 
				+    //筛选订单
			
 
				+    orderChoose(e, s) {
			
 
				+      for (
			
 
				+        let index = 0;
			
 
				+        index < e.currentTarget.parentNode.children.length;
			
 
				+        index++
			
 
				+      ) {
			
 
				+        e.currentTarget.parentNode.children[index].style.color = "black";
			
 
				+      }
			
 
				+      e.currentTarget.style.color = "#409eff";
			
 
				+      this.setStatus(s)
			
 
				+      this.init()
			
 
				+    },
			
 
				+    addComment(id) {
			
 
				+      // 实现评论接口
			
 
				+      let params = {
			
 
				+        orderId: id,
			
 
				+        userId: this.queryList.userId,
			
 
				+        content: this.queryList.content
			
 
				+      }
			
 
				+      Comment(params).then(res => {
			
 
				+        if (res.data.code === 200) {
			
 
				+          popmessage({ type: "success", str: "发表成功" });
			
 
				+          this.init()
			
 
				+        }
			
 
				+      })
			
 
				+      this.queryList.orderId = ''
			
 
				+    },
			
 
				+    // 查看是否有评价字段
			
 
				+    compare(comment) {
			
 
				+      if (comment !== undefined) {
			
 
				+        return true 
			
 
				+      } else {
			
 
				+        return false
			
 
				+      }
			
 
				+    },
			
 
				+    // 确定订单状态
			
 
				+    convertMsg(e, list) {
			
 
				+      this.queryList.orderId = list.id
			
 
				+      let msg = e.currentTarget.value
			
 
				+      if (msg === '去支付') {
			
 
				+        // 跳转支付页面
			
 
				+        let parmas = {
			
 
				+          orderId: list.id
			
 
				+        }
			
 
				+        toPay(parmas).then(response => {
			
 
				+          if (response.data.code === 200) {
			
 
				+            const payNo = response.data.data
			
 
				+            const url =
			
 
				+              "http://localhost:7777/user/pay/requestPay?payNo=" +
			
 
				+              payNo;
			
 
				+            window.open(url);
			
 
				+            this.$router.go(0)
			
 
				+          }
			
 
				+        })
			
 
				+      } else if (msg === '取消订单') {
			
 
				+        let params = {
			
 
				+          orderId: list.id
			
 
				+        }
			
 
				+        cancelOrderById(params).then(res => {
			
 
				+          if (res.data.code === 200) {
			
 
				+            popmessage({ type: "success", str: "取消成功" });
			
 
				+            this.init()
			
 
				+          } else if (res.data.code === 611) {
			
 
				+            popmessage({ type: "error", str: "取消失败，请联系管理员" });
			
 
				+          }
			
 
				+        })
			
 
				+      } else if (msg === '服务完成') {
			
 
				+        let params = {
			
 
				+          orderId: this.queryList.orderId
			
 
				+        }
			
 
				+        finishOrder(params).then(response => {
			
 
				+          if (response.data.code === 200) {
			
 
				+            popmessage({ type: "success", str: "完成服务" });
			
 
				+            this.init()
			
 
				+          }
			
 
				+        })
			
 
				+      }
			
 
				+    },
			
 
				+    ...mapMutations("PerCent", ["convertIndex"]),
			
 
				+    handleCurrentChange(val) {
			
 
				+      this.changePageNum(val)
			
 
				+      this.init()
			
 
				+    },
			
 
				+    init() {
			
 
				+      const parmas = {
			
 
				+        orderStatus: this.getStatus,
			
 
				+        pageNum: this.getCurrentPage,
			
 
				+        pageSize: this.getCurrentPageSize,
			
 
				+      };
			
 
				+      getBossOrder(parmas).then((response) => {
			
 
				+        if (response.data.code === 200) {
			
 
				+          this.list = response.data.data.rows;
			
 
				+          this.setTotal(parseInt(response.data.data.total))
			
 
				+          this.queryList.userId = response.data.data.rows[0].userId
			
 
				+        }
			
 
				+      });
			
 
				+    }
			
 
				+  },
			
 
				+  created() {
			
 
				+    this.init()
			
 
				+  },
			
 
				+  components: {
			
 
				+    IconMenu,
			
 
				+    ArrowUpBold,
			
 
				+    ArrowDownBold,
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+<style scoped>
			
 
				+.commentInput[disabled]{
			
 
				+  font-size: 30dp;
			
 
				+  font-weight: bold;
			
 
				+  color: black;
			
 
				+}
			
 
				+.right {
			
 
				+  width: 59rem;
			
 
				+  background-color: rgb(255, 255, 255);
			
 
				+  /* top: 1rem; */
			
 
				+  /* left: 24rem; */
			
 
				+  border: 1px solid gray;
			
 
				+  border-radius: 10px;
			
 
				+  display: inline-block;
			
 
				+  margin: 0;
			
 
				+  margin-left: 25rem;
			
 
				+  float: left;
			
 
				+  margin-top: -43.5rem;
			
 
				+}
			
 
				+
			
 
				+.showTitle {
			
 
				+  position: relative;
			
 
				+  width: 100%;
			
 
				+  height: 3rem;
			
 
				+  border-bottom: 1px solid rgb(165, 162, 162);
			
 
				+  box-sizing: border-box;
			
 
				+  text-align: start;
			
 
				+  padding-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+.showTitle h2 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+}
			
 
				+
			
 
				+#topNav {
			
 
				+  text-align: left;
			
 
				+}
			
 
				+
			
 
				+#hr1 {
			
 
				+  border-width: 0.15rem;
			
 
				+}
			
 
				+
			
 
				+#topNav h2 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.2rem;
			
 
				+  font-weight: 400;
			
 
				+  padding: 0;
			
 
				+  margin: 0;
			
 
				+  margin-left: 2rem;
			
 
				+  margin-top: 1rem;
			
 
				+  margin-bottom: 1rem;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+#topNav :first-child {
			
 
				+  color: #409eff;
			
 
				+}
			
 
				+
			
 
				+#serveArea {
			
 
				+  margin-bottom: 2rem;
			
 
				+}
			
 
				+
			
 
				+#tipsMsg {
			
 
				+  transition: all 0.4s ease;
			
 
				+  display: none;
			
 
				+  height: auto;
			
 
				+  padding-left: 2rem;
			
 
				+  padding-bottom: 1rem;
			
 
				+  padding-top: 1.5rem;
			
 
				+}
			
 
				+
			
 
				+#arrow {
			
 
				+  padding-left: 46rem !important;
			
 
				+}
			
 
				+
			
 
				+/* 填写信息样式
			
 
				+ */
			
 
				+#choseMsg {
			
 
				+  width: 90%;
			
 
				+  border: 1px solid rgb(112, 110, 110);
			
 
				+  border-radius: 2rem;
			
 
				+  text-align: start;
			
 
				+  margin: 0 auto;
			
 
				+  margin-top: 2rem;
			
 
				+  padding-left: 2.5rem;
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+#choseMsg span {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.2rem;
			
 
				+  font-weight: 400;
			
 
				+  padding-right: 1rem;
			
 
				+  margin-top: 1rem;
			
 
				+}
			
 
				+
			
 
				+#choseMsg select {
			
 
				+  width: 7rem;
			
 
				+  height: 1.7em;
			
 
				+  font-size: 1rem;
			
 
				+  margin-top: 1rem;
			
 
				+  margin-right: 3rem;
			
 
				+}
			
 
				+
			
 
				+#choseMsg .theIn {
			
 
				+  width: 17rem;
			
 
				+  height: 1.6rem;
			
 
				+  border: none;
			
 
				+  font-size: 1.1rem;
			
 
				+}
			
 
				+
			
 
				+#choseMsg input {
			
 
				+  height: 1rem;
			
 
				+  margin-top: 1rem;
			
 
				+}
			
 
				+
			
 
				+#emType {
			
 
				+  margin-left: 5.5rem;
			
 
				+}
			
 
				+
			
 
				+#contact {
			
 
				+  margin-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+#residence {
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+#salaryIn {
			
 
				+  width: 3rem;
			
 
				+  margin-left: -1rem;
			
 
				+  margin-right: 0.5rem;
			
 
				+}
			
 
				+
			
 
				+#salary {
			
 
				+  margin-left: 4.4rem;
			
 
				+}
			
 
				+
			
 
				+/* 
			
 
				+我的状态 */
			
 
				+#myStatus {
			
 
				+  padding: 0;
			
 
				+  margin: 0;
			
 
				+  text-align: start;
			
 
				+  margin-top: 2rem;
			
 
				+}
			
 
				+
			
 
				+#myStatus #statusTitle {
			
 
				+  margin-left: 3rem;
			
 
				+  font-size: 1.2rem;
			
 
				+  font-weight: 700;
			
 
				+}
			
 
				+
			
 
				+#statusRight {
			
 
				+  display: inline-block;
			
 
				+  height: 3rem;
			
 
				+  width: auto;
			
 
				+  overflow: hidden;
			
 
				+  background-color: aqua;
			
 
				+  margin: 0 auto;
			
 
				+  margin-bottom: 0;
			
 
				+  margin-left: 9rem;
			
 
				+}
			
 
				+
			
 
				+#statusRight img {}
			
 
				+
			
 
				+#msgStatus {
			
 
				+  margin-left: 1rem;
			
 
				+  font-weight: 600;
			
 
				+}
			
 
				+
			
 
				+#private {
			
 
				+  margin-left: 42rem;
			
 
				+  font-weight: 500;
			
 
				+  display: inline-block;
			
 
				+  padding-right: 1rem;
			
 
				+  margin-bottom: 2rem;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-cascader .el-input {
			
 
				+  display: flex;
			
 
				+  cursor: pointer;
			
 
				+  border: 1px solid black;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-input__wrapper {
			
 
				+  display: inline-flex;
			
 
				+  flex-grow: 1;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+  padding: 1px 11px;
			
 
				+  background-color: var(--el-input-bg-color, var(--el-fill-color-blank));
			
 
				+  background-image: none;
			
 
				+  border-radius: 0;
			
 
				+  transition: var(--el-transition-box-shadow);
			
 
				+  box-shadow: 0 0 0 1px var(--el-input-border-color, var(--el-border-color)) inset;
			
 
				+}
			
 
				+
			
 
				+#areaStyle {
			
 
				+  width: 15rem;
			
 
				+  margin-left: 0.1rem;
			
 
				+  height: 1.3rem !important;
			
 
				+  vertical-align: inherit;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-input__wrapper {
			
 
				+  display: inline-flex;
			
 
				+  flex-grow: 1;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+  padding: 1px 11px;
			
 
				+  background-image: none;
			
 
				+  border-radius: var(--el-input-border-radius, var(--el-border-radius-base));
			
 
				+  transition: var(--el-transition-box-shadow);
			
 
				+}
			
 
				+
			
 
				+#topContent {
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+  text-align: left;
			
 
				+}
			
 
				+
			
 
				+#topContent label {
			
 
				+  font-size: 1.1rem;
			
 
				+  margin-top: 1rem;
			
 
				+}
			
 
				+
			
 
				+.hr {
			
 
				+  position: absolute;
			
 
				+  left: 29rem;
			
 
				+  width: 55rem;
			
 
				+}
			
 
				+
			
 
				+/* 备注 */
			
 
				+textarea {
			
 
				+  resize: none;
			
 
				+  width: 82%;
			
 
				+  height: 4rem;
			
 
				+  border: none;
			
 
				+  /* outline: none; */
			
 
				+  color: rgb(63, 62, 62);
			
 
				+  font-size: 0.8rem;
			
 
				+  font-weight: bold;
			
 
				+  margin-top: -1rem;
			
 
				+  /* border: none; */
			
 
				+  margin-left: 6.3rem;
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+/* 状态图片 */
			
 
				+#statusImg {
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+  width: 3%;
			
 
				+  height: auto;
			
 
				+}
			
 
				+
			
 
				+/* 订单头部 */
			
 
				+.orderId {
			
 
				+  width: 18rem;
			
 
				+  text-align: left;
			
 
				+  padding: 0.2rem;
			
 
				+  display: inline-block;
			
 
				+}
			
 
				+
			
 
				+/* 雇主 */
			
 
				+#employer {
			
 
				+  margin-right: 2.2rem;
			
 
				+}
			
 
				+
			
 
				+.rightSpan {
			
 
				+  margin-left: 3.5rem;
			
 
				+  text-align: start;
			
 
				+}
			
 
				+
			
 
				+/* 
			
 
				+总价 */
			
 
				+#totalPrice {
			
 
				+  margin-right: 2.5rem;
			
 
				+  margin-left: 0rem;
			
 
				+}
			
 
				+
			
 
				+/* 备注 */
			
 
				+#note {
			
 
				+  position: relative;
			
 
				+  top: 0.1rem;
			
 
				+  left: 0.2rem;
			
 
				+}
			
 
				+
			
 
				+#statusSpan {
			
 
				+  vertical-align: text-bottom;
			
 
				+  margin-left: 0.3rem;
			
 
				+}
			
 
				+
			
 
				+/* 按钮 */
			
 
				+.firstBotton {
			
 
				+  margin-left: 38rem;
			
 
				+}
			
 
				+
			
 
				+input[type="button"] {
			
 
				+  margin-top: 0.2rem;
			
 
				+  background-color: #409eff;
			
 
				+  width: 6rem;
			
 
				+  height: 2rem !important;
			
 
				+  border-radius: 1rem;
			
 
				+  display: inline-block;
			
 
				+  right: 2rem;
			
 
				+  border: none;
			
 
				+  margin-right: 1rem;
			
 
				+  color: white;
			
 
				+  letter-spacing: 0.1rem;
			
 
				+  cursor: pointer;
			
 
				+  margin-bottom: 0.7rem;
			
 
				+  font-weight: 500;
			
 
				+}
			
 
				+
			
 
				+.secondBotton {
			
 
				+  background-color: white !important;
			
 
				+  border: 1px solid black !important;
			
 
				+  color: black !important;
			
 
				+}
			
 
				+
			
 
				+.threeBotton {
			
 
				+  margin-left: 45rem !important;
			
 
				+}
			
 
				+
			
 
				+.commentButton {
			
 
				+  margin-left: 45rem;
			
 
				+}
			
 
				+
			
 
				+.refund {
			
 
				+  margin-left: 45rem;
			
 
				+}
			
 
				+
			
 
				+.tophr {
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+/* 缺省页 */
			
 
				+#noImg {
			
 
				+  width: 25rem;
			
 
				+}
			
 
				+
			
 
				+/* 
			
 
				+清除浮动 */
			
 
				+.clear {
			
 
				+  clear: both;
			
 
				+}
			
 
				+
			
 
				+/* 分页按钮 */
			
 
				+#pagination {
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/BossPerCent/PerRight/img/noContent.png
+++ b/src/views/BossPerCent/PerRight/img/noContent.png
--- a/src/views/BossPerCent/PerRight/index.vue
+++ b/src/views/BossPerCent/PerRight/index.vue
@@ -0,0 +1,33 @@
 
				+<template>
			
 
				+  <BasicInfo v-if="this.showBasic"></BasicInfo>
			
 
				+  <ConvertPwd v-if="this.showPwd"></ConvertPwd>
			
 
				+  <MyComment v-if="this.showComment"></MyComment>
			
 
				+  <MyOrder v-if="this.showOrder"></MyOrder>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { mapState } from "vuex";
			
 
				+import BasicInfo from "./BasicInfo";
			
 
				+import ConvertPwd from "./ConvertPwd";
			
 
				+import MyComment from "./MyComment";
			
 
				+import MyOrder from "./MyOrder";
			
 
				+export default {
			
 
				+  name: "PerRight",
			
 
				+  components: {
			
 
				+    BasicInfo,
			
 
				+    MyComment,
			
 
				+    ConvertPwd,
			
 
				+    MyOrder,
			
 
				+  },
			
 
				+  computed: {
			
 
				+    ...mapState("PerCent", [
			
 
				+      "showBasic",
			
 
				+      "showPwd",
			
 
				+      "showComment",
			
 
				+      "showOrder",
			
 
				+    ]),
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+
			
 
				+<style scoped></style>
			
--- a/src/views/BossPerCent/img/VIP.png
+++ b/src/views/BossPerCent/img/VIP.png
--- a/src/views/BossPerCent/img/becomeServer.png
+++ b/src/views/BossPerCent/img/becomeServer.png
--- a/src/views/BossPerCent/img/status.png
+++ b/src/views/BossPerCent/img/status.png
--- a/src/views/BossPerCent/index.vue
+++ b/src/views/BossPerCent/index.vue
@@ -0,0 +1,39 @@
 
				+<template>
			
 
				+  <div class="background">
			
 
				+    <div class="bigbox">
			
 
				+      <PerLeft></PerLeft>
			
 
				+      <PerRight></PerRight>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import PerLeft from "./PerLeft";
			
 
				+import PerRight from "./PerRight";
			
 
				+
			
 
				+export default {
			
 
				+  name: "BossPerCent",
			
 
				+  components: {
			
 
				+    PerRight,
			
 
				+    PerLeft,
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+<style scoped>
			
 
				+.background {
			
 
				+  width: 100%;
			
 
				+  background-color: rgb(237, 244, 237);
			
 
				+  padding-top: 4rem;
			
 
				+  padding-bottom: 4rem;
			
 
				+}
			
 
				+.bigbox {
			
 
				+  background: rgb(255, 255, 255);
			
 
				+  width: 90%;
			
 
				+  left: 50%;
			
 
				+  top: 4rem;
			
 
				+  translate: -50% 0;
			
 
				+  margin-left: 48rem;
			
 
				+  margin-top: 2rem;
			
 
				+  padding: 2rem;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/Introduce/img/3.1回到顶部.png
+++ b/src/views/Introduce/img/3.1回到顶部.png
--- a/src/views/Introduce/img/QR.png
+++ b/src/views/Introduce/img/QR.png
--- a/src/views/Introduce/img/introduce_footer.png
+++ b/src/views/Introduce/img/introduce_footer.png
--- a/src/views/Introduce/img/introduce_footer2.png
+++ b/src/views/Introduce/img/introduce_footer2.png
--- a/src/views/Introduce/img/introduce_head.png
+++ b/src/views/Introduce/img/introduce_head.png
--- a/src/views/Introduce/img/客服.png
+++ b/src/views/Introduce/img/客服.png
--- a/src/views/Introduce/img/微信.png
+++ b/src/views/Introduce/img/微信.png
--- a/src/views/Introduce/index.vue
+++ b/src/views/Introduce/index.vue
@@ -0,0 +1,245 @@
 
				+<template>
			
 
				+  <div class="bogbox">
			
 
				+    <div class="firstpage">
			
 
				+      <img src="./img/introduce_head.png" />
			
 
				+      <!-- <button class="login" @click="Login">立即登录</button> -->
			
 
				+      <button class="button1" @click="Search">找家政</button>
			
 
				+      <button class="button2" @click="convertUserType">做家政</button>
			
 
				+    </div>
			
 
				+    <div class="footer">
			
 
				+      <img src="./img/introduce_footer.png" />
			
 
				+      <img class="QRcode" src="./img/QR.png" />
			
 
				+      <img class="about" src="./img/introduce_footer2.png" />
			
 
				+
			
 
				+      <!--  底部详细信息 -->
			
 
				+      <div class="information">
			
 
				+        <div class="find_infor">
			
 
				+          <p>流程介绍</p>
			
 
				+          <p>挑选家政</p>
			
 
				+        </div>
			
 
				+        <div class="do_infor">
			
 
				+          <p>预约订单</p>
			
 
				+          <p>培训管理</p>
			
 
				+        </div>
			
 
				+        <div class="help_infor">
			
 
				+          <p>使用条款</p>
			
 
				+          <p>服务协议</p>
			
 
				+          <p>收费标准</p>
			
 
				+          <p>关于我们</p>
			
 
				+        </div>
			
 
				+        <div class="contact_infor">
			
 
				+          <p>●电话：</p>
			
 
				+          <p>188 1393××××</p>
			
 
				+          <p>周一至周五</p>
			
 
				+          <br />
			
 
				+          <p>●邮箱：</p>
			
 
				+          <P>智慧家政@163.com</P>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+
			
 
				+    <!-- 侧边导航栏 -->
			
 
				+    <div class="right_nav">
			
 
				+      <div class="service">
			
 
				+        <img src="./img/客服.png" />
			
 
				+        <p>专属客服</p>
			
 
				+      </div>
			
 
				+      <div class="wechat">
			
 
				+        <img class="wechat" src="./img/微信.png" />
			
 
				+        <p>微信咨询</p>
			
 
				+      </div>
			
 
				+      <div @click="go_top" class="to_top">
			
 
				+        <img src="./img/3.1回到顶部.png" />
			
 
				+        <p>回到顶部</p>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: "Introduce",
			
 
				+  data() {
			
 
				+    return {
			
 
				+      isLogin: false,
			
 
				+    };
			
 
				+  },
			
 
				+  created() {
			
 
				+    if (localStorage.getItem("token") && localStorage.getItem("token") != "") {
			
 
				+      this.token = localStorage.getItem("token");
			
 
				+      this.isLogin = true;
			
 
				+    } else this.isLogin = false;
			
 
				+  },
			
 
				+  methods: {
			
 
				+    // Login() {
			
 
				+    //   if (
			
 
				+    //     localStorage.getItem("token") &&
			
 
				+    //     localStorage.getItem("token") != "" &&
			
 
				+    //     localStorage.getItem("token") != "undefined"
			
 
				+    //   ) {
			
 
				+    //     this.token = localStorage.getItem("token");
			
 
				+    //     this.isLogin = true;
			
 
				+    //   } else this.isLogin = false;
			
 
				+
			
 
				+    //   if (!this.isLogin) {
			
 
				+    //     this.$router.push("./loginview");
			
 
				+    //   } else {
			
 
				+    //     alert("已登录，请先退出。");
			
 
				+    //   }
			
 
				+    // },
			
 
				+    // go_top() {
			
 
				+    //   document.documentElement.scrollTop = 0;
			
 
				+    // },
			
 
				+    Search() {
			
 
				+      this.$router.push("./search");
			
 
				+    }
			
 
				+    ,
			
 
				+    convertUserType() {
			
 
				+      let usertype = localStorage.getItem("userType");
			
 
				+      let token = localStorage.getItem("token");
			
 
				+      if (usertype === '0' || token == undefined) {
			
 
				+        if(window.confirm("未登录，请先登录")){
			
 
				+          this.$router.push("/loginView");
			
 
				+        }
			
 
				+      } else {
			
 
				+        if (window.confirm("切换身份需要登出账号,确定要执行此操作吗？")) {
			
 
				+          // 用户点击了“确定”按钮
			
 
				+          Logout().then((res) => {
			
 
				+            if (res.data.code === 200) {
			
 
				+              localStorage.clear()
			
 
				+              delCookie("userId");
			
 
				+              this.isLogin = false;
			
 
				+              this.$router.push("/loginView");
			
 
				+            }
			
 
				+          });
			
 
				+        } else {
			
 
				+          // 用户点击了“取消”按钮
			
 
				+        }
			
 
				+      }
			
 
				+    },
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+
			
 
				+<style scoped>
			
 
				+.firstpage {
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  position: relative;
			
 
				+}
			
 
				+
			
 
				+img {
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+
			
 
				+.button1 {
			
 
				+  position: absolute;
			
 
				+  top: 37.5rem;
			
 
				+  left: 6rem;
			
 
				+  width: 11rem;
			
 
				+  height: 3.5rem;
			
 
				+  background-color: #339966;
			
 
				+  border: 1px solid #339966;
			
 
				+  border-radius: 30px;
			
 
				+  color: aliceblue;
			
 
				+  font-size: 1.2rem;
			
 
				+  font-weight: bolder;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+.button2 {
			
 
				+  position: absolute;
			
 
				+  top: 37.5rem;
			
 
				+  left: 19rem;
			
 
				+  width: 11rem;
			
 
				+  height: 3.5rem;
			
 
				+  background-color: #70a2c1;
			
 
				+  border: 1px solid #70a2c1;
			
 
				+  border-radius: 30px;
			
 
				+  color: aliceblue;
			
 
				+  font-size: 1.2rem;
			
 
				+  font-weight: bolder;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+.footer {
			
 
				+  position: relative;
			
 
				+}
			
 
				+
			
 
				+.QRcode {
			
 
				+  top: 34rem;
			
 
				+  left: 2rem;
			
 
				+  position: absolute;
			
 
				+  width: 15rem;
			
 
				+  height: 15rem;
			
 
				+}
			
 
				+
			
 
				+.about {
			
 
				+  position: absolute;
			
 
				+  top: 27rem;
			
 
				+  left: 23rem;
			
 
				+  width: 64rem;
			
 
				+  height: auto;
			
 
				+}
			
 
				+
			
 
				+.information {
			
 
				+  font-size: 1.2rem;
			
 
				+  color: #608eab;
			
 
				+  letter-spacing: 13px;
			
 
				+  line-height: 1rem;
			
 
				+}
			
 
				+
			
 
				+.find_infor {
			
 
				+  position: absolute;
			
 
				+  top: 33rem;
			
 
				+  left: 25rem;
			
 
				+}
			
 
				+
			
 
				+.do_infor {
			
 
				+  position: absolute;
			
 
				+  top: 33rem;
			
 
				+  left: 42rem;
			
 
				+}
			
 
				+
			
 
				+.help_infor {
			
 
				+  position: absolute;
			
 
				+  top: 33rem;
			
 
				+  left: 58rem;
			
 
				+}
			
 
				+
			
 
				+.contact_infor {
			
 
				+  text-align: left;
			
 
				+  position: absolute;
			
 
				+  top: 33rem;
			
 
				+  left: 75rem;
			
 
				+  letter-spacing: 5px;
			
 
				+}
			
 
				+
			
 
				+.information p {
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+.right_nav {
			
 
				+  width: 4.5rem;
			
 
				+  background-color: rgb(250, 249, 249);
			
 
				+  position: fixed;
			
 
				+  top: 20rem;
			
 
				+  right: 1em;
			
 
				+  border-radius: 10px;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+.right_nav img {
			
 
				+  margin-top: 10px;
			
 
				+  height: 2rem;
			
 
				+  width: auto;
			
 
				+}
			
 
				+
			
 
				+.right_nav {
			
 
				+  transition: 1s;
			
 
				+}
			
 
				+
			
 
				+.right_nav div :hover {
			
 
				+  transform: scale(1.2);
			
 
				+}</style>
			
--- a/src/views/PreCent/PerLeft/index.vue
+++ b/src/views/PreCent/PerLeft/index.vue
@@ -0,0 +1,207 @@
 
				+<template>
			
 
				+  <div class="left">
			
 
				+    <div class="top">
			
 
				+      <div class="headPortrait">
			
 
				+        <input type="file" ref="avatarInput" style="display: none" @change="uploadAvatar" accept="img/png img/jpg" />
			
 
				+        <img @click.native="selectAvatar" :src="this.avatar" title="更换头像" class="upAvatar" />
			
 
				+      </div>
			
 
				+      <div class="message">
			
 
				+        <h2>{{ this.nickName }}</h2>
			
 
				+        <div class="threebox">
			
 
				+          <div @click="changeIndex('0-1')">修改密码</div>
			
 
				+          &nbsp;
			
 
				+        </div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <el-row class="tac">
			
 
				+      <el-col :span="50">
			
 
				+        <el-menu default-active="1-1" class="el-menu-vertical-demo">
			
 
				+          <el-sub-menu index="1">
			
 
				+            <template #title>
			
 
				+              <el-icon>
			
 
				+                <Avatar />
			
 
				+              </el-icon>
			
 
				+              <span>家政人员信息 </span>
			
 
				+            </template>
			
 
				+
			
 
				+            <el-menu-item @click="changeIndex('1-1')" class="second-menu" index="1-1">基础信息
			
 
				+            </el-menu-item>
			
 
				+            <el-menu-item @click="changeIndex('1-2')" class="second-menu" index="1-2">家政经历
			
 
				+            </el-menu-item>
			
 
				+          </el-sub-menu>
			
 
				+          <el-menu-item @click="changeIndex('2')" index="2">
			
 
				+            <el-icon><icon-menu /></el-icon>
			
 
				+            <span>发布状态</span>
			
 
				+          </el-menu-item>
			
 
				+          <el-menu-item @click="changeIndex('3')" index="3">
			
 
				+            <el-icon>
			
 
				+              <document />
			
 
				+            </el-icon>
			
 
				+            <span>我的订单</span>
			
 
				+          </el-menu-item>
			
 
				+          <el-menu-item @click="changeIndex('4')" index="4">
			
 
				+            <el-icon>
			
 
				+              <ZoomOut />
			
 
				+            </el-icon>
			
 
				+            <span>我的评价</span>
			
 
				+          </el-menu-item>
			
 
				+          <el-menu-item @click="showHelp" index="5">
			
 
				+            <el-icon>
			
 
				+              <QuestionFilled />
			
 
				+            </el-icon>
			
 
				+            <span>帮助中心</span>
			
 
				+          </el-menu-item>
			
 
				+        </el-menu>
			
 
				+      </el-col>
			
 
				+    </el-row>
			
 
				+  </div>
			
 
				+</template>
			
 
				+<script>
			
 
				+import {
			
 
				+  Avatar,
			
 
				+  Document,
			
 
				+  Menu as IconMenu,
			
 
				+  Location,
			
 
				+  ZoomOut,
			
 
				+} from "@element-plus/icons-vue";
			
 
				+import { mapState } from "vuex";
			
 
				+import { mapMutations } from "vuex";
			
 
				+import { userInfo, avatarUp } from "@/api";
			
 
				+export default {
			
 
				+  name: "PerLeft",
			
 
				+  data() {
			
 
				+    return {
			
 
				+      nickName: "",
			
 
				+      avatar: "",
			
 
				+      default: '1-1',
			
 
				+    };
			
 
				+  },
			
 
				+  created() {
			
 
				+    this.default = this.defaultIndex
			
 
				+    this.init()
			
 
				+  },
			
 
				+  computed: {
			
 
				+    ...mapState("PerCent", ["showBasic", "showExperience", "defaultIndex"]),
			
 
				+    ...mapState("LoginStore", ["login_name"]),
			
 
				+  },
			
 
				+  components: {
			
 
				+    Avatar,
			
 
				+    Document,
			
 
				+    IconMenu,
			
 
				+    Location,
			
 
				+    ZoomOut,
			
 
				+  },
			
 
				+
			
 
				+  methods: {
			
 
				+    ...mapMutations("PerCent", ["convertIndex"]),
			
 
				+    init() {
			
 
				+      userInfo().then((response) => {
			
 
				+        if ((response.data.code = 200)) {
			
 
				+          this.avatar = response.data.data.avatar;
			
 
				+          this.nickName = response.data.data.nickName;
			
 
				+        } else {
			
 
				+          alert("服务器出错了，请重试!");
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+    selectAvatar() {
			
 
				+      if (confirm('确定要修改头像吗')) {
			
 
				+        // 用户点击了确定按钮
			
 
				+        this.$refs.avatarInput.click();
			
 
				+      } else { }
			
 
				+    },
			
 
				+    uploadAvatar(event) {
			
 
				+      const file = event.target.files[0];
			
 
				+      const formData = new FormData();
			
 
				+      formData.append('img', file);
			
 
				+      if (file !== undefined) {
			
 
				+        avatarUp(formData).then((response) => {
			
 
				+          if (response.data.code === 200) {
			
 
				+            this.init()
			
 
				+            alert("修改头像成功！");
			
 
				+          } else if (response.data.code == 507) {
			
 
				+            alert(response.data.msg);
			
 
				+          } else {
			
 
				+            alert("头像上传失败!");
			
 
				+          }
			
 
				+        });
			
 
				+      }
			
 
				+    },
			
 
				+    changeIndex(i) {
			
 
				+      this.convertIndex(i);
			
 
				+    },
			
 
				+    showHelp() {
			
 
				+      this.$router.push("/UserHelp");
			
 
				+    }
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+
			
 
				+<style scoped>
			
 
				+.left {
			
 
				+  position: absolute;
			
 
				+  top: 2rem;
			
 
				+  left: 4rem;
			
 
				+  border: 1px solid gray;
			
 
				+  border-radius: 10px;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+
			
 
				+.top {
			
 
				+  position: relative;
			
 
				+  width: 100%;
			
 
				+  height: 8rem;
			
 
				+  background-color: rgb(246, 248, 247);
			
 
				+  border-bottom: 1px solid gray;
			
 
				+}
			
 
				+
			
 
				+.headPortrait {
			
 
				+  width: 80px;
			
 
				+  height: 80px;
			
 
				+  background-color: antiquewhite;
			
 
				+  border-radius: 40px;
			
 
				+  position: absolute;
			
 
				+  top: 1rem;
			
 
				+  left: 1rem;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+
			
 
				+.message {
			
 
				+  position: absolute;
			
 
				+  top: 0.5rem;
			
 
				+  left: 9rem;
			
 
				+}
			
 
				+
			
 
				+.message h2 {
			
 
				+  font-size: 1.3rem;
			
 
				+  margin-left: -0.5rem;
			
 
				+}
			
 
				+
			
 
				+.message div {
			
 
				+  border: 0.5px solid rgb(162, 160, 160);
			
 
				+  font-size: 0.7rem;
			
 
				+  margin-left: 0rem;
			
 
				+  display: inline-block;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+.message .threebox {
			
 
				+  border: none;
			
 
				+  margin-left: 1em;
			
 
				+}
			
 
				+
			
 
				+[class*="el-col-"] {
			
 
				+  box-sizing: border-box;
			
 
				+  width: 20rem;
			
 
				+}
			
 
				+
			
 
				+.el-sub-menu .el-menu-item {
			
 
				+  height: var(--el-menu-sub-item-height);
			
 
				+  line-height: var(--el-menu-sub-item-height);
			
 
				+  margin-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+img {
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}</style>
			
--- a/src/views/PreCent/PerRight/BasicInfo/index.vue
+++ b/src/views/PreCent/PerRight/BasicInfo/index.vue
@@ -0,0 +1,367 @@
 
				+<template>
			
 
				+  <div v-if="basicShow" class="right">
			
 
				+    <div class="showTitle">
			
 
				+      <el-icon><Tickets /></el-icon>
			
 
				+      <h2>基本信息</h2>
			
 
				+      <input type="button" @click="convertMsg($event)" value="修改" />
			
 
				+    </div>
			
 
				+    <table class="bigtable">
			
 
				+      <tr>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <el-icon><User /></el-icon>
			
 
				+            <h3>账户名</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input type="text" v-model="this.userName" disabled />
			
 
				+        </td>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <el-icon><Avatar /></el-icon>
			
 
				+            <h3>用户名</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input v-model="this.nickName" type="text" disabled />
			
 
				+        </td>
			
 
				+      </tr>
			
 
				+      <tr>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <el-icon><Clock /></el-icon>
			
 
				+            <h3>年龄</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input type="text" disabled v-model="age" />
			
 
				+        </td>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <el-icon><UserFilled /></el-icon>
			
 
				+            <h3>性别</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td>
			
 
				+          <select id="gender" disabled v-model="this.sex">
			
 
				+            <option value="">请选择</option>
			
 
				+            <option value="1">男</option>
			
 
				+            <option value="2">女</option>
			
 
				+          </select>
			
 
				+        </td>
			
 
				+      </tr>
			
 
				+      <tr>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <el-icon><Iphone /></el-icon>
			
 
				+            <h3>手机号</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input v-model="this.phone" type="text" disabled />
			
 
				+        </td>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <el-icon><Location /></el-icon>
			
 
				+            <h3>地区</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input v-model="this.area" type="text" disabled />
			
 
				+        </td>
			
 
				+      </tr>
			
 
				+    </table>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import {
			
 
				+  Tickets,
			
 
				+  PictureFilled,
			
 
				+  Avatar,
			
 
				+  UserFilled,
			
 
				+  Iphone,
			
 
				+  Location,
			
 
				+  Clock,
			
 
				+  User,
			
 
				+} from "@element-plus/icons-vue";
			
 
				+import { userInfo, convertInfo } from "@/api";
			
 
				+import { mapState, mapMutations } from "vuex";
			
 
				+
			
 
				+/* import $ from 'jquery' */
			
 
				+export default {
			
 
				+  name: "BasicInfo",
			
 
				+  data() {
			
 
				+    return {
			
 
				+      basicShow: true,
			
 
				+      avatar: "https://cube.elemecdn.com/e/fd/0fc7d20532fdaf769a25683617711png.png",
			
 
				+      age: "",
			
 
				+      userName: "",
			
 
				+      nickName: "",
			
 
				+      area: "",
			
 
				+      sex: "",
			
 
				+      phone: "",
			
 
				+    };
			
 
				+  },
			
 
				+  components: {
			
 
				+    User,
			
 
				+    Clock,
			
 
				+    Location,
			
 
				+    Tickets,
			
 
				+    PictureFilled,
			
 
				+    Avatar,
			
 
				+    UserFilled,
			
 
				+    Iphone,
			
 
				+  },
			
 
				+  computed: {
			
 
				+    ...mapState("LoginStore", ["tokenStore","login_name"]),
			
 
				+  },
			
 
				+  created() {
			
 
				+    if (localStorage.getItem("token")) {
			
 
				+      this.token = localStorage.getItem("token");
			
 
				+    }
			
 
				+    this.getInfo()
			
 
				+  },
			
 
				+  methods: {
			
 
				+    ...mapMutations("PerCent", ["convertMsgStore"]),
			
 
				+    ...mapMutations("LoginStore", ["setLoginName"]),
			
 
				+    getInfo(){
			
 
				+      userInfo().then((response) => {
			
 
				+      if (response.data.code === 200) {
			
 
				+        this.age = response.data.data.age;
			
 
				+        this.avatar = response.data.data.avatar;
			
 
				+        this.userName = response.data.data.userName;
			
 
				+        this.nickName = response.data.data.nickName;
			
 
				+        this.area = response.data.data.area;
			
 
				+        this.sex = response.data.data.sex;
			
 
				+        this.phone = response.data.data.phone;
			
 
				+        this.setLoginName(this.userName)
			
 
				+      } else {
			
 
				+        alert("服务器出错了，请重试!");
			
 
				+      }
			
 
				+    });
			
 
				+    },
			
 
				+    validate() {
			
 
				+      const phoneRegx =
			
 
				+        /^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:9[1589]))\d{8}$/;
			
 
				+      let errMsg = "";
			
 
				+
			
 
				+      if (this.age < 18) {
			
 
				+        errMsg = "年龄不能小于18岁<br/>";
			
 
				+      }
			
 
				+      if (!phoneRegx.test(this.phone)) {
			
 
				+        errMsg += "手机号格式不正确<br/>";
			
 
				+      }
			
 
				+      if (errMsg != "") {
			
 
				+        alert(errMsg);
			
 
				+        return false;
			
 
				+      } else {
			
 
				+        return true;
			
 
				+      }
			
 
				+    },
			
 
				+    convertMsg(e) {
			
 
				+      //修改信息
			
 
				+      if (e.currentTarget.getAttribute("value") === "确认修改") {
			
 
				+        const params = {
			
 
				+          age: this.age,
			
 
				+          nickName: this.nickName,
			
 
				+          area: this.area,
			
 
				+          sex: this.sex,
			
 
				+          phone: this.phone,
			
 
				+        };
			
 
				+        if (this.validate()) {
			
 
				+          convertInfo(params).then((response) => {
			
 
				+            if (response.data.code === 200) {
			
 
				+              this.basicShow = false;
			
 
				+              alert("修改成功");
			
 
				+              this.setLoginName(this.nickName);
			
 
				+              this.getInfo()
			
 
				+              this.basicShow = true;
			
 
				+            } else {
			
 
				+              alert("修改失败");
			
 
				+            }
			
 
				+          });
			
 
				+        }
			
 
				+      } //退出修改信息
			
 
				+      else if (e.currentTarget.getAttribute("value") === "修改") {
			
 
				+        const n = document.documentElement
			
 
				+            .getElementsByTagName("table")[0]
			
 
				+          .getElementsByTagName("input").length;
			
 
				+        for (var i = 2; i < n; i++) {
			
 
				+          document.documentElement
			
 
				+            .getElementsByTagName("table")[0]
			
 
				+            .getElementsByTagName("input")[i]
			
 
				+            .removeAttribute("disabled");
			
 
				+        }
			
 
				+        document.documentElement
			
 
				+          .getElementsByTagName("select")[0]
			
 
				+          .removeAttribute("disabled");
			
 
				+        e.currentTarget.setAttribute("value", "确认修改");
			
 
				+      }
			
 
				+    },
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+<style scoped>
			
 
				+.right {
			
 
				+  width: 59rem;
			
 
				+  background-color: rgb(255, 255, 255);
			
 
				+  top: 1rem;
			
 
				+  left: 24rem;
			
 
				+  border: 1px solid gray;
			
 
				+  border-radius: 10px;
			
 
				+  margin-left: 25rem;
			
 
				+}
			
 
				+.showTitle {
			
 
				+  position: relative;
			
 
				+  width: 100%;
			
 
				+  height: 3rem;
			
 
				+  border-bottom: 1px solid rgb(165, 162, 162);
			
 
				+  box-sizing: border-box;
			
 
				+  text-align: start;
			
 
				+  padding-left: 2rem;
			
 
				+}
			
 
				+.showTitle h2 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+}
			
 
				+table {
			
 
				+  width: 95%;
			
 
				+  margin: 0 auto;
			
 
				+  margin-top: 3rem;
			
 
				+  font-size: small;
			
 
				+  font-weight: bolder;
			
 
				+  border-collapse: separate; /* 控制是否合并边框 */
			
 
				+  border-spacing: 0; /* 控制单元格之间的距离 */
			
 
				+  border: solid 2px rgb(215, 215, 215); /*控制外边框*/
			
 
				+  border-radius: 20px;
			
 
				+  overflow: hidden;
			
 
				+  margin-bottom: 8rem;
			
 
				+}
			
 
				+td {
			
 
				+  text-align: left;
			
 
				+  padding: 0.5rem;
			
 
				+  border-top: 1px solid rgb(213, 213, 213);
			
 
				+}
			
 
				+td:last-child,
			
 
				+th:last-child {
			
 
				+  border-right-color: transparent;
			
 
				+}
			
 
				+.title {
			
 
				+  width: 4rem;
			
 
				+  background-color: rgb(245, 245, 245);
			
 
				+  padding-left: 1rem;
			
 
				+  margin: 0;
			
 
				+}
			
 
				+.headPortrait {
			
 
				+  height: 6rem;
			
 
				+}
			
 
				+td,
			
 
				+th {
			
 
				+  border-right: 2px solid rgb(213, 213, 213);
			
 
				+}
			
 
				+
			
 
				+.el-icon {
			
 
				+  --color: inherit;
			
 
				+  height: 1em;
			
 
				+  width: 1em;
			
 
				+  line-height: 1em;
			
 
				+  fill: currentColor;
			
 
				+  color: var(--color);
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+  font-size: large;
			
 
				+}
			
 
				+table td h3 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1rem;
			
 
				+}
			
 
				+table td .el-icon[data-v-7641c14d] {
			
 
				+  --color: inherit;
			
 
				+  height: 1em;
			
 
				+  width: 1em;
			
 
				+  line-height: 1em;
			
 
				+  fill: currentColor;
			
 
				+  color: var(--color);
			
 
				+  font-size: 1.3rem;
			
 
				+  font-size: large;
			
 
				+  display: inline-block;
			
 
				+  position: absolute;
			
 
				+  top: 1.1rem;
			
 
				+  left: -0.2rem;
			
 
				+}
			
 
				+table td div {
			
 
				+  position: relative;
			
 
				+  text-align: justify;
			
 
				+  padding-left: 1rem;
			
 
				+}
			
 
				+input[type="button"] {
			
 
				+  background-color: #409eff;
			
 
				+  width: 6rem;
			
 
				+  height: 2rem;
			
 
				+  border-radius: 1rem;
			
 
				+  position: absolute;
			
 
				+  right: 2rem;
			
 
				+  border: none;
			
 
				+  top: 0.5rem;
			
 
				+  color: white;
			
 
				+  text-align: center;
			
 
				+  letter-spacing: 0.3rem;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+/* 输入框的样式 */
			
 
				+input {
			
 
				+  display: inline-block;
			
 
				+  padding: 0;
			
 
				+  margin: 0;
			
 
				+  width: 90%;
			
 
				+  height: 2rem;
			
 
				+  border: none;
			
 
				+  /* outline: none; */
			
 
				+  color: rgb(63, 62, 62);
			
 
				+  font-size: 1rem;
			
 
				+  font-weight: bold;
			
 
				+}
			
 
				+.input {
			
 
				+  padding: 0;
			
 
				+  padding-left: 0.4rem;
			
 
				+}
			
 
				+table select {
			
 
				+  width: 5rem;
			
 
				+  font-size: 1rem;
			
 
				+  border: none;
			
 
				+}
			
 
				+table select:disabled {
			
 
				+  width: 5rem;
			
 
				+  font-size: 1rem;
			
 
				+  color: black;
			
 
				+  border: none;
			
 
				+  font-weight: bold;
			
 
				+}
			
 
				+
			
 
				+/* 头像样式 */
			
 
				+.avatarParent {
			
 
				+  position: relative;
			
 
				+}
			
 
				+.avatar {
			
 
				+  width: 5rem;
			
 
				+  height: 5rem;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+table input[type="file"] {
			
 
				+  display: none;
			
 
				+  position: absolute;
			
 
				+  top: -1.5rem;
			
 
				+  left: 8rem;
			
 
				+  /*   background-color: #409eff;
			
 
				+  border: none;
			
 
				+  color: white; */
			
 
				+}
			
 
				+table img {
			
 
				+  width: 100%;
			
 
				+  height: auto;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/PreCent/PerRight/ConvertPwd/index.vue
+++ b/src/views/PreCent/PerRight/ConvertPwd/index.vue
@@ -0,0 +1,153 @@
 
				+<template>
			
 
				+  <div class="right">
			
 
				+    <div class="showTitle">
			
 
				+      <el-icon><Tickets /></el-icon>
			
 
				+      <h2>修改密码</h2>
			
 
				+    </div>
			
 
				+    <div class="buttom">
			
 
				+      <div>
			
 
				+        <h5>旧密码:</h5>
			
 
				+        <input type="password" />
			
 
				+      </div>
			
 
				+      <div>
			
 
				+        <h5>新密码:</h5>
			
 
				+        <input type="password" />
			
 
				+      </div>
			
 
				+      <div>
			
 
				+        <h5>确认密码:</h5>
			
 
				+        <input class="last" type="password" />
			
 
				+      </div>
			
 
				+      <input type="button" @click="convertMsg()" value="确认修改" />
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+<script>
			
 
				+import { changePwd } from "@/api";
			
 
				+
			
 
				+import { mapState } from "vuex";
			
 
				+export default {
			
 
				+  name: "ConvertMsg",
			
 
				+  computed: {
			
 
				+    ...mapState("LoginStore", ["tokenStore"]),
			
 
				+  },
			
 
				+  created() {
			
 
				+    //页面加载时就从本地通过localstorage获取存储的token值
			
 
				+    if (localStorage.getItem("token")) {
			
 
				+      this.token = localStorage.getItem("token");
			
 
				+    }
			
 
				+  },
			
 
				+  methods: {
			
 
				+    convertMsg() {
			
 
				+      //取出密码
			
 
				+      const prePwd = document.documentElement
			
 
				+        .getElementsByClassName("buttom")[0]
			
 
				+        .getElementsByTagName("input")[0].value;
			
 
				+      const pwd1 = document.documentElement
			
 
				+        .getElementsByClassName("buttom")[0]
			
 
				+        .getElementsByTagName("input")[1].value;
			
 
				+      const pwd2 = document.documentElement
			
 
				+        .getElementsByClassName("buttom")[0]
			
 
				+        .getElementsByTagName("input")[2].value;
			
 
				+      console.log("密码", prePwd, pwd1, pwd2);
			
 
				+
			
 
				+      var pPattern =
			
 
				+        /^.*(?=.{6,})(?=.*\d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*? ]).*$/;
			
 
				+      //判断是否为空
			
 
				+      if (prePwd.trim() == "" || pwd1.trim() == "" || pwd2.trim() == "") {
			
 
				+        alert("请填写完整信息!");
			
 
				+      }
			
 
				+      //判断密码是否一致
			
 
				+      else if (pwd1 != pwd2) {
			
 
				+        alert("前后密码不一致");
			
 
				+      } else if (!pPattern.test(pwd1)) {
			
 
				+        alert(
			
 
				+          "密码最少6位，包括至少1个大写字母，1个小写字母，1个数字，1个特殊字符"
			
 
				+        );
			
 
				+      } else {
			
 
				+        const params = {
			
 
				+          oldPW: prePwd,
			
 
				+          newPW: pwd1,
			
 
				+        };
			
 
				+
			
 
				+        changePwd(params).then((response) => {
			
 
				+          if (response.data.code == 200) {
			
 
				+            alert("修改成功!");
			
 
				+          } else {
			
 
				+            alert("修改失败，请重试");
			
 
				+          }
			
 
				+        });
			
 
				+      }
			
 
				+    },
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+
			
 
				+<style scoped>
			
 
				+.right {
			
 
				+  width: 59rem;
			
 
				+  height: 35rem;
			
 
				+  background-color: rgb(255, 255, 255);
			
 
				+  top: 1rem;
			
 
				+  left: 24rem;
			
 
				+  border: 1px solid gray;
			
 
				+  border-radius: 10px;
			
 
				+  margin-left: 25rem;
			
 
				+}
			
 
				+.showTitle {
			
 
				+  position: relative;
			
 
				+  width: 100%;
			
 
				+  height: 3rem;
			
 
				+  border-bottom: 1px solid rgb(165, 162, 162);
			
 
				+  box-sizing: border-box;
			
 
				+  text-align: start;
			
 
				+  padding-left: 2rem;
			
 
				+}
			
 
				+.showTitle h2 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+}
			
 
				+.buttom input[type="button"] {
			
 
				+  background-color: #409eff;
			
 
				+  width: 6rem;
			
 
				+  height: 2rem;
			
 
				+  border-radius: 1rem;
			
 
				+  font-size: 1rem;
			
 
				+  border: none;
			
 
				+
			
 
				+  color: white;
			
 
				+  text-align: center;
			
 
				+  letter-spacing: 0.3rem;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+.buttom {
			
 
				+  text-align: left;
			
 
				+}
			
 
				+.buttom h5 {
			
 
				+  font-size: 1.1rem;
			
 
				+  padding-left: 4rem;
			
 
				+  padding-right: 2rem;
			
 
				+  display: inline-block;
			
 
				+}
			
 
				+.buttom input {
			
 
				+  font-size: 1.1rem;
			
 
				+}
			
 
				+
			
 
				+.buttom input[type="button"][data-v-3e4046af][data-v-3e4046af] {
			
 
				+  background-color: #409eff;
			
 
				+  width: 7rem;
			
 
				+  height: 3rem;
			
 
				+  border-radius: 2rem;
			
 
				+  font-size: 0.8rem;
			
 
				+  border: none;
			
 
				+  color: white;
			
 
				+  text-align: center;
			
 
				+  letter-spacing: 0.3rem;
			
 
				+  cursor: pointer;
			
 
				+  margin-left: 12rem;
			
 
				+  margin-top: 1rem;
			
 
				+}
			
 
				+.last {
			
 
				+  margin-left: -1rem;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/PreCent/PerRight/MyComment/index.vue
+++ b/src/views/PreCent/PerRight/MyComment/index.vue
@@ -0,0 +1,374 @@
 
				+<template>
			
 
				+  <div v-if="show" class="right">
			
 
				+    <div class="showTitle">
			
 
				+      <el-icon><ZoomOut /></el-icon>
			
 
				+      <h2 @click="showComment">我的评价</h2>
			
 
				+    </div>
			
 
				+    <div class="Comment" id="CommentMSg" v-for="(item, i) in this.rows">
			
 
				+      <div id="commentTitle">
			
 
				+        <h4 id="order">订单编号:</h4>
			
 
				+        <div id="orderDetail">
			
 
				+          <h4>{{ item.id }}</h4>
			
 
				+        </div>
			
 
				+        <h4 id="range">分类范围：</h4>
			
 
				+        <div id="rangeDetail">
			
 
				+          <h4>{{ item.categoryName }}</h4>
			
 
				+        </div>
			
 
				+        <h4 id="date">日期：</h4>
			
 
				+        <div id="dateDetail">
			
 
				+          <h4>{{ item.createTime }}</h4>
			
 
				+        </div>
			
 
				+        <span id="detail">查看订单详情</span><br />
			
 
				+        <div id="commentMain">
			
 
				+          <div id="detailTop">
			
 
				+            <div>
			
 
				+              订单信息
			
 
				+            </div>
			
 
				+            <br>
			
 
				+            <br>
			
 
				+            <h6 id="nameDetail">{{ item.userName }}</h6>
			
 
				+            <h6 id="createTime" class="bigTime">{{ item.createTime }}</h6>
			
 
				+            <br />
			
 
				+            <h4 id="commentContext">{{ item.content }}</h4>
			
 
				+            <div></div>
			
 
				+            <hr />
			
 
				+            <div id="replyMsg" v-for="(item2, i) in item.children">
			
 
				+              <h6 id="nameDetail">{{ item2.username }}</h6>
			
 
				+              <h6 id="nameDetail" class="textReply">回复</h6>
			
 
				+              <h6 id="nameDetail" class="theBoss">
			
 
				+                {{ item2.toCommentUserName }}
			
 
				+              </h6>
			
 
				+              <h6 id="createTime" class="littleTime">{{ item2.createTime }}</h6>
			
 
				+              <h6 id="reply" class="littleReply" @click="replyPrompt($event)">
			
 
				+                回复
			
 
				+              </h6>
			
 
				+              <br />
			
 
				+              <h6 class="replyContext">{{ item2.content }}</h6>
			
 
				+              <hr id="replyHr" />
			
 
				+            </div>
			
 
				+
			
 
				+            <br />
			
 
				+            <div class="showReply" id="replyMsg">
			
 
				+              <input type="text" /> <input type="button" value="发布" />
			
 
				+            </div>
			
 
				+          </div>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <nav v-if="this.total * 1" style="text-align: -webkit-center">
			
 
				+      <!-- 分页居中放置-->
			
 
				+      <el-pagination
			
 
				+        :page-size="5"
			
 
				+        background
			
 
				+        style="width: max-content"
			
 
				+        :current-page="this.getPageNum"
			
 
				+        @current-change="handleCurrentChange"
			
 
				+        layout="prev, pager, next"
			
 
				+        :total="this.total * 1"
			
 
				+      />
			
 
				+    </nav>
			
 
				+    <div v-if="!(this.total * 1)">
			
 
				+      <img id="noImg" src="../img/noContent.png" />
			
 
				+      <h4>没有关于你的评价....</h4>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { serverCommentList, userInfo } from "@/api";
			
 
				+import { ZoomOut } from "@element-plus/icons-vue";
			
 
				+export default {
			
 
				+  name: "MyComment",
			
 
				+  created() {
			
 
				+    if (localStorage.getItem("token")) {
			
 
				+      this.token = localStorage.getItem("token");
			
 
				+    }
			
 
				+    userInfo().then((response) => {
			
 
				+      if (response.data.code === 200) {
			
 
				+        this.serverId = response.data.data.id;
			
 
				+        const params = {
			
 
				+          userId: this.serverId,
			
 
				+          pageNum: "1",
			
 
				+          pageSize: "5",
			
 
				+        };
			
 
				+        serverCommentList(params).then((response) => {
			
 
				+          if (response.data.code == 200) {
			
 
				+            this.rows = response.data.data.rows;
			
 
				+            this.total = parseInt(response.data.data.total);
			
 
				+          }
			
 
				+        });
			
 
				+      } else {
			
 
				+        alert("获取用户id失败");
			
 
				+      }
			
 
				+    });
			
 
				+  },
			
 
				+  data() {
			
 
				+    return {
			
 
				+      show: true,
			
 
				+      total: 0,
			
 
				+      pageCount: 9,
			
 
				+      serverId: "",
			
 
				+      pageNum: "1",
			
 
				+      pageSize: "5",
			
 
				+      rows: [],
			
 
				+    };
			
 
				+  },
			
 
				+  components: {
			
 
				+    ZoomOut,
			
 
				+  },
			
 
				+
			
 
				+  methods: {
			
 
				+    /* ...mapActions("PerCent", ["postComment"]),
			
 
				+    async postCom(serverid, token) {
			
 
				+      await this.$store.dispatch("postComment", { serverId: serverid, token });
			
 
				+    }, */
			
 
				+    //获取大页码
			
 
				+    handleCurrentChange(val) {
			
 
				+      const params = {
			
 
				+        serverId: this.serverId,
			
 
				+        pageNum: val,
			
 
				+        pageSize: "5",
			
 
				+      };
			
 
				+
			
 
				+      serverCommentList(params).then((response) => {
			
 
				+        if (response.data.code == 200) {
			
 
				+          this.rows = response.data.data.rows;
			
 
				+          this.total = parseInt(response.data.data.total);
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+    showComment() {
			
 
				+      const p = {
			
 
				+        serverId: this.serverId,
			
 
				+        pageNum: this.pageNum,
			
 
				+        pageSize: this.pageSize,
			
 
				+      };
			
 
				+      serverCommentList(p).then((response) => {
			
 
				+        console.log(response.data.data.total);
			
 
				+      });
			
 
				+    },
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+<style scoped>
			
 
				+.right {
			
 
				+  width: 59rem;
			
 
				+  background-color: rgb(255, 255, 255);
			
 
				+  top: 1rem;
			
 
				+  left: 24rem;
			
 
				+  border: 1px solid gray;
			
 
				+  border-radius: 10px;
			
 
				+  margin-left: 25rem;
			
 
				+}
			
 
				+.showTitle {
			
 
				+  position: relative;
			
 
				+  width: 100%;
			
 
				+  height: 3rem;
			
 
				+  border-bottom: 1px solid rgb(165, 162, 162);
			
 
				+  box-sizing: border-box;
			
 
				+  text-align: start;
			
 
				+  padding-left: 2rem;
			
 
				+}
			
 
				+.showTitle h2 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+}
			
 
				+/* 评价表 */
			
 
				+#commentTitle {
			
 
				+  /*   position: absolute; */
			
 
				+  margin: 0 auto;
			
 
				+  padding: 0;
			
 
				+  margin-top: 2rem;
			
 
				+  background-color: #f5f5f5;
			
 
				+  text-align: left;
			
 
				+  width: 85%;
			
 
				+  border-radius: 1rem;
			
 
				+}
			
 
				+
			
 
				+#commentTitle h4 {
			
 
				+  display: inline-block;
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+}
			
 
				+#commentTitle #order {
			
 
				+  margin-left: 1rem;
			
 
				+  margin-top: 2rem;
			
 
				+}
			
 
				+#commentTitle #detail {
			
 
				+  margin-left: 3em;
			
 
				+  color: #4c96b3;
			
 
				+}
			
 
				+#commentTitle #date {
			
 
				+  margin-left: 2rem;
			
 
				+}
			
 
				+#commentTitle div {
			
 
				+  display: inline-block;
			
 
				+  /*   background-color: aqua; */
			
 
				+  position: relative;
			
 
				+  top: 0.3rem;
			
 
				+}
			
 
				+#commentTitle #orderDetail {
			
 
				+  width: 8rem;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+#commentTitle #range {
			
 
				+  margin-left: 0rem;
			
 
				+}
			
 
				+#commentTitle #rangeDetail {
			
 
				+  top: 0.2rem;
			
 
				+  width: 4.5rem;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+.bigTime {
			
 
				+  margin-left: 0rem !important;
			
 
				+}
			
 
				+#commentTitle #dateDetail {
			
 
				+  position: relative;
			
 
				+  top: 0.3rem;
			
 
				+  width: 11rem;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+#commentMain {
			
 
				+  background-color: #fdfdfd;
			
 
				+  margin: 0 auto;
			
 
				+  margin-left: 0.5rem;
			
 
				+  width: 98%;
			
 
				+  border-radius: 1rem;
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+#commentMain h6 {
			
 
				+  /*  background-color: #4c96b3; */
			
 
				+  color: #726f6f;
			
 
				+  font-size: 0.8rem;
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+  display: inline-block;
			
 
				+  margin-left: 1.5rem;
			
 
				+}
			
 
				+#commentMain #nameDetail {
			
 
				+  width: 6rem;
			
 
				+  overflow: hidden;
			
 
				+  margin-top: 1rem;
			
 
				+}
			
 
				+#commentMain #createTime {
			
 
				+  overflow: hidden;
			
 
				+  width: 11rem;
			
 
				+}
			
 
				+#commentMain #reply {
			
 
				+  cursor: pointer;
			
 
				+  margin-left: 26rem;
			
 
				+}
			
 
				+#commentMain hr {
			
 
				+  display: block;
			
 
				+  width: 95%;
			
 
				+  unicode-bidi: isolate;
			
 
				+  margin-block-start: 0.5em;
			
 
				+  margin-block-end: 0.5em;
			
 
				+  margin-inline-start: auto;
			
 
				+  margin-inline-end: auto;
			
 
				+  overflow: hidden;
			
 
				+  border-style: inset;
			
 
				+  border-width: 1px;
			
 
				+}
			
 
				+#commentMain #commentContext {
			
 
				+  margin-top: 0.5rem;
			
 
				+  margin-left: 2rem;
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+/* #CommentMSg :nth-child(3) {
			
 
				+  margin-bottom: 5rem;
			
 
				+} */
			
 
				+::v-deep .el-pagination {
			
 
				+  --el-pagination-font-size: 14px;
			
 
				+  --el-pagination-bg-color: var(--el-fill-color-blank);
			
 
				+  --el-pagination-text-color: var(--el-text-color-primary);
			
 
				+  --el-pagination-border-radius: 2px;
			
 
				+  --el-pagination-button-color: var(--el-text-color-primary);
			
 
				+  --el-pagination-button-width: 32px;
			
 
				+  --el-pagination-button-height: 32px;
			
 
				+  --el-pagination-button-disabled-color: var(--el-text-color-placeholder);
			
 
				+  --el-pagination-button-disabled-bg-color: var(--el-fill-color-blank);
			
 
				+  --el-pagination-button-bg-color: var(--el-fill-color);
			
 
				+  --el-pagination-hover-color: var(--el-color-primary);
			
 
				+  --el-pagination-font-size-small: 12px;
			
 
				+  --el-pagination-button-width-small: 24px;
			
 
				+  --el-pagination-button-height-small: 24px;
			
 
				+  --el-pagination-item-gap: 16px;
			
 
				+  white-space: nowrap;
			
 
				+  color: var(--el-pagination-text-color);
			
 
				+  font-size: var(--el-pagination-font-size);
			
 
				+  font-weight: 400;
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  margin-top: 2rem;
			
 
				+  margin-bottom: 3rem;
			
 
				+  justify-content: center;
			
 
				+  /*   position: fixed;
			
 
				+  top: 56rem;
			
 
				+  left: 11rem; */
			
 
				+}
			
 
				+
			
 
				+/* 回复 */
			
 
				+.right #replyMsg {
			
 
				+  /*   display: none; */
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+input[type="button"] {
			
 
				+  background-color: #409eff;
			
 
				+  width: 6rem;
			
 
				+  height: 2rem;
			
 
				+  border-radius: 1rem;
			
 
				+
			
 
				+  right: 2rem;
			
 
				+  border: none;
			
 
				+
			
 
				+  color: white;
			
 
				+  text-align: center;
			
 
				+  letter-spacing: 0.3rem;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+#replyMsg input[type="text"] {
			
 
				+  width: 22rem;
			
 
				+  height: 1.7rem;
			
 
				+  font-size: 1.2rem;
			
 
				+  margin-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+/* 回复小框内容 */
			
 
				+.right #detailTop .textReply {
			
 
				+  margin-left: -1rem;
			
 
				+}
			
 
				+.right #detailTop .theBoss {
			
 
				+  margin-left: -2rem;
			
 
				+}
			
 
				+.right #detailTop .littleReply {
			
 
				+  margin-left: 14rem !important;
			
 
				+  padding-right: 2rem !important;
			
 
				+}
			
 
				+.right #detailTop .replyContext {
			
 
				+  color: #282727;
			
 
				+  font-size: 1rem;
			
 
				+  margin-top: 1rem !important;
			
 
				+}
			
 
				+.right #detailTop .replyHr {
			
 
				+}
			
 
				+.right #detailTop #replyMsg {
			
 
				+  padding-left: 4rem;
			
 
				+}
			
 
				+.right #detailTop #replyMsg h6 {
			
 
				+  margin-top: 0rem;
			
 
				+}
			
 
				+.right #detailTop .littleTime {
			
 
				+  margin-left: -1rem;
			
 
				+}
			
 
				+/* 缺省页 */
			
 
				+#noImg {
			
 
				+  width: 26rem;
			
 
				+  margin-left: 2rem;
			
 
				+}
			
 
				+#noH3 {
			
 
				+  margin-left: 32rem;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/PreCent/PerRight/MyOrder/img/noContent.png
+++ b/src/views/PreCent/PerRight/MyOrder/img/noContent.png
--- a/src/views/PreCent/PerRight/MyOrder/index.vue
+++ b/src/views/PreCent/PerRight/MyOrder/index.vue
@@ -0,0 +1,449 @@
 
				+<!-- 我的订单 -->
			
 
				+<template>
			
 
				+  <div ref="backHeight" class="right">
			
 
				+    <div class="showTitle">
			
 
				+      <el-icon>
			
 
				+        <document />
			
 
				+      </el-icon>
			
 
				+      <h2>我的订单</h2>
			
 
				+    </div>
			
 
				+    <div id="topNav">
			
 
				+      <h2 @click="orderChoose($event, '全部')">全部</h2>
			
 
				+      <h2 @click="orderChoose($event, '未支付')">未支付</h2>
			
 
				+      <h2 @click="orderChoose($event, '服务中')">服务中</h2>
			
 
				+      <h2 @click="orderChoose($event, '已完成')">已完成</h2>
			
 
				+      <h2 @click="orderChoose($event, '已取消')">已取消</h2>
			
 
				+    </div>
			
 
				+    <hr id="hr1" />
			
 
				+    <div id="choseMsg" class="statusMsg" v-for="item in this.list">
			
 
				+      <div id="topContent">
			
 
				+        <label>订单号:</label>
			
 
				+        <label class="orderId">{{ item.id }}</label>
			
 
				+        <label>创建时间:</label>
			
 
				+        <label class="orderId">{{ item.createTime }}</label>
			
 
				+        <img id="statusImg" src="../../img/status.png" />
			
 
				+        <label id="statusSpan">{{ item.status }}</label>
			
 
				+      </div>
			
 
				+      <hr id="hr" />
			
 
				+      <span id="employer">雇主:</span>
			
 
				+      <input disabled v-model="item.userName" class="theIn" type="text" />
			
 
				+
			
 
				+      <span class="rightSpan">分类范围:</span>
			
 
				+      <input disabled v-model="item.categoryName" class="theIn" type="text" />
			
 
				+      <br />
			
 
				+      <span>联系方式:</span>
			
 
				+      <input disabled v-model="item.userPhone" class="theIn" type="text" />
			
 
				+      <span class="rightSpan">服务时间:</span>
			
 
				+      <input disabled v-model="item.serverTime" class="theIn" type="text" />
			
 
				+      <br />
			
 
				+      <span>雇主地址:</span>
			
 
				+      <input disabled v-model="item.area" class="theIn" type="text" />
			
 
				+
			
 
				+      <span id="totalPrice" class="rightSpan">总价:</span>
			
 
				+      <input disabled v-model="item.totalPrice" class="theIn" type="text" />
			
 
				+      <br />
			
 
				+      <span id="note">备注：</span>
			
 
				+      <textarea disabled v-model="item.treatment"></textarea>
			
 
				+    </div>
			
 
				+    <nav v-if="this.getTotal * 1" style="text-align: -webkit-center">
			
 
				+      <el-pagination :page-size="this.getCurrentPageSize" style="width: max-content" :current-page="this.getCurrentPage"
			
 
				+        @current-change="handleCurrentChange" layout="prev, pager, next" :total="this.getTotal * 1" />
			
 
				+    </nav>
			
 
				+    <div v-if="!(this.getTotal * 1)">
			
 
				+      <img id="noImg" src="./img/noContent.png" />
			
 
				+      <h4>没有订单信息....</h4>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { getServerOrder } from "@/api";
			
 
				+import {
			
 
				+  Menu as IconMenu,
			
 
				+  ArrowDownBold,
			
 
				+  ArrowUpBold,
			
 
				+} from "@element-plus/icons-vue";
			
 
				+import { mapGetters, mapMutations } from "vuex";
			
 
				+
			
 
				+export default {
			
 
				+  name: "MyOrder",
			
 
				+  computed: {
			
 
				+    ...mapGetters("OrderStore", ['getCurrentPageSize', 'getCurrentPage', 'getStatus', 'getTotal'])
			
 
				+  },
			
 
				+  created() {
			
 
				+    this.init()
			
 
				+  },
			
 
				+  data() {
			
 
				+    return {
			
 
				+      list: [],
			
 
				+    };
			
 
				+  },
			
 
				+  methods: {
			
 
				+    ...mapMutations("OrderStore", ['changePageNum', 'setTotal', 'setStatus']),
			
 
				+    init() {
			
 
				+      let parmas = {
			
 
				+        orderStatus: this.getStatus,
			
 
				+        pageNum: this.getCurrentPage,
			
 
				+        pageSize: this.getCurrentPageSize,
			
 
				+      };
			
 
				+      getServerOrder(parmas).then((response) => {
			
 
				+        if (response.data.code == 200) {
			
 
				+          this.list = response.data.data.rows;
			
 
				+          console.log(response.data.data)
			
 
				+          this.list.forEach(e => {
			
 
				+            if (e.status === '服务中') {
			
 
				+              e.status = '工作中'
			
 
				+            }
			
 
				+          })
			
 
				+          this.setTotal(parseInt(response.data.data.total))
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+    //筛选订单
			
 
				+    orderChoose(e, s) {
			
 
				+      for (
			
 
				+        let index = 0;
			
 
				+        index < e.currentTarget.parentNode.children.length;
			
 
				+        index++
			
 
				+      ) {
			
 
				+        e.currentTarget.parentNode.children[index].style.color = "black";
			
 
				+      }
			
 
				+      e.currentTarget.style.color = "#409eff";
			
 
				+      this.setStatus(s)
			
 
				+      this.init()
			
 
				+    },
			
 
				+    //选择页数
			
 
				+    handleCurrentChange(val) {
			
 
				+      this.changePageNum(val)
			
 
				+      this.init()
			
 
				+    },
			
 
				+  },
			
 
				+  components: {
			
 
				+    IconMenu,
			
 
				+    ArrowUpBold,
			
 
				+    ArrowDownBold,
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+<style scoped>
			
 
				+.right {
			
 
				+  width: 59rem;
			
 
				+  background-color: rgb(255, 255, 255);
			
 
				+  top: 1rem;
			
 
				+  left: 24rem;
			
 
				+  border: 1px solid gray;
			
 
				+  border-radius: 10px;
			
 
				+  padding-bottom: 2rem;
			
 
				+  margin-left: 25rem;
			
 
				+}
			
 
				+
			
 
				+.right:after {
			
 
				+  content: "";
			
 
				+  display: block;
			
 
				+  height: 0;
			
 
				+  clear: both;
			
 
				+  visibility: hidden;
			
 
				+}
			
 
				+
			
 
				+.showTitle {
			
 
				+  position: relative;
			
 
				+  width: 100%;
			
 
				+  height: 3rem;
			
 
				+  border-bottom: 1px solid rgb(165, 162, 162);
			
 
				+  box-sizing: border-box;
			
 
				+  text-align: start;
			
 
				+  padding-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+.showTitle h2 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+}
			
 
				+
			
 
				+#topNav {
			
 
				+  text-align: left;
			
 
				+}
			
 
				+
			
 
				+#hr1 {
			
 
				+  border-width: 0.15rem;
			
 
				+}
			
 
				+
			
 
				+#topNav h2 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.2rem;
			
 
				+  font-weight: 400;
			
 
				+  padding: 0;
			
 
				+  margin: 0;
			
 
				+  margin-left: 2rem;
			
 
				+  margin-top: 1rem;
			
 
				+  margin-bottom: 1rem;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+#topNav :first-child {
			
 
				+  color: #409eff;
			
 
				+}
			
 
				+
			
 
				+#serveArea {
			
 
				+  margin-bottom: 2rem;
			
 
				+}
			
 
				+
			
 
				+#tipsMsg {
			
 
				+  transition: all 0.4s ease;
			
 
				+  display: none;
			
 
				+  height: auto;
			
 
				+  padding-left: 2rem;
			
 
				+  padding-bottom: 1rem;
			
 
				+  padding-top: 1.5rem;
			
 
				+}
			
 
				+
			
 
				+#arrow {
			
 
				+  padding-left: 46rem !important;
			
 
				+}
			
 
				+
			
 
				+/* 填写信息样式
			
 
				+ */
			
 
				+#choseMsg {
			
 
				+  width: 90%;
			
 
				+  border: 1px solid rgb(112, 110, 110);
			
 
				+  border-radius: 2rem;
			
 
				+  text-align: start;
			
 
				+  margin: 0 auto;
			
 
				+  margin-top: 2rem;
			
 
				+  padding-left: 2.5rem;
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+#choseMsg span {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.2rem;
			
 
				+  font-weight: 400;
			
 
				+  padding-right: 1rem;
			
 
				+  margin-top: 0.8rem;
			
 
				+}
			
 
				+
			
 
				+#choseMsg select {
			
 
				+  width: 7rem;
			
 
				+  height: 1.7em;
			
 
				+  font-size: 1rem;
			
 
				+  margin-top: 1rem;
			
 
				+  margin-right: 3rem;
			
 
				+}
			
 
				+
			
 
				+#choseMsg .theIn {
			
 
				+  width: 17rem;
			
 
				+  height: 1.6rem;
			
 
				+  border: none;
			
 
				+  font-size: 1.1rem;
			
 
				+  padding-left: 0.5rem;
			
 
				+}
			
 
				+
			
 
				+#choseMsg input {
			
 
				+  height: 1rem;
			
 
				+  margin-top: 1rem;
			
 
				+}
			
 
				+
			
 
				+#emType {
			
 
				+  margin-left: 5.5rem;
			
 
				+}
			
 
				+
			
 
				+#contact {
			
 
				+  margin-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+#residence {
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+#salaryIn {
			
 
				+  width: 3rem;
			
 
				+  margin-left: -1rem;
			
 
				+  margin-right: 0.5rem;
			
 
				+}
			
 
				+
			
 
				+#salary {
			
 
				+  margin-left: 4.4rem;
			
 
				+}
			
 
				+
			
 
				+/*
			
 
				+我的状态 */
			
 
				+#myStatus {
			
 
				+  padding: 0;
			
 
				+  margin: 0;
			
 
				+  text-align: start;
			
 
				+  margin-top: 2rem;
			
 
				+}
			
 
				+
			
 
				+#myStatus #statusTitle {
			
 
				+  margin-left: 3rem;
			
 
				+  font-size: 1.2rem;
			
 
				+  font-weight: 700;
			
 
				+}
			
 
				+
			
 
				+#statusRight {
			
 
				+  display: inline-block;
			
 
				+  height: 3rem;
			
 
				+  width: auto;
			
 
				+  overflow: hidden;
			
 
				+  background-color: aqua;
			
 
				+  margin: 0 auto;
			
 
				+  margin-bottom: 0;
			
 
				+  margin-left: 9rem;
			
 
				+}
			
 
				+
			
 
				+#statusRight img {}
			
 
				+
			
 
				+#msgStatus {
			
 
				+  margin-left: 1rem;
			
 
				+  font-weight: 600;
			
 
				+}
			
 
				+
			
 
				+#private {
			
 
				+  margin-left: 42rem;
			
 
				+  font-weight: 500;
			
 
				+  display: inline-block;
			
 
				+  padding-right: 1rem;
			
 
				+  margin-bottom: 2rem;
			
 
				+}
			
 
				+
			
 
				+input[type="button"] {
			
 
				+  background-color: #409eff;
			
 
				+  width: 6rem;
			
 
				+  height: 2rem;
			
 
				+  border-radius: 1rem;
			
 
				+  position: absolute;
			
 
				+  right: 2rem;
			
 
				+  border: none;
			
 
				+  top: 0.5rem;
			
 
				+  color: white;
			
 
				+  text-align: center;
			
 
				+  letter-spacing: 0.3rem;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-cascader .el-input {
			
 
				+  display: flex;
			
 
				+  cursor: pointer;
			
 
				+  border: 1px solid black;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-input__wrapper {
			
 
				+  display: inline-flex;
			
 
				+  flex-grow: 1;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+  padding: 1px 11px;
			
 
				+  background-color: var(--el-input-bg-color, var(--el-fill-color-blank));
			
 
				+  background-image: none;
			
 
				+  border-radius: 0;
			
 
				+  transition: var(--el-transition-box-shadow);
			
 
				+  box-shadow: 0 0 0 1px var(--el-input-border-color, var(--el-border-color)) inset;
			
 
				+}
			
 
				+
			
 
				+#areaStyle {
			
 
				+  width: 15rem;
			
 
				+  margin-left: 0.1rem;
			
 
				+  height: 1.3rem !important;
			
 
				+  vertical-align: inherit;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-input__wrapper {
			
 
				+  display: inline-flex;
			
 
				+  flex-grow: 1;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+  padding: 1px 11px;
			
 
				+  background-image: none;
			
 
				+  border-radius: var(--el-input-border-radius, var(--el-border-radius-base));
			
 
				+  transition: var(--el-transition-box-shadow);
			
 
				+}
			
 
				+
			
 
				+#topContent {
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+  text-align: left;
			
 
				+}
			
 
				+
			
 
				+#topContent label {
			
 
				+  font-size: 1.1rem;
			
 
				+  margin-top: 1rem;
			
 
				+}
			
 
				+
			
 
				+#hr {
			
 
				+  position: absolute;
			
 
				+  left: 29rem;
			
 
				+  width: 55rem;
			
 
				+}
			
 
				+
			
 
				+/* 备注 */
			
 
				+textarea {
			
 
				+  resize: none;
			
 
				+  width: 83%;
			
 
				+  height: 4rem;
			
 
				+  border: none;
			
 
				+  /* outline: none; */
			
 
				+  color: rgb(63, 62, 62);
			
 
				+  font-size: 1.1rem;
			
 
				+  font-weight: bold;
			
 
				+  margin-top: -1rem;
			
 
				+  /* border: none; */
			
 
				+  margin-left: 6.3rem;
			
 
				+  margin-bottom: 1rem;
			
 
				+  padding-left: 0.5rem;
			
 
				+}
			
 
				+
			
 
				+/* 状态图片 */
			
 
				+#statusImg {
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+  width: 3%;
			
 
				+  height: auto;
			
 
				+}
			
 
				+
			
 
				+/* 订单头部 */
			
 
				+.orderId {
			
 
				+  width: 18rem;
			
 
				+  text-align: left;
			
 
				+  padding: 0.2rem;
			
 
				+  display: inline-block;
			
 
				+}
			
 
				+
			
 
				+/* 雇主 */
			
 
				+#employer {
			
 
				+  margin-right: 2.2rem;
			
 
				+}
			
 
				+
			
 
				+.rightSpan {
			
 
				+  margin-left: 3.5rem;
			
 
				+  text-align: start;
			
 
				+}
			
 
				+
			
 
				+/*
			
 
				+总价 */
			
 
				+#totalPrice {
			
 
				+  margin-right: 2.5rem;
			
 
				+}
			
 
				+
			
 
				+/* 备注 */
			
 
				+#note {
			
 
				+  position: relative;
			
 
				+  top: 0.2rem;
			
 
				+  left: 0.2rem;
			
 
				+}
			
 
				+
			
 
				+#statusSpan {
			
 
				+  vertical-align: text-bottom;
			
 
				+  margin-left: 0.3rem;
			
 
				+}
			
 
				+
			
 
				+/* 缺省页样式 */
			
 
				+#noImg {
			
 
				+  width: 20rem;
			
 
				+}
			
 
				+
			
 
				+/* 最外层 */
			
 
				+#backColor {
			
 
				+  padding-bottom: -10rem !important;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/PreCent/PerRight/PostStatus/index.vue
+++ b/src/views/PreCent/PerRight/PostStatus/index.vue
@@ -0,0 +1,823 @@
 
				+<template>
			
 
				+  <div v-if="show" class="right">
			
 
				+    <div class="showTitle">
			
 
				+      <el-icon><icon-menu /></el-icon>
			
 
				+      <h2>发布状态</h2>
			
 
				+      <input type="button" ref="button" @click="convertStatus" value="修改" />
			
 
				+    </div>
			
 
				+    <div id="tips">
			
 
				+      <div>
			
 
				+        <h4>Tips:>>></h4>
			
 
				+        <font> &nbsp;{{ this.Msg }} </font>
			
 
				+        <br><br><br>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <div id="myStatus">
			
 
				+      <span id="statusTitle">我的状态</span>
			
 
				+      <img id="statusImg" src="../../img/status.png" />
			
 
				+      <span id="msgStatus">{{ statusText }}</span>
			
 
				+      <table class="bigtable">
			
 
				+        <tr>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon>
			
 
				+                <HelpFilled />
			
 
				+              </el-icon>
			
 
				+              <h3>分类范围</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <select v-model="categoryId" disabled>
			
 
				+              <option v-for="item in this.categoryList" :value="item.id">
			
 
				+                {{ item.name }}
			
 
				+              </option>
			
 
				+            </select>
			
 
				+          </td>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon>
			
 
				+                <List />
			
 
				+              </el-icon>
			
 
				+              <h3>聘请类别</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <select v-model="serverType" disabled>
			
 
				+              <option value="1">长期工</option>
			
 
				+              <option value="2">短期工</option>
			
 
				+            </select>
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+        <tr>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon>
			
 
				+                <Calendar />
			
 
				+              </el-icon>
			
 
				+              <h3>上岗日期</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input type="text" v-model="this.serverTime" disabled placeholder="可接单时段/几日到岗" />
			
 
				+          </td>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon>
			
 
				+                <PhoneFilled />
			
 
				+              </el-icon>
			
 
				+              <h3>联系方式</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input v-model="phone" type="text" disabled />
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+        <tr>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon>
			
 
				+                <Present />
			
 
				+              </el-icon>
			
 
				+              <h3>待遇</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input type="text" disabled v-model="treatment" placeholder="休假等期望待遇" />
			
 
				+          </td>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon>
			
 
				+                <HomeFilled />
			
 
				+              </el-icon>
			
 
				+              <h3>是否住家</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td>
			
 
				+            <select v-model="stay" disabled>
			
 
				+              <option value="1">住家</option>
			
 
				+              <option value="2">不住家</option>
			
 
				+            </select>
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+        <tr>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon>
			
 
				+                <Money />
			
 
				+              </el-icon>
			
 
				+              <h3>薪酬</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input id="salaryInput" v-model="this.salary" type="text" disabled />
			
 
				+            <label>元（日/次）</label>
			
 
				+          </td>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon>
			
 
				+                <Location />
			
 
				+              </el-icon>
			
 
				+              <h3>服务地区</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input v-if="!canAlter" :value="serverArea" disabled type="text" />
			
 
				+            <el-cascader v-if="canAlter" ref="area" style="width: 75%" :options="options" :placeholder="this.serverArea"
			
 
				+              @change="addressChoose"></el-cascader>
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+        <tr>
			
 
				+          <td class="endPortrait">
			
 
				+            <div>
			
 
				+              <el-icon>
			
 
				+                <Location />
			
 
				+              </el-icon>
			
 
				+              <h3>简介</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="lognInput" colspan="3">
			
 
				+            <input v-model="introduction" type="text" disabled />
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+      </table>
			
 
				+    </div>
			
 
				+    <span id="private">设为私密</span>
			
 
				+    <el-switch @click="changetStatus" v-model="isPriva" :disabled="forbidden" />
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { postStatus, getCondition, categoryListApi } from "@/api";
			
 
				+import { getCookie } from "@/util/cookie";
			
 
				+import popmessage from "@/components/tip/index.js";
			
 
				+
			
 
				+import {
			
 
				+  Menu as IconMenu,
			
 
				+  Money,
			
 
				+  Location,
			
 
				+} from "@element-plus/icons-vue";
			
 
				+
			
 
				+import { regionDataPlus, CodeToText } from "element-china-area-data";
			
 
				+
			
 
				+export default {
			
 
				+  name: "PostStatus",
			
 
				+  created() {
			
 
				+    this.serverId = getCookie("userId");
			
 
				+    if (localStorage.getItem("token")) {
			
 
				+      this.token = localStorage.getItem("token");
			
 
				+    }
			
 
				+    let parmas = {
			
 
				+      serverId: this.serverId,
			
 
				+    };
			
 
				+    getCondition(parmas).then((response) => {
			
 
				+      if (response.data.code === 200) {
			
 
				+        this.treatment = response.data.data.treatment;
			
 
				+        this.phone = response.data.data.phone;
			
 
				+        this.serverTime = response.data.data.workDate;
			
 
				+        this.serverType = response.data.data.serverType;
			
 
				+        this.salary = response.data.data.salary;
			
 
				+        this.categoryId = response.data.data.categoryId;
			
 
				+        this.stay = response.data.data.stay;
			
 
				+        this.status = response.data.data.status;
			
 
				+        this.serverArea = response.data.data.serverArea;
			
 
				+        // 渲染serverArea
			
 
				+        if (this.serverArea.substring(0, 2) === '全部') {
			
 
				+          this.serverArea = '全国范围内'
			
 
				+        } else {
			
 
				+          this.serverArea.replace('全部', '内')
			
 
				+          this.serverArea.replace('undefined', '')
			
 
				+        }
			
 
				+        this.introduction = response.data.data.introduction
			
 
				+        // 返回管理员反馈
			
 
				+        if (response.data.data.tips != null) {
			
 
				+          this.Msg = response.data.data.tips;
			
 
				+        }
			
 
				+        if (this.status == 4 || this.statis == 5) {
			
 
				+          this.forbidden = true
			
 
				+        }
			
 
				+        if (this.status == 0 || this.status == 1) {
			
 
				+          this.forbidden = false
			
 
				+        }
			
 
				+        // 转换为审核成功
			
 
				+        if (this.status == 1 || this.status === 0) {
			
 
				+          this.statusText = this.statusList[6];
			
 
				+          this.status = localStorage.getItem('isPriva')
			
 
				+        } else {
			
 
				+          this.statusText = this.statusList[parseInt(this.status)];
			
 
				+        }
			
 
				+        if (this.status == 1) {
			
 
				+          this.isPriva = true;
			
 
				+          this.forbidden = false
			
 
				+        } else if(this.status == 0){
			
 
				+          this.isPriva = false;
			
 
				+        }
			
 
				+      }
			
 
				+    });
			
 
				+    categoryListApi().then((response) => {
			
 
				+      if (response.data.code === 200) {
			
 
				+        // var c = response.data.data;
			
 
				+        // var newC = [];
			
 
				+        // for (var i = 1; i < c.length; i++) {
			
 
				+        //   newC[i - 1] = c[i];
			
 
				+        // }
			
 
				+        // this.categoryList = newC;
			
 
				+        this.categoryList = response.data.data
			
 
				+      }
			
 
				+    });
			
 
				+  },
			
 
				+  data() {
			
 
				+    return {
			
 
				+      forbidden: true,
			
 
				+      show: true,
			
 
				+      //家政分类list
			
 
				+      categoryList: [],
			
 
				+      //状态信息
			
 
				+      statusList: ["公开", "私密", "未提交", "已接单", "审核中", "审核失败", '审核成功'],
			
 
				+      statusText: "",
			
 
				+      serverId: 0,
			
 
				+      serverArea: "",
			
 
				+      treatment: "",
			
 
				+      phone: "",
			
 
				+      serverTime: "",
			
 
				+      type: "",
			
 
				+      categoryId: "",
			
 
				+      stay: "",
			
 
				+      introduction: '',
			
 
				+      // 省市区级联
			
 
				+      options: regionDataPlus,
			
 
				+      selectedOptions: [],
			
 
				+      showArrow: true,
			
 
				+      isShow: true,
			
 
				+      isPriva: false,
			
 
				+      Msg: '请尽快填写信息',
			
 
				+      ishome: "",
			
 
				+      serverid: "",
			
 
				+      salary: 0,
			
 
				+      eltips: {
			
 
				+        "background-color": "blue !importent",
			
 
				+      },
			
 
				+      errMSg: "",
			
 
				+      canAlter: false,
			
 
				+    };
			
 
				+  },
			
 
				+  methods: {
			
 
				+    showTips() {
			
 
				+      if (this.isShow) {
			
 
				+        this.$refs.tipMsg.style.display = "block";
			
 
				+        this.showArrow = false;
			
 
				+        this.isShow = false;
			
 
				+      } else if (!this.isShow) {
			
 
				+        this.$refs.tipMsg.style.display = "none";
			
 
				+        this.showArrow = true;
			
 
				+        this.isShow = true;
			
 
				+      }
			
 
				+    },
			
 
				+    //解除禁用
			
 
				+    convertStatus() {
			
 
				+      if (this.$refs.button.value == "修改") {
			
 
				+        const n = document.documentElement
			
 
				+          .getElementsByTagName("table")[0]
			
 
				+          .getElementsByTagName("input").length;
			
 
				+        const n2 = document.documentElement
			
 
				+          .getElementsByTagName("table")[0]
			
 
				+          .getElementsByTagName("select").length;
			
 
				+        for (var i = 0; i < n2; i++) {
			
 
				+          document.documentElement
			
 
				+            .getElementsByTagName("table")[0]
			
 
				+            .getElementsByTagName("select")
			
 
				+          [i].removeAttribute("disabled");
			
 
				+        }
			
 
				+        for (var i = 0; i < n; i++) {
			
 
				+          document.documentElement
			
 
				+            .getElementsByTagName("table")[0]
			
 
				+            .getElementsByTagName("input")
			
 
				+          [i].removeAttribute("disabled");
			
 
				+        }
			
 
				+        this.canAlter = true;
			
 
				+        this.$refs.button.value = "发布";
			
 
				+      } else if (this.$refs.button.value == "发布") {
			
 
				+        if (this.validate()) {
			
 
				+          const parmas = {
			
 
				+            serverId: this.serverId,
			
 
				+            serverArea: this.serverArea,
			
 
				+            treatment: this.treatment,
			
 
				+            phone: this.phone,
			
 
				+            workDate: this.serverTime,
			
 
				+            serverType: this.serverType,
			
 
				+            salary: this.salary,
			
 
				+            categoryId: this.categoryId,
			
 
				+            stay: this.stay,
			
 
				+            status: 4,
			
 
				+            introduction: this.introduction
			
 
				+          };
			
 
				+          //是否发布确认弹框
			
 
				+          this.$confirm(`是否确认发布?`, "提示", {
			
 
				+            distinguishCancelAndClose: true,
			
 
				+            confirmButtonText: "确认",
			
 
				+            cancelButtonText: "取消",
			
 
				+            type: "warning",
			
 
				+          })
			
 
				+            .then(() => {
			
 
				+              //确认发布
			
 
				+              postStatus(parmas).then((response) => {
			
 
				+                if (response.data.code === 200) {
			
 
				+                  localStorage.removeItem('isPriva')
			
 
				+                  this.show = false;
			
 
				+                  this.statusText = "审核中";
			
 
				+                  popmessage({ type: "success", str: "发布成功" });
			
 
				+                  //锁定
			
 
				+                  const n = document.documentElement
			
 
				+                    .getElementsByTagName("table")[0]
			
 
				+                    .getElementsByTagName("input").length;
			
 
				+
			
 
				+                  const n2 = document.documentElement
			
 
				+                    .getElementsByTagName("table")[0]
			
 
				+                    .getElementsByTagName("select").length;
			
 
				+
			
 
				+                  for (var i = 0; i < n2; i++) {
			
 
				+                    document.documentElement
			
 
				+                      .getElementsByTagName("table")[0]
			
 
				+                      .getElementsByTagName("select")
			
 
				+                    [i].setAttribute("disabled", "disabled");
			
 
				+                  }
			
 
				+                  for (var i = 0; i < n; i++) {
			
 
				+                    document.documentElement
			
 
				+                      .getElementsByTagName("table")[0]
			
 
				+                      .getElementsByTagName("input")
			
 
				+                    [i].setAttribute("disabled", "disabled");
			
 
				+                  }
			
 
				+                  this.canAlter = false;
			
 
				+                  this.$refs.button.value = "修改";
			
 
				+                  this.show = true;
			
 
				+                } else {
			
 
				+                  popmessage({ type: "error", str: "发布失败请重试" });
			
 
				+                }
			
 
				+              });
			
 
				+            })
			
 
				+            .catch((action) => { });
			
 
				+        } else {
			
 
				+          alert(this.errMSg);
			
 
				+        }
			
 
				+      }
			
 
				+    },
			
 
				+    //格式验证
			
 
				+    validate() {
			
 
				+      const phoneRegx =
			
 
				+        /^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:9[1589]))\d{8}$/;
			
 
				+      if (!phoneRegx.test(this.phone)) {
			
 
				+        this.errMSg += "手机号格式不正确";
			
 
				+        return false;
			
 
				+      } else if (this.serverArea == "") {
			
 
				+        this.errMSg += "请填写完整信息";
			
 
				+        return false;
			
 
				+      } else if (this.treatment == "") {
			
 
				+        this.errMSg += "请填写完整信息";
			
 
				+        return false;
			
 
				+      } else if (this.phone == "") {
			
 
				+        this.errMSg += "请填写完整信息";
			
 
				+        return false;
			
 
				+      } else if (this.serverTime == "") {
			
 
				+        this.errMSg += "请填写完整信息";
			
 
				+        return false;
			
 
				+      } else if (this.serverType == "") {
			
 
				+        this.errMSg += "请填写完整信息";
			
 
				+        return false;
			
 
				+      } else if (this.stay == "") {
			
 
				+        this.errMSg += "请填写完整信息";
			
 
				+        return false;
			
 
				+      } else if (this.categoryId == "") {
			
 
				+        this.errMSg += "请填写完整信息";
			
 
				+        return false;
			
 
				+      }
			
 
				+      return true;
			
 
				+    },
			
 
				+    //私密还是非私密
			
 
				+    changetStatus() {
			
 
				+      var s = null;
			
 
				+      if (this.isPriva == false) {
			
 
				+        s = 0;
			
 
				+      } else if (this.isPriva == true) {
			
 
				+        s = 1;
			
 
				+      }
			
 
				+      localStorage.setItem('isPriva', s)
			
 
				+      popmessage({ type: "success", str: "修改成功" });
			
 
				+    },
			
 
				+    //发布信息
			
 
				+    PostStatus() {
			
 
				+      if (this.validate()) {
			
 
				+        const parmas = {
			
 
				+          serverId: this.serverId,
			
 
				+          serverArea: this.serverArea,
			
 
				+          treatment: this.treatment,
			
 
				+          phone: this.phone,
			
 
				+          workDate: this.serverTime,
			
 
				+          type: this.type,
			
 
				+          categoryId: this.categoryId,
			
 
				+          stay: this.stay,
			
 
				+          status: 4,
			
 
				+        };
			
 
				+        postStatus(parmas).then((response) => {
			
 
				+          if (response.data.code === 200) {
			
 
				+            popmessage({ type: "success", str: "发布成功" });
			
 
				+          }
			
 
				+        });
			
 
				+      } else {
			
 
				+        alert(this.errMSg);
			
 
				+      }
			
 
				+    },
			
 
				+    /**省市区三级联动 */
			
 
				+    addressChoose(value) {
			
 
				+      this.serverArea =
			
 
				+        CodeToText[value[0]] + CodeToText[value[1]] + CodeToText[value[2]];
			
 
				+    },
			
 
				+  },
			
 
				+  components: {
			
 
				+    IconMenu,
			
 
				+    Money,
			
 
				+    Location,
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+<style scoped>
			
 
				+.endPortrait {
			
 
				+  height: 2rem;
			
 
				+  width: 5rem;
			
 
				+  background-color: rgb(245, 245, 245);
			
 
				+  padding-left: 1rem;
			
 
				+  margin: 0;
			
 
				+}
			
 
				+
			
 
				+.right {
			
 
				+  width: 59rem;
			
 
				+  background-color: rgb(255, 255, 255);
			
 
				+  top: 1rem;
			
 
				+  left: 24rem;
			
 
				+  border: 1px solid gray;
			
 
				+  border-radius: 10px;
			
 
				+  margin-left: 25rem;
			
 
				+}
			
 
				+
			
 
				+.showTitle {
			
 
				+  position: relative;
			
 
				+  width: 100%;
			
 
				+  height: 3rem;
			
 
				+  border-bottom: 1px solid rgb(165, 162, 162);
			
 
				+  box-sizing: border-box;
			
 
				+  text-align: start;
			
 
				+  padding-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+.showTitle h2 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+}
			
 
				+
			
 
				+/* tips面板 */
			
 
				+#tips {
			
 
				+  overflow: hidden;
			
 
				+  margin: 0 auto;
			
 
				+  text-align: start;
			
 
				+  background-color: #e7f3ec;
			
 
				+  cursor: pointer;
			
 
				+  width: 90%;
			
 
				+  height: auto;
			
 
				+  padding: 0;
			
 
				+  margin-top: 1.3rem;
			
 
				+  border-radius: 1rem;
			
 
				+}
			
 
				+
			
 
				+#tips h4 {
			
 
				+  padding: 0;
			
 
				+  margin: 0;
			
 
				+  padding-top: 0.5rem;
			
 
				+  padding-left: 2rem;
			
 
				+  font-size: 1.2rem;
			
 
				+  display: inline-block;
			
 
				+}
			
 
				+
			
 
				+#serveArea {
			
 
				+  margin-bottom: 2rem;
			
 
				+}
			
 
				+
			
 
				+#tipsMsg {
			
 
				+  transition: all 0.4s ease;
			
 
				+  display: none;
			
 
				+  height: auto;
			
 
				+  padding-left: 2rem;
			
 
				+  padding-bottom: 1rem;
			
 
				+  padding-top: 1.5rem;
			
 
				+
			
 
				+  white-space: normal;
			
 
				+  word-break: break-all;
			
 
				+  padding-right: 2rem;
			
 
				+}
			
 
				+
			
 
				+#arrow {
			
 
				+  padding-left: 50rem !important;
			
 
				+}
			
 
				+
			
 
				+/* 填写信息样式
			
 
				+ */
			
 
				+#choseMsg {
			
 
				+  width: 80%;
			
 
				+  border: 1px solid rgb(112, 110, 110);
			
 
				+  border-radius: 2rem;
			
 
				+  text-align: start;
			
 
				+  margin: 0 auto;
			
 
				+  margin-top: 2rem;
			
 
				+  padding-left: 5rem;
			
 
				+}
			
 
				+
			
 
				+#choseMsg span {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.2rem;
			
 
				+  font-weight: 400;
			
 
				+  padding-right: 1rem;
			
 
				+  margin-top: 1rem;
			
 
				+}
			
 
				+
			
 
				+#choseMsg select {
			
 
				+  width: 7rem;
			
 
				+  height: 1.7em;
			
 
				+  font-size: 1rem;
			
 
				+  margin-top: 1rem;
			
 
				+  margin-right: 3rem;
			
 
				+}
			
 
				+
			
 
				+#choseMsg .theIn {
			
 
				+  width: 13rem;
			
 
				+}
			
 
				+
			
 
				+#choseMsg input {
			
 
				+  height: 1rem;
			
 
				+  margin-top: 1rem;
			
 
				+}
			
 
				+
			
 
				+#emType {
			
 
				+  margin-left: 5.5rem;
			
 
				+}
			
 
				+
			
 
				+#contact {
			
 
				+  margin-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+#residence {
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+#treatment {
			
 
				+  margin-left: 2.4rem;
			
 
				+  height: 2.4rem !important;
			
 
				+}
			
 
				+
			
 
				+#salaryIn {
			
 
				+  width: 3rem;
			
 
				+  margin-left: -1rem;
			
 
				+  margin-right: 0.5rem;
			
 
				+}
			
 
				+
			
 
				+#salary {
			
 
				+  margin-left: 4.4rem;
			
 
				+}
			
 
				+
			
 
				+/* 
			
 
				+我的状态 */
			
 
				+#myStatus {
			
 
				+  padding: 0;
			
 
				+  margin: 0;
			
 
				+  text-align: start;
			
 
				+  margin-top: 2rem;
			
 
				+}
			
 
				+
			
 
				+#myStatus #statusTitle {
			
 
				+  margin-left: 3rem;
			
 
				+  font-size: 1.2rem;
			
 
				+  font-weight: 700;
			
 
				+}
			
 
				+
			
 
				+#statusRight {
			
 
				+  display: inline-block;
			
 
				+  height: 3rem;
			
 
				+  width: auto;
			
 
				+  overflow: hidden;
			
 
				+  background-color: aqua;
			
 
				+  margin: 0 auto;
			
 
				+  margin-bottom: 0;
			
 
				+  margin-left: 9rem;
			
 
				+}
			
 
				+
			
 
				+#statusRight img {}
			
 
				+
			
 
				+#statusImg {
			
 
				+  width: 2%;
			
 
				+  height: auto;
			
 
				+  margin-left: 42rem;
			
 
				+}
			
 
				+
			
 
				+#msgStatus {
			
 
				+  margin-left: 1rem;
			
 
				+  font-weight: 600;
			
 
				+}
			
 
				+
			
 
				+#private {
			
 
				+  margin-left: 42rem;
			
 
				+  font-weight: 500;
			
 
				+  display: inline-block;
			
 
				+  padding-right: 1rem;
			
 
				+  margin-bottom: 2rem;
			
 
				+}
			
 
				+
			
 
				+input[type="button"] {
			
 
				+  background-color: #409eff;
			
 
				+  width: 6rem;
			
 
				+  height: 2rem;
			
 
				+  border-radius: 1rem;
			
 
				+  position: absolute;
			
 
				+  right: 2rem;
			
 
				+  border: none;
			
 
				+  top: 0.5rem;
			
 
				+  color: white;
			
 
				+  text-align: center;
			
 
				+  letter-spacing: 0.3rem;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-cascader .el-input {
			
 
				+  display: flex;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-input__wrapper {
			
 
				+  display: inline-flex;
			
 
				+  flex-grow: 1;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+  padding: 1px 11px;
			
 
				+  background-color: var(--el-input-bg-color, var(--el-fill-color-blank));
			
 
				+  background-image: none;
			
 
				+  border-radius: 0;
			
 
				+  transition: var(--el-transition-box-shadow);
			
 
				+  box-shadow: 0 0 0 1px var(--el-input-border-color, var(--el-border-color)) inset;
			
 
				+}
			
 
				+
			
 
				+#areaStyle {
			
 
				+  width: 15rem;
			
 
				+  margin-left: 0.1rem;
			
 
				+  height: 1.3rem !important;
			
 
				+  vertical-align: inherit;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-input__wrapper {
			
 
				+  display: inline-flex;
			
 
				+  flex-grow: 1;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+  padding: 1px 11px;
			
 
				+  background-image: none;
			
 
				+  border-radius: var(--el-input-border-radius, var(--el-border-radius-base));
			
 
				+  transition: var(--el-transition-box-shadow);
			
 
				+}
			
 
				+
			
 
				+/* 表格 */
			
 
				+
			
 
				+table {
			
 
				+  width: 95%;
			
 
				+  margin: 0 auto;
			
 
				+  margin-top: 2rem;
			
 
				+  font-size: small;
			
 
				+  font-weight: bolder;
			
 
				+  border-collapse: separate;
			
 
				+  border-spacing: 0;
			
 
				+  border: solid 2px rgb(215, 215, 215);
			
 
				+  border-radius: 20px;
			
 
				+  overflow: hidden;
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+td {
			
 
				+  text-align: left;
			
 
				+  padding: 0.5rem;
			
 
				+  border-top: 1px solid rgb(213, 213, 213);
			
 
				+}
			
 
				+
			
 
				+td:last-child,
			
 
				+th:last-child {
			
 
				+  border-right-color: transparent;
			
 
				+}
			
 
				+
			
 
				+.title {
			
 
				+  width: 5rem;
			
 
				+  background-color: rgb(245, 245, 245);
			
 
				+  padding-left: 1rem;
			
 
				+  margin: 0;
			
 
				+}
			
 
				+
			
 
				+.headPortrait {
			
 
				+  height: 6rem;
			
 
				+}
			
 
				+
			
 
				+td,
			
 
				+th {
			
 
				+  border-right: 2px solid rgb(213, 213, 213);
			
 
				+}
			
 
				+
			
 
				+.el-icon {
			
 
				+  --color: inherit;
			
 
				+  height: 1em;
			
 
				+  width: 1em;
			
 
				+  line-height: 1em;
			
 
				+  fill: currentColor;
			
 
				+  color: var(--color);
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+  font-size: large;
			
 
				+}
			
 
				+
			
 
				+table .el-icon {
			
 
				+  --color: inherit;
			
 
				+  height: 1em;
			
 
				+  width: 1em;
			
 
				+  line-height: 1em;
			
 
				+  fill: currentcolor;
			
 
				+  color: var(--color);
			
 
				+  text-align: left;
			
 
				+  font-size: large;
			
 
				+  display: inline-block;
			
 
				+  position: absolute;
			
 
				+  top: 1.1rem;
			
 
				+  left: -0.2rem;
			
 
				+}
			
 
				+
			
 
				+table td h3 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1rem;
			
 
				+}
			
 
				+
			
 
				+table td .el-icon[data-v-7641c14d] {
			
 
				+  --color: inherit;
			
 
				+  height: 1em;
			
 
				+  width: 1em;
			
 
				+  line-height: 1em;
			
 
				+  fill: currentColor;
			
 
				+  color: var(--color);
			
 
				+  font-size: 1.3rem;
			
 
				+  font-size: large;
			
 
				+  display: inline-block;
			
 
				+  position: absolute;
			
 
				+  top: 1.1rem;
			
 
				+  left: -0.2rem;
			
 
				+}
			
 
				+
			
 
				+table td div {
			
 
				+  position: relative;
			
 
				+  text-align: justify;
			
 
				+  padding-left: 1rem;
			
 
				+}
			
 
				+
			
 
				+/* 输入框的样式 */
			
 
				+input {
			
 
				+  display: inline-block;
			
 
				+  padding: 0;
			
 
				+  margin: 0;
			
 
				+  width: 90%;
			
 
				+  height: 2rem;
			
 
				+  border: none;
			
 
				+  /*   outline: none; */
			
 
				+  color: rgb(63, 62, 62);
			
 
				+  font-size: 1rem;
			
 
				+  font-weight: bold;
			
 
				+  padding-left: 0.5rem;
			
 
				+}
			
 
				+
			
 
				+.input {
			
 
				+  padding: 0;
			
 
				+  padding-left: 0.4rem;
			
 
				+}
			
 
				+
			
 
				+table select {
			
 
				+  width: 6rem;
			
 
				+  font-size: 1rem;
			
 
				+  border: none;
			
 
				+}
			
 
				+
			
 
				+table select:disabled {
			
 
				+  width: 6rem;
			
 
				+  font-size: 1rem;
			
 
				+  border: none;
			
 
				+  color: black;
			
 
				+  font-weight: 600;
			
 
				+  padding-left: 0.5rem;
			
 
				+}
			
 
				+
			
 
				+/* 薪酬样式 */
			
 
				+#salaryInput {
			
 
				+  width: 5rem;
			
 
				+}
			
 
				+
			
 
				+label {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1rem;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/PreCent/PerRight/WorkExperience/index.vue
+++ b/src/views/PreCent/PerRight/WorkExperience/index.vue
@@ -0,0 +1,428 @@
 
				+<template>
			
 
				+  <div class="right">
			
 
				+    <div class="showTitle">
			
 
				+      <el-icon>
			
 
				+        <Tickets />
			
 
				+      </el-icon>
			
 
				+      <h2>家政经历</h2>
			
 
				+      <input type="button" @click="convertMsg($event)" value="修改" />
			
 
				+    </div>
			
 
				+    <div class="smallTitle">
			
 
				+      <h4>个人描述</h4>
			
 
				+    </div>
			
 
				+    <table class="bigtable">
			
 
				+      <tr>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <h3>工作范围</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input v-model="this.workRange" type="text" disabled />
			
 
				+        </td>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <h3>擅长技能</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input v-model="this.skill" type="text" disabled />
			
 
				+        </td>
			
 
				+      </tr>
			
 
				+      <tr>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <h3>工作地点</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input v-model="this.workArea" type="text" disabled />
			
 
				+        </td>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <h3>联系方式</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input v-model="this.phoneNumber" type="text" disabled />
			
 
				+        </td>
			
 
				+      </tr>
			
 
				+    </table>
			
 
				+    <div class="smallTitle">
			
 
				+      <h4>家政经历</h4>
			
 
				+    </div>
			
 
				+    <table class="bigtable">
			
 
				+      <tr>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <h3>个人特点</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input type="text" v-model="this.characteristic" disabled />
			
 
				+        </td>
			
 
				+      </tr>
			
 
				+      <tr>
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <h3>证书</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <input type="text" v-model="this.cert" disabled />
			
 
				+        </td>
			
 
				+      </tr>
			
 
				+      <tr class="expirence">
			
 
				+        <td class="title">
			
 
				+          <div>
			
 
				+            <h3>工作经验</h3>
			
 
				+          </div>
			
 
				+        </td>
			
 
				+        <td class="input">
			
 
				+          <textarea disabled v-model="this.workExp"></textarea>
			
 
				+        </td>
			
 
				+      </tr>
			
 
				+    </table>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import {
			
 
				+  Tickets,
			
 
				+  PictureFilled,
			
 
				+  Avatar,
			
 
				+  UserFilled,
			
 
				+  Iphone,
			
 
				+  Location,
			
 
				+  Clock,
			
 
				+  User,
			
 
				+} from "@element-plus/icons-vue";
			
 
				+import { mapState } from "vuex";
			
 
				+import { userInfo, convertInfo } from "@/api";
			
 
				+export default {
			
 
				+  name: "WorkExpeirence",
			
 
				+  data() {
			
 
				+    return {
			
 
				+      workRange: "",
			
 
				+      skill: "",
			
 
				+      workArea: "",
			
 
				+      phoneNumber: "",
			
 
				+      characteristic: "",
			
 
				+      cert: "",
			
 
				+      workExp: "",
			
 
				+      age: "",
			
 
				+    };
			
 
				+  },
			
 
				+  components: {
			
 
				+    User,
			
 
				+    Clock,
			
 
				+    Location,
			
 
				+    Tickets,
			
 
				+    PictureFilled,
			
 
				+    Avatar,
			
 
				+    UserFilled,
			
 
				+    Iphone,
			
 
				+  },
			
 
				+  created() {
			
 
				+    //页面加载时就从本地通过localstorage获取存储的token值
			
 
				+    if (localStorage.getItem("token")) {
			
 
				+      this.token = localStorage.getItem("token");
			
 
				+    }
			
 
				+    userInfo().then((response) => {
			
 
				+      if (response.data.code === 200) {
			
 
				+        this.workRange = response.data.data.workRange;
			
 
				+        this.skill = response.data.data.skill;
			
 
				+        this.workArea = response.data.data.workArea;
			
 
				+        this.phoneNumber = response.data.data.phone;
			
 
				+        this.characteristic = response.data.data.characteristic;
			
 
				+        this.cert = response.data.data.cert;
			
 
				+        this.workExp = response.data.data.workExp;
			
 
				+        this.age = response.data.data.age;
			
 
				+      }
			
 
				+    });
			
 
				+  },
			
 
				+  computed: {
			
 
				+    ...mapState("PerCent", [
			
 
				+      "workRange",
			
 
				+      "skill",
			
 
				+      "workArea",
			
 
				+      "phone",
			
 
				+      "characteristic",
			
 
				+      "cert",
			
 
				+      "workExp",
			
 
				+    ]),
			
 
				+    ...mapState("LoginStore", ["tokenStore"]),
			
 
				+  },
			
 
				+  methods: {
			
 
				+    validate() {
			
 
				+      if (this.phoneNumber.length < 11) {
			
 
				+        alert("手机号长度不能小于11位");
			
 
				+        return false;
			
 
				+      }
			
 
				+      return true;
			
 
				+    },
			
 
				+    change(e) {
			
 
				+      this.$forceUpdate();
			
 
				+    },
			
 
				+    convertMsg(e) {
			
 
				+      if (e.currentTarget.getAttribute("value") == "确认修改") {
			
 
				+        //第一个表格
			
 
				+        const n = document.documentElement
			
 
				+          .getElementsByTagName("table")[0]
			
 
				+          .getElementsByTagName("input").length;
			
 
				+        /*  console.log(n); */
			
 
				+        for (var i = 0; i < n; i++) {
			
 
				+          document.documentElement
			
 
				+            .getElementsByTagName("table")[0]
			
 
				+            .getElementsByTagName("input")
			
 
				+          [i].setAttribute("disabled", "disabled");
			
 
				+        }
			
 
				+        //第二个表格
			
 
				+        const n2 = document.documentElement
			
 
				+          .getElementsByTagName("table")[1]
			
 
				+          .getElementsByTagName("input").length;
			
 
				+        /* console.log(n2); */
			
 
				+        for (var i = 0; i < n2; i++) {
			
 
				+          document.documentElement
			
 
				+            .getElementsByTagName("table")[1]
			
 
				+            .getElementsByTagName("input")
			
 
				+          [i].setAttribute("disabled", "disabled");
			
 
				+        }
			
 
				+
			
 
				+        document.documentElement
			
 
				+          .getElementsByTagName("textarea")[0]
			
 
				+          .setAttribute("disabled", "disabled");
			
 
				+        e.currentTarget.setAttribute("value", "修改");
			
 
				+        //更新个人信息
			
 
				+        const params = {
			
 
				+          workRange: this.workRange,
			
 
				+          skill: this.skill,
			
 
				+          workArea: this.workArea,
			
 
				+          phonenumber: this.phoneNumber,
			
 
				+          characteristic: this.characteristic,
			
 
				+          cert: this.cert,
			
 
				+          workExp: this.workExp,
			
 
				+          age: this.age,
			
 
				+        };
			
 
				+        if (this.validate()) {
			
 
				+          convertInfo(params).then((response) => {
			
 
				+            if (response.data.code == 200) {
			
 
				+              alert("修改成功");
			
 
				+            } else {
			
 
				+              alert("修改失败");
			
 
				+            }
			
 
				+          });
			
 
				+        }
			
 
				+        this.$router.go(0);
			
 
				+      } else {
			
 
				+        //第一个表
			
 
				+        const n = document.documentElement
			
 
				+          .getElementsByTagName("table")[0]
			
 
				+          .getElementsByTagName("input").length;
			
 
				+        /* console.log(n); */
			
 
				+        for (var i = 0; i < n; i++) {
			
 
				+          document.documentElement
			
 
				+            .getElementsByTagName("table")[0]
			
 
				+            .getElementsByTagName("input")
			
 
				+          [i].removeAttribute("disabled");
			
 
				+        }
			
 
				+        //第二个表
			
 
				+        const n2 = document.documentElement
			
 
				+          .getElementsByTagName("table")[1]
			
 
				+          .getElementsByTagName("input").length;
			
 
				+        /*    console.log(n2); */
			
 
				+        for (var i = 0; i < n2; i++) {
			
 
				+          document.documentElement
			
 
				+            .getElementsByTagName("table")[1]
			
 
				+            .getElementsByTagName("input")
			
 
				+          [i].removeAttribute("disabled");
			
 
				+        }
			
 
				+        document.documentElement
			
 
				+          .getElementsByTagName("textarea")[0]
			
 
				+          .removeAttribute("disabled");
			
 
				+        e.currentTarget.setAttribute("value", "确认修改");
			
 
				+      }
			
 
				+    },
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+<style scoped>
			
 
				+.right {
			
 
				+  width: 59rem;
			
 
				+  background-color: rgb(255, 255, 255);
			
 
				+  top: 1rem;
			
 
				+  left: 24rem;
			
 
				+  border: 1px solid gray;
			
 
				+  border-radius: 10px;
			
 
				+  margin-left: 25rem;
			
 
				+}
			
 
				+
			
 
				+.showTitle {
			
 
				+  position: relative;
			
 
				+  width: 100%;
			
 
				+  height: 3rem;
			
 
				+  border-bottom: 1px solid rgb(165, 162, 162);
			
 
				+  box-sizing: border-box;
			
 
				+  text-align: start;
			
 
				+  padding-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+.showTitle h2 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+}
			
 
				+
			
 
				+table {
			
 
				+  width: 95%;
			
 
				+  margin: 0 auto;
			
 
				+  margin-top: 0.3rem;
			
 
				+  font-size: small;
			
 
				+  font-weight: bolder;
			
 
				+  border-collapse: separate;
			
 
				+  border-spacing: 0;
			
 
				+  border: solid 2px rgb(215, 215, 215);
			
 
				+  border-radius: 20px;
			
 
				+  overflow: hidden;
			
 
				+  margin-bottom: 1.5rem;
			
 
				+}
			
 
				+
			
 
				+td {
			
 
				+  text-align: left;
			
 
				+  padding: 0.5rem;
			
 
				+  border-top: 1px solid rgb(213, 213, 213);
			
 
				+}
			
 
				+
			
 
				+td:last-child,
			
 
				+th:last-child {
			
 
				+  border-right-color: transparent;
			
 
				+}
			
 
				+
			
 
				+.title {
			
 
				+  width: 4rem;
			
 
				+  background-color: rgb(245, 245, 245);
			
 
				+  padding-left: 1rem;
			
 
				+  margin: 0;
			
 
				+  padding: 0.3rem;
			
 
				+}
			
 
				+
			
 
				+.headPortrait {
			
 
				+  height: 6rem;
			
 
				+}
			
 
				+
			
 
				+td,
			
 
				+th {
			
 
				+  border-right: 2px solid rgb(213, 213, 213);
			
 
				+}
			
 
				+
			
 
				+.el-icon {
			
 
				+  --color: inherit;
			
 
				+  height: 1em;
			
 
				+  width: 1em;
			
 
				+  line-height: 1em;
			
 
				+  fill: currentColor;
			
 
				+  color: var(--color);
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+  font-size: large;
			
 
				+}
			
 
				+
			
 
				+table td h3 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 0.8rem;
			
 
				+}
			
 
				+
			
 
				+table td .el-icon[data-v-7641c14d] {
			
 
				+  --color: inherit;
			
 
				+  height: 1em;
			
 
				+  width: 1em;
			
 
				+  line-height: 1em;
			
 
				+  fill: currentColor;
			
 
				+  color: var(--color);
			
 
				+  font-size: 1.3rem;
			
 
				+  font-size: large;
			
 
				+  display: inline-block;
			
 
				+  position: absolute;
			
 
				+  top: 0rem;
			
 
				+  left: -0.2rem;
			
 
				+}
			
 
				+
			
 
				+table td div {
			
 
				+  position: relative;
			
 
				+  text-align: justify;
			
 
				+  padding-left: 0.2rem;
			
 
				+}
			
 
				+
			
 
				+input[type="button"] {
			
 
				+  background-color: #409eff;
			
 
				+  width: 6rem;
			
 
				+  height: 2rem;
			
 
				+  border-radius: 1rem;
			
 
				+  position: absolute;
			
 
				+  right: 2rem;
			
 
				+  border: none;
			
 
				+  top: 0.5rem;
			
 
				+  color: white;
			
 
				+  text-align: center;
			
 
				+  letter-spacing: 0.3rem;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+.smallTitle {
			
 
				+  text-align: left;
			
 
				+}
			
 
				+
			
 
				+.smallTitle h4 {
			
 
				+  padding-left: 1rem;
			
 
				+  display: inline-block;
			
 
				+}
			
 
				+
			
 
				+.expirence div {
			
 
				+  padding: 1.4rem;
			
 
				+}
			
 
				+
			
 
				+input {
			
 
				+  display: inline-block;
			
 
				+  padding: 0;
			
 
				+  margin: 0;
			
 
				+  width: 90%;
			
 
				+  height: 2rem;
			
 
				+  border: none;
			
 
				+  /* outline: none; */
			
 
				+  color: rgb(63, 62, 62);
			
 
				+  font-size: 1rem;
			
 
				+  font-weight: 500;
			
 
				+  padding-left: 0.5rem;
			
 
				+}
			
 
				+
			
 
				+.input {
			
 
				+  padding: 0;
			
 
				+  padding-left: 0.4rem;
			
 
				+}
			
 
				+
			
 
				+.expirence input {
			
 
				+  height: 5rem;
			
 
				+  font-weight: 500;
			
 
				+}
			
 
				+
			
 
				+/* 工作经历输入框 */
			
 
				+textarea {
			
 
				+  resize: none;
			
 
				+  width: 90%;
			
 
				+  height: 7rem;
			
 
				+
			
 
				+  border: none;
			
 
				+  /*  outline: none; */
			
 
				+  color: black;
			
 
				+  font-size: 1rem;
			
 
				+  font-weight: 500;
			
 
				+  padding-left: 0.5rem;
			
 
				+  /* border: none; */
			
 
				+}
			
 
				+
			
 
				+/* 输入框的disabled样式清除 */
			
 
				+textarea [disabled] {
			
 
				+  background-color: rgb(248, 246, 246) !important;
			
 
				+  font-weight: bold;
			
 
				+}</style>
			
--- a/src/views/PreCent/PerRight/img/noContent.png
+++ b/src/views/PreCent/PerRight/img/noContent.png
--- a/src/views/PreCent/PerRight/index.vue
+++ b/src/views/PreCent/PerRight/index.vue
@@ -0,0 +1,42 @@
 
				+<template>
			
 
				+  <WorkExperience v-if="this.showExperience"></WorkExperience>
			
 
				+  <BasicInfo v-if="this.showBasic"></BasicInfo>
			
 
				+  <ConvertPwd v-if="this.showPwd"></ConvertPwd>
			
 
				+  <MyComment v-if="this.showComment"></MyComment>
			
 
				+  <PostStatus v-if="this.showStatus"></PostStatus>
			
 
				+  <MyOrder v-if="this.showOrder"></MyOrder>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { mapState } from "vuex";
			
 
				+import BasicInfo from "./BasicInfo";
			
 
				+import WorkExperience from "./WorkExperience";
			
 
				+import ConvertPwd from "./ConvertPwd";
			
 
				+import MyComment from "./MyComment";
			
 
				+import PostStatus from "./PostStatus";
			
 
				+import MyOrder from "./MyOrder";
			
 
				+export default {
			
 
				+  name: "PerRight",
			
 
				+  components: {
			
 
				+    MyComment,
			
 
				+    BasicInfo,
			
 
				+    WorkExperience,
			
 
				+    ConvertPwd,
			
 
				+    PostStatus,
			
 
				+    MyOrder,
			
 
				+  },
			
 
				+  computed: {
			
 
				+    ...mapState("PerCent", [
			
 
				+      "showBasic",
			
 
				+      "showExperience",
			
 
				+      "showPwd",
			
 
				+      "showComment",
			
 
				+      "showStatus",
			
 
				+      "showOrder",
			
 
				+    ]),
			
 
				+  },
			
 
				+  methods: {},
			
 
				+};
			
 
				+</script>
			
 
				+
			
 
				+<style scoped></style>
			
--- a/src/views/PreCent/img/status.png
+++ b/src/views/PreCent/img/status.png
--- a/src/views/PreCent/index.vue
+++ b/src/views/PreCent/index.vue
@@ -0,0 +1,38 @@
 
				+<template>
			
 
				+  <div class="background">
			
 
				+    <div class="bigbox">
			
 
				+      <PerLeft></PerLeft>
			
 
				+      <PerRight></PerRight>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import PerLeft from "./PerLeft";
			
 
				+import PerRight from "./PerRight";
			
 
				+export default {
			
 
				+  name: "PerCent",
			
 
				+  components: {
			
 
				+    PerRight,
			
 
				+    PerLeft,
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+<style scoped>
			
 
				+.background {
			
 
				+  width: 100%;
			
 
				+  background-color: rgb(237, 244, 237);
			
 
				+  padding-top: 4rem;
			
 
				+  padding-bottom: 4rem;
			
 
				+}
			
 
				+.bigbox {
			
 
				+  background: rgb(255, 255, 255);
			
 
				+  width: 90%;
			
 
				+  left: 50%;
			
 
				+  top: 6rem;
			
 
				+  translate: -50% 0;
			
 
				+  margin-left: 48rem;
			
 
				+  margin-top: 2rem;
			
 
				+  padding: 2rem;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/Search/ConfirmOrder/img/alipay.png
+++ b/src/views/Search/ConfirmOrder/img/alipay.png
--- a/src/views/Search/ConfirmOrder/img/process.png
+++ b/src/views/Search/ConfirmOrder/img/process.png
--- a/src/views/Search/ConfirmOrder/img/title.png
+++ b/src/views/Search/ConfirmOrder/img/title.png
--- a/src/views/Search/ConfirmOrder/index.vue
+++ b/src/views/Search/ConfirmOrder/index.vue
@@ -0,0 +1,519 @@
 
				+<template>
			
 
				+  <div id="backgroundColor">
			
 
				+    <div id="whiteBackground">
			
 
				+      <div class="right">
			
 
				+        <div class="showTitle">
			
 
				+          <img id="titleIco" src="./img/title.png" />
			
 
				+          <h2>确认订单</h2>
			
 
				+        </div>
			
 
				+        <div id="processImg">
			
 
				+          <img id="processPng" src="./img/process.png" />
			
 
				+          <hr />
			
 
				+        </div>
			
 
				+        <div id="searveDetail">
			
 
				+          <h4>确认服务时间</h4>
			
 
				+          <el-date-picker v-model="this.orderMsg.serverTime" value-format="YYYY-MM-DD hh:mm:ss" type="datetime"
			
 
				+            placeholder="选择服务时间" />
			
 
				+          <h4>确认订单信息</h4>
			
 
				+          <div id="choseMsg" class="statusMsg">
			
 
				+            <span>家政人员:</span>
			
 
				+            <input disabled :value="this.orderMsg.nickName" class="theIn" type="text" />
			
 
				+
			
 
				+            <span class="rightSpan">分类范围:</span>
			
 
				+            <input disabled :value="this.orderMsg.categoryName" class="theIn" type="text" />
			
 
				+            <br />
			
 
				+            <span>联系方式:</span>
			
 
				+            <input disabled :value="this.orderMsg.phoneNumber" class="theIn" type="text" />
			
 
				+            <span class="rightSpan">聘请类别:</span>
			
 
				+            <input disabled :value="this.orderMsg.serverType" class="theIn" type="text" />
			
 
				+            <br />
			
 
				+            <span id="totalPrice" class="rightSpan">总价:</span>
			
 
				+            <input id="priceIn" disabled :value="this.orderMsg.salary" class="theIn" type="text" />
			
 
				+
			
 
				+            <br />
			
 
				+            <span id="note">备注：</span>
			
 
				+            <textarea placeholder="选填，给家政人员留言，如上门前请先联系" v-model="this.orderMsg.note"></textarea>
			
 
				+          </div>
			
 
				+          <h4>选择支付方式</h4>
			
 
				+          <input v-model="modeOfPay" value="Alipay" type="radio" />
			
 
				+          <img id="alipayImg" src="./img/alipay.png" />
			
 
				+          <input @click="pay" type="button" value="支付" />
			
 
				+        </div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+<script>
			
 
				+import { mapState } from "vuex";
			
 
				+import { generatePayCode } from "@/api";
			
 
				+import { getCookie, delCookie } from "@/util/cookie.js";
			
 
				+
			
 
				+export default {
			
 
				+  name: "ConfirmOrder",
			
 
				+  computed: {
			
 
				+    ...mapState("LoginStore", ["tokenStore"]),
			
 
				+  },
			
 
				+  data() {
			
 
				+    return {
			
 
				+      //支付方式
			
 
				+      modeOfPay: "Alipay",
			
 
				+      orderMsg: [
			
 
				+        {
			
 
				+          nickName: "",
			
 
				+          categoryName: "",
			
 
				+          phoneNumber: "",
			
 
				+          serverType: "",
			
 
				+          salary: null,
			
 
				+          serverTime: "",
			
 
				+          note: "",
			
 
				+        },
			
 
				+      ],
			
 
				+    };
			
 
				+  },
			
 
				+  created() {
			
 
				+    if (getCookie('serverId')) {
			
 
				+      this.orderMsg.nickName = getCookie("nickName");
			
 
				+      this.orderMsg.categoryName = getCookie("categoryName");
			
 
				+      this.orderMsg.phoneNumber = getCookie("phoneNumber");
			
 
				+      this.orderMsg.serverType = getCookie("serverType");
			
 
				+      this.orderMsg.salary = getCookie("salary");
			
 
				+    }else{
			
 
				+      if (confirm('信息过期，请重新操作！')) {
			
 
				+        this.$router.go(-1)
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  methods: {
			
 
				+    pay() {
			
 
				+      //格式验证
			
 
				+      if (this.orderMsg.serverTime == undefined) {
			
 
				+        alert("请填写服务时间");
			
 
				+      } else if (this.orderMsg.note == undefined) {
			
 
				+        this.orderMsg.note = "";
			
 
				+      } else {
			
 
				+        const parmas = {
			
 
				+          userId: getCookie("userId"),
			
 
				+          serverId: getCookie("serverId"),
			
 
				+          totalPrice: getCookie("salary"),
			
 
				+          description: this.orderMsg.note,
			
 
				+          server_time: this.orderMsg.serverTime,
			
 
				+        };
			
 
				+        delCookie('serverId')
			
 
				+        delCookie('nickName')
			
 
				+        delCookie('categoryName')
			
 
				+        delCookie('phoneNumber')
			
 
				+        delCookie('serverType')
			
 
				+        delCookie('salary')
			
 
				+        generatePayCode(parmas).then((response) => {
			
 
				+          if (response.data.code === 200) {
			
 
				+            const url =
			
 
				+              "http://localhost:7777/user/pay/requestPay?payNo=" +
			
 
				+              response.data.data.payNo;
			
 
				+            window.open(url);
			
 
				+            this.$router.go(-1)
			
 
				+          }
			
 
				+        });
			
 
				+      }
			
 
				+    },
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+
			
 
				+<style scoped>
			
 
				+#backgroundColor {
			
 
				+  background-color: rgb(237, 244, 237);
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  padding-top: 4rem;
			
 
				+  padding-bottom: 3rem;
			
 
				+}
			
 
				+
			
 
				+/* //白色背景 */
			
 
				+#whiteBackground {
			
 
				+  background-color: white;
			
 
				+  width: 72rem;
			
 
				+  height: 61rem;
			
 
				+  margin: 0 auto;
			
 
				+  border-radius: 1rem;
			
 
				+  padding-top: 0.2rem;
			
 
				+  margin-top: 3rem;
			
 
				+}
			
 
				+
			
 
				+.right {
			
 
				+  text-align: left;
			
 
				+  width: 68rem;
			
 
				+  height: 52rem;
			
 
				+  background-color: rgb(255, 255, 255);
			
 
				+  border: 1px solid gray;
			
 
				+  border-radius: 10px;
			
 
				+  margin: 0 auto;
			
 
				+  margin-top: 3rem;
			
 
				+  padding-bottom: 3rem;
			
 
				+}
			
 
				+
			
 
				+.showTitle {
			
 
				+  position: relative;
			
 
				+  width: 100%;
			
 
				+  height: 3rem;
			
 
				+  border-bottom: 1px solid rgb(165, 162, 162);
			
 
				+  box-sizing: border-box;
			
 
				+  text-align: start;
			
 
				+  padding-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+.showTitle h2 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+  vertical-align: middle;
			
 
				+}
			
 
				+
			
 
				+.showTitle #titleIco {
			
 
				+  display: inline-block;
			
 
				+  width: 1.7rem;
			
 
				+  height: auto;
			
 
				+  text-align: left;
			
 
				+  vertical-align: middle;
			
 
				+}
			
 
				+
			
 
				+#processImg {
			
 
				+  text-align: center;
			
 
				+}
			
 
				+
			
 
				+#processPng {
			
 
				+  width: 94%;
			
 
				+  height: auto;
			
 
				+}
			
 
				+
			
 
				+/* 服务时间 */
			
 
				+#searveDetail h4 {
			
 
				+  margin-left: 2rem;
			
 
				+  font-size: 1.3rem;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-date-editor.el-input,
			
 
				+.el-date-editor.el-input__wrapper {
			
 
				+  width: revert;
			
 
				+  height: var(--el-input-height, var(--el-component-size));
			
 
				+  margin-left: 4rem;
			
 
				+}
			
 
				+
			
 
				+/* 表格 */
			
 
				+#serveArea {
			
 
				+  margin-bottom: 2rem;
			
 
				+}
			
 
				+
			
 
				+#tipsMsg {
			
 
				+  transition: all 0.4s ease;
			
 
				+  display: none;
			
 
				+  height: auto;
			
 
				+  padding-left: 2rem;
			
 
				+  padding-bottom: 1rem;
			
 
				+  padding-top: 1.5rem;
			
 
				+}
			
 
				+
			
 
				+#arrow {
			
 
				+  padding-left: 46rem !important;
			
 
				+}
			
 
				+
			
 
				+/* 填写信息样式
			
 
				+ */
			
 
				+#choseMsg {
			
 
				+  width: 90%;
			
 
				+  border: 1px solid rgb(112, 110, 110);
			
 
				+  border-radius: 2rem;
			
 
				+  text-align: start;
			
 
				+  margin: 0 auto;
			
 
				+  margin-top: 2rem;
			
 
				+  padding-left: 2.5rem;
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+#choseMsg span {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.2rem;
			
 
				+  font-weight: 400;
			
 
				+  padding-right: 1rem;
			
 
				+  margin-top: 1rem;
			
 
				+}
			
 
				+
			
 
				+#choseMsg select {
			
 
				+  width: 7rem;
			
 
				+  height: 1.7em;
			
 
				+  font-size: 1rem;
			
 
				+  margin-top: 1rem;
			
 
				+  margin-right: 3rem;
			
 
				+}
			
 
				+
			
 
				+#choseMsg .theIn {
			
 
				+  font-size: 1.1rem;
			
 
				+  width: 21rem;
			
 
				+  height: 1.6rem;
			
 
				+  border: none;
			
 
				+}
			
 
				+
			
 
				+#choseMsg input {
			
 
				+  height: 1rem;
			
 
				+  margin-top: 1rem;
			
 
				+}
			
 
				+
			
 
				+#emType {
			
 
				+  margin-left: 5.5rem;
			
 
				+}
			
 
				+
			
 
				+#contact {
			
 
				+  margin-left: 2rem;
			
 
				+}
			
 
				+
			
 
				+#residence {
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+#salaryIn {
			
 
				+  width: 3rem;
			
 
				+  margin-left: -1rem;
			
 
				+  margin-right: 0.5rem;
			
 
				+}
			
 
				+
			
 
				+#salary {
			
 
				+  margin-left: 4.4rem;
			
 
				+}
			
 
				+
			
 
				+/*
			
 
				+我的状态 */
			
 
				+#myStatus {
			
 
				+  padding: 0;
			
 
				+  margin: 0;
			
 
				+  text-align: start;
			
 
				+  margin-top: 2rem;
			
 
				+}
			
 
				+
			
 
				+#myStatus #statusTitle {
			
 
				+  margin-left: 3rem;
			
 
				+  font-size: 1.2rem;
			
 
				+  font-weight: 700;
			
 
				+}
			
 
				+
			
 
				+#statusRight {
			
 
				+  display: inline-block;
			
 
				+  height: 3rem;
			
 
				+  width: auto;
			
 
				+  overflow: hidden;
			
 
				+  background-color: aqua;
			
 
				+  margin: 0 auto;
			
 
				+  margin-bottom: 0;
			
 
				+  margin-left: 9rem;
			
 
				+}
			
 
				+
			
 
				+#statusRight img {}
			
 
				+
			
 
				+#msgStatus {
			
 
				+  margin-left: 1rem;
			
 
				+  font-weight: 600;
			
 
				+}
			
 
				+
			
 
				+#private {
			
 
				+  margin-left: 42rem;
			
 
				+  font-weight: 500;
			
 
				+  display: inline-block;
			
 
				+  padding-right: 1rem;
			
 
				+  margin-bottom: 2rem;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-cascader .el-input {
			
 
				+  display: flex;
			
 
				+  cursor: pointer;
			
 
				+  border: 1px solid black;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-input__wrapper {
			
 
				+  display: inline-flex;
			
 
				+  flex-grow: 1;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+  padding: 1px 11px;
			
 
				+  background-color: var(--el-input-bg-color, var(--el-fill-color-blank));
			
 
				+  background-image: none;
			
 
				+  border-radius: 0;
			
 
				+  transition: var(--el-transition-box-shadow);
			
 
				+  box-shadow: 0 0 0 1px var(--el-input-border-color, var(--el-border-color)) inset;
			
 
				+}
			
 
				+
			
 
				+#areaStyle {
			
 
				+  width: 15rem;
			
 
				+  margin-left: 0.1rem;
			
 
				+  height: 1.3rem !important;
			
 
				+  vertical-align: inherit;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-input__wrapper {
			
 
				+  display: inline-flex;
			
 
				+  flex-grow: 1;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+  padding: 1px 11px;
			
 
				+  background-image: none;
			
 
				+  border-radius: var(--el-input-border-radius, var(--el-border-radius-base));
			
 
				+  transition: var(--el-transition-box-shadow);
			
 
				+}
			
 
				+
			
 
				+#topContent {
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+  text-align: left;
			
 
				+}
			
 
				+
			
 
				+#topContent label {
			
 
				+  font-size: 1.1rem;
			
 
				+  margin-top: 1rem;
			
 
				+}
			
 
				+
			
 
				+.hr {
			
 
				+  position: absolute;
			
 
				+  left: 2rem;
			
 
				+  width: 55rem;
			
 
				+}
			
 
				+
			
 
				+/* 备注 */
			
 
				+input::input-placeholder {
			
 
				+  color: rgba(63, 55, 55, 0.3);
			
 
				+}
			
 
				+
			
 
				+textarea {
			
 
				+  resize: none;
			
 
				+  width: 84%;
			
 
				+  height: 6rem;
			
 
				+  border: none;
			
 
				+  /* outline: none; */
			
 
				+  color: rgb(30, 23, 23) !important;
			
 
				+  padding: 0.5rem;
			
 
				+  font-size: 1rem;
			
 
				+  font-weight: bold;
			
 
				+  margin-top: -1rem;
			
 
				+  /* border: none; */
			
 
				+  margin-left: 6.3rem;
			
 
				+  margin-bottom: 1rem;
			
 
				+  background-color: rgba(239, 239, 239, 0.3);
			
 
				+  font-size: 1rem;
			
 
				+}
			
 
				+
			
 
				+/* 状态图片 */
			
 
				+#statusImg {
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+  width: 3%;
			
 
				+  height: auto;
			
 
				+}
			
 
				+
			
 
				+/* 订单头部 */
			
 
				+.orderId {
			
 
				+  width: 18rem;
			
 
				+  text-align: left;
			
 
				+  padding: 0.2rem;
			
 
				+  display: inline-block;
			
 
				+}
			
 
				+
			
 
				+/* 雇主 */
			
 
				+#employer {
			
 
				+  margin-right: 2.2rem;
			
 
				+}
			
 
				+
			
 
				+.rightSpan {
			
 
				+  margin-left: 3.5rem;
			
 
				+  text-align: start;
			
 
				+}
			
 
				+
			
 
				+/*
			
 
				+总价 */
			
 
				+#totalPrice {
			
 
				+  margin-right: 2.5rem;
			
 
				+  margin-left: 0rem;
			
 
				+  vertical-align: revert;
			
 
				+}
			
 
				+
			
 
				+#priceIn {
			
 
				+  width: 52rem !important;
			
 
				+  height: 4rem !important;
			
 
				+}
			
 
				+
			
 
				+/* 备注 */
			
 
				+#note {
			
 
				+  position: relative;
			
 
				+  top: 0rem;
			
 
				+  left: 0.2rem;
			
 
				+}
			
 
				+
			
 
				+#statusSpan {
			
 
				+  vertical-align: text-bottom;
			
 
				+  margin-left: 0.3rem;
			
 
				+}
			
 
				+
			
 
				+/* 按钮 */
			
 
				+.firstBotton {
			
 
				+  margin-left: 38rem;
			
 
				+}
			
 
				+
			
 
				+input[type="button"] {
			
 
				+  margin-top: 0.2rem;
			
 
				+  background-color: #409eff;
			
 
				+  width: 6rem;
			
 
				+  height: 2rem !important;
			
 
				+  border-radius: 1rem;
			
 
				+  display: inline-block;
			
 
				+  right: 2rem;
			
 
				+  border: none;
			
 
				+  margin-right: 1rem;
			
 
				+  color: white;
			
 
				+  letter-spacing: 0.3rem;
			
 
				+  cursor: pointer;
			
 
				+  margin-bottom: 0.7rem;
			
 
				+  font-weight: 500;
			
 
				+}
			
 
				+
			
 
				+.secondBotton {
			
 
				+  background-color: white !important;
			
 
				+  border: 1px solid black !important;
			
 
				+  color: black !important;
			
 
				+}
			
 
				+
			
 
				+.commentButton {
			
 
				+  margin-left: 45rem;
			
 
				+}
			
 
				+
			
 
				+.refund {
			
 
				+  margin-left: 45rem;
			
 
				+}
			
 
				+
			
 
				+.tophr {
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+/* 支付 */
			
 
				+#alipayImg {
			
 
				+  width: 8rem;
			
 
				+  height: auto;
			
 
				+  display: inline-block;
			
 
				+}
			
 
				+
			
 
				+input[type="radio"] {
			
 
				+  vertical-align: middle;
			
 
				+  margin-left: 1.5rem;
			
 
				+  width: 1.2rem;
			
 
				+  height: 1.2rem;
			
 
				+  margin-top: -2rem;
			
 
				+  margin-right: 0.5rem;
			
 
				+}
			
 
				+
			
 
				+input[type="button"] {
			
 
				+  width: 7rem;
			
 
				+  height: 2.5rem !important;
			
 
				+  border-radius: 3.5rem;
			
 
				+  color: white;
			
 
				+  background-color: #52a7f8;
			
 
				+  border: none;
			
 
				+  margin-left: 47rem;
			
 
				+  font-size: 1.2rem;
			
 
				+  padding: 0;
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/Search/index.vue
+++ b/src/views/Search/index.vue
@@ -0,0 +1,69 @@
 
				+<template>
			
 
				+  <div id="color">
			
 
				+    <div id="background">
			
 
				+      <searchBox></searchBox>
			
 
				+      <RightNav></RightNav>
			
 
				+      <mainContent></mainContent>
			
 
				+      <nav v-if="this.getTotal * 1" style="text-align: -webkit-center">
			
 
				+        <el-pagination :page-size="this.getPageSize" style="width: max-content" :current-page="this.getPageNum"
			
 
				+          @current-change="handleCurrentChange" layout="prev, pager, next" :total="this.getTotal * 1" />
			
 
				+      </nav>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import searchBox from "./searchBox";
			
 
				+import RightNav from "@/components/RightNav";
			
 
				+import mainContent from "./mainContent";
			
 
				+import { mapGetters, mapMutations } from 'vuex'
			
 
				+export default {
			
 
				+  name: "Search",
			
 
				+  components: {
			
 
				+    searchBox,
			
 
				+    RightNav,
			
 
				+    mainContent,
			
 
				+  },
			
 
				+  data() {
			
 
				+
			
 
				+  },
			
 
				+  methods: {
			
 
				+    ...mapMutations("SearchStore", ["changePageNum", "changePageSize"]),
			
 
				+    handleCurrentChange(val) {
			
 
				+      this.changePageNum(val);
			
 
				+    },
			
 
				+    handleCurrentSizeChange(val) {
			
 
				+      this.changePageSize(val);
			
 
				+    },
			
 
				+  },
			
 
				+  watch: {
			
 
				+    getTotal(newValue, oldValue) {
			
 
				+      console.log("getTotal changed to:", newValue);
			
 
				+    },
			
 
				+    getPageNum(newValue, oldValue) {
			
 
				+      console.log("getPageNum changed to:", newValue);
			
 
				+    },
			
 
				+    getPageSize(newValue, oldValue){
			
 
				+      console.log("getPageSize changed to:", newValue);
			
 
				+    }
			
 
				+  },
			
 
				+  computed: {
			
 
				+    ...mapGetters("SearchStore", ["getPageNum", "getTotal","getPageSize"]),
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+<style scoped>
			
 
				+#background {
			
 
				+  width: 100%;
			
 
				+  margin-top: -1rem;
			
 
				+  margin: 0 auto;
			
 
				+  padding-bottom: 2rem;
			
 
				+  /* background-color: rgb(237, 244, 237); */
			
 
				+}
			
 
				+
			
 
				+#color {
			
 
				+  width: 100%;
			
 
				+  background-color: rgb(237, 244, 237);
			
 
				+  padding-bottom: 6rem;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/Search/mainContent/img/noContent.png
+++ b/src/views/Search/mainContent/img/noContent.png
--- a/src/views/Search/mainContent/img/search.png
+++ b/src/views/Search/mainContent/img/search.png
--- a/src/views/Search/mainContent/img/校徽.png
+++ b/src/views/Search/mainContent/img/校徽.png
--- a/src/views/Search/mainContent/index.vue
+++ b/src/views/Search/mainContent/index.vue
@@ -0,0 +1,384 @@
 
				+<template>
			
 
				+  <div id="bigBox">
			
 
				+    <div id="left">
			
 
				+      <img id="searchPic" src="./img/search.png" />
			
 
				+      <input type="button" @click="toLogin" value="去登录" />
			
 
				+    </div>
			
 
				+    <div id="right">
			
 
				+      <div class="content" v-for="item in this.searchList">
			
 
				+        <div id="avatar">
			
 
				+          <img :src="item.avatar" />
			
 
				+        </div>
			
 
				+        <h5 class="name">{{ item.serverNickName }}</h5>
			
 
				+        <div class="three first">{{ item.categoryName }}</div>
			
 
				+        <div class="three">{{ item.serverType == 1 ? '长期工' : item.serverType == 2 ? '短期工' : '出现错误' }}</div>
			
 
				+        <div class="three">{{ item.stay == 1 ? '住家' : item.stay == 2 ? '不住家' : '出现错误' }}</div>
			
 
				+        <br />
			
 
				+        <div id="bottom">
			
 
				+          <label>薪酬：</label>
			
 
				+          <h4 id="money">{{ item.salary }}</h4>
			
 
				+          <label>元/(次/日)</label>
			
 
				+          <label id="phoneLabel">联系方式:</label>
			
 
				+          <h4 id="phone">{{ item.phone }}</h4>
			
 
				+        </div>
			
 
				+        <input style="cursor: pointer" type="button" @click="appointment(item)" value="预约" />
			
 
				+        <hr />
			
 
				+        <label id="areaLabel">地区:</label>
			
 
				+        <h4 id="workArea">{{ item.serverArea }}</h4>
			
 
				+        <label id="areaLabel">简介:</label>
			
 
				+        <h4 id="workArea">{{ item.introduction.substring(0, 4) + "......" }}</h4>
			
 
				+        <label @click="serveDetail(item.serverId)" id="detailLabel">点击详情</label>
			
 
				+        <div id="insulate"></div>
			
 
				+      </div>
			
 
				+      <div v-if="!(this.getTotal * 1)">
			
 
				+        <img id="noImg" src="./img/noContent.png" />
			
 
				+        <h3 id="noH3">没有内容.....</h3>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <div class="clear"></div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+<script>
			
 
				+import { searchServerWithNoCondition } from "@/api";
			
 
				+import { mapActions, mapState } from "vuex";
			
 
				+import popmessage from "@/components/tip/index.js";
			
 
				+import { mapMutations } from "vuex";
			
 
				+import { mapGetters } from "vuex";
			
 
				+import { setCookie } from "@/util/cookie.js";
			
 
				+
			
 
				+export default {
			
 
				+  name: "mainContent",
			
 
				+  data() {
			
 
				+    return {
			
 
				+      count: 0,
			
 
				+      content: [],
			
 
				+      result: "",
			
 
				+    };
			
 
				+  },
			
 
				+  computed: {
			
 
				+    ...mapGetters("SearchStore", [
			
 
				+      "getSearchList",
			
 
				+      "getPageNum",
			
 
				+      "getParmas",
			
 
				+      "getTotal",
			
 
				+    ]),
			
 
				+    ...mapState("SearchStore", ["searchList", "total"]),
			
 
				+  },
			
 
				+  methods: {
			
 
				+    ...mapMutations("SearchStore", [
			
 
				+      "setList",
			
 
				+      "changePageNum",
			
 
				+      "setId",
			
 
				+      "setTotal",
			
 
				+    ]),
			
 
				+    ...mapActions("SearchStore", ["searchServerAction"]),
			
 
				+    toLogin() {
			
 
				+      if (
			
 
				+        localStorage.getItem("token") ||
			
 
				+        localStorage.getItem("token") == ""
			
 
				+      ) {
			
 
				+        popmessage({ type: "warn", str: "您已登录" });
			
 
				+      } else {
			
 
				+        this.$router.push("/loginview");
			
 
				+      }
			
 
				+    },
			
 
				+    //预约
			
 
				+    appointment(item) {
			
 
				+      if (
			
 
				+        !localStorage.getItem("token") ||
			
 
				+        localStorage.getItem("token") == ""
			
 
				+      ) {
			
 
				+        alert("请先登录")
			
 
				+        popmessage({ type: "warn", str: "请您登录之后再进行预约" });
			
 
				+        this.$router.push("/loginview");
			
 
				+      } else {
			
 
				+        setCookie("serverId", item.id);
			
 
				+        setCookie("nickName", item.serverNickName, 1);
			
 
				+        setCookie("categoryName", item.categoryName, 1);
			
 
				+        setCookie("phoneNumber", item.phone, 1);
			
 
				+        setCookie("serverType", item.serverType, 1);
			
 
				+        setCookie("salary", item.salary, 1);
			
 
				+        this.$router.push("/confirm_order");
			
 
				+      }
			
 
				+    },
			
 
				+    serveDetail(id) {
			
 
				+      if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
			
 
				+        alert("请先登录")
			
 
				+        return
			
 
				+      }
			
 
				+      this.setId(id);
			
 
				+      this.$router.push("/serve_detail");
			
 
				+    },
			
 
				+  },
			
 
				+
			
 
				+  created() {
			
 
				+    const parmas = {
			
 
				+      pageNum: 1,
			
 
				+      pageSize: 3,
			
 
				+    }
			
 
				+    searchServerWithNoCondition(parmas).then((response) => {
			
 
				+      if (response.data.code === 200) {
			
 
				+        this.content = response.data.data.rows;
			
 
				+        this.content.forEach(e => {
			
 
				+          // 渲染serverArea
			
 
				+          if (e.serverArea.substring(0, 2) === '全部') {
			
 
				+            e.serverArea = e.serverArea = '全国范围内'
			
 
				+          } else {
			
 
				+            e.serverArea = e.serverArea.replace('全部', '内')
			
 
				+            e.serverArea = e.serverArea.replace('undefined', '')
			
 
				+          }
			
 
				+        })
			
 
				+        this.count = response.data.data.total;
			
 
				+        this.setTotal(this.count);
			
 
				+        this.setList(this.content);
			
 
				+      }
			
 
				+    });
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+<style scoped>
			
 
				+#bigBox {
			
 
				+  /* background-color: aqua; */
			
 
				+  /* top: 8rem; */
			
 
				+  /* left: 0rem; */
			
 
				+  margin-top: 6rem;
			
 
				+}
			
 
				+
			
 
				+#bigBox #searchPic {
			
 
				+  width: 22rem;
			
 
				+  height: auto;
			
 
				+  top: 0rem;
			
 
				+  left: 0rem;
			
 
				+  min-width: 20rem;
			
 
				+  max-width: 24rem;
			
 
				+  /* display: inline-block; */
			
 
				+  border-radius: 1rem;
			
 
				+  display: inline-block;
			
 
				+  margin-left: -57rem;
			
 
				+}
			
 
				+
			
 
				+#left input[type="button"] {
			
 
				+  top: 10rem;
			
 
				+  left: 12rem;
			
 
				+  font-size: 1.3rem;
			
 
				+  letter-spacing: 0.2rem;
			
 
				+  font-weight: 800;
			
 
				+  border: none;
			
 
				+  border-radius: 1.3rem;
			
 
				+  background-color: #f9ec90;
			
 
				+  padding: 0.5rem 1.8rem;
			
 
				+  cursor: pointer;
			
 
				+  min-width: 8rem;
			
 
				+  max-width: 12rem;
			
 
				+  display: inline-block;
			
 
				+  z-index: 99;
			
 
				+  position: relative;
			
 
				+  top: -8rem;
			
 
				+  left: -10rem;
			
 
				+}
			
 
				+
			
 
				+/* 右侧内容样式 */
			
 
				+#right {
			
 
				+  top: 0rem;
			
 
				+  left: 25rem;
			
 
				+  text-align: start;
			
 
				+  width: 66rem;
			
 
				+  margin-top: -21rem;
			
 
				+  margin-left: 29rem;
			
 
				+}
			
 
				+
			
 
				+#right .content {
			
 
				+  position: relative;
			
 
				+  top: 0rem;
			
 
				+  left: 0rem;
			
 
				+  background: white;
			
 
				+  margin-bottom: 1rem;
			
 
				+  width: 63rem;
			
 
				+  border-radius: 2rem;
			
 
				+  font-weight: 600;
			
 
				+}
			
 
				+
			
 
				+#right #avatar {
			
 
				+  position: absolute;
			
 
				+  top: 1rem;
			
 
				+  left: 1rem;
			
 
				+  width: 4rem;
			
 
				+  height: 4rem;
			
 
				+  /* background-color: #f9ec90; */
			
 
				+  border-radius: 2rem;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+
			
 
				+#avatar img {
			
 
				+  height: 4rem;
			
 
				+  width: auto;
			
 
				+}
			
 
				+
			
 
				+#right .name {
			
 
				+  text-align: start;
			
 
				+  display: inline-block;
			
 
				+  position: absolute;
			
 
				+  top: 1.5rem;
			
 
				+  left: 6rem;
			
 
				+  width: 10rem;
			
 
				+  overflow: hidden;
			
 
				+  font-size: 1rem;
			
 
				+}
			
 
				+
			
 
				+.content .three {
			
 
				+  font-size: 1rem;
			
 
				+  display: inline-block;
			
 
				+  width: 4.2rem;
			
 
				+  overflow: hidden;
			
 
				+  margin-left: 1rem;
			
 
				+  margin-top: 0.8rem;
			
 
				+  color: #68aa84;
			
 
				+  background-color: #e2e7e0;
			
 
				+  text-align: center;
			
 
				+  border-radius: 0.2rem;
			
 
				+  padding: 0.1rem 0.3rem;
			
 
				+  font-weight: bold;
			
 
				+}
			
 
				+
			
 
				+.content .first {
			
 
				+  margin-left: 13rem;
			
 
				+}
			
 
				+
			
 
				+.content #phoneLabel {
			
 
				+  margin-left: 7rem;
			
 
				+}
			
 
				+
			
 
				+.content input[type="button"] {
			
 
				+  width: 5rem;
			
 
				+  height: 2rem;
			
 
				+  border-radius: 1rem;
			
 
				+  color: white;
			
 
				+  background-color: #52a7f8;
			
 
				+  border: none;
			
 
				+  margin-left: 12rem;
			
 
				+}
			
 
				+
			
 
				+.content #bottom {
			
 
				+  font-size: 1.1rem;
			
 
				+  display: inline-block;
			
 
				+  margin-top: 1rem;
			
 
				+  margin-left: 13rem;
			
 
				+  top: 0rem;
			
 
				+  left: 0rem;
			
 
				+}
			
 
				+
			
 
				+.content hr {
			
 
				+  margin: 0 auto;
			
 
				+  padding: 0;
			
 
				+  margin-top: 1rem;
			
 
				+  width: 90%;
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+.content h4 {
			
 
				+  display: inline-block;
			
 
				+}
			
 
				+
			
 
				+.content #money {
			
 
				+  width: 2.2rem;
			
 
				+  overflow: hidden;
			
 
				+  padding: 0;
			
 
				+  margin: 0;
			
 
				+  vertical-align: middle;
			
 
				+}
			
 
				+
			
 
				+.content #phone {
			
 
				+  width: 7rem;
			
 
				+  overflow: hidden;
			
 
				+  padding: 0;
			
 
				+  margin: 0;
			
 
				+  vertical-align: middle;
			
 
				+}
			
 
				+
			
 
				+.content label {
			
 
				+  margin-right: 0.2rem;
			
 
				+  font-weight: 600;
			
 
				+}
			
 
				+
			
 
				+#areaLabel {
			
 
				+  margin-left: 2rem;
			
 
				+  vertical-align: middle;
			
 
				+}
			
 
				+
			
 
				+#skillLabel {
			
 
				+  margin-left: 0rem;
			
 
				+}
			
 
				+
			
 
				+#detailLabel {
			
 
				+  margin-left: 0rem;
			
 
				+  color: #8191ba;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+#workArea {
			
 
				+  width: 20rem;
			
 
				+  overflow: hidden;
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+  vertical-align: middle;
			
 
				+}
			
 
				+
			
 
				+#skill {
			
 
				+  width: 25rem;
			
 
				+  overflow: hidden;
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+  vertical-align: middle;
			
 
				+}
			
 
				+
			
 
				+#insulate {
			
 
				+  display: block;
			
 
				+  height: 1rem;
			
 
				+  width: 3rem;
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+/* 分页按钮 */
			
 
				+::v-deep .el-pagination {
			
 
				+  --el-pagination-font-size: 1.1rem;
			
 
				+  --el-pagination-bg-color: var(--el-fill-color-blank);
			
 
				+  --el-pagination-text-color: var(--el-text-color-primary);
			
 
				+  --el-pagination-border-radius: 2px;
			
 
				+  --el-pagination-button-color: var(--el-text-color-primary);
			
 
				+  --el-pagination-button-width: 3rem;
			
 
				+  --el-pagination-button-height: 3rem;
			
 
				+  --el-pagination-button-disabled-color: var(--el-text-color-placeholder);
			
 
				+  --el-pagination-button-disabled-bg-color: var(--el-fill-color-blank);
			
 
				+  --el-pagination-button-bg-color: var(--el-fill-color);
			
 
				+  --el-pagination-hover-color: var(--el-color-primary);
			
 
				+  --el-pagination-font-size-small: 12px;
			
 
				+  --el-pagination-button-width-small: 24px;
			
 
				+  --el-pagination-button-height-small: 24px;
			
 
				+  --el-pagination-item-gap: 16px;
			
 
				+  white-space: nowrap;
			
 
				+  color: var(--el-pagination-text-color);
			
 
				+  font-size: var(--el-pagination-font-size);
			
 
				+  font-weight: 400;
			
 
				+  align-items: center;
			
 
				+}
			
 
				+
			
 
				+/* 缺省页 */
			
 
				+#noImg {
			
 
				+  width: 26rem;
			
 
				+  margin-left: 20rem;
			
 
				+}
			
 
				+
			
 
				+#noH3 {
			
 
				+  margin-left: 32rem;
			
 
				+}
			
 
				+
			
 
				+/* 清除浮动 */
			
 
				+.clear {
			
 
				+  clear: both;
			
 
				+}
			
 
				+
			
 
				+/* 左侧图片 */
			
 
				+#left {
			
 
				+  margin: 0;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/Search/searchBox/img/定位.png
+++ b/src/views/Search/searchBox/img/定位.png
--- a/src/views/Search/searchBox/index.vue
+++ b/src/views/Search/searchBox/index.vue
@@ -0,0 +1,702 @@
 
				+<template>
			
 
				+  <div id="background">
			
 
				+    <div id="topBox">
			
 
				+      <img src="./img/定位.png" />
			
 
				+      <el-cascader v-model="selectedOptions" :options="options" @change="addressChoose" placeholder="请选择地区" />
			
 
				+      <div id="searchInp">
			
 
				+        <input @keyup.enter.native="search" type="search" v-model="parmas.introduction" />
			
 
				+        <span @click="search" id="searchButton" placeholder="请输入关键字">搜索</span>
			
 
				+      </div>
			
 
				+      <div class="categoryBox">
			
 
				+        <span>家政分类</span>
			
 
				+
			
 
				+        <div class="catagoryList">
			
 
				+          <div class="categoryItem" v-for="(item, i) in category">
			
 
				+            <span tabindex="i" @click="selectCategory($event)">{{ item.name }}</span>
			
 
				+          </div>
			
 
				+        </div>
			
 
				+        <el-button @click.native="resetPage" native-type="reset" id="resetButton" class="cancelBtn"
			
 
				+          round="true">重置</el-button>
			
 
				+        <br />
			
 
				+        <span id="salaryRank">薪酬(次/元)</span>
			
 
				+        <div class="catagoryList">
			
 
				+          <div class="categoryItem" v-for="(item, i) in salaryList">
			
 
				+            <span @click="selectSalary($event)">{{ item }}</span>
			
 
				+          </div>
			
 
				+        </div>
			
 
				+        <label>薪酬排序</label>
			
 
				+        <label ref="up" @click="upSalary">升序</label>
			
 
				+        <label ref="down" @click="downSalary">降序</label>
			
 
				+      </div>
			
 
				+      <div id="bottom">
			
 
				+        <span>聘请类别</span>
			
 
				+        <label>长期工</label>
			
 
				+        <input @click="convertServerType('1')" v-model="isLong" type="radio" name="serverType" value="1">
			
 
				+        <label>短期工</label>
			
 
				+        <input @click="convertServerType('2')" v-model="isLong" type="radio" name="serverType" value="2" />
			
 
				+        <span>是否住家</span>
			
 
				+        <label>住家</label>
			
 
				+        <input @click="isStay('1')" v-model="isHome" value="1" type="radio" name="stay" />
			
 
				+        <label>不住家</label>
			
 
				+        <input @click="isStay('2')" v-model="isHome" value="2" type="radio" name="stay" />
			
 
				+      </div>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+<script>
			
 
				+import { categoryListApi, searchByIntroduction, searchServerWithNoCondition } from "@/api";
			
 
				+import {
			
 
				+  regionDataPlus,
			
 
				+  CodeToText,
			
 
				+} from "element-china-area-data";
			
 
				+import { searchServer } from "@/api";
			
 
				+import { mapGetters, mapMutations, mapState } from "vuex";
			
 
				+export default {
			
 
				+  name: "searchBox",
			
 
				+  data() {
			
 
				+    return {
			
 
				+      category: [],
			
 
				+      searchFlag: 0,
			
 
				+      serverType: "0",
			
 
				+      stay: '0',
			
 
				+      isHome: null,
			
 
				+      isLong: null,
			
 
				+      homeClick: null,
			
 
				+      content: [],
			
 
				+      options: regionDataPlus,
			
 
				+      selectedOptions: [],
			
 
				+      serveArea: "",
			
 
				+      salaryList: ["不限", "100以下", "100-300", "300-500", "500以上"],
			
 
				+      parmas: {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 3,
			
 
				+        nickName: "",
			
 
				+        salaryOrder: 0,
			
 
				+        categoryName: "不限",
			
 
				+        salary: '0',
			
 
				+        stay: '0',
			
 
				+        // 表示家政人员
			
 
				+        userType: 1,
			
 
				+        workArea: "",
			
 
				+        // 长期工or短期工
			
 
				+        serverType: '',
			
 
				+        introduction: ''
			
 
				+      },
			
 
				+    };
			
 
				+  },
			
 
				+  computed: {
			
 
				+    ...mapState("SearchStore", ["searchList", "isByCondition"]),
			
 
				+    ...mapGetters("SearchStore", ["getPageNum", "getTotal", "getPageSize"]),
			
 
				+  },
			
 
				+  created() {
			
 
				+    // 家政分类
			
 
				+    categoryListApi().then((response) => {
			
 
				+      if (response.data.code === 200) {
			
 
				+        this.category = response.data.data;
			
 
				+      }
			
 
				+    });
			
 
				+  },
			
 
				+  // 监控页码变化
			
 
				+  watch: {
			
 
				+    getPageNum(newVal, oldVal) {
			
 
				+      if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
			
 
				+        alert("请先登录")
			
 
				+        return
			
 
				+      }
			
 
				+      if (this.isByCondition === false && this.searchFlag === 0) {
			
 
				+        let params = {
			
 
				+          pageNum: newVal,
			
 
				+          pageSize: this.getPageSize
			
 
				+        }
			
 
				+        searchServerWithNoCondition(params).then((response) => {
			
 
				+          if (response.data.code === 200) {
			
 
				+            this.content = response.data.data.rows;
			
 
				+            this.count = response.data.data.total;
			
 
				+            this.content.forEach(e => {
			
 
				+              // 渲染serverArea
			
 
				+              if (e.serverArea.substring(0, 2) === '全部') {
			
 
				+                e.serverArea = e.serverArea = '全国范围内'
			
 
				+              } else {
			
 
				+                e.serverArea = e.serverArea.replace('全部', '内')
			
 
				+                e.serverArea = e.serverArea.replace('undefined', '')
			
 
				+              }
			
 
				+            })
			
 
				+            this.setTotal(this.count);
			
 
				+            this.setList(this.content);
			
 
				+          }
			
 
				+        });
			
 
				+      } else if (this.isByCondition === true && this.searchFlag === 0) {
			
 
				+        this.parmas.pageNum = newVal
			
 
				+        this.setParmas(this.parmas);
			
 
				+        searchServer(this.parmas).then((response) => {
			
 
				+          if (response.data.code === 200) {
			
 
				+            this.content = response.data.data.rows;
			
 
				+            this.content.forEach(e => {
			
 
				+              e.serverArea = e.workArea
			
 
				+            })
			
 
				+            this.content.forEach(e => {
			
 
				+              // 渲染serverArea
			
 
				+              if (e.serverArea.substring(0, 2) === '全部') {
			
 
				+                e.serverArea = e.serverArea = '全国范围内'
			
 
				+              } else {
			
 
				+                e.serverArea = e.serverArea.replace('全部', '内')
			
 
				+                e.serverArea = e.serverArea.replace('undefined', '')
			
 
				+              }
			
 
				+            })
			
 
				+            this.setTotal(response.data.data.total);
			
 
				+            this.setList(this.content);
			
 
				+          }
			
 
				+        });
			
 
				+      } else if (this.searchFlag === 1 && this.isByCondition === true) {
			
 
				+        let param = {
			
 
				+          introduction: this.parmas.introduction,
			
 
				+          pageSize: this.parmas.pageSize,
			
 
				+          pageNum: this.parmas.pageNum
			
 
				+        }
			
 
				+        searchByIntroduction(param).then((response) => {
			
 
				+          if (response.data.code == 200) {
			
 
				+            this.content = response.data.data.rows;
			
 
				+            this.setTotal(response.data.data.total);
			
 
				+            this.setList(this.content);
			
 
				+          }
			
 
				+        });
			
 
				+      }
			
 
				+    },
			
 
				+    getPageSize(newVal, oldVal) {
			
 
				+      if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
			
 
				+        alert("请先登录")
			
 
				+        return
			
 
				+      }
			
 
				+      let params = {
			
 
				+        pageNum: this.getPageNum,
			
 
				+        pageSize: newVal
			
 
				+      }
			
 
				+      searchServerWithNoCondition(params).then((response) => {
			
 
				+        if (response.data.code === 200) {
			
 
				+          this.content = response.data.data.rows;
			
 
				+          this.content.forEach(e => {
			
 
				+              // 渲染serverArea
			
 
				+              if (e.serverArea.substring(0, 2) === '全部') {
			
 
				+                e.serverArea = e.serverArea = '全国范围内'
			
 
				+              } else {
			
 
				+                e.serverArea = e.serverArea.replace('全部', '内')
			
 
				+                e.serverArea = e.serverArea.replace('undefined', '')
			
 
				+              }
			
 
				+            })
			
 
				+          this.count = response.data.data.total;
			
 
				+          this.setTotal(this.count);
			
 
				+          this.setList(this.content);
			
 
				+        }
			
 
				+      });
			
 
				+      this.parmas.pageNum = newVal
			
 
				+      this.setParmas(this.parmas);
			
 
				+      searchServer(this.parmas).then((response) => {
			
 
				+        if (response.data.code === 200) {
			
 
				+          this.content = response.data.data.rows;
			
 
				+          this.content.forEach(e => {
			
 
				+            e.serverArea = e.workArea
			
 
				+          })
			
 
				+          this.content.forEach(e => {
			
 
				+              // 渲染serverArea
			
 
				+              if (e.serverArea.substring(0, 2) === '全部') {
			
 
				+                e.serverArea = e.serverArea = '全国范围内'
			
 
				+              } else {
			
 
				+                e.serverArea = e.serverArea.replace('全部', '内')
			
 
				+                e.serverArea = e.serverArea.replace('undefined', '')
			
 
				+              }
			
 
				+            })
			
 
				+          this.setTotal(response.data.data.total);
			
 
				+          this.setList(this.content);
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+  },
			
 
				+  methods: {
			
 
				+    ...mapMutations("SearchStore", ["setParmas", "setList", "setTotal"]),
			
 
				+    ...mapMutations("SearchStore", ["convertParmas", "changePageNum", "changePageSize", "changeIsByCondition"]),
			
 
				+    ...mapGetters("SearchStore", ["getParmas"]),
			
 
				+    // 选择分类
			
 
				+    selectCategory(e) {
			
 
				+      for (
			
 
				+        var i = 0;
			
 
				+        i < e.currentTarget.parentNode.parentNode.children.length;
			
 
				+        i++
			
 
				+      ) {
			
 
				+        e.currentTarget.parentNode.parentNode.children[i].children[0].className = null;
			
 
				+      }
			
 
				+      e.currentTarget.className = "activeSpan";
			
 
				+      if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
			
 
				+        alert("请先登录")
			
 
				+        return
			
 
				+      }
			
 
				+      var value = e.currentTarget.textContent;
			
 
				+      this.parmas.categoryName = value;
			
 
				+      this.setParmas(this.parmas);
			
 
				+      this.changeIsByCondition(true)
			
 
				+      searchServer(this.parmas).then((response) => {
			
 
				+        if (response.data.code === 200) {
			
 
				+          this.content = response.data.data.rows;
			
 
				+          this.content.forEach(e => {
			
 
				+            e.serverArea = e.workArea
			
 
				+          })
			
 
				+          this.content.forEach(e => {
			
 
				+              // 渲染serverArea
			
 
				+              if (e.serverArea.substring(0, 2) === '全部') {
			
 
				+                e.serverArea = e.serverArea = '全国范围内'
			
 
				+              } else {
			
 
				+                e.serverArea = e.serverArea.replace('全部', '内')
			
 
				+                e.serverArea = e.serverArea.replace('undefined', '')
			
 
				+              }
			
 
				+            })
			
 
				+          this.setTotal(response.data.data.total);
			
 
				+          this.setList(this.content);
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+    selectSalary(e) {
			
 
				+      for (
			
 
				+        var i = 0;
			
 
				+        i < e.currentTarget.parentNode.parentNode.children.length;
			
 
				+        i++
			
 
				+      ) {
			
 
				+        e.currentTarget.parentNode.parentNode.children[
			
 
				+          i
			
 
				+        ].children[0].className = null;
			
 
				+      }
			
 
				+      e.currentTarget.className = "activeSpan";
			
 
				+      var value = e.currentTarget.textContent;
			
 
				+      if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
			
 
				+        alert("请先登录")
			
 
				+        return
			
 
				+      }
			
 
				+      if (value == "100以下") value = '1';
			
 
				+      else if (value == "100-300") value = '2';
			
 
				+      else if (value == "300-500") value = '3';
			
 
				+      else if (value == "500以上") value = '4';
			
 
				+      else if (value == "不限") value = '0';
			
 
				+      this.parmas.salary = value;
			
 
				+      this.setParmas(this.parmas);
			
 
				+      this.changeIsByCondition(true)
			
 
				+      searchServer(this.parmas).then((response) => {
			
 
				+        if (response.data.code == 200) {
			
 
				+          this.setTotal(response.data.data.total);
			
 
				+          this.content = response.data.data.rows;
			
 
				+          this.content.forEach(e => {
			
 
				+            e.serverArea = e.workArea
			
 
				+          })
			
 
				+          this.content.forEach(e => {
			
 
				+              // 渲染serverArea
			
 
				+              if (e.serverArea.substring(0, 2) === '全部') {
			
 
				+                e.serverArea = e.serverArea = '全国范围内'
			
 
				+              } else {
			
 
				+                e.serverArea = e.serverArea.replace('全部', '内')
			
 
				+                e.serverArea = e.serverArea.replace('undefined', '')
			
 
				+              }
			
 
				+            })
			
 
				+          this.setList(this.content);
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+    upSalary() {
			
 
				+      this.$refs.down.style.color = "black";
			
 
				+      this.$refs.up.style.color = "#446AB0";
			
 
				+      if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
			
 
				+        alert("请先登录")
			
 
				+        return
			
 
				+      }
			
 
				+      this.parmas.salaryOrder = 1;
			
 
				+      this.setParmas(this.parmas);
			
 
				+      this.changeIsByCondition(true)
			
 
				+      searchServer(this.parmas).then((response) => {
			
 
				+        if (response.data.code == 200) {
			
 
				+          this.content = response.data.data.rows;
			
 
				+          this.content.forEach(e => {
			
 
				+            e.serverArea = e.workArea
			
 
				+          })
			
 
				+          this.content.forEach(e => {
			
 
				+              // 渲染serverArea
			
 
				+              if (e.serverArea.substring(0, 2) === '全部') {
			
 
				+                e.serverArea = e.serverArea = '全国范围内'
			
 
				+              } else {
			
 
				+                e.serverArea = e.serverArea.replace('全部', '内')
			
 
				+                e.serverArea = e.serverArea.replace('undefined', '')
			
 
				+              }
			
 
				+            })
			
 
				+          this.setList(this.content);
			
 
				+          this.setTotal(response.data.data.total);
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+    downSalary() {
			
 
				+      this.$refs.up.style.color = "black";
			
 
				+      this.$refs.down.style.color = "#446AB0";
			
 
				+      if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
			
 
				+        alert("请先登录")
			
 
				+        return
			
 
				+      }
			
 
				+      this.parmas.salaryOrder = 2;
			
 
				+      this.setParmas(this.parmas);
			
 
				+      this.changeIsByCondition(true)
			
 
				+      searchServer(this.parmas).then((response) => {
			
 
				+        if (response.data.code == 200) {
			
 
				+          this.content = response.data.data.rows;
			
 
				+          this.content.forEach(e => {
			
 
				+            e.serverArea = e.workArea
			
 
				+          })
			
 
				+          this.content.forEach(e => {
			
 
				+              // 渲染serverArea
			
 
				+              if (e.serverArea.substring(0, 2) === '全部') {
			
 
				+                e.serverArea = e.serverArea = '全国范围内'
			
 
				+              } else {
			
 
				+                e.serverArea = e.serverArea.replace('全部', '内')
			
 
				+                e.serverArea = e.serverArea.replace('undefined', '')
			
 
				+              }
			
 
				+            })
			
 
				+          this.setTotal(response.data.data.total);
			
 
				+          this.setList(this.content);
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+    //长期工 短期工
			
 
				+    convertServerType(i) {
			
 
				+      if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
			
 
				+        alert("请先登录")
			
 
				+        return
			
 
				+      }
			
 
				+      this.parmas.serverType = i
			
 
				+      this.setParmas(this.parmas);
			
 
				+      this.changeIsByCondition(true)
			
 
				+      searchServer(this.parmas).then((response) => {
			
 
				+        if (response.data.code === 200) {
			
 
				+          this.content = response.data.data.rows;
			
 
				+          this.content.forEach(e => {
			
 
				+            e.serverArea = e.workArea
			
 
				+          })
			
 
				+          this.content.forEach(e => {
			
 
				+              // 渲染serverArea
			
 
				+              if (e.serverArea.substring(0, 2) === '全部') {
			
 
				+                e.serverArea = e.serverArea = '全国范围内'
			
 
				+              } else {
			
 
				+                e.serverArea = e.serverArea.replace('全部', '内')
			
 
				+                e.serverArea = e.serverArea.replace('undefined', '')
			
 
				+              }
			
 
				+            })
			
 
				+          this.setTotal(response.data.data.total);
			
 
				+          this.setList(this.content);
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+    isStay(i) {
			
 
				+      this.parmas.stay = i;
			
 
				+
			
 
				+      if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
			
 
				+        alert("请先登录")
			
 
				+        return
			
 
				+      }
			
 
				+      this.setParmas(this.parmas);
			
 
				+      this.changeIsByCondition(true)
			
 
				+      searchServer(this.parmas).then((response) => {
			
 
				+        if (response.data.code == 200) {
			
 
				+          this.content = response.data.data.rows;
			
 
				+          this.content.forEach(e => {
			
 
				+            e.serverArea = e.workArea
			
 
				+          })
			
 
				+          this.content.forEach(e => {
			
 
				+              // 渲染serverArea
			
 
				+              if (e.serverArea.substring(0, 2) === '全部') {
			
 
				+                e.serverArea = e.serverArea = '全国范围内'
			
 
				+              } else {
			
 
				+                e.serverArea = e.serverArea.replace('全部', '内')
			
 
				+                e.serverArea = e.serverArea.replace('undefined', '')
			
 
				+              }
			
 
				+            })
			
 
				+          this.setTotal(response.data.data.total);
			
 
				+          this.setList(this.content);
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+    addressChoose(value) {
			
 
				+      if (!localStorage.getItem("token") === undefined || localStorage.getItem("token") === '') {
			
 
				+        alert("请先登录")
			
 
				+        return
			
 
				+      }
			
 
				+      this.serveArea =
			
 
				+        CodeToText[value[0]] + CodeToText[value[1]] + CodeToText[value[2]];
			
 
				+      var a =
			
 
				+        CodeToText[value[0]] + CodeToText[value[1]] + CodeToText[value[2]];
			
 
				+      if (a == "全部undefinedundefined") a = "";
			
 
				+      this.parmas.workArea = a;
			
 
				+      this.setParmas(this.parmas);
			
 
				+      this.changeIsByCondition(true)
			
 
				+      searchServer(this.parmas).then((response) => {
			
 
				+        if (response.data.code == 200) {
			
 
				+          this.content = response.data.data.rows;
			
 
				+          this.content.forEach(e => {
			
 
				+            e.serverArea = e.workArea
			
 
				+          })
			
 
				+          this.content.forEach(e => {
			
 
				+              // 渲染serverArea
			
 
				+              if (e.serverArea.substring(0, 2) === '全部') {
			
 
				+                e.serverArea = e.serverArea = '全国范围内'
			
 
				+              } else {
			
 
				+                e.serverArea = e.serverArea.replace('全部', '内')
			
 
				+                e.serverArea = e.serverArea.replace('undefined', '')
			
 
				+              }
			
 
				+            })
			
 
				+          this.setTotal(response.data.data.total);
			
 
				+          this.setList(this.content);
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+    //搜索家政人员
			
 
				+    search() {
			
 
				+      if (!localStorage.getItem("token") === undefined || localStorage.getItem("token") === '') {
			
 
				+        alert("请先登录")
			
 
				+        return
			
 
				+      }
			
 
				+      this.searchFlag = 1
			
 
				+      this.setParmas(this.parmas);
			
 
				+      let param = {
			
 
				+        introduction: this.parmas.introduction,
			
 
				+        pageSize: this.parmas.pageSize,
			
 
				+        pageNum: this.parmas.pageNum
			
 
				+      }
			
 
				+      this.changeIsByCondition(true)
			
 
				+      searchByIntroduction(param).then((response) => {
			
 
				+        if (response.data.code == 200) {
			
 
				+          this.content = response.data.data.rows;
			
 
				+          this.setTotal(response.data.data.total);
			
 
				+          this.setList(this.content);
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+    // 重置选择
			
 
				+    resetPage() {
			
 
				+      this.parmas = {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 3,
			
 
				+        nickName: "",
			
 
				+        salaryOrder: 0,
			
 
				+        categoryName: "不限",
			
 
				+        salary: '0',
			
 
				+        stay: '0',
			
 
				+        userType: 1,
			
 
				+        workArea: "",
			
 
				+        serverType: "",
			
 
				+        introduction: ''
			
 
				+      }
			
 
				+      this.selectedOptions = []
			
 
				+      this.$refs.down.style.color = "black";
			
 
				+      this.$refs.up.style.color = "black";
			
 
				+      this.isLong = null
			
 
				+      this.isHome = null
			
 
				+      this.searchFlag = 0
			
 
				+      const activeElements = document.querySelectorAll('.activeSpan');
			
 
				+      for (const element of activeElements) {
			
 
				+        element.classList.remove('activeSpan');
			
 
				+      }
			
 
				+      this.setParmas(this.parmas)
			
 
				+      this.changeIsByCondition(false)
			
 
				+      this.changePageNum(this.parmas.pageNum)
			
 
				+      this.changePageSize(this.parmas.pageSize)
			
 
				+      let params = {
			
 
				+        pageNum: this.getPageNum,
			
 
				+        pageSize: this.getPageSize
			
 
				+      }
			
 
				+      searchServerWithNoCondition(params).then((response) => {
			
 
				+        if (response.data.code === 200) {
			
 
				+          this.content = response.data.data.rows;
			
 
				+          this.count = response.data.data.total;
			
 
				+          this.content.forEach(e => {
			
 
				+              // 渲染serverArea
			
 
				+              if (e.serverArea.substring(0, 2) === '全部') {
			
 
				+                e.serverArea = e.serverArea = '全国范围内'
			
 
				+              } else {
			
 
				+                e.serverArea = e.serverArea.replace('全部', '内')
			
 
				+                e.serverArea = e.serverArea.replace('undefined', '')
			
 
				+              }
			
 
				+            })
			
 
				+          this.setTotal(this.count);
			
 
				+          this.setList(this.content);
			
 
				+        }
			
 
				+      });
			
 
				+    },
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+
			
 
				+<style scoped>
			
 
				+.cancelBtn {
			
 
				+  color: black;
			
 
				+  background-color: #f5f5f5;
			
 
				+  margin-left: 20px;
			
 
				+  border: 2px;
			
 
				+}
			
 
				+
			
 
				+#topBox {
			
 
				+  text-align: left;
			
 
				+  margin: 0 auto;
			
 
				+  margin-left: 4rem;
			
 
				+  background-color: rgb(255, 255, 255);
			
 
				+  width: 93%;
			
 
				+  position: relative;
			
 
				+  top: 5rem;
			
 
				+  padding-bottom: 1rem;
			
 
				+  border-radius: 1rem;
			
 
				+}
			
 
				+
			
 
				+#background {
			
 
				+  width: 100%;
			
 
				+  margin-top: -1rem;
			
 
				+  margin: 0 auto;
			
 
				+  /* background-color: rgb(237, 244, 237); */
			
 
				+}
			
 
				+
			
 
				+/* 地标图片 */
			
 
				+#topBox img {
			
 
				+  display: inline-block;
			
 
				+  height: 1.8rem;
			
 
				+  width: auto;
			
 
				+  margin-top: 1.6rem;
			
 
				+  margin-left: 7.8rem;
			
 
				+  margin-right: 0.5rem;
			
 
				+}
			
 
				+
			
 
				+/* 地区选择器 */
			
 
				+::v-deep .el-cascader {
			
 
				+  --el-cascader-menu-text-color: var(--el-text-color-regular);
			
 
				+  --el-cascader-menu-selected-text-color: var(--el-color-primary);
			
 
				+  --el-cascader-menu-fill: var(--el-bg-color-overlay);
			
 
				+  --el-cascader-menu-font-size: var(--el-font-size-base);
			
 
				+  --el-cascader-menu-radius: var(--el-border-radius-base);
			
 
				+  --el-cascader-menu-border: solid 1px var(--el-border-color-light);
			
 
				+  --el-cascader-menu-shadow: var(--el-box-shadow-light);
			
 
				+  --el-cascader-node-background-hover: var(--el-fill-color-light);
			
 
				+  --el-cascader-node-color-disabled: var(--el-text-color-placeholder);
			
 
				+  --el-cascader-color-empty: var(--el-text-color-placeholder);
			
 
				+  --el-cascader-tag-background: var(--el-fill-color);
			
 
				+  display: inline-block;
			
 
				+  vertical-align: middle;
			
 
				+  position: absolute;
			
 
				+  top: 1.25rem;
			
 
				+  left: 9.8rem;
			
 
				+  font-size: var(--el-font-size-base);
			
 
				+  line-height: 32px;
			
 
				+  outline: 0;
			
 
				+  width: 175px;
			
 
				+}
			
 
				+
			
 
				+/* 搜素框 */
			
 
				+#searchInp {
			
 
				+  text-align: center;
			
 
				+  display: inline-block;
			
 
				+  width: 62%;
			
 
				+  height: 3rem;
			
 
				+  background-color: #5fb49e;
			
 
				+  position: absolute;
			
 
				+  left: 24rem;
			
 
				+  top: 1rem;
			
 
				+  border-radius: 0.7rem;
			
 
				+}
			
 
				+
			
 
				+#searchButton {
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+#searchInp input {
			
 
				+  height: 2.5rem;
			
 
				+  margin-top: 0.2rem;
			
 
				+  width: 92%;
			
 
				+  border-radius: 1rem;
			
 
				+  margin-left: 0rem;
			
 
				+  margin-right: 1rem;
			
 
				+  border: 0;
			
 
				+  padding-left: 1rem;
			
 
				+  outline: none;
			
 
				+  font-size: small;
			
 
				+}
			
 
				+
			
 
				+#searchInp span {
			
 
				+  color: white;
			
 
				+
			
 
				+  font-weight: 600;
			
 
				+}
			
 
				+
			
 
				+/* 家政分类 */
			
 
				+.catagoryList {
			
 
				+  margin-top: 1.5rem;
			
 
				+  display: inline-block;
			
 
				+  background-color: #f5f5f5;
			
 
				+  box-sizing: border-box;
			
 
				+  border-radius: 1rem;
			
 
				+}
			
 
				+
			
 
				+.categoryItem {
			
 
				+  display: inline-block;
			
 
				+  box-sizing: border-box;
			
 
				+  margin-top: 1rem;
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+.categoryBox span {
			
 
				+  font-weight: bold;
			
 
				+}
			
 
				+
			
 
				+.categoryBox>span {
			
 
				+  margin-top: 1rem;
			
 
				+  margin-left: 8rem;
			
 
				+  margin-right: 4rem;
			
 
				+}
			
 
				+
			
 
				+.categoryItem span {
			
 
				+  display: inline-block;
			
 
				+  box-sizing: border-box;
			
 
				+  cursor: pointer;
			
 
				+  margin-right: 2.7rem;
			
 
				+  margin-left: 2.7rem;
			
 
				+  border-radius: 0.5rem;
			
 
				+  padding: 0.5rem;
			
 
				+  padding-top: 0.1rem;
			
 
				+  padding-bottom: 0.1rem;
			
 
				+}
			
 
				+
			
 
				+.activeSpan {
			
 
				+  background-color: #55b084;
			
 
				+  color: white;
			
 
				+}
			
 
				+
			
 
				+.categoryBox label {
			
 
				+  font-weight: bold;
			
 
				+  margin-left: 2.5rem;
			
 
				+
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+#salaryRank {
			
 
				+  margin-right: 3rem;
			
 
				+}
			
 
				+
			
 
				+/* 长期工等的选择 */
			
 
				+#bottom {
			
 
				+  margin-top: 1rem;
			
 
				+  margin-bottom: 1rem;
			
 
				+}
			
 
				+
			
 
				+#bottom span {
			
 
				+  vertical-align: middle;
			
 
				+
			
 
				+  margin-left: 19rem;
			
 
				+  margin-right: 2rem;
			
 
				+  font-weight: bold;
			
 
				+}
			
 
				+
			
 
				+#bottom label {
			
 
				+  font-weight: 600;
			
 
				+  vertical-align: middle;
			
 
				+}
			
 
				+
			
 
				+#bottom input {
			
 
				+  margin-right: 1rem;
			
 
				+  vertical-align: middle;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/ServeDetail/index.vue
+++ b/src/views/ServeDetail/index.vue
@@ -0,0 +1,485 @@
 
				+<template>
			
 
				+  <div id="backColo">
			
 
				+    <div class="right">
			
 
				+      <div class="showTitle">
			
 
				+        <el-icon id="primeTitle"><Tickets /></el-icon>
			
 
				+        <h2>家政人员详情</h2>
			
 
				+      </div>
			
 
				+      <table class="bigtable">
			
 
				+        <tr class="headPortrait">
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon><PictureFilled /></el-icon>
			
 
				+              <h3>头像</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="avatarParent">
			
 
				+            <div class="avatar"><img :src="this.avatar" /></div>
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+        <tr>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon><User /></el-icon>
			
 
				+              <h3>用户名</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input type="text" v-model="this.nickName" disabled />
			
 
				+          </td>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon><Paperclip /></el-icon>
			
 
				+              <h3>分类范围</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input v-model="this.categoryName" type="text" disabled />
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+        <tr>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon><Clock /></el-icon>
			
 
				+              <h3>年龄</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input type="text" disabled v-model="this.age" />
			
 
				+          </td>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon><Male /></el-icon>
			
 
				+              <h3>性别</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td>
			
 
				+            <select id="gender" disabled v-model="this.sex">
			
 
				+              <option value="">请选择</option>
			
 
				+              <option value="1">男</option>
			
 
				+              <option value="2">女</option>
			
 
				+            </select>
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+        <tr>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon><Iphone /></el-icon>
			
 
				+              <h3>联系方式</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input v-model="this.phone" type="text" disabled />
			
 
				+          </td>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon><Location /></el-icon>
			
 
				+              <h3>地区</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input v-model="this.area" type="text" disabled />
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+        <tr>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon><Coin /></el-icon>
			
 
				+              <h3>薪酬(次/日)</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input v-model="this.salary" type="text" disabled />
			
 
				+          </td>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon><Calendar /></el-icon>
			
 
				+              <h3>上岗日期</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input v-model="this.serverTime" type="text" disabled />
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+        <tr>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon><HomeFilled /></el-icon>
			
 
				+              <h3>是否住家</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input v-model="this.stay" type="text" disabled />
			
 
				+          </td>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon><Operation /></el-icon>
			
 
				+              <h3>聘请类别</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input v-model="this.serverType" type="text" disabled />
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+        <tr>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon><Present /></el-icon>
			
 
				+              <h3>待遇</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input v-model="this.treatment" type="text" disabled />
			
 
				+          </td>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <el-icon><Message /></el-icon>
			
 
				+              <h3>邮箱</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input v-model="this.email" type="text" disabled />
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+      </table>
			
 
				+      <div class="smallTitle"><h4 id="secondTitle">家政经历</h4></div>
			
 
				+      <table class="bigtable">
			
 
				+        <tr>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <h3>个人特点</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input type="text" v-model="this.characteristic" disabled />
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+        <tr>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <h3>证书</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input type="text" v-model="this.cert" disabled />
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+        <tr>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <h3>擅长技能</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input type="text" v-model="this.skill" disabled />
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+        <tr>
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <h3>工作范围</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <input type="text" v-model="this.workRange" disabled />
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+        <tr class="expirence">
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <h3>工作经验</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <textarea class="exep" disabled v-model="this.workExp"></textarea>
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+        <tr class="introduction">
			
 
				+          <td class="title">
			
 
				+            <div>
			
 
				+              <h3>简介</h3>
			
 
				+            </div>
			
 
				+          </td>
			
 
				+          <td class="input">
			
 
				+            <textarea class="introduction" disabled v-model="this.introduction"></textarea>
			
 
				+          </td>
			
 
				+        </tr>
			
 
				+      </table>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { serverDetailApi } from "@/api";
			
 
				+import { mapState } from "vuex";
			
 
				+export default {
			
 
				+  name: "ServeDetail",
			
 
				+  data() {
			
 
				+    return {
			
 
				+      serverId: null,
			
 
				+      avatar: "",
			
 
				+      nickName: "",
			
 
				+      serverType: "",
			
 
				+      age: "",
			
 
				+      sex: "",
			
 
				+      phone: "",
			
 
				+      area: "",
			
 
				+      salary: "",
			
 
				+      serverTime: "",
			
 
				+      treatment: "",
			
 
				+      categoryName: "",
			
 
				+      stay: "",
			
 
				+      email: "",
			
 
				+      characteristic: "",
			
 
				+      skill: "",
			
 
				+      cert: "",
			
 
				+      workRange: "",
			
 
				+      workExp: "",
			
 
				+      introduction: '',
			
 
				+    };
			
 
				+  },
			
 
				+  computed: {
			
 
				+    ...mapState("SearchStore", ["id"]),
			
 
				+  },
			
 
				+  created() {
			
 
				+    this.serverId = this.id;
			
 
				+    serverDetailApi(this.serverId).then((response) => {
			
 
				+      if (response.data.code === 200) {
			
 
				+        console.log(response.data.data)
			
 
				+        this.introduction = response.data.data.introduction
			
 
				+        this.avatar = response.data.data.avatar;
			
 
				+        this.nickName = response.data.data.nickName;
			
 
				+        this.serverType = response.data.data.serverType;
			
 
				+        this.age = response.data.data.age;
			
 
				+        this.sex = response.data.data.sex;
			
 
				+        this.phone = response.data.data.phone;
			
 
				+        this.area = response.data.data.area;
			
 
				+        this.salary = response.data.data.salary;
			
 
				+        this.serverTime = response.data.data.serverTime;
			
 
				+        this.categoryName = response.data.data.categoryName;
			
 
				+        this.stay = response.data.data.stay;
			
 
				+        this.email = response.data.data.email;
			
 
				+        this.characteristic = response.data.data.characteristic;
			
 
				+        this.skill = response.data.data.skill;
			
 
				+        this.cert = response.data.data.cert;
			
 
				+        this.workRange = response.data.data.workRange;
			
 
				+        this.workExp = response.data.data.workExp;
			
 
				+        this.treatment = response.data.data.treatment;
			
 
				+        if(this.serverType === 1){
			
 
				+          this.serverType = '长期工'
			
 
				+        }else if(this.serverType === 2){
			
 
				+          this.serverType = '短期工'
			
 
				+        }else{
			
 
				+          this.serverType = '出现错误'
			
 
				+        }
			
 
				+      }
			
 
				+    });
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+<style scoped>
			
 
				+.right {
			
 
				+  width: 59rem;
			
 
				+  background-color: rgb(255, 255, 255);
			
 
				+  position: absolute;
			
 
				+  top: 5rem;
			
 
				+  left: 19rem;
			
 
				+  border: 1px solid gray;
			
 
				+  border-radius: 10px;
			
 
				+}
			
 
				+.showTitle {
			
 
				+  position: relative;
			
 
				+  width: 100%;
			
 
				+  height: 3rem;
			
 
				+  border-bottom: 1px solid rgb(165, 162, 162);
			
 
				+  box-sizing: border-box;
			
 
				+  text-align: start;
			
 
				+  padding-left: 2rem;
			
 
				+}
			
 
				+.showTitle h2 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+}
			
 
				+table {
			
 
				+  width: 95%;
			
 
				+  margin: 0 auto;
			
 
				+  margin-top: 3rem;
			
 
				+  font-size: small;
			
 
				+  font-weight: bolder;
			
 
				+  border-collapse: separate; /* 控制是否合并边框 */
			
 
				+  border-spacing: 0; /* 控制单元格之间的距离 */
			
 
				+  border: solid 2px rgb(215, 215, 215); /*控制外边框*/
			
 
				+  border-radius: 20px;
			
 
				+  overflow: hidden;
			
 
				+  margin-bottom: 3rem;
			
 
				+}
			
 
				+td {
			
 
				+  text-align: left;
			
 
				+  padding: 0.5rem;
			
 
				+  border-top: 1px solid rgb(213, 213, 213);
			
 
				+}
			
 
				+td:last-child,
			
 
				+th:last-child {
			
 
				+  border-right-color: transparent;
			
 
				+}
			
 
				+#primeTitle {
			
 
				+  position: absolute;
			
 
				+  top: 1.3rem;
			
 
				+  left: 0.5rem;
			
 
				+}
			
 
				+.exep{
			
 
				+  margin-top: 1.5rem;
			
 
				+  margin-bottom: 0.2rem;
			
 
				+}
			
 
				+.title {
			
 
				+  width: 6rem;
			
 
				+  background-color: rgb(245, 245, 245);
			
 
				+  padding-left: 1rem;
			
 
				+  margin: 0;
			
 
				+}
			
 
				+.headPortrait {
			
 
				+  height: 6rem;
			
 
				+}
			
 
				+td,
			
 
				+th {
			
 
				+  border-right: 2px solid rgb(213, 213, 213);
			
 
				+}
			
 
				+
			
 
				+.el-icon {
			
 
				+  --color: inherit;
			
 
				+  height: 1em;
			
 
				+  width: 1em;
			
 
				+  line-height: 1em;
			
 
				+  fill: currentColor;
			
 
				+  color: var(--color);
			
 
				+  display: inline-block;
			
 
				+  font-size: 1.3rem;
			
 
				+  text-align: left;
			
 
				+  font-size: large;
			
 
				+  position: absolute;
			
 
				+  top: 1.1rem;
			
 
				+  left: -0.5rem;
			
 
				+}
			
 
				+table td h3 {
			
 
				+  display: inline-block;
			
 
				+  font-size: 1rem;
			
 
				+}
			
 
				+table td .el-icon[data-v-7641c14d] {
			
 
				+  --color: inherit;
			
 
				+  height: 1em;
			
 
				+  width: 1em;
			
 
				+  line-height: 1em;
			
 
				+  fill: currentColor;
			
 
				+  color: var(--color);
			
 
				+  font-size: 1.3rem;
			
 
				+  font-size: large;
			
 
				+  display: inline-block;
			
 
				+  position: absolute;
			
 
				+  top: 1.1rem;
			
 
				+  left: -0.2rem;
			
 
				+}
			
 
				+table td div {
			
 
				+  position: relative;
			
 
				+  text-align: justify;
			
 
				+  padding-left: 1rem;
			
 
				+}
			
 
				+input[type="button"] {
			
 
				+  background-color: #409eff;
			
 
				+  width: 6rem;
			
 
				+  height: 2rem;
			
 
				+  border-radius: 1rem;
			
 
				+  position: absolute;
			
 
				+  right: 2rem;
			
 
				+  border: none;
			
 
				+  top: 0.5rem;
			
 
				+  color: white;
			
 
				+  text-align: center;
			
 
				+  letter-spacing: 0.3rem;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+/* 输入框的样式 */
			
 
				+input {
			
 
				+  display: inline-block;
			
 
				+  padding: 0;
			
 
				+  margin: 0;
			
 
				+  width: 90%;
			
 
				+  height: 2rem;
			
 
				+  border: none;
			
 
				+  /*   outline: none; */
			
 
				+  color: rgb(63, 62, 62);
			
 
				+  font-size: 1rem;
			
 
				+  font-weight: bold;
			
 
				+}
			
 
				+.input {
			
 
				+  padding: 0;
			
 
				+  padding-left: 0.4rem;
			
 
				+}
			
 
				+table select {
			
 
				+  width: 5rem;
			
 
				+  font-size: 1rem;
			
 
				+  border: none;
			
 
				+  color: black;
			
 
				+}
			
 
				+table select:disabled {
			
 
				+  width: 5rem;
			
 
				+  font-size: 1rem;
			
 
				+  border: none;
			
 
				+  font-weight: bold;
			
 
				+  color: black;
			
 
				+}
			
 
				+/* 头像样式 */
			
 
				+.avatarParent {
			
 
				+  position: relative;
			
 
				+}
			
 
				+.avatar {
			
 
				+  width: 5rem;
			
 
				+  height: 5rem;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+table input[type="file"] {
			
 
				+  display: none;
			
 
				+  position: absolute;
			
 
				+  top: -1.5rem;
			
 
				+  left: 8rem;
			
 
				+  /*   background-color: #409eff;
			
 
				+  border: none;
			
 
				+  color: white; */
			
 
				+}
			
 
				+table img {
			
 
				+  width: 100%;
			
 
				+  height: auto;
			
 
				+}
			
 
				+
			
 
				+/* 家政经历 */
			
 
				+#secondTitle {
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+  text-align: start;
			
 
				+  margin-left: 3rem;
			
 
				+  margin-bottom: -2rem;
			
 
				+}
			
 
				+/* 工作经历输入框 */
			
 
				+textarea.introduction {
			
 
				+  margin-top: 1rem;
			
 
				+  resize: none;
			
 
				+  width: 90%;
			
 
				+  height: 7rem;
			
 
				+  border: none;
			
 
				+  /*  outline: none; */
			
 
				+  color: rgb(63, 62, 62);
			
 
				+  font-size: 1.1rem;
			
 
				+  font-weight: bold;
			
 
				+}
			
 
				+textarea.exep{
			
 
				+  resize: none;
			
 
				+  width: 90%;
			
 
				+  height: 2.5rem;
			
 
				+  border: none;
			
 
				+  /*  outline: none; */
			
 
				+  color: rgb(63, 62, 62);
			
 
				+  font-size: 1.1rem;
			
 
				+  font-weight: bold;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/TheHome/img/introduce_server.png
+++ b/src/views/TheHome/img/introduce_server.png
--- a/src/views/TheHome/index.vue
+++ b/src/views/TheHome/index.vue
@@ -0,0 +1,81 @@
 
				+<template>
			
 
				+  <div class="bogbox">
			
 
				+    <div class="firstpage">
			
 
				+      <img src="./img/introduce_server.png" />
			
 
				+      <button class="login" @click="PostStatus">发布信息</button>
			
 
				+    </div>
			
 
				+
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { mapMutations } from "vuex";
			
 
				+export default {
			
 
				+  name: "TheHome",
			
 
				+  data() {
			
 
				+    return {
			
 
				+      isLogin: false,
			
 
				+    };
			
 
				+  },
			
 
				+  created() {
			
 
				+    if (localStorage.getItem("token") && localStorage.getItem("token") != "") {
			
 
				+      this.token = localStorage.getItem("token");
			
 
				+      this.isLogin = true;
			
 
				+    } else this.isLogin = false;
			
 
				+  },
			
 
				+  methods: {
			
 
				+    ...mapMutations("PerCent", ["convertIndex"]),
			
 
				+    PostStatus() {
			
 
				+      if (
			
 
				+        localStorage.getItem("token") &&
			
 
				+        localStorage.getItem("token") != "" &&
			
 
				+        localStorage.getItem("token") != "undefined"
			
 
				+      ) {
			
 
				+        this.token = localStorage.getItem("token");
			
 
				+        this.isLogin = true;
			
 
				+      } else this.isLogin = false;
			
 
				+
			
 
				+      if (!this.isLogin) {
			
 
				+        alert("未登录，请先登录。");
			
 
				+        this.$router.push("./loginview");
			
 
				+      } else {
			
 
				+        // 进行跳转
			
 
				+        this.convertIndex(2);
			
 
				+        this.$router.push("./PerCent");
			
 
				+      }
			
 
				+    },
			
 
				+    go_top() {
			
 
				+      document.documentElement.scrollTop = 0;
			
 
				+    },
			
 
				+  },
			
 
				+
			
 
				+};
			
 
				+</script>
			
 
				+
			
 
				+<style scoped>
			
 
				+.firstpage {
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  position: relative;
			
 
				+}
			
 
				+
			
 
				+img {
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+
			
 
				+.login {
			
 
				+  position: absolute;
			
 
				+  top: 37.5rem;
			
 
				+  left: 70rem;
			
 
				+  width: 13rem;
			
 
				+  height: 3.5rem;
			
 
				+  background-color: #339966;
			
 
				+  border: 1px solid #339966;
			
 
				+  border-radius: 30px;
			
 
				+  color: aliceblue;
			
 
				+  font-size: 1.2rem;
			
 
				+  font-weight: bolder;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/UserHelp/index.vue
+++ b/src/views/UserHelp/index.vue
@@ -0,0 +1,261 @@
 
				+<template>
			
 
				+  <div id="backgroundColor">
			
 
				+    <div id="whiteBackground">
			
 
				+      <div id="text">
			
 
				+        <h1><span>常见问题</span></h1>
			
 
				+
			
 
				+        <el-collapse v-model="activeNames" @change="handleChange">
			
 
				+          <el-collapse-item class="title_style" title=">>>>网站简介" name="-1">
			
 
				+            <div>
			
 
				+              <span>
			
 
				+                <h2>欢迎使用我们的智慧家政预约平台！</h2>
			
 
				+              </span>
			
 
				+              <p>
			
 
				+                <strong><span>若您想做家政</span></strong><span>，只需填写个人信息和家政经历，您的信息就能轻松发布到平台上，获得更多工作机会。</span>
			
 
				+              </p>
			
 
				+              <p>
			
 
				+                <strong><span>若您想找家政</span></strong><span>，经过我们团队严格审核的优质家政人员信息也将在平台上展示，让雇主轻松找到合适家政人员，同时也为家政人员提供更多就业机会。</span>
			
 
				+              </p>
			
 
				+              <p>
			
 
				+                <span>我们的网站不仅易于使用，同时也十分安全可靠，</span><u><span>严格保护用户的个人隐私信息。</span></u><span>我们全程关注着平台运作，希望让雇主和家政人员之间的交流更加顺畅。</span>
			
 
				+              </p>
			
 
				+              <p>
			
 
				+                <span>无论是寻找家政服务，还是提供家政服务，我们的网站都能够为您提供更好的选择和帮助。现在就来注册我们的网站，开启您的家政之旅！</span>
			
 
				+              </p>
			
 
				+            </div>
			
 
				+          </el-collapse-item>
			
 
				+
			
 
				+          <el-collapse-item title=">>>>雇主相关问题" name="-2">
			
 
				+            <h2><span>雇主相关</span></h2>
			
 
				+            <p>&nbsp;</p>
			
 
				+            <p>&nbsp;</p>
			
 
				+            <h3><span>找家政</span></h3>
			
 
				+
			
 
				+            <div>
			
 
				+              <h4><span>步骤一 完善信息</span></h4>
			
 
				+              <ol start="">
			
 
				+                <li><span>注册或切换为雇主身份</span></li>
			
 
				+                <li>
			
 
				+                  <span>进入导航栏右上角</span><strong><span>个人中心</span></strong><span>→个人信息内填写您的</span><strong><span>基础信息</span></strong><span>（注意正确填写</span><strong><span>地址</span></strong><span>和</span><strong><span>手机号</span></strong><span>，以便于家政人员上门服务）</span>
			
 
				+                </li>
			
 
				+              </ol>
			
 
				+              <h4><span>步骤二 预约家政人员</span></h4>
			
 
				+              <ol>
			
 
				+                <li>
			
 
				+                  <span>您可以直接在导航栏左上角点击</span><strong><span> 找家政</span></strong><span> 查找符合期望条件的家政人员</span>
			
 
				+                </li>
			
 
				+                <li>
			
 
				+                  <span>找到你中意的家政人员后，点击</span><strong><span>预约</span></strong><span>。</span>
			
 
				+                </li>
			
 
				+                <li>
			
 
				+                  <span>选择服务时间，成功</span><strong><span>支付</span></strong><span>订单</span>
			
 
				+                </li>
			
 
				+              </ol>
			
 
				+              <h4><span>步骤二 完成订单及评价</span></h4>
			
 
				+              <ol start="">
			
 
				+                <li>
			
 
				+                  <span>成功支付后，可以在我的个人中心→我的订单查看订单信息，即可等待家政人员上门</span>
			
 
				+                </li>
			
 
				+                <li>
			
 
				+                  <strong><span>服务结束后</span></strong><span>，在个人中心→我的订单点击</span><strong><span>已完成</span></strong>
			
 
				+                </li>
			
 
				+                <li>
			
 
				+                  <span>在个人中心→我的订单对家政人员进行</span><strong><span>评价</span></strong>
			
 
				+                </li>
			
 
				+              </ol>
			
 
				+            </div>
			
 
				+            <p>&nbsp;</p>
			
 
				+            <p>&nbsp;</p>
			
 
				+            <h3><span>如何切换家政人员身份</span></h3>
			
 
				+            <div>
			
 
				+              <p>
			
 
				+                <span>点击网站导航栏右侧头像→切换身份，登出账号，以雇主身份登录/注册
			
 
				+                  ，完善您个人信息及状态后，审核后即可接单。</span>
			
 
				+              </p>
			
 
				+            </div>
			
 
				+          </el-collapse-item>
			
 
				+          <el-collapse-item title=">>>>家政人员相关问题" name="-5">
			
 
				+            <h2><span>家政人员相关</span></h2>
			
 
				+            <br />
			
 
				+            <h3><span>做家政</span></h3>
			
 
				+            <div>
			
 
				+              <h4><span>步骤一 完善信息</span></h4>
			
 
				+              <ol start="">
			
 
				+                <li>
			
 
				+                  <span>注册或切换为</span><strong><span>家政人员身份</span></strong>
			
 
				+                </li>
			
 
				+                <li>
			
 
				+                  <span>进入导航栏右上角</span><strong><span>个人中心</span></strong><span>→个人信息内填写您的</span><strong><span>基础信息</span></strong><span>和</span><strong><span>家政经历</span></strong><span>并保存</span>
			
 
				+                </li>
			
 
				+              </ol>
			
 
				+              <h4><span>步骤二 发布状态</span></h4>
			
 
				+              <ol start="">
			
 
				+                <li>
			
 
				+                  <span>点击个人中心→</span><strong><span>发布状态</span></strong><span>，正确填写后点击发布，等待管理员审核。</span>
			
 
				+                </li>
			
 
				+                <li>
			
 
				+                  <span>审核成功后，您的状态即可在搜索页内显示，
			
 
				+                    可以被雇主看到和搜索。</span>
			
 
				+                </li>
			
 
				+              </ol>
			
 
				+              <h4><span>步骤三 接受订单</span></h4>
			
 
				+              <ol start="">
			
 
				+                <li>
			
 
				+                  <span>有雇主下单后，您可以在个人中心→我的订单</span><strong><span>查看订单信息</span></strong>
			
 
				+                </li>
			
 
				+                <li>
			
 
				+                  <span>根据订单信息</span><strong><span>上门服务</span></strong>
			
 
				+                </li>
			
 
				+                <li>
			
 
				+                  <span>服务结束后，在个人中心→我的评价查看雇主给您的评价</span>
			
 
				+                </li>
			
 
				+              </ol>
			
 
				+            </div>
			
 
				+            <p>&nbsp;</p>
			
 
				+            <p>&nbsp;</p>
			
 
				+            <h3><span>状态相关</span></h3>
			
 
				+            <div>
			
 
				+              <h4><span>状态有什么用</span></h4>
			
 
				+              <p>
			
 
				+                <strong><span>位置：</span></strong><span>个人中心→我的状态 </span>
			
 
				+              </p>
			
 
				+              <p>
			
 
				+                <strong><span>简介：</span></strong><span>为给您提供更好的求职服务，我们特别开发了“我的状态”功能，让您可以自由动态编辑个人家政服务能力、期望归属分类以及心仪薪酬待遇等等信息；
			
 
				+                  相当于您的家政简历。
			
 
				+                </span>
			
 
				+              </p>
			
 
				+              <p>
			
 
				+                <strong><span>编写流程：</span></strong><span>完善填写并及时发布后，我们的审核员会快速审核通过，确保您的信息能被雇主准确快速地搜索到。若审核失败，您可以根据上方管理员发送的信息重新修改发布。</span>
			
 
				+              </p>
			
 
				+              <p>
			
 
				+                <span>此外，您不想接单时，点击右下角滑动按钮可以将状态设为私密。</span>
			
 
				+              </p>
			
 
				+            </div>
			
 
				+
			
 
				+            <p>&nbsp;</p>
			
 
				+            <p>&nbsp;</p>
			
 
				+            <h4><span>状态审核时间需要多久</span></h4>
			
 
				+            <div>
			
 
				+              <p>
			
 
				+                <span>状态审核时间为1~3个工作日，相关人员会尽快为您审核，
			
 
				+                  请您耐心等待。</span>
			
 
				+              </p>
			
 
				+            </div>
			
 
				+            <p>&nbsp;</p>
			
 
				+            <p>&nbsp;</p>
			
 
				+            <h4><span>雇主能看到您什么信息</span></h4>
			
 
				+            <div>
			
 
				+              <p>
			
 
				+                <span>在状态审核成功后，雇主能看到您在个人中心填写的</span><strong><span>状态</span></strong><span>，个人信息中的</span><strong><span>家政经历</span></strong><span>。</span>
			
 
				+              </p>
			
 
				+            </div>
			
 
				+            <p>&nbsp;</p>
			
 
				+            <p>&nbsp;</p>
			
 
				+            <h3><span>如何切换雇主身份</span></h3>
			
 
				+            <div>
			
 
				+              <p>
			
 
				+                <span>点击网站导航栏右侧头像→切换身份，登出账号，以雇主身份登录/注册
			
 
				+                </span>
			
 
				+              </p>
			
 
				+            </div>
			
 
				+          </el-collapse-item>
			
 
				+        </el-collapse>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: "UserHelp",
			
 
				+  data() {
			
 
				+    return {
			
 
				+      activeNames: ["-1"],
			
 
				+    };
			
 
				+  },
			
 
				+
			
 
				+  created() { },
			
 
				+  methods: {
			
 
				+    handleChange(val) {
			
 
				+      console.log(val);
			
 
				+    },
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+
			
 
				+<style scoped>
			
 
				+#backgroundColor {
			
 
				+  background-color: rgb(237, 244, 237);
			
 
				+  width: 100%;
			
 
				+  padding-top: 4rem;
			
 
				+  padding-bottom: 3rem;
			
 
				+}
			
 
				+
			
 
				+/* //白色背景 */
			
 
				+#whiteBackground {
			
 
				+  background-color: white;
			
 
				+  width: 80rem;
			
 
				+  margin: 0 auto;
			
 
				+  border-radius: 1rem;
			
 
				+  padding-top: 0.2rem;
			
 
				+  margin-top: 3rem;
			
 
				+}
			
 
				+
			
 
				+#text {
			
 
				+  background-color: white;
			
 
				+  width: 70rem;
			
 
				+  padding-left: 10rem;
			
 
				+}
			
 
				+
			
 
				+h1,
			
 
				+h2,
			
 
				+h3,
			
 
				+h4,
			
 
				+h5,
			
 
				+h6 {
			
 
				+  position: relative;
			
 
				+  margin-top: 1rem;
			
 
				+  margin-bottom: 1rem;
			
 
				+  font-weight: bold;
			
 
				+  line-height: 1.4;
			
 
				+  cursor: text;
			
 
				+  text-align: left;
			
 
				+}
			
 
				+
			
 
				+h1 {
			
 
				+  font-size: 2.25em;
			
 
				+  line-height: 1.2;
			
 
				+  border-bottom: 1px solid #eee;
			
 
				+}
			
 
				+
			
 
				+h2 {
			
 
				+  font-size: 1.75em;
			
 
				+  line-height: 1.225;
			
 
				+  border-bottom: 1px solid #eee;
			
 
				+}
			
 
				+
			
 
				+h3 {
			
 
				+  font-size: 1.5em;
			
 
				+  line-height: 1.43;
			
 
				+}
			
 
				+
			
 
				+h4 {
			
 
				+  font-size: 1.25em;
			
 
				+}
			
 
				+
			
 
				+h5 {
			
 
				+  font-size: 1em;
			
 
				+}
			
 
				+
			
 
				+h6 {
			
 
				+  font-size: 1em;
			
 
				+  color: #777;
			
 
				+}
			
 
				+
			
 
				+p,
			
 
				+ul,
			
 
				+ol {
			
 
				+  margin: 0.8em 0;
			
 
				+  text-align: left;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/UserLogin/index.vue
+++ b/src/views/UserLogin/index.vue
@@ -0,0 +1,566 @@
 
				+<template>
			
 
				+  <div class="bigbox">
			
 
				+    <div class="img">
			
 
				+      <div class="login">
			
 
				+        <div class="header">
			
 
				+          <h1 id="welcom">欢迎使用家政预约平台</h1>
			
 
				+        </div>
			
 
				+
			
 
				+        <el-tabs v-model="activeTab" @tab-change="handleClick" class="demo-tabs">
			
 
				+          <el-tab-pane label="手机号登陆" name="first"></el-tab-pane>
			
 
				+          <el-tab-pane label="邮箱登陆" name="second"></el-tab-pane>
			
 
				+          <el-tab-pane label="账号密码登陆" name="third"></el-tab-pane>
			
 
				+        </el-tabs>
			
 
				+        <div v-if="this.loginMethod.usePhone">
			
 
				+          <input type="text" placeholder="手机号" required v-model="phone" />
			
 
				+
			
 
				+          <br />
			
 
				+          <input class="verificationCode" type="text" placeholder="验证码" required v-model="validateCode" />
			
 
				+          <input @click="getValidateCode('1')" class="verificationButton" type="button" value="获取验证码" />
			
 
				+          <div class="radio">
			
 
				+            <label class="lable">家政工作人员</label>
			
 
				+            <input class="rad" type="radio" value="1" v-model="usertype" />
			
 
				+            &nbsp;&nbsp;
			
 
				+            <label class="lable">雇主</label>
			
 
				+            <input class="rad" type="radio" value="2" v-model="usertype" />
			
 
				+          </div>
			
 
				+
			
 
				+          <br />
			
 
				+          <input type="submit" @click.prevent="login($event, '1')" value="Login" @keyup.enter.native="login($event, '1')" />
			
 
				+          <p class="regis" @click="regis">没有账户?</p>
			
 
				+        </div>
			
 
				+        <div v-if="this.loginMethod.useEmail">
			
 
				+          <input type="text" placeholder="邮箱" required v-model="email" />
			
 
				+
			
 
				+          <br />
			
 
				+          <input class="verificationCode" type="text" placeholder="验证码" @keyup.enter.native="login" required
			
 
				+            v-model="validateCode" />
			
 
				+          <input @click="getValidateCode('2')" class="verificationButton" type="button" value="获取验证码" />
			
 
				+          <div class="radio">
			
 
				+            <label class="lable">家政工作人员</label>
			
 
				+            <input class="rad" type="radio" value="1" v-model="usertype" />
			
 
				+            &nbsp;&nbsp;
			
 
				+            <label class="lable">雇主</label>
			
 
				+            <input class="rad" type="radio" value="2" v-model="usertype" />
			
 
				+          </div>
			
 
				+          <div class="bigerror" v-if="vali.unvali || vali.pwdvali"></div>
			
 
				+          <br />
			
 
				+          <input type="submit" @click.prevent="login($event, '2')" value="Login" @keyup.enter.native="login($event, '2')" />
			
 
				+          <p class="regis" @click="regis">没有账户?</p>
			
 
				+        </div>
			
 
				+        <div v-if="this.loginMethod.useName">
			
 
				+          <input type="text" placeholder="账户名" required v-model="username" />
			
 
				+
			
 
				+          <input type="password" placeholder="密码" required v-model="password" />
			
 
				+          <div class="radio">
			
 
				+            <label class="lable">家政工作人员</label>
			
 
				+            <input class="rad" type="radio" value="1" v-model="usertype" />
			
 
				+            &nbsp;&nbsp;
			
 
				+            <label class="lable">雇主</label>
			
 
				+            <input class="rad" type="radio" value="2" v-model="usertype" />
			
 
				+          </div>
			
 
				+          <div class="bigerror" v-if="this.v">
			
 
				+            <div class="error" v-html="errormsg"></div>
			
 
				+          </div>
			
 
				+          <br />
			
 
				+          <input type="submit" @click.prevent="login($event, '3')" value="Login" @keyup.enter.native="login($event, '3')" />
			
 
				+          <p class="regis" @click="regis">没有账户?</p>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+<script>
			
 
				+import { mapState } from "vuex";
			
 
				+import { mapMutations } from "vuex";
			
 
				+import popmessage from "@/components/tip/index.js";
			
 
				+
			
 
				+import { phoneValidate, phoneLogin, emailValidate, emailLogin, UserLogin } from "@/api";
			
 
				+export default {
			
 
				+  name: "AdminLogin",
			
 
				+  data() {
			
 
				+    return {
			
 
				+      v: false,
			
 
				+      activeTab: "first",
			
 
				+      usertype: "",
			
 
				+      username: "",
			
 
				+      password: "",
			
 
				+      phone: "",
			
 
				+      validateCode: "",
			
 
				+      email: "",
			
 
				+      errorList: [],
			
 
				+      errormsg: "",
			
 
				+      vali: {
			
 
				+        unvali: true,
			
 
				+        pwdvali: "",
			
 
				+      },
			
 
				+      loginMethod: {
			
 
				+        usePhone: true,
			
 
				+        useEmail: false,
			
 
				+        useName: false,
			
 
				+      },
			
 
				+    };
			
 
				+  },
			
 
				+  computed: {
			
 
				+    ...mapState("LoginStore", ["login_name", "tokenStore"]),
			
 
				+  },
			
 
				+  created(){
			
 
				+  },
			
 
				+  methods: {
			
 
				+    ...mapMutations("LoginStore", ["setLoginName"]),
			
 
				+    validate3() {
			
 
				+      this.errormsg = "";
			
 
				+      if (this.username == "" || this.password == "" || this.usertype == "") {
			
 
				+        this.errormsg += "请填写完整信息";
			
 
				+        this.v = true;
			
 
				+        return false;
			
 
				+      }
			
 
				+      if (this.username.length < 4) {
			
 
				+        this.errormsg += "账户名长度不得小于四位";
			
 
				+        this.v = true;
			
 
				+        return false;
			
 
				+      }
			
 
				+      var pPattern =
			
 
				+        /^.*(?=.{6,})(?=.*\d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*? ]).*$/;
			
 
				+      if (!pPattern.test(this.password)) {
			
 
				+        this.errormsg +=
			
 
				+          "密码最少6位，包括至少1个大写字母，<BR/>1个小写字母，1个数字，1个特殊字符<br/>";
			
 
				+        this.v = true;
			
 
				+        return false;
			
 
				+      }
			
 
				+      return true;
			
 
				+    },
			
 
				+    //切换登陆方式
			
 
				+    handleClick(tag) {
			
 
				+      if (tag === "first") {
			
 
				+        this.loginMethod.usePhone = true;
			
 
				+        this.loginMethod.useEmail = false;
			
 
				+        this.loginMethod.useName = false;
			
 
				+      } else if (tag === "second") {
			
 
				+        this.loginMethod.usePhone = false;
			
 
				+        this.loginMethod.useEmail = true;
			
 
				+        this.loginMethod.useName = false;
			
 
				+      } else if (tag === "third") {
			
 
				+        this.loginMethod.usePhone = false;
			
 
				+        this.loginMethod.useEmail = false;
			
 
				+        this.loginMethod.useName = true;
			
 
				+      }
			
 
				+    },
			
 
				+
			
 
				+    //获取验证码
			
 
				+    getValidateCode(i) {
			
 
				+      if (i === "1") {
			
 
				+        //电话号码格式验证
			
 
				+        const phoneRegx =
			
 
				+          /^1[3456789]\d{9}$/;
			
 
				+        if (!phoneRegx.test(this.phone)) {
			
 
				+          popmessage({ type: "error", str: "手机号不正确" });
			
 
				+          return;
			
 
				+        } else if (this.usertype == "") {
			
 
				+          popmessage({ type: "error", str: "请选择你的角色" });
			
 
				+          return;
			
 
				+        }
			
 
				+        popmessage({ type: "success", str: "正在发送验证码" });
			
 
				+        const parmas = {
			
 
				+          phone: this.phone,
			
 
				+          userType: this.usertype,
			
 
				+        };
			
 
				+        phoneValidate(parmas).then((response) => {
			
 
				+          if (response.data.code === 200) {
			
 
				+          } else {
			
 
				+            popmessage({ type: "error", str: response.data.msg });
			
 
				+          }
			
 
				+        });
			
 
				+      } else if (i === "2") {
			
 
				+        //邮箱格式验证
			
 
				+        const eamilRegx =
			
 
				+          /^[\w\-]+(\.[\w\-]+)*@[\w\-]+(\.[\w\-]+)+$/;
			
 
				+        if (!eamilRegx.test(this.email)) {
			
 
				+          popmessage({ type: "error", str: "请填写正确邮箱" });
			
 
				+          return;
			
 
				+        } else if (this.usertype == "") {
			
 
				+          popmessage({ type: "error", str: "请选择你的角色" });
			
 
				+          return;
			
 
				+        }
			
 
				+        popmessage({ type: "success", str: "正在发送验证码" });
			
 
				+        const parmas = {
			
 
				+          email: this.email,
			
 
				+          userType: this.usertype,
			
 
				+        };
			
 
				+        emailValidate(parmas).then((response) => {
			
 
				+          if (response.data.code == 200) {
			
 
				+          } else {
			
 
				+            popmessage({ type: "error", str: response.data.msg });
			
 
				+          }
			
 
				+        });
			
 
				+      }
			
 
				+    },
			
 
				+
			
 
				+    login(e, i) {
			
 
				+      e.currentTarget.style.backgroundColor = "#39566e";
			
 
				+      e.currentTarget.value = "Logining";
			
 
				+      this.setLoginName(this.username);
			
 
				+      let params = {}
			
 
				+      if (i == "1") {
			
 
				+        params = {
			
 
				+          object: this.phone,
			
 
				+          userType: this.usertype,
			
 
				+          code: this.validateCode,
			
 
				+        };
			
 
				+        phoneLogin(params)
			
 
				+          .then((response) => {
			
 
				+            this.$store.commit("changeType", params.userType);
			
 
				+            if (response.data.code === 200 && this.usertype === "1") {
			
 
				+              console.log(response.data.data)
			
 
				+              this.phone = "";
			
 
				+              this.validateCode = "";
			
 
				+              this.userType = "";
			
 
				+              //传到本地
			
 
				+              if (response.data.data.token) {
			
 
				+                localStorage.setItem("token", response.data.data.token);
			
 
				+              }
			
 
				+              localStorage.setItem("userType", this.usertype);
			
 
				+              popmessage({ type: "success", str: "登录成功" });
			
 
				+              setTimeout(() => {
			
 
				+                this.$router.go(0);
			
 
				+              }, 500);
			
 
				+              this.$router.push({
			
 
				+                name: "thehome",
			
 
				+                params: {
			
 
				+                  username: this.login_name,
			
 
				+                },
			
 
				+              });
			
 
				+            }else if(response.data.code === 200 && this.usertype === "2"){
			
 
				+              localStorage.setItem("token", response.data.data.token);
			
 
				+              localStorage.setItem("userType", this.usertype);
			
 
				+              this.phone = "";
			
 
				+              this.validateCode = "";
			
 
				+              this.userType = "";
			
 
				+              popmessage({ type: "success", str: "登录成功" });
			
 
				+              setTimeout(() => {
			
 
				+                this.$router.go(0);
			
 
				+              }, 500);
			
 
				+              this.$router.push({
			
 
				+                name: "introduce",
			
 
				+              });
			
 
				+            }
			
 
				+            else {
			
 
				+              this.phone = "";
			
 
				+              this.validateCode = "";
			
 
				+              this.usertype = "";
			
 
				+              popmessage({ type: "error", str: "验证码错误" });
			
 
				+              this.$router.replace("/loginview");
			
 
				+            }
			
 
				+          })
			
 
				+          .catch((error) => {
			
 
				+            this.phone = "";
			
 
				+            this.validateCode = "";
			
 
				+            this.usertype = "";
			
 
				+            this.$router.go(0);
			
 
				+            console.log("错误信息：", error);
			
 
				+            alert("登陆失败请重试！");
			
 
				+          });
			
 
				+      } else if (i == "2") {
			
 
				+        params = {
			
 
				+          object: this.email,
			
 
				+          userType: this.usertype,
			
 
				+          code: this.validateCode,
			
 
				+        };
			
 
				+        emailLogin(params)
			
 
				+          .then((response) => {
			
 
				+            this.$store.commit("changeType", params.userType);
			
 
				+
			
 
				+            if (response.data.code === 200 && this.usertype == "1") {
			
 
				+              this.email = "";
			
 
				+              this.validateCode = "";
			
 
				+              this.userType = "";
			
 
				+              //传到本地
			
 
				+              if (response.data.data.token) {
			
 
				+                localStorage.setItem("token", response.data.data.token);
			
 
				+              }
			
 
				+              localStorage.setItem("userType", this.usertype);
			
 
				+              popmessage({ type: "success", str: "登录成功" });
			
 
				+              setTimeout(() => {
			
 
				+                this.$router.go(0);
			
 
				+              }, 500);
			
 
				+              this.$router.push({
			
 
				+                name: "thehome",
			
 
				+                params: {
			
 
				+                  username: this.login_name,
			
 
				+                },
			
 
				+              });
			
 
				+            } else if (response.data.code === 200 && this.usertype === "2") {
			
 
				+              localStorage.setItem("token", response.data.data.token);
			
 
				+              localStorage.setItem("userType", this.usertype);
			
 
				+              this.email = "";
			
 
				+              this.validateCode = "";
			
 
				+              this.userType = "";
			
 
				+              popmessage({ type: "success", str: "登录成功" });
			
 
				+              setTimeout(() => {
			
 
				+                this.$router.go(0);
			
 
				+              }, 500);
			
 
				+              this.$router.push({
			
 
				+                name: "introduce",
			
 
				+              });
			
 
				+            } else {
			
 
				+              this.email = "";
			
 
				+              this.validateCode = "";
			
 
				+              this.userType = "";
			
 
				+              popmessage({ type: "error", str: "验证码错误" });
			
 
				+              this.$router.replace("/loginview");
			
 
				+            }
			
 
				+          })
			
 
				+          .catch((error) => {
			
 
				+            this.email = "";
			
 
				+            this.validateCode = "";
			
 
				+            this.usertype = "";
			
 
				+            this.$router.go(0);
			
 
				+            console.log("错误信息：", error);
			
 
				+            alert("登陆失败请重试！");
			
 
				+          });
			
 
				+      } else if (i == "3") {
			
 
				+        var v = this.validate3();
			
 
				+        console.log("validate3", v);
			
 
				+        if (!this.validate3()) {
			
 
				+          return;
			
 
				+        }
			
 
				+
			
 
				+        const parm = {
			
 
				+          userName: this.username,
			
 
				+          password: this.password,
			
 
				+          userType: this.usertype,
			
 
				+        };
			
 
				+        UserLogin(parm)
			
 
				+          .then((response) => {
			
 
				+            this.$store.commit("changeType", parm.userType);
			
 
				+            if (response.data.code === 200 && this.usertype == "1") {
			
 
				+              this.username = "";
			
 
				+              this.password = "";
			
 
				+              this.userType = "";
			
 
				+              //传到本地
			
 
				+              if (response.data.data.token) {
			
 
				+                localStorage.setItem("token", response.data.data.token);
			
 
				+              }
			
 
				+              localStorage.setItem("userType", this.usertype);
			
 
				+              popmessage({ type: "success", str: "登录成功" });
			
 
				+              setTimeout(() => {
			
 
				+                this.$router.go(0);
			
 
				+              }, 500);
			
 
				+              this.$router.push({
			
 
				+                name: "thehome",
			
 
				+                params: {
			
 
				+                  username: this.login_name,
			
 
				+                },
			
 
				+              });
			
 
				+            } else if (response.data.code === 200 && this.usertype == "2") {
			
 
				+              localStorage.setItem("token", response.data.data.token);
			
 
				+              localStorage.setItem("userType", this.usertype);
			
 
				+              this.username = "";
			
 
				+              this.password = "";
			
 
				+              this.userType = "";
			
 
				+              popmessage({ type: "success", str: "登录成功" });
			
 
				+              setTimeout(() => {
			
 
				+                this.$router.go(0);
			
 
				+              }, 500);
			
 
				+              this.$router.push({
			
 
				+                name: "introduce",
			
 
				+              });
			
 
				+            } else {
			
 
				+              this.username = "";
			
 
				+              this.password = "";
			
 
				+              this.userType = "";
			
 
				+              alert("账户密码错误！");
			
 
				+              this.$router.replace("/loginview");
			
 
				+            }
			
 
				+          })
			
 
				+          .catch((error) => {
			
 
				+            this.username = "";
			
 
				+            this.password = "";
			
 
				+            this.$router.go(0);
			
 
				+            console.log("错误信息：", error);
			
 
				+            alert("登陆失败请重试！");
			
 
				+          });
			
 
				+      }
			
 
				+    },
			
 
				+    regis() {
			
 
				+      this.$router.push("/userreg");
			
 
				+    },
			
 
				+  },
			
 
				+};
			
 
				+</script>
			
 
				+
			
 
				+<style scoped>
			
 
				+img {
			
 
				+  width: 100%;
			
 
				+}
			
 
				+
			
 
				+.img {
			
 
				+  height: 43rem;
			
 
				+  width: 80rem;
			
 
				+  position: absolute;
			
 
				+  top: 55%;
			
 
				+  left: 50%;
			
 
				+  transform: translate(-50%, -50%);
			
 
				+  background: url("../../assets/2.png");
			
 
				+  background-size: contain;
			
 
				+}
			
 
				+
			
 
				+.login {
			
 
				+  position: relative;
			
 
				+  width: 40rem;
			
 
				+  height: 35rem;
			
 
				+  right: 0rem;
			
 
				+  top: 7rem;
			
 
				+  left: 40rem;
			
 
				+}
			
 
				+
			
 
				+#welcom {
			
 
				+  color: #272727;
			
 
				+  font-weight: 700;
			
 
				+  font-size: 1.5rem;
			
 
				+  border-bottom: 0.0556rem solid #e7e0e0;
			
 
				+  margin-top: -0.7222rem;
			
 
				+  padding-bottom: 1.1111rem;
			
 
				+}
			
 
				+
			
 
				+input {
			
 
				+  width: 50%;
			
 
				+  height: 2.6rem;
			
 
				+  margin-top: 1rem;
			
 
				+  font-size: 1rem;
			
 
				+}
			
 
				+
			
 
				+.logintitle {
			
 
				+  font-size: 1.5rem;
			
 
				+  margin-bottom: 2.2222rem;
			
 
				+}
			
 
				+
			
 
				+.regis {
			
 
				+  font-size: 0.8333rem;
			
 
				+
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+input[type="submit"] {
			
 
				+  font-size: 0.8889rem;
			
 
				+  width: 13rem;
			
 
				+  background-color: #3e81b8;
			
 
				+  color: white;
			
 
				+  font-weight: bold;
			
 
				+}
			
 
				+
			
 
				+input[type="submit"]:hover {
			
 
				+  background: #2e2d2d;
			
 
				+  color: #fff;
			
 
				+}
			
 
				+
			
 
				+.error {
			
 
				+  color: #e45252;
			
 
				+  text-align: start;
			
 
				+  margin-left: 8rem;
			
 
				+  margin-top: 0.75rem;
			
 
				+  margin-bottom: -0.05rem;
			
 
				+  font-size: 0.875rem;
			
 
				+}
			
 
				+
			
 
				+.radio {
			
 
				+  margin: 0 auto;
			
 
				+  width: 55%;
			
 
				+  margin-top: 1.15rem;
			
 
				+  box-sizing: border-box;
			
 
				+  margin-bottom: 0.4rem;
			
 
				+}
			
 
				+
			
 
				+.rad {
			
 
				+  margin-top: -0.1rem;
			
 
				+  margin-bottom: 0.05rem;
			
 
				+  width: 1.125rem;
			
 
				+  height: 1.125rem;
			
 
				+  vertical-align: middle;
			
 
				+}
			
 
				+
			
 
				+.lable {
			
 
				+  display: inline-block;
			
 
				+}
			
 
				+
			
 
				+/* 选择登陆方式页头 */
			
 
				+::v-deep .el-tabs__item.is-active {
			
 
				+  color: #557c70;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-tabs__item:hover {
			
 
				+  color: #557c70;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-tabs__active-bar {
			
 
				+  position: absolute;
			
 
				+  bottom: 0;
			
 
				+  left: 0;
			
 
				+  height: 2px;
			
 
				+  background-color: #557c70;
			
 
				+  z-index: 1;
			
 
				+  transition: width var(--el-transition-duration) var(--el-transition-function-ease-in-out-bezier),
			
 
				+    transform var(--el-transition-duration) var(--el-transition-function-ease-in-out-bezier);
			
 
				+  list-style: none;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-tabs__nav-next,
			
 
				+.el-tabs__nav-prev {
			
 
				+  position: absolute;
			
 
				+  cursor: pointer;
			
 
				+  line-height: 44px;
			
 
				+  font-size: 1rem;
			
 
				+  color: var(--el-text-color-secondary);
			
 
				+  width: 20px;
			
 
				+  text-align: center;
			
 
				+  left: 0.5rem;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-tabs__item {
			
 
				+  padding: 0 20px;
			
 
				+  height: 3.5rem;
			
 
				+  box-sizing: border-box;
			
 
				+  line-height: var(--el-tabs-header-height);
			
 
				+  display: inline-block;
			
 
				+  list-style: none;
			
 
				+  font-size: 1rem;
			
 
				+  font-weight: 530;
			
 
				+  color: var(--el-text-color-primary);
			
 
				+  position: relative;
			
 
				+  left: 3rem;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-tabs {
			
 
				+  --el-tabs-header-height: 3rem;
			
 
				+  width: 26rem;
			
 
				+  margin-left: 6rem;
			
 
				+}
			
 
				+
			
 
				+::v-deep .el-tabs__nav-wrap::after {
			
 
				+  content: "";
			
 
				+  position: absolute;
			
 
				+  left: 3rem;
			
 
				+  bottom: 0;
			
 
				+  width: 79%;
			
 
				+  height: 2px;
			
 
				+  background-color: var(--el-border-color-light);
			
 
				+  z-index: var(--el-index-normal);
			
 
				+}
			
 
				+
			
 
				+.verificationCode {
			
 
				+  width: 12rem;
			
 
				+  margin-left: 0rem;
			
 
				+}
			
 
				+
			
 
				+.verificationButton {
			
 
				+  margin-left: 1rem;
			
 
				+  width: 7rem;
			
 
				+  font-size: 0.8rem;
			
 
				+  background-color: #ecf5ff;
			
 
				+  color: #52a7f8;
			
 
				+  border: #6c9ecc;
			
 
				+  border-radius: 0.5rem;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+</style>
			
--- a/src/views/UserReg/index.vue
+++ b/src/views/UserReg/index.vue