2023.12.30

- 材料网入驻端使用最新版代码手动覆盖

build/webpack.dev.conf.js

@@ -82,11 +82,14 @@ module.exports = new Promise((resolve, reject) => {
       // Add FriendlyErrorsPlugin
       devWebpackConfig.plugins.push(new FriendlyErrorsPlugin({
         compilationSuccessInfo: {
-          messages: [`Your application is running here: http://${devWebpackConfig.devServer.host}:${port}`],
+          messages: [
+            `Your application is running here: http://localhost:${port}`,
+            `Network: http://${require('ip').address()}:${port}`,
+          ],
         },
         onErrors: config.dev.notifyOnErrors
-        ? utils.createNotifierCallback()
-        : undefined
+          ? utils.createNotifierCallback()
+          : undefined
       }))
 
       resolve(devWebpackConfig)

config/index.js

@@ -21,7 +21,7 @@ module.exports = {
 
     // Various Dev Server settings
     // host: '0.0.0.0', // can be overwritten by process.env.HOST
-    host: 'localhost', // can be overwritten by process.env.HOST
+    host: '0.0.0.0', // can be overwritten by process.env.HOST
     port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
     autoOpenBrowser: false,
     errorOverlay: true,

jsconfig.json

@@ -0,0 +1,17 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/*": [
+        "src/*"
+      ]
+    },
+    "experimentalDecorators": true,
+    "jsx": "preserve"
+  },
+  "exclude": [
+    "node_modules",
+    "dist",
+    "build"
+  ]
+}

package-lock.json

@@ -181,11 +181,6 @@
         "to-fast-properties": "^2.0.0"
       }
     },
-    "@popperjs/core": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npm.taobao.org/@popperjs/core/download/@popperjs/core-2.6.0.tgz",
-      "integrity": "sha1-8CIZWv38lC4IjuIQEoWh0xx9cn8="
-    },
     "@types/json5": {
       "version": "0.0.29",
       "resolved": "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz",
@@ -199,22 +194,19 @@
       "dev": true
     },
     "@vant/icons": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npm.taobao.org/@vant/icons/download/@vant/icons-1.5.0.tgz?cache=0&sync_timestamp=1608190068028&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40vant%2Ficons%2Fdownload%2F%40vant%2Ficons-1.5.0.tgz",
-      "integrity": "sha1-znii8FWhpAmRKbtsRNVFhPN0Dic="
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/@vant/icons/-/icons-3.0.0.tgz",
+      "integrity": "sha512-g0sNQGwq3xajpri698ql/MjeMZ0Bwptjf7WO+s5fZEPq4smesmwC8Jda1OetidBjI0cQ5c7cYqoNGlkQA81TMw=="
     },
     "@vant/popperjs": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npm.taobao.org/@vant/popperjs/download/@vant/popperjs-1.0.2.tgz",
-      "integrity": "sha1-Ui1xZWI1Elo64I6ccBo7rm/YjXs=",
-      "requires": {
-        "@popperjs/core": "^2.5.4"
-      }
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/@vant/popperjs/-/popperjs-1.3.0.tgz",
+      "integrity": "sha512-hB+czUG+aHtjhaEmCJDuXOep0YTZjdlRR+4MSmIFnkCQIxJaXLQdSsR90XWvAI2yvKUI7TCGqR8pQg2RtvkMHw=="
     },
     "@vue/babel-helper-vue-jsx-merge-props": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npm.taobao.org/@vue/babel-helper-vue-jsx-merge-props/download/@vue/babel-helper-vue-jsx-merge-props-1.2.1.tgz?cache=0&sync_timestamp=1602851122331&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40vue%2Fbabel-helper-vue-jsx-merge-props%2Fdownload%2F%40vue%2Fbabel-helper-vue-jsx-merge-props-1.2.1.tgz",
-      "integrity": "sha1-MWJKelBfsU2h1YAjclpMXycOaoE="
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.4.0.tgz",
+      "integrity": "sha512-JkqXfCkUDp4PIlFdDQ0TdXoIejMtTHP67/pvxlgeY+u5k3LEdKuWZ3LK6xkxo52uDoABIVyRwqVkfLQJhk7VBA=="
     },
     "accepts": {
       "version": "1.3.7",
@@ -6809,9 +6801,9 @@
       "dev": true
     },
     "nan": {
-      "version": "2.14.2",
-      "resolved": "https://registry.npmjs.org/nan/-/nan-2.14.2.tgz",
-      "integrity": "sha512-M2ufzIiINKCuDfBSAUr1vWQ+vuVcA9kqx8JJUsbQi6yf1uGRyb7HfpdfUr5qLXf3B/t8dPvcjhKMmlfnP47EzQ==",
+      "version": "2.18.0",
+      "resolved": "https://registry.npmjs.org/nan/-/nan-2.18.0.tgz",
+      "integrity": "sha512-W7tfG7vMOGtD30sHoZSSc/JVYiyDPEyQVso/Zz+/uQd0B0L46gtC+pHha5FFMRpil6fm/AoEcRWyOVi4+E/f8w==",
       "dev": true,
       "optional": true
     },
@@ -12790,13 +12782,13 @@
       }
     },
     "vant": {
-      "version": "2.12.1",
-      "resolved": "https://registry.npm.taobao.org/vant/download/vant-2.12.1.tgz?cache=0&sync_timestamp=1609075406947&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fvant%2Fdownload%2Fvant-2.12.1.tgz",
-      "integrity": "sha1-q0wBOqBQeHQXlKzDb/nZD749K8I=",
+      "version": "2.13.0",
+      "resolved": "https://registry.npmjs.org/vant/-/vant-2.13.0.tgz",
+      "integrity": "sha512-dDsU9FkmWI/2jYCcKz+7zSp7/MUND4i961vipZ8Yg0VaXrCIyStSEaFDGYIieB+PsroG9LdwBvIFzZ+W+qcKPw==",
       "requires": {
         "@babel/runtime": "7.x",
-        "@vant/icons": "1.5.0",
-        "@vant/popperjs": "^1.0.0",
+        "@vant/icons": "^3.0.0",
+        "@vant/popperjs": "^1.1.0",
         "@vue/babel-helper-vue-jsx-merge-props": "^1.0.0",
         "vue-lazyload": "1.2.3"
       }
@@ -12863,8 +12855,8 @@
     },
     "vue-lazyload": {
       "version": "1.2.3",
-      "resolved": "https://registry.npm.taobao.org/vue-lazyload/download/vue-lazyload-1.2.3.tgz",
-      "integrity": "sha1-kB+ewVx+bKeHgaK65KNDaGve2yw="
+      "resolved": "https://registry.npmjs.org/vue-lazyload/-/vue-lazyload-1.2.3.tgz",
+      "integrity": "sha512-DC0ZwxanbRhx79tlA3zY5OYJkH8FYp3WBAnAJbrcuoS8eye1P73rcgAZhyxFSPUluJUTelMB+i/+VkNU/qVm7g=="
     },
     "vue-loader": {
       "version": "13.7.3",

package.json

@@ -16,7 +16,7 @@
     "js-cookie": "^2.2.0",
     "less": "^3.9.0",
     "less-loader": "^4.1.0",
-    "vant": "^2.12.1",
+    "vant": "^2.12.54",
     "vue": "^2.5.2",
     "vue-router": "^3.0.1",
     "vuex": "^3.1.0"

src/App.vue

@@ -1,3 +1,11 @@
+<!--
+ * @Author: aliyun0758874076 2300202994@qq.com
+ * @Date: 2023-09-14 10:59:00
+ * @LastEditors: aliyun0758874076 2300202994@qq.com
+ * @LastEditTime: 2023-09-23 15:18:33
+ * @FilePath: \jufeng-pc-settle\src\App.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
 <template>
   <div id="app">
     <router-view></router-view>
@@ -5,6 +13,7 @@
 </template>
 
 <script>
+// import '../static/js/canvas-nest.min.js'
 export default {
   name: 'App',
   created () {

src/api/index.js

@@ -1,19 +1,41 @@
+/*
+ * @Author: aliyun0758874076 2300202994@qq.com
+ * @Date: 2023-09-14 10:59:00
+ * @LastEditors: aliyun0758874076 2300202994@qq.com
+ * @LastEditTime: 2023-10-06 15:52:39
+ * @FilePath: \jufeng-pc-settle\src\api\index.js
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
 // 导入api接口模块
 import home from './home'
 
 // 获取当前环境变量 true => 生产环境 false => 开发环境
 const BASEURL = (process.env.NODE_ENV === 'production') ? 'https://mtrappapi.tfcliao.com' : '/api'
 
+// 识别证件号的根路径
+const CARDURL = `https://www.zhult.com/samrtWorker/api`
+
 export const api = {
   // 登录模块
   ...home(BASEURL),
   // 图片上传
   upload: `${BASEURL}/file/upload`,
   // 商家入驻
+  getAdditional: `${BASEURL}/packageMember/selectPackageMember`,
+  getTreeOne: `${BASEURL}/cityManageArea/getTreeOne`,
+  getTreeClass: `${BASEURL}/cityManageArea/getTreeClass`, // getTree 地区分类树查询
+  getTree: `${BASEURL}/cityManageArea/getTree`, // getTree 地区分类树查询 已废弃 一次性返回的数据太多很慢
+  selectAnd: `${BASEURL}/platformUser/selectAnd`, // 查询商家/营销策划师
   enterpriseCheck: `${BASEURL}/check/enterpriseCheck`,
   individualCheck: `${BASEURL}/check/individualCheck`,
   organizationsCheck: `${BASEURL}/check/organizationsCheck`,
   personalCheck: `${BASEURL}/check/personalCheck`,
-  getByName: `${BASEURL}/app/getSelect`
+  getByName: `${BASEURL}/app/getSelect`,
+  plannerCheck: `${BASEURL}/check/marketing`, // 策划师入驻
+  subsidiaryCompanyCheck: `${BASEURL}/check/agentCheck`,
+  getCategoryList: `${BASEURL}/shopCategory/getShopCategoryLevel`,
+  getChildCategoryList: `${BASEURL}/shopCategory/getShopCategorySon`,
+  cardRecognition: `${CARDURL}/third/ocr/idOcr`, // 身份证识别
+  businessRecognition: `${CARDURL}/third/ocr/baiduBusinessLicense` // 营业执照识别
 }
 export default api

src/components/centLogo.vue

@@ -1,3 +1,11 @@
+<!--
+ * @Author: aliyun0758874076 2300202994@qq.com
+ * @Date: 2023-09-14 10:59:00
+ * @LastEditors: aliyun0758874076 2300202994@qq.com
+ * @LastEditTime: 2023-09-14 17:09:22
+ * @FilePath: \jufeng-pc-settle\src\components\centLogo.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
 <template>
   <div class="statusTop">
     <div class="
@@ -18,7 +26,7 @@ export default {
 .statusTop {
   // width: 350px;
   width: 500px;
-  margin: 50px auto 40px auto;
+  margin: 36px auto 26px auto;
   .topLogo {
     text-align: center;
     width: 100%;

src/components/pageLoading.vue

@@ -0,0 +1,35 @@
+<template>
+  <van-overlay :show="pageLoadingVisible"
+    style="background-color: rgba(0, 0, 0, 0.7); display: flex; align-items: center; justify-content: center;">
+    <van-loading size="48px" vertical type="spinner" color="#fff">{{ laodingText }}</van-loading>
+  </van-overlay>
+</template>
+
+<script>
+import { Overlay, Loading } from 'vant'
+export default {
+  components: {
+    [Overlay.name]: Overlay,
+    [Loading.name]: Loading
+  },
+  data() {
+    return {
+      pageLoadingVisible: false,
+      laodingText: '加载中'
+    }
+  },
+
+  methods: {
+    showPageLoading(laodingText) {
+      this.pageLoadingVisible = true
+      this.laodingText = laodingText || '加载中'
+    },
+
+    cloasePageLoading() {
+      this.pageLoadingVisible = false
+    }
+  },
+}
+</script>
+
+<style scoped></style>

src/config/mixin/searchMixin.js

@@ -5,7 +5,7 @@ import request from './server'
 
 /* eslint-disable */
 export const listSearch = {
-  data () {
+  data() {
     return {
       // 加载中
       loading: false,
@@ -15,22 +15,23 @@ export const listSearch = {
     /*
      * 发送请求
      */
-    sendReq (params, callback) {
+    sendReq(params, callback, errCb) {
       let self = this
       request({
         method: params.method || 'POST',
         url: params.url,
         data: params.data || {},
-        withCredentials : true,
+        params: params.params || {}, // 傻逼玩意，参数全tm的默认隐藏的，老子是没见过哪个傻逼这样去封装请求的，还得老子来改，初代的开发者是脑子有屎吧
+        withCredentials: true,
         headers: {
           'Content-Type': params.contentType || 'application/json;charset=utf-8'
         }
       }).then((res) => {
         if (res && res.data) {
           callback && callback(res.data)
-        }
-      }, (error) => {
-        console.log(error)
+        } 
+      }).catch(error => {
+        errCb && typeof errCb === 'function' && errCb(error)
       })
     }
   }

src/main.js

@@ -1,3 +1,11 @@
+/*
+ * @Author: aliyun0758874076 2300202994@qq.com
+ * @Date: 2023-09-14 10:59:00
+ * @LastEditors: aliyun0758874076 2300202994@qq.com
+ * @LastEditTime: 2023-09-17 15:46:16
+ * @FilePath: \jufeng-pc-settle\src\main.js
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
 // The Vue build version to load with the `import` command
 // (runtime-only or standalone) has been set in webpack.base.conf with an alias.
 import Vue from 'vue'

src/router/index.js

@@ -52,6 +52,19 @@ const router = new Router({
           path: '/organization', // PC 其它组织机构入驻
           name: 'organization',
           component: () => import('@/views/SettleIn/organization')
+        },
+        {
+          path: '/planner', // PC 营销策划师入驻
+          name: 'planner',
+          meta: {
+            keepAlive: true
+          },
+          component: () => import('@/views/SettleIn/planner')
+        },
+        {
+          path: '/subsidiaryCompany', // PC 分公司入驻
+          name: 'subsidiaryCompany',
+          component: () => import('@/views/SettleIn/subsidiaryCompany')
         }
       ]
     },
@@ -79,6 +92,16 @@ const router = new Router({
       path: '/mOtherOrg', // 手机其它组织机构入驻
       name: 'mOtherOrg',
       component: mOtherOrg
+    },
+    {
+      path: '/mPlanner', // 手机个人入驻
+      name: 'mPlanner',
+      component: () => import('@/views/moblie/mPlanner')
+    },
+    {
+      path: '/mSubsidiaryCompany', // 手机其它组织机构入驻
+      name: 'mSubsidiaryCompany',
+      component: () => import('@/views/moblie/mSubsidiaryCompany')
     }
   ]
 })

src/store/getter.js

@@ -1,2 +1,11 @@
+/*
+ * @Author: aliyun0758874076 2300202994@qq.com
+ * @Date: 2023-09-14 10:59:00
+ * @LastEditors: aliyun0758874076 2300202994@qq.com
+ * @LastEditTime: 2023-09-23 11:41:52
+ * @FilePath: \jufeng-pc-settle\src\store\getter.js
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
 export const mseId = state => state.mseId
 export const userName = state => state.userName
+export const getAdditional = state => state.getAdditional

src/store/mutation-types.js

@@ -1,2 +1,11 @@
+/*
+ * @Author: aliyun0758874076 2300202994@qq.com
+ * @Date: 2023-09-14 10:59:00
+ * @LastEditors: aliyun0758874076 2300202994@qq.com
+ * @LastEditTime: 2023-09-23 11:47:04
+ * @FilePath: \jufeng-pc-settle\src\store\mutation-types.js
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
 export const SET_MSEID = 'SET_MSEID'
 export const SET_USERNAME = 'SET_USERNAME'
+export const SET_ADDITIONAL = 'SET_ADDITIONAL'

src/store/mutations.js

@@ -1,3 +1,11 @@
+/*
+ * @Author: aliyun0758874076 2300202994@qq.com
+ * @Date: 2023-09-14 10:59:00
+ * @LastEditors: aliyun0758874076 2300202994@qq.com
+ * @LastEditTime: 2023-09-23 11:46:11
+ * @FilePath: \jufeng-pc-settle\src\store\mutations.js
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
 import * as types from './mutation-types'
 
 const mutations = {
@@ -6,6 +14,9 @@ const mutations = {
   },
   [types.SET_USERNAME] (state, name) {
     state.userName = name
+  },
+  [types.SET_ADDITIONAL] (state, getAdditionalArray) {
+    state.getAdditional = getAdditionalArray
   }
 }
 

src/store/state.js

@@ -1,6 +1,7 @@
 const state = {
   mseId: 0, // 城域网MSEID
-  userName: ''
+  userName: '',
+  additional: null // 可供选择的会员套餐
 }
 
 export default state

src/util/ArrayFunction.js

@@ -0,0 +1,27 @@
+/*
+ * @Author: aliyun0758874076 2300202994@qq.com
+ * @Date: 2023-09-16 14:38:57
+ * @LastEditors: aliyun0758874076 2300202994@qq.com
+ * @LastEditTime: 2023-09-17 18:04:48
+ * @FilePath: \jufeng-pc-settle\src\util\ArrayFunction.js 用于书写处理数组的方法
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
+export const unemptyArray = function (arr = []) {
+  for (var i = 0; i < arr.length; i++) {
+    if (arr[i].children.length < 1) {
+      // children若为空数组，则将children设为undefined
+      arr[i].children = undefined
+    } else {
+      // children若不为空数组，则继续 递归调用 本方法
+      unemptyArray(arr[i].children)
+    }
+  }
+  return arr
+}
+
+export const formatDate = (now) => { // 时间戳转日期格式
+  let year = now.getFullYear()
+  let month = now.getMonth() + 1
+  let date = now.getDate()
+  return year + '-' + month + '-' + date
+}

src/util/identify.js

@@ -0,0 +1,82 @@
+import api from '@/api'
+import { listSearchMixin } from '@/config/mixin'
+
+//  身份证识别请求函数  
+export function cardIdentify(imageUrl, ocrType, app) {
+  app.sendReq({
+    url: api.cardRecognition,
+    method: "POST",
+    data: {
+      imageUrl,
+      ocrType
+    }
+  }, (res) => {
+    // console.log(res)
+    if (ocrType == 0) {
+      app.idType = "身份证"
+      app.personalForm.subjectIdCard = res.data.cardNum
+      app.personalForm.subjectOperator = res.data.name
+    }
+  })
+}
+
+//  营业执照识别请求函数  status 0 表示个体商户 1 表示企业商户
+export function businessIdentify(fileUrl, app, status) {
+  // console.log(app);
+  app.sendReq({
+    url: api.businessRecognition,
+    method: "POST",
+    data: {
+      fileUrl
+    }
+  }, (res) => {
+    // console.log(res);
+    const { data: { words_result } } = res;
+    //  单词太长 这边简化一下 
+    const from = app.personalForm;
+    if (!words_result) {
+      return
+    } else if (status == 0) {
+      //  商户名称
+      from.subjectName = words_result["单位名称"].words
+      //  社会信用代码
+      from.subjectCode = words_result["社会信用代码"].words
+      //  注册地址
+      from.subjectRegion = words_result["地址"].words
+      //  详细地址
+      from.subjectAdress = "."
+      //  营业开始时间
+      from.subjectStartTime = words_result["成立日期"].words
+      //  营业结束时间
+      from.subjectEndTime = words_result["有效期"].words
+    } else if (status == 1) {
+      //  企业名称
+      from.enterpriseName = words_result["单位名称"].words
+      //  社会信用代码
+      from.enterpriseCode = words_result["社会信用代码"].words
+      //  注册地址
+      from.enterpriseRegion = words_result["地址"].words
+      //  详细地址
+      from.enterpriseAdress = "."
+      //  营业开始时间
+      from.enterpriseStartTime = words_result["成立日期"].words
+      //  营业结束时间
+      from.enterpriseEndTime = words_result["有效期"].words
+    }
+  })
+}
+
+//  刷新页面保存当前数据
+export function saveData(app) {
+  //  页面刷新保存数据
+  window.addEventListener("beforeunload", () => {
+    localStorage.setItem('pageData', JSON.stringify(app.personalForm));
+  })
+  window.addEventListener("load", () => {
+    let dataList = localStorage.getItem("pageData");
+    // console.log(dataList);
+    if (dataList) {
+      app.personalForm = JSON.parse(dataList)
+    }
+  })
+}

src/views/SettleIn/enterprisesApply.vue

@@ -29,17 +29,66 @@
               <el-form-item label="负责人电话" prop="chargePersonPhone">
                 <el-input  maxlength="100" placeholder="请输入负责人电话" v-model="personalForm.chargePersonPhone"></el-input>
               </el-form-item>
-              <el-form-item label="店铺地址" prop="shopAdressProvince">
+              <el-form-item label="店铺类型" prop="isVoucher">
+                <el-radio-group v-model="personalForm.shopType">
+                  <el-radio :label="1">商城</el-radio>
+                  <el-radio :label="2">本地</el-radio>
+                </el-radio-group>
+              </el-form-item>
+              <el-form-item label="是否开放使用代金卷" prop="isVoucher">
+                <el-radio-group v-model="personalForm.isVoucher">
+                  <el-radio :label="1">支持</el-radio>
+                  <el-radio :label="2">不支持</el-radio>
+                </el-radio-group>
+              </el-form-item>
+              <el-form-item label="代金卷抵扣比例" prop="voucherReturn">
+                <el-input :disabled="personalForm.isVoucher == 2" maxlength="100" placeholder="请输入代金卷抵扣比例(以你填写的数值作为百分比的数值,如你填1,则为1%,关闭使用代金卷则默认为0)" v-model="personalForm.voucherReturn"></el-input>
+              </el-form-item>
+              <el-form-item label="入驻套餐" prop="packageId" class="idType">
+                <el-select v-model="personalForm.packageId" placeholder="请选择">
+                  <el-option
+                    v-for="item in setMealData"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.id">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="店铺地址" prop="areaId">
                 <el-cascader
+                      ref="addressChange"
+                      size="large"
+                      :options="options"
+                      v-model="personalForm.areaId"
+                      :props="{ checkStrictly: true,emitPath: false, label:'name',value: 'id', lazy: true, lazyLoad: lazyLoadAddres }"
+                      @change="addressChange">
+                </el-cascader>
+                <!-- <el-cascader
                   size="large"
                   :options="options"
                   v-model="selectedOptions"
                   @change="addressChange">
-                </el-cascader>
+                </el-cascader> -->
               </el-form-item>
               <el-form-item label="" prop="storeAddressDetail">
                 <el-input maxlength="200" resize="none" placeholder="请输入详细地址" type="textarea" :rows="3" v-model="personalForm.storeAddressDetail"></el-input>
               </el-form-item>
+              <el-form-item label="是否绑定策划师">
+                <el-radio-group v-model="isPersonalForm">
+                  <el-radio :label="true">是</el-radio>
+                  <el-radio :label="false">否</el-radio>
+                </el-radio-group>
+              </el-form-item>
+              <el-form-item v-if="isPersonalForm" label="绑定策划师" class="idType">
+                <el-select v-model="personalForm.parentId" placeholder="请先选择好地址，如果当前地区没有营销策划师也可以不绑定">
+                  <el-option
+                    v-for="item in plannerColumns"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.platformUserId">
+                  </el-option>
+                </el-select>
+              </el-form-item>
               <div class="formTit">
                 <span class="serialNumber">02</span>
                 <span class="formName">主体信息</span>
@@ -232,8 +281,20 @@ export default {
         enterpriseCardStartTime: '', // 证件有效开始时间
         enterpriseCardEndTime: '', // 证件有效结束时间
         enterpriseCardPositive: '', // 身份证正面照
-        enterpriseCardSide: '' // 身份证反面照
+        enterpriseCardSide: '', // 身份证反面照
+        shopType: 1, // 店铺类型 1商城 2本地
+        isVoucher: 1, // 是否支持使用代金卷
+        voucherReturn: '', // 代金卷的抵扣比例/返还比例
+        areaId: '', // 区域ID
+        packageId: '',
+        parentId: ''
+      },
+      queryData: {
+        page: 1,
+        size: 20 // 策划师的角色在某个省可能会很多，但是一块区域肯定不会太多，放心大胆的写死为20！！！，不建议模仿 略略略 ψ(｀∇´)ψ
       },
+      isPersonalForm: false,
+      plannerColumns: null,
       idCardList: [],
       dictName: '证件类型',
       isShowImg: true,
@@ -316,6 +377,27 @@ export default {
       myHeaders: {}
     }
   },
+  created () {
+    this.sendReq({
+        url: api.getTreeClass,
+        method: 'GET',
+        params: {}
+      }, (res) => {
+        // console.log(res) // 获取地址选择器数据并去除空的子项
+        this.options = res.data
+      })
+    this.sendReq({
+      url: api.getAdditional, // 套餐购买类型：1-商家，2-策划师 3-分公司
+      method: 'GET',
+      params: {
+        type: 1
+      }
+    }, (res) => {
+      // console.log(res) // 获取地址选择器数据并去除空的子项
+      this.setMealData = res.data
+      // console.log(this.options)
+    })
+  },
   mounted () {
     if (Cookie.get('token')) {
       this.myHeaders.Authorization = Cookie.get('token')
@@ -346,9 +428,31 @@ export default {
       this.personalForm.enterpriseLicense = res.data.url
     },
     addressChange (arr) {
-      this.personalForm.shopAdress = `${CodeToText[arr[0]]}-${CodeToText[arr[1]]}-${CodeToText[arr[2]]}`
-      this.personalForm.shopAdressProvince = CodeToText[arr[0]]
-      this.personalForm.shopAdressCity = CodeToText[arr[1]]
+      // console.log(arr)
+      this.personalForm.shopAdress = ''
+      let datas = this.$refs.addressChange.getCheckedNodes(false)[0] // 获取选中的节点数据
+      for (let i = 0; i < datas.pathNodes.length; i++) {
+        if (i >= datas.pathNodes.length - 1) {
+          this.personalForm.shopAdress += datas.pathNodes[i].label
+        } else {
+          this.personalForm.shopAdress += datas.pathNodes[i].label + '/'
+        }
+      }
+      // console.log(datas)
+      this.sendReq({ // 获取可选择的分公司/策划师
+        url: api.selectAnd,
+        method: 'POST',
+        data: {
+          area: datas.value, // 地区编号
+          type: 2,
+          level: datas.level, // "区级别不能为空"
+          page: this.queryData.page,
+          pageSize: this.queryData.size
+        }
+        }, (res) => {
+          this.plannerColumns = res.data.list
+          console.log(res)
+        })
     },
     registeredAddressChange (arr) {
       this.personalForm.enterpriseRegion = `${CodeToText[arr[0]]}-${CodeToText[arr[1]]}-${CodeToText[arr[2]]}`
@@ -396,7 +500,19 @@ export default {
     },
     resetForm (formName) {
       this.$refs[formName].resetFields()
-    }
+    },
+    lazyLoadAddres (node, resolve) {
+        // console.log(node)
+         this.sendReq({
+          url: api.getTreeOne,
+          method: 'GET',
+          params: {
+            parentId: node.data.id
+          }
+          }, (res) => {
+             resolve(res.data)
+        })
+      }
   }
 }
 </script>

src/views/SettleIn/individualBusiness.vue

@@ -29,17 +29,66 @@
               <el-form-item label="负责人电话" prop="chargePersonPhone">
                 <el-input  maxlength="100" placeholder="请输入负责人电话" v-model="personalForm.chargePersonPhone"></el-input>
               </el-form-item>
-              <el-form-item label="店铺地址" prop="shopAdressProvince">
+              <el-form-item label="店铺类型" prop="isVoucher">
+                <el-radio-group v-model="personalForm.shopType">
+                  <el-radio :label="1">商城</el-radio>
+                  <el-radio :label="2">本地</el-radio>
+                </el-radio-group>
+              </el-form-item>
+              <el-form-item label="是否开放使用代金卷" prop="isVoucher">
+                <el-radio-group v-model="personalForm.isVoucher">
+                  <el-radio :label="1">支持</el-radio>
+                  <el-radio :label="2">不支持</el-radio>
+                </el-radio-group>
+              </el-form-item>
+              <el-form-item label="代金卷抵扣比例" prop="voucherReturn">
+                <el-input :disabled="personalForm.isVoucher == 2" maxlength="100" placeholder="请输入代金卷抵扣比例(以你填写的数值作为百分比的数值,如你填1,则为1%,关闭使用代金卷则默认为0)" v-model="personalForm.voucherReturn"></el-input>
+              </el-form-item>
+              <el-form-item label="入驻套餐" prop="packageId" class="idType">
+                <el-select v-model="personalForm.packageId" placeholder="请选择">
+                  <el-option
+                    v-for="item in setMealData"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.id">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="店铺地址" prop="areaId">
                 <el-cascader
+                      ref="addressChange"
+                      size="large"
+                      :options="options"
+                      v-model="personalForm.areaId"
+                      :props="{ checkStrictly: true,emitPath: false, label:'name',value: 'id', lazy: true, lazyLoad: lazyLoadAddres }"
+                      @change="addressChange">
+                </el-cascader>
+                <!-- <el-cascader
                   size="large"
                   :options="options"
                   v-model="selectedOptions"
                   @change="addressChange">
-                </el-cascader>
+                </el-cascader> -->
               </el-form-item>
               <el-form-item label="" prop="storeAddressDetail">
                 <el-input maxlength="200" resize="none" placeholder="请输入详细地址" type="textarea" :rows="3" v-model="personalForm.storeAddressDetail"></el-input>
               </el-form-item>
+              <el-form-item label="是否绑定策划师">
+                <el-radio-group v-model="isPersonalForm">
+                  <el-radio :label="true">是</el-radio>
+                  <el-radio :label="false">否</el-radio>
+                </el-radio-group>
+              </el-form-item>
+              <el-form-item v-if="isPersonalForm" label="绑定策划师" class="idType">
+                <el-select v-model="personalForm.parentId" placeholder="请先选择好地址，如果当前地区没有营销策划师也可以不绑定">
+                  <el-option
+                    v-for="item in plannerColumns"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.platformUserId">
+                  </el-option>
+                </el-select>
+              </el-form-item>
               <div class="formTit">
                 <span class="serialNumber">02</span>
                 <span class="formName">主体信息</span>
@@ -54,7 +103,7 @@
               <el-form-item label="注册地址" prop="subjectRegion">
                 <el-cascader
                   size="large"
-                  :options="options"
+                  :options="options2"
                   v-model="registeredAddress"
                   @change="registeredAddressChange">
                 </el-cascader>
@@ -206,9 +255,11 @@ export default {
   components: {CentLogo},
   data () {
     return {
-      options: regionData,
+      options: null,
+      options2: regionData,
       selectedOptions: [],
       registeredAddress: [],
+      setMealData: [],
       personalForm: {
         shopName: '', // 店铺名称
         shopPhone: '', // 手机号
@@ -232,8 +283,20 @@ export default {
         subjectCardStartTime: '', // 证件有效开始时间
         subjectCardEndTime: '', // 证件有效结束时间
         subjectCardPositive: '', // 身份证正面照
-        subjectCardSide: '' // 身份证反面照
+        subjectCardSide: '', // 身份证反面照
+        shopType: 1, // 店铺类型 1商城 2本地
+        isVoucher: 1, // 是否支持使用代金卷
+        voucherReturn: '', // 代金卷的抵扣比例/返还比例
+        areaId: '', // 区域ID
+        packageId: '',
+        parentId: ''
+      },
+      queryData: {
+        page: 1,
+        size: 20 // 策划师的角色在某个省可能会很多，但是一块区域肯定不会太多，放心大胆的写死为20！！！，不建议模仿 略略略 ψ(｀∇´)ψ
       },
+      isPersonalForm: false,
+      plannerColumns: null,
       idCardList: [],
       dictName: '证件类型',
       isShowImg: true,
@@ -315,6 +378,27 @@ export default {
       myHeaders: {}
     }
   },
+  created () {
+    this.sendReq({
+        url: api.getTreeClass,
+        method: 'GET',
+        params: {}
+      }, (res) => {
+        // console.log(res) // 获取地址选择器数据并去除空的子项
+        this.options = res.data
+      })
+    this.sendReq({
+      url: api.getAdditional, // 套餐购买类型：1-商家，2-策划师 3-分公司
+      method: 'GET',
+      params: {
+        type: 1
+      }
+    }, (res) => {
+      // console.log(res) // 获取地址选择器数据并去除空的子项
+      this.setMealData = res.data
+      // console.log(this.options)
+    })
+  },
   mounted () {
     if (Cookie.get('token')) {
       this.myHeaders.Authorization = Cookie.get('token')
@@ -347,11 +431,37 @@ export default {
       console.log(this.personalForm.subjectLicense)
     },
     addressChange (arr) {
-      this.personalForm.shopAdress = `${CodeToText[arr[0]]}-${CodeToText[arr[1]]}-${CodeToText[arr[2]]}`
-      this.personalForm.shopAdressProvince = CodeToText[arr[0]]
-      this.personalForm.shopAdressCity = CodeToText[arr[1]]
-      console.log(this.personalForm.shopAdress)
+      // console.log(arr)
+      this.personalForm.shopAdress = ''
+      let datas = this.$refs.addressChange.getCheckedNodes(false)[0] // 获取选中的节点数据
+      for (let i = 0; i < datas.pathNodes.length; i++) {
+        if (i >= datas.pathNodes.length - 1) {
+          this.personalForm.shopAdress += datas.pathNodes[i].label
+        } else {
+          this.personalForm.shopAdress += datas.pathNodes[i].label + '/'
+        }
+      }
+      this.sendReq({ // 获取可选择的分公司/策划师
+        url: api.selectAnd,
+        method: 'POST',
+        data: {
+          area: datas.value, // 地区编号
+          type: 2,
+          level: datas.level, // "区级别不能为空"
+          page: this.queryData.page,
+          pageSize: this.queryData.size
+        }
+        }, (res) => {
+          this.plannerColumns = res.data.list
+          console.log(res)
+        })
     },
+    // addressChange (arr) {
+    //   this.personalForm.shopAdress = `${CodeToText[arr[0]]}-${CodeToText[arr[1]]}-${CodeToText[arr[2]]}`
+    //   this.personalForm.shopAdressProvince = CodeToText[arr[0]]
+    //   this.personalForm.shopAdressCity = CodeToText[arr[1]]
+    //   console.log(this.personalForm.shopAdress)
+    // },
     registeredAddressChange (arr) {
       this.personalForm.subjectRegion = `${CodeToText[arr[0]]}-${CodeToText[arr[1]]}-${CodeToText[arr[2]]}`
       console.log(this.personalForm.subjectRegion)
@@ -399,7 +509,19 @@ export default {
     },
     resetForm (formName) {
       this.$refs[formName].resetFields()
-    }
+    },
+    lazyLoadAddres (node, resolve) {
+        // console.log(node)
+         this.sendReq({
+          url: api.getTreeOne,
+          method: 'GET',
+          params: {
+            parentId: node.data.id
+          }
+          }, (res) => {
+             resolve(res.data)
+        })
+      }
   }
 }
 </script>

src/views/SettleIn/organization.vue

@@ -27,13 +27,46 @@
               <el-form-item label="负责人电话" prop="chargePersonPhone">
                 <el-input  maxlength="100" placeholder="请输入负责人电话" v-model="personalForm.chargePersonPhone"></el-input>
               </el-form-item>
-              <el-form-item label="店铺地址" prop="shopAdressProvince">
+              <el-form-item label="店铺类型" prop="isVoucher">
+                <el-radio-group v-model="personalForm.shopType">
+                  <el-radio :label="1">商城</el-radio>
+                  <el-radio :label="2">本地</el-radio>
+                </el-radio-group>
+              </el-form-item>
+              <el-form-item label="是否开放使用代金卷" prop="isVoucher">
+                <el-radio-group v-model="personalForm.isVoucher">
+                  <el-radio :label="1">支持</el-radio>
+                  <el-radio :label="2">不支持</el-radio>
+                </el-radio-group>
+              </el-form-item>
+              <el-form-item label="代金卷抵扣比例" prop="voucherReturn">
+                <el-input :disabled="personalForm.isVoucher == 2" maxlength="100" placeholder="请输入代金卷抵扣比例(以你填写的数值作为百分比的数值,如你填1,则为1%,关闭使用代金卷则默认为0)" v-model="personalForm.voucherReturn"></el-input>
+              </el-form-item>
+              <el-form-item label="入驻套餐" prop="packageId" class="idType">
+                <el-select v-model="personalForm.packageId" placeholder="请选择">
+                  <el-option
+                    v-for="item in setMealData"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.id">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="店铺地址" prop="areaId">
                 <el-cascader
+                      ref="addressChange"
+                      size="large"
+                      :options="options"
+                      v-model="personalForm.areaId"
+                      :props="{ checkStrictly: true,emitPath: false, label:'name',value: 'id', lazy: true, lazyLoad: lazyLoadAddres }"
+                      @change="addressChange">
+                </el-cascader>
+                <!-- <el-cascader
                   size="large"
                   :options="options"
                   v-model="selectedOptions"
                   @change="addressChange">
-                </el-cascader>
+                </el-cascader> -->
               </el-form-item>
               <el-form-item label="" prop="storeAddressDetail">
                 <el-input maxlength="200" resize="none" placeholder="请输入详细地址" type="textarea" :rows="3" v-model="personalForm.storeAddressDetail"></el-input>
@@ -204,9 +237,10 @@ export default {
   components: {CentLogo},
   data () {
     return {
-      options: regionData,
+      options: null,
       selectedOptions: [],
       registeredAddress: [],
+      setMealData: [],
       personalForm: {
         shopName: '', // 店铺名称
         shopPhone: '', // 手机号
@@ -230,7 +264,12 @@ export default {
         otherCardStartTime: '', // 证件有效开始时间
         otherCardEndTime: '', // 证件有效结束时间
         otherCardPositive: '', // 身份证正面照
-        otherCardSide: '' // 身份证反面照
+        otherCardSide: '', // 身份证反面照
+        shopType: 1, // 店铺类型 1商城 2本地
+        isVoucher: 1, // 是否支持使用代金卷
+        voucherReturn: '', // 代金卷的抵扣比例/返还比例
+        areaId: '', // 区域ID
+        packageId: ''
       },
       idCardList: [],
       dictName: '证件类型',
@@ -264,7 +303,7 @@ export default {
             },
             trigger: 'blur' }
         ],
-        shopAdressProvince: [
+        areaId: [
           { required: true, message: '请选择省份和城市', trigger: 'change' }
         ],
         storeAddressDetail: [
@@ -313,6 +352,27 @@ export default {
       myHeaders: {}
     }
   },
+  created () {
+    this.sendReq({
+        url: api.getTreeClass,
+        method: 'GET',
+        params: {}
+      }, (res) => {
+        // console.log(res) // 获取地址选择器数据并去除空的子项
+        this.options = res.data
+      })
+    this.sendReq({
+      url: api.getAdditional, // 套餐购买类型：1-商家，2-策划师 3-分公司
+      method: 'GET',
+      params: {
+        type: 1
+      }
+    }, (res) => {
+      // console.log(res) // 获取地址选择器数据并去除空的子项
+      this.setMealData = res.data
+      // console.log(this.options)
+    })
+  },
   mounted () {
     if (Cookie.get('token')) {
       this.myHeaders.Authorization = Cookie.get('token')
@@ -342,9 +402,16 @@ export default {
       this.personalForm.otherLicense = res.data.url
     },
     addressChange (arr) {
-      this.personalForm.shopAdress = `${CodeToText[arr[0]]}-${CodeToText[arr[1]]}-${CodeToText[arr[2]]}`
-      this.personalForm.shopAdressProvince = CodeToText[arr[0]]
-      this.personalForm.shopAdressCity = CodeToText[arr[1]]
+      // console.log(arr)
+      this.personalForm.shopAdress = ''
+      let datas = this.$refs.addressChange.getCheckedNodes(false)[0] // 获取选中的节点数据
+      for (let i = 0; i < datas.pathNodes.length; i++) {
+        if (i >= datas.pathNodes.length - 1) {
+          this.personalForm.shopAdress += datas.pathNodes[i].label
+        } else {
+          this.personalForm.shopAdress += datas.pathNodes[i].label + '/'
+        }
+      }
     },
     registeredAddressChange (arr) {
       this.personalForm.otherRegion = `${CodeToText[arr[0]]}-${CodeToText[arr[1]]}-${CodeToText[arr[2]]}`
@@ -392,7 +459,19 @@ export default {
     },
     resetForm (formName) {
       this.$refs[formName].resetFields()
-    }
+    },
+    lazyLoadAddres (node, resolve) {
+        // console.log(node)
+         this.sendReq({
+          url: api.getTreeOne,
+          method: 'GET',
+          params: {
+            parentId: node.data.id
+          }
+          }, (res) => {
+             resolve(res.data)
+        })
+      }
   }
 }
 </script>

src/views/SettleIn/personal.vue

@@ -29,17 +29,66 @@
               <el-form-item label="负责人电话" prop="chargePersonPhone">
                 <el-input  maxlength="100" placeholder="请输入负责人电话" v-model="personalForm.chargePersonPhone"></el-input>
               </el-form-item>
-              <el-form-item label="店铺地址" prop="shopAdressProvince">
+              <el-form-item label="店铺类型" prop="isVoucher">
+                <el-radio-group v-model="personalForm.shopType">
+                  <el-radio :label="1">商城</el-radio>
+                  <el-radio :label="2">本地</el-radio>
+                </el-radio-group>
+              </el-form-item>
+              <el-form-item label="是否开放使用代金卷" prop="isVoucher">
+                <el-radio-group v-model="personalForm.isVoucher">
+                  <el-radio :label="1">支持</el-radio>
+                  <el-radio :label="2">不支持</el-radio>
+                </el-radio-group>
+              </el-form-item>
+              <el-form-item label="代金卷抵扣比例" prop="voucherReturn">
+                <el-input :disabled="personalForm.isVoucher == 2" maxlength="100" placeholder="请输入代金卷抵扣比例(以你填写的数值作为百分比的数值,如你填1,则为1%,关闭使用代金卷则默认为0)" v-model="personalForm.voucherReturn"></el-input>
+              </el-form-item>
+              <el-form-item label="入驻套餐" prop="packageId" class="idType">
+                <el-select v-model="personalForm.packageId" placeholder="请选择">
+                  <el-option
+                    v-for="item in setMealData"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.id">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="店铺地址" prop="areaId">
                 <el-cascader
+                      ref="addressChange"
+                      size="large"
+                      :options="options"
+                      v-model="personalForm.areaId"
+                      :props="{ checkStrictly: true,emitPath: false, label:'name',value: 'id', lazy: true, lazyLoad: lazyLoadAddres }"
+                      @change="addressChange">
+                </el-cascader>
+                <!-- <el-cascader
                   size="large"
                   :options="options"
                   v-model="selectedOptions"
                   @change="addressChange">
-                </el-cascader>
+                </el-cascader> -->
               </el-form-item>
               <el-form-item label="" prop="storeAddressDetail">
                 <el-input maxlength="200" resize="none" placeholder="请输入详细地址" type="textarea" :rows="3" v-model="personalForm.storeAddressDetail"></el-input>
               </el-form-item>
+              <el-form-item label="是否绑定策划师">
+                <el-radio-group v-model="isPersonalForm">
+                  <el-radio :label="true">是</el-radio>
+                  <el-radio :label="false">否</el-radio>
+                </el-radio-group>
+              </el-form-item>
+              <el-form-item v-if="isPersonalForm" label="绑定策划师" class="idType">
+                <el-select v-model="personalForm.parentId" placeholder="请先选择好地址，如果当前地区没有营销策划师也可以不绑定">
+                  <el-option
+                    v-for="item in plannerColumns"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.platformUserId">
+                  </el-option>
+                </el-select>
+              </el-form-item>
               <div class="formTit">
                 <span class="serialNumber">02</span>
                 <span class="formName">经营者信息</span>
@@ -158,7 +207,7 @@
 import CentLogo from '@/components/centLogo'
 import api from '@/api'
 import { listSearchMixin } from '@/config/mixin'
-import { regionData, CodeToText } from 'element-china-area-data'
+// import { regionData, CodeToText } from 'element-china-area-data'
 import Cookie from 'js-cookie'
 export default {
   name: 'individualBusiness',
@@ -166,9 +215,10 @@ export default {
   components: {CentLogo},
   data () {
     return {
-      options: regionData,
+      options: null,
       selectedOptions: [],
       registeredAddress: [],
+      setMealData: [],
       personalForm: {
         shopName: '', // 店铺名称
         shopPhone: '', // 手机号
@@ -186,8 +236,20 @@ export default {
         personalCardEndTime: '', // 证件有效结束时间
         personalCardPositive: '', // 身份证正面照
         personalCardSide: '', // 身份证反面照
-        personalCardHand: '' // 手持证件照
+        personalCardHand: '', // 手持证件照
+        shopType: 1, // 店铺类型 1商城 2本地
+        isVoucher: 1, // 是否支持使用代金卷
+        voucherReturn: '', // 代金卷的抵扣比例/返还比例
+        areaId: '', // 区域ID
+        packageId: '',
+        parentId: ''
+      },
+       queryData: {
+        page: 1,
+        size: 20 // 策划师的角色在某个省可能会很多，但是一块区域肯定不会太多，放心大胆的写死为20！！！，不建议模仿 略略略 ψ(｀∇´)ψ
       },
+      isPersonalForm: false,
+      plannerColumns: null,
       idCardList: [],
       dictName: '证件类型',
       isShowImg: true,
@@ -220,7 +282,7 @@ export default {
             },
             trigger: 'blur' }
         ],
-        shopAdressProvince: [
+        areaId: [
           { required: true, message: '请选择省份和城市', trigger: 'change' }
         ],
         storeAddressDetail: [
@@ -246,6 +308,15 @@ export default {
         ],
         personalCardHand: [
           { required: true, message: '请选择上传手持证件照', trigger: 'blur' }
+        ],
+        shopType: [
+          { required: true, message: '请选择商家类型', trigger: 'blur' }
+        ],
+        isVoucher: [
+          { required: true, message: '请选择是否开启代金卷支付', trigger: 'blur' }
+        ],
+        voucherReturn: [
+          { required: true, message: '请输入代金卷充值比例', trigger: 'blur' }
         ]
       },
       dialogImageUrl: '',
@@ -255,6 +326,27 @@ export default {
       myHeaders: {}
     }
   },
+  created () {
+    this.sendReq({
+        url: api.getTreeClass,
+        method: 'GET',
+        params: {}
+      }, (res) => {
+        // console.log(res) // 获取地址选择器数据并去除空的子项
+        this.options = res.data
+      })
+    this.sendReq({
+      url: api.getAdditional, // 套餐购买类型：1-商家，2-策划师 3-分公司
+      method: 'GET',
+      params: {
+        type: 1
+      }
+    }, (res) => {
+      // console.log(res) // 获取地址选择器数据并去除空的子项
+      this.setMealData = res.data
+      // console.log(this.options)
+    })
+  },
   mounted () {
     if (Cookie.get('token')) {
       this.myHeaders.Authorization = Cookie.get('token')
@@ -284,9 +376,35 @@ export default {
       this.personalForm.personalCardHand = res.data.url
     },
     addressChange (arr) {
-      this.personalForm.shopAdress = `${CodeToText[arr[0]]}-${CodeToText[arr[1]]}-${CodeToText[arr[2]]}`
-      this.personalForm.shopAdressProvince = CodeToText[arr[0]]
-      this.personalForm.shopAdressCity = CodeToText[arr[1]]
+      console.log(arr)
+      this.personalForm.shopAdress = ''
+      let datas = this.$refs.addressChange.getCheckedNodes(false)[0] // 获取选中的节点数据
+      for (let i = 0; i < datas.pathNodes.length; i++) {
+        if (i >= datas.pathNodes.length - 1) {
+          this.personalForm.shopAdress += datas.pathNodes[i].label
+        } else {
+          this.personalForm.shopAdress += datas.pathNodes[i].label + '/'
+        }
+      }
+      this.sendReq({ // 获取可选择的分公司/策划师
+        url: api.selectAnd,
+        method: 'POST',
+        data: {
+          area: datas.value, // 地区编号
+          type: 2,
+          level: datas.level, // "区级别不能为空"
+          page: this.queryData.page,
+          pageSize: this.queryData.size
+        }
+        }, (res) => {
+          this.plannerColumns = res.data.list
+          console.log(res)
+        })
+      // this.personalForm.shopAdress = `${CodeToText[arr[0]]}-${CodeToText[arr[1]]}-${CodeToText[arr[2]]}`
+      // this.personalForm.shopAdressProvince = CodeToText[arr[0]]submitFor
+      // this.personalForm.shopAdressCity = CodeToText[arr[1]]
+      // console.log(this.personalForm)
+      // console.log(datas)
     },
     handlePictureCardPreview () {
       this.dialogImageUrl = this.idPositive
@@ -297,6 +415,11 @@ export default {
     },
     // 提交入驻
     submitForm (formName) {
+      console.log(this.personalForm)
+      // eslint-disable-next-line eqeqeq
+      if (this.personalForm.isVoucher == '2') {
+        this.personalForm.voucherReturn = 0
+      }
       this.$refs[formName].validate(valid => {
         if (valid) {
           this.personalForm.shopAdress = `${this.personalForm.shopAdress}，${this.personalForm.storeAddressDetail}`
@@ -331,7 +454,19 @@ export default {
     },
     resetForm (formName) {
       this.$refs[formName].resetFields()
-    }
+    },
+    lazyLoadAddres (node, resolve) {
+        // console.log(node)
+         this.sendReq({
+          url: api.getTreeOne,
+          method: 'GET',
+          params: {
+            parentId: node.data.id
+          }
+          }, (res) => {
+             resolve(res.data)
+        })
+      }
   }
 }
 </script>

src/views/SettleIn/planner.vue

@@ -0,0 +1,510 @@
+<!-- eslint-disable no-unused-vars -->
+<!--
+ *                        _oo0oo_
+ *                       o8888888o
+ *                       88" . "88
+ *                       (| -_- |)
+ *                       0\  =  /0
+ *                     ___/`---'\___
+ *                   .' \\|     |// '.
+ *                  / \\|||  :  |||// \
+ *                 / _||||| -:- |||||- \
+ *                |   | \\\  - /// |   |
+ *                | \_|  ''\---/''  |_/ |
+ *                \  .-\__  '-'  ___/-. /
+ *              ___'. .'  /--.--\  `. .'___
+ *           ."" '<  `.___\_<|>_/___.' >' "".
+ *          | | :  `- \`.;`\ _ /`;.`/ - ` : | |
+ *          \  \ `_.   \_ __\ /__ _/   .-` /  /
+ *      =====`-.____`.___ \_____/___.-`___.-'=====
+ *                        `=---='
+ *
+ *
+ *      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+ *
+ *            佛祖保佑     永不宕机     永无BUG
+ -->
+<template>
+  <div class="warp12">
+    <div class="statusBox">
+        <cent-logo></cent-logo>
+        <div class="personal infoBox">
+           <div class="title">营销策划师</div>
+           <div class="content">
+              <div class="formBox">
+                <el-form
+                  :model="plannerForm"
+                  :rules="plannerRules"
+                  :label-position="'top'"
+                  ref="ruleForm"
+                  label-width="150px"
+                  class="ruleForm">
+                  <div class="formTit">
+                    <span class="serialNumber">01</span>
+                    <span class="formName">个人信息</span>
+                  </div>
+                  <el-form-item label="账户名/电话号码" prop="username">
+                    <el-input maxlength="100" placeholder="请输入账户名/电话" v-model="plannerForm.username"></el-input>
+                  </el-form-item>
+                  <el-form-item label="姓名" prop="name">
+                    <el-input maxlength="100" placeholder="请输入姓名" v-model="plannerForm.name"></el-input>
+                  </el-form-item>
+                  <el-form-item label="电话号码" prop="phone">
+                    <el-input maxlength="100" placeholder="请输入电话号码" v-model="plannerForm.phone"></el-input>
+                  </el-form-item>
+                  <el-form-item label="邮箱" prop="email">
+                    <el-input maxlength="100" placeholder="请输入邮箱地址" v-model="plannerForm.email"></el-input>
+                  </el-form-item>
+                  <el-form-item label="性别" prop="sex">
+                     <el-radio-group v-model="plannerForm.sex">
+                      <el-radio :label="'男'">男</el-radio>
+                      <el-radio :label="'女'">女</el-radio>
+                    </el-radio-group>
+                  </el-form-item>
+                  <el-form-item label="店铺地址" prop="addres">
+                    <el-cascader
+                      ref="addressChange"
+                      size="large"
+                      :options="options"
+                      v-model="plannerForm.region"
+                      :props="{ checkStrictly: true, emitPath: false, label:'name', value: 'id', lazy: true, lazyLoad: lazyLoadAddres }"
+                      @change="addressChange">
+                    </el-cascader>
+                  </el-form-item>
+                  <el-form-item label="" prop="storeAddressDetail">
+                    <el-input maxlength="200" resize="none" placeholder="请输入详细地址" type="textarea" :rows="3" v-model="plannerForm.addres"></el-input>
+                  </el-form-item>
+                  <!-- <el-form-item label="合同状态" prop="contractState">
+                     <el-radio-group v-model="plannerForm.contractState">
+                      <el-radio :label="1">有效</el-radio>
+                      <el-radio :label="0">无效</el-radio>
+                    </el-radio-group>
+                  </el-form-item> -->
+                <!-- <div class="dateBox idDateBox">
+                  <el-form-item label="合同有效期" prop="effectiveDate" class="businessDate">
+                    <el-date-picker
+                      type="daterange"
+                      @change="getTime"
+                      v-model="formTimer"
+                      start-placeholder="开始日期"
+                      format="yyyy 年 MM 月 dd 日"
+                      end-placeholder="结束日期"
+                      value-format="yyyy-MM-dd"
+                      :default-time="['00:00:00', '23:59:59']">
+                    </el-date-picker>
+                  </el-form-item>
+                </div> -->
+                    <el-form-item label="选择分公司" prop="parentId" class="idType">
+                     <el-select v-model="plannerForm.parentId" placeholder="请在选择分公司前先选择好地址">
+                        <el-option
+                          v-for="item in conpanyList"
+                          :key="item.platformUserId"
+                          :label="item.name"
+                          :value="item.platformUserId">
+                        </el-option>
+                      </el-select>
+                    </el-form-item>
+                    <el-form-item label="入驻套餐" prop="packageId" class="idType">
+                      <el-select v-model="plannerForm.packageId" placeholder="请选择">
+                        <el-option
+                          v-for="item in setMealData"
+                          :key="item.id"
+                          :label="item.name"
+                          :value="item.id">
+                        </el-option>
+                      </el-select>
+                    </el-form-item>
+                </el-form>
+                <el-button
+                class="submitBtn"
+                @click="submitForm('ruleForm')"
+                >提交</el-button>
+              </div>
+           </div>
+        </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { listSearchMixin } from '@/config/mixin'
+import CentLogo from '@/components/centLogo'
+import api from '@/api'
+// import { unemptyArray } from '@/util/ArrayFunction'
+// import { regionData, CodeToText } from 'element-china-area-data' // 引入地区数据，现在使用的为线上接口的数据，已废弃
+export default {
+    name: 'planner',
+    mixins: [listSearchMixin],
+    components: {
+      CentLogo
+    },
+    data () {
+      return {
+        options: null,
+        conpanyList: [],
+        addresCode: '',
+        formTimer: '',
+        selectedOptions: [],
+        setMealData: [],
+        plannerForm: {
+          username: '', // 账号
+          name: '', // 姓名
+          phone: '', // 电话号码
+          email: '', // 邮箱
+          sex: '男', // 性别
+          region: '', // 区域编码
+          addres: '', // 详细地址
+          effectiveDate: '', // 生效日期  即时生效-设置当前时间 有值-指定日期生效
+          effectiveYear: '', // 生效时限（年）
+          contractState: '', // 合同状态 1-有效 0-无效
+          type: '2', // 类型： 1为分公司 2为策划师
+          parentId: '', // 父级ID 如果为分公司则为null
+          packageId: '' // 套餐类型
+        },
+        SetMeal: [],
+        plannerRules: {
+          username: [
+            { required: true, message: '请输入账号/电话', trigger: 'blur' }
+          ],
+          name: [
+            { required: true, message: '请输入姓名', trigger: 'blur' }
+          ],
+          phone: [
+          { required: true, message: '请输入电话号码', trigger: 'blur' },
+          { validator: function (rule, value, callback) {
+              if (!/^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/.test(value) && value) {
+                callback(new Error('请输入正确的电话号码'))
+              } else {
+                callback()
+              }
+            },
+            trigger: 'blur' }
+          ],
+          email: [
+            { required: true, message: '请输入邮箱', trigger: 'blur' },
+            { type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }
+          ],
+          sex: [
+            { required: true, message: '请选择性别', trigger: 'blur' }
+          ],
+          addres: [
+            { required: true, message: '请选择地址', trigger: 'blur' }
+          ],
+          packageId: [
+            { required: true, message: '请选择入驻套餐', trigger: 'blur' }
+          ],
+          parentId: [
+            { required: true, message: '请选择分公司', trigger: 'blur' }
+          ]
+        }
+      }
+    },
+    created () {
+      this.sendReq({
+        url: api.getTreeClass,
+        method: 'GET',
+        params: {}
+      }, (res) => {
+        // console.log(res) // 获取地址选择器数据并去除空的子项
+        this.options = res.data
+      })
+      this.sendReq({
+        url: api.getAdditional, // 套餐购买类型：1-商家，2-策划师 3-分公司
+        method: 'GET',
+        params: {
+          type: 3
+        }
+      }, (res) => {
+        // console.log(res) // 获取地址选择器数据并去除空的子项
+        this.setMealData = res.data
+        // console.log(this.options)
+      })
+    },
+    methods: {
+      submitForm (formName) {
+        // console.log(this.plannerForm)
+        this.$refs[formName].validate(valid => {
+          if (valid) {
+            let params = {
+              url: api.subsidiaryCompanyCheck,
+              method: 'POST',
+              data: this.plannerForm
+            }
+            this.sendReq(params, (res) => {
+              if (res.code === '200') {
+                this.$message({
+                  message: '提交成功',
+                  type: 'success'
+                })
+                this.$router.push({path: '/status'})
+              } else {
+                this.$message({
+                  message: res.message,
+                  type: 'error'
+                })
+              }
+            })
+          } else {
+            this.$message({
+              message: '信息填写不完整！',
+              type: 'warning'
+            })
+            return false
+          }
+        })
+      },
+      addressChange (arr) {
+        // let cacheArray = []
+        let datas = this.$refs.addressChange.getCheckedNodes(true)[0].data // 获取选中的节点数据
+        // console.log(datas)
+        this.sendReq({
+        url: api.selectAnd,
+        method: 'POST',
+        data: {
+          area: datas.id, // 地区编号
+          type: 2,
+          level: datas.level, // "区级别不能为空"
+          page: 1,
+          pageSize: 10
+        }
+        }, (res) => {
+          this.conpanyList = res.data.list
+          console.log(res)
+        })
+      },
+      // !原本的接口需要传递时间信息，后面不许要的，先注释，待使用一段时间确认后删除
+      // getTime (TimeValue = []) { // 获取有效时间并且转化为字符串,并计算出之间的有效年份
+      //     this.plannerForm.effectiveDate = TimeValue[0] + ' - ' + TimeValue[1]
+      //     let arr = TimeValue.map(item => {
+      //       return item.split('-')[0]
+      //     })
+      //     // console.log(arr[1], arr[0])
+      //     this.plannerForm.effectiveYear = arr[1] - arr[0]
+      //   // this.plannerForm.effectiveDate
+      // },
+      lazyLoadAddres (node, resolve) {
+        // console.log(node)
+         this.sendReq({
+          url: api.getTreeOne,
+          method: 'GET',
+          params: {
+            parentId: node.value
+          }
+          }, (res) => {
+             resolve(res.data)
+        })
+      }
+    }
+}
+</script>
+
+<style lang="less" scoped>
+.statusBox {
+  position: relative;
+  z-index: 1000;
+  .infoBox {
+    width: 100%;
+    height: 700px;
+    background: #ffffff;
+    .title {
+      background: #FAFAFA;
+      width: 100%;
+      height: 42px;
+      line-height: 42px;
+      text-align: center;
+      border-bottom: 1px solid #E6E6E6;
+    }
+    .content {
+      width: 100%;
+      padding: 0 80px 50px 80px;
+      height: 650px;
+      overflow-y: auto;
+      .formTit {
+        height: 55px;
+        display: flex;
+        align-items: center;
+        width: 100%;
+        margin: 50px 0;
+        border-bottom: 1px solid #E6E6E6;
+        .serialNumber {
+          width: 24px;
+          height: 24px;
+          color: #C5AA7B;
+          border: 1px solid #C5AA7B;
+          border-radius: 4px;
+          margin-right: 10px;
+          text-align: center;
+          line-height: 24px;
+          font-size: 12px;
+        }
+        .formName {
+          font-size: 20px;
+          font-weight: 400;
+          color: #333333;
+          width: 200px;
+        }
+      }
+      .formBox {
+        width: 100%;
+        /deep/ .ruleForm {
+          .el-form-item{
+            padding: 0 170px;
+          }
+        }
+        /deep/ .el-cascader {
+          width: 100%;
+        }
+        .idDateBox {
+          margin-bottom: 30px;
+          /deep/.el-form-item__content{
+            display: flex;
+          }
+        }
+        .describe {
+          margin: 15px 0 30px 0;
+          p {
+            // padding-left: 150px;
+            font-size: 12px;
+            color: #999999;
+          }
+        }
+        .idImgesBox {
+          display: flex;
+          justify-content: space-between;
+          .idImgaeLeft {
+            width: 50%;
+          }
+          .idImgaeRight {
+            width: 50%;
+            text-align: right;
+          }
+          /deep/ .el-upload-list--picture-card {
+            width: 284px;
+            height: 180px;
+          }
+          /deep/ .el-upload--picture-card {
+            width: 284px;
+            height: 180px;
+            position: relative;
+            .avatar {
+              width: 100%;
+              max-height: 178px;
+            }
+            .noImg {
+              position: absolute;
+              left: 0;
+              top: 0;
+              bottom: 0;
+              right: 0;
+              background: #F7F7F7;
+              .bgBox {
+                height: 149px;
+                align-items: center;
+                display: flex;
+                justify-content: center;
+              }
+            }
+            .bgInfo {
+              color: #FFFFFF;
+              font-size: 14px;
+              height: 39px;
+              line-height: 39px;
+              background: #A0C1FF;
+              position: absolute;
+              left: 0;
+              bottom: 0;
+              width: 100%;
+            }
+            .changeImg {
+              display: none;
+              position: absolute;
+              top: 40px;
+              left: 112px;
+              width: 60px;
+              height: 60px;
+              line-height: 60px;
+              background: #000000;
+              opacity: 0.6;
+              border-radius: 50%;
+              color: #FFFFFF;
+            }
+            .zoomImg {
+              position: absolute;
+              top: 40px;
+              left: 50px;
+              width: 60px;
+              height: 60px;
+              line-height: 60px;
+              background: #000000;
+              opacity: 0.6;
+              border-radius: 50%;
+              color: #FFFFFF;
+            }
+            &:hover {
+              .changeImg {
+                display: block;
+              }
+            }
+          }
+          /deep/ .el-upload-list--picture-card .el-upload-list__item {
+            width: 284px;
+            height: 180px;
+          }
+        }
+        .businessDate {
+          span {
+            display: inline-block;
+            text-align: center;
+            width: 50px;
+            color: #666666;
+          }
+          .el-date-editor--date {
+            width: 268px;
+          }
+        }
+        .idType {
+          /deep/ .el-select {
+            width: 100%;
+          }
+        }
+      }
+      .submitBtn {
+        display: block;
+        width: 750px;
+        height: 50px;
+        margin: 40px auto 0 auto;
+        color: #FFEBC4;
+        background: #333333;
+        box-shadow: 0px 20px 30px rgba(0, 0, 0, 0.2);
+      }
+    }
+  }
+  /deep/ .el-form-item__content {
+    p {
+      font-size: 12px;
+      color: #999999;
+      line-height: 20px;
+      margin-top: 8px;
+    }
+    .el-input__inner,.el-textarea__inner{
+      border-radius: 0;
+      border: 1px solid transparent;
+      color: #333;
+      background: #F9F9F9;
+      &:focus{
+        border-color: #C5AA7B;
+      }
+    }
+  }
+}
+.hide {
+  /deep/ .el-upload--picture-card {
+    display: none;
+  }
+}
+.avatar-uploader {
+  img {
+    width: 100%;
+  }
+}
+</style>

src/views/SettleIn/subsidiaryCompany.vue

@@ -0,0 +1,481 @@
+<template>
+  <div class="warp12">
+    <div class="statusBox">
+        <cent-logo></cent-logo>
+        <div class="personal infoBox">
+           <div class="title">分公司入驻</div>
+           <div class="content">
+              <div class="formBox">
+                <el-form
+                  :model="plannerForm"
+                  :rules="plannerRules"
+                  :label-position="'top'"
+                  ref="ruleForm"
+                  label-width="150px"
+                  class="ruleForm">
+                  <div class="formTit">
+                    <span class="serialNumber">01</span>
+                    <span class="formName">个人信息</span>
+                  </div>
+                  <el-form-item label="账户名/电话号码" prop="username">
+                    <el-input maxlength="100" placeholder="请输入账户名/电话" v-model="plannerForm.username"></el-input>
+                  </el-form-item>
+                  <el-form-item label="姓名" prop="name">
+                    <el-input maxlength="100" placeholder="请输入姓名" v-model="plannerForm.name"></el-input>
+                  </el-form-item>
+                  <el-form-item label="电话号码" prop="phone">
+                    <el-input maxlength="100" placeholder="请输入电话号码" v-model="plannerForm.phone"></el-input>
+                  </el-form-item>
+                  <el-form-item label="邮箱" prop="email">
+                    <el-input maxlength="100" placeholder="请输入邮箱地址" v-model="plannerForm.email"></el-input>
+                  </el-form-item>
+                  <el-form-item label="性别" prop="sex">
+                     <el-radio-group v-model="plannerForm.sex">
+                      <el-radio :label="'男'">男</el-radio>
+                      <el-radio :label="'女'">女</el-radio>
+                    </el-radio-group>
+                  </el-form-item>
+                  <el-form-item label="店铺地址" prop="region">
+                    <el-cascader
+                      ref="addressChange"
+                      size="large"
+                      :options="options"
+                      v-model="plannerForm.region"
+                      :props="{ checkStrictly: true, emitPath: false, label:'name', value: 'id', lazy: true, lazyLoad: lazyLoadAddres }"
+                      @change="addressChange">
+                    </el-cascader>
+                  </el-form-item>
+                  <el-form-item label="" prop="addres">
+                    <el-input maxlength="200" resize="none" placeholder="请输入详细地址" type="textarea" :rows="3" v-model="plannerForm.addres"></el-input>
+                  </el-form-item>
+                  <el-form-item label="入驻套餐" prop="packageId" class="idType">
+                      <el-select v-model="plannerForm.packageId" placeholder="请选择">
+                        <el-option
+                          v-for="item in setMealData"
+                          :key="item.id"
+                          :label="item.name"
+                          :value="item.id">
+                        </el-option>
+                      </el-select>
+                    </el-form-item>
+                  <!-- <div class="dateBox idDateBox">
+                    <el-form-item label="合同有效期" prop="effectiveDate" class="businessDate">
+                    <el-date-picker
+                    type="daterange"
+                    @change="getTime"
+                    v-model="formTimer"
+                    start-placeholder="开始日期"
+                    format="yyyy 年 MM 月 dd 日"
+                    end-placeholder="结束日期"
+                    value-format="yyyy-MM-dd"
+                    :default-time="['00:00:00', '23:59:59']">
+                    </el-date-picker>
+                </el-form-item>
+                <el-form-item label="有效时间(年)" prop="effectiveYear">
+                     <el-input disabled maxlength="100" placeholder="" v-model="plannerForm.effectiveYear"></el-input>
+                </el-form-item>
+              </div>
+                <el-form-item label="合同状态" prop="contractState">
+                     <el-radio-group v-model="plannerForm.contractState">
+                      <el-radio :label="1">有效</el-radio>
+                      <el-radio :label="0">无效</el-radio>
+                     </el-radio-group>
+                </el-form-item> -->
+                </el-form>
+                <el-button
+                class="submitBtn"
+                @click="submitForm('ruleForm')"
+                >提交</el-button>
+              </div>
+           </div>
+        </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { listSearchMixin } from '@/config/mixin'
+import CentLogo from '@/components/centLogo'
+import api from '@/api'
+// import { unemptyArray } from '@/util/ArrayFunction'
+// eslint-disable-next-line no-unused-vars
+import { regionData, CodeToText } from 'element-china-area-data'
+export default {
+    name: 'planner',
+    mixins: [listSearchMixin],
+    components: {
+      CentLogo
+    },
+    data () {
+      return {
+        options: null,
+        addresCode: '',
+        formTimer: '',
+        selectedOptions: [],
+        setMealData: [],
+        plannerForm: {
+          username: '', // 账号
+          name: '', // 姓名
+          phone: '', // 电话号码
+          email: '', // 邮箱
+          sex: '男', // 性别
+          region: '', // 区域编码
+          addres: '', //
+          // startTime: '',
+          // endTime: '',
+          effectiveDate: '', // 生效日期  即时生效-设置当前时间 有值-指定日期生效
+          effectiveYear: '', // 生效时限（年）
+          contractState: '', // 合同状态 1-有效 0-无效
+          type: '1', // 类型： 1为分公司 2为策划师
+          parentId: '', // 父级ID 如果为分公司则为null
+          packageId: '' // 套餐类型
+        },
+        plannerRules: {
+          username: [
+            { required: true, message: '请输入账号/电话', trigger: 'blur' }
+          ],
+          name: [
+            { required: true, message: '请输入姓名', trigger: 'blur' }
+          ],
+          phone: [
+          { required: true, message: '请输入电话号码', trigger: 'blur' },
+          { validator: function (rule, value, callback) {
+              if (!/^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/.test(value) && value) {
+                callback(new Error('请输入正确的电话号码'))
+              } else {
+                callback()
+              }
+            },
+            trigger: 'blur' }
+          ],
+          email: [
+            { required: true, message: '请输入邮箱', trigger: 'blur' },
+            { type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }
+          ],
+          sex: [
+            { required: true, message: '请选择性别', trigger: 'blur' }
+          ],
+          region: [
+            { required: true, message: '请选择地址', trigger: 'blur' }
+          ],
+          addres: [
+            { required: true, message: '请输入详细地址', trigger: 'blur' }
+          ],
+          packageId: [
+            { required: true, message: '请选择入驻套餐', trigger: 'blur' }
+          ],
+          // effectiveDate: [
+          //   { required: true, message: '请选择生效日期', trigger: 'blur' }
+          // ],
+          effectiveYear: [
+            { required: true, message: '请选择生效日期', trigger: 'blur' }
+          ]
+          // contractState: [
+          //   { required: true, message: '请选择合同状态', trigger: 'blur' }
+          // ]
+        }
+      }
+    },
+    created () {
+      this.sendReq({
+        url: api.getTreeClass,
+        method: 'GET',
+        params: {}
+      }, (res) => {
+        // console.log(res) // 获取地址选择器数据并去除空的子项
+        this.options = res.data
+      })
+      this.sendReq({ // 请求可供选择的套餐的数据，type为当前正在申请的角色对应查询的类型 1-商家，2-策划师 3-分公司
+        url: api.getAdditional,
+        method: 'GET',
+        params: {
+          type: 3
+        }
+      }, (res) => {
+        // console.log(res)
+        this.setMealData = res.data
+        // console.log(this.options)
+      })
+    },
+    methods: {
+      submitForm (formName) {
+        // console.log(this)
+        this.$refs[formName].validate(valid => {
+          if (valid) {
+            let params = {
+              url: api.subsidiaryCompanyCheck,
+              method: 'POST',
+              data: this.plannerForm
+            }
+            this.sendReq(params, (res) => {
+              if (res.code === '200') {
+                this.$message({
+                  message: '提交成功',
+                  type: 'success'
+                })
+                this.$router.push({path: '/status'})
+              } else {
+                this.$message({
+                  message: res.message,
+                  type: 'error'
+                })
+              }
+            })
+          } else {
+            this.$message({
+              message: '信息填写不完整！',
+              type: 'warning'
+            })
+            return false
+          }
+        })
+      },
+      addressChange (arr) {
+        // let datas = this.$refs.addressChange.getCheckedNodes(true)[0].data // 获取选中的节点数据
+        // this.sendReq({
+        // url: api.selectAnd,
+        // method: 'POST',
+        // data: {
+        //   area: datas.id, // 地区编号
+        //   type: 2,
+        //   level: datas.level // "区级别不能为空"
+        // }
+        // }, (res) => {
+        //   console.log(res)
+        // })
+      },
+      getTime (TimeValue = []) { // 获取有效时间并且转化为字符串,并计算出之间的有效年份
+          this.plannerForm.effectiveDate = TimeValue[0] + ' - ' + TimeValue[1]
+          let arr = TimeValue.map(item => {
+            return item.split('-')[0]
+          })
+          // console.log(arr[1], arr[0])
+          this.plannerForm.effectiveYear = arr[1] - arr[0]
+        // this.plannerForm.effectiveDate
+      },
+      lazyLoadAddres (node, resolve) {
+        // console.log(node)
+         this.sendReq({
+          url: api.getTreeOne,
+          method: 'GET',
+          params: {
+            parentId: node.value
+          }
+          }, (res) => {
+             resolve(res.data)
+        })
+      }
+    }
+}
+</script>
+
+<style lang="less" scoped>
+.statusBox {
+  position: relative;
+  z-index: 1000;
+  .infoBox {
+    width: 100%;
+    height: 700px;
+    background: #ffffff;
+    .title {
+      background: #FAFAFA;
+      width: 100%;
+      height: 42px;
+      line-height: 42px;
+      text-align: center;
+      border-bottom: 1px solid #E6E6E6;
+    }
+    .content {
+      width: 100%;
+      padding: 0 80px 50px 80px;
+      height: 650px;
+      overflow-y: auto;
+      .formTit {
+        height: 55px;
+        display: flex;
+        align-items: center;
+        width: 100%;
+        margin: 50px 0;
+        border-bottom: 1px solid #E6E6E6;
+        .serialNumber {
+          width: 24px;
+          height: 24px;
+          color: #C5AA7B;
+          border: 1px solid #C5AA7B;
+          border-radius: 4px;
+          margin-right: 10px;
+          text-align: center;
+          line-height: 24px;
+          font-size: 12px;
+        }
+        .formName {
+          font-size: 20px;
+          font-weight: 400;
+          color: #333333;
+          width: 200px;
+        }
+      }
+      .formBox {
+        width: 100%;
+        /deep/ .ruleForm {
+          .el-form-item{
+            padding: 0 170px;
+          }
+        }
+        /deep/ .el-cascader {
+          width: 100%;
+        }
+        .idDateBox {
+          margin-bottom: 30px;
+          /deep/.el-form-item__content{
+            display: flex;
+          }
+        }
+        .describe {
+          margin: 15px 0 30px 0;
+          p {
+            // padding-left: 150px;
+            font-size: 12px;
+            color: #999999;
+          }
+        }
+        .idImgesBox {
+          display: flex;
+          justify-content: space-between;
+          .idImgaeLeft {
+            width: 50%;
+          }
+          .idImgaeRight {
+            width: 50%;
+            text-align: right;
+          }
+          /deep/ .el-upload-list--picture-card {
+            width: 284px;
+            height: 180px;
+          }
+          /deep/ .el-upload--picture-card {
+            width: 284px;
+            height: 180px;
+            position: relative;
+            .avatar {
+              width: 100%;
+              max-height: 178px;
+            }
+            .noImg {
+              position: absolute;
+              left: 0;
+              top: 0;
+              bottom: 0;
+              right: 0;
+              background: #F7F7F7;
+              .bgBox {
+                height: 149px;
+                align-items: center;
+                display: flex;
+                justify-content: center;
+              }
+            }
+            .bgInfo {
+              color: #FFFFFF;
+              font-size: 14px;
+              height: 39px;
+              line-height: 39px;
+              background: #A0C1FF;
+              position: absolute;
+              left: 0;
+              bottom: 0;
+              width: 100%;
+            }
+            .changeImg {
+              display: none;
+              position: absolute;
+              top: 40px;
+              left: 112px;
+              width: 60px;
+              height: 60px;
+              line-height: 60px;
+              background: #000000;
+              opacity: 0.6;
+              border-radius: 50%;
+              color: #FFFFFF;
+            }
+            .zoomImg {
+              position: absolute;
+              top: 40px;
+              left: 50px;
+              width: 60px;
+              height: 60px;
+              line-height: 60px;
+              background: #000000;
+              opacity: 0.6;
+              border-radius: 50%;
+              color: #FFFFFF;
+            }
+            &:hover {
+              .changeImg {
+                display: block;
+              }
+            }
+          }
+          /deep/ .el-upload-list--picture-card .el-upload-list__item {
+            width: 284px;
+            height: 180px;
+          }
+        }
+        .businessDate {
+          span {
+            display: inline-block;
+            text-align: center;
+            width: 50px;
+            color: #666666;
+          }
+          .el-date-editor--date {
+            width: 268px;
+          }
+        }
+        .idType {
+          /deep/ .el-select {
+            width: 100%;
+          }
+        }
+      }
+      .submitBtn {
+        display: block;
+        width: 750px;
+        height: 50px;
+        margin: 40px auto 0 auto;
+        color: #FFEBC4;
+        background: #333333;
+        box-shadow: 0px 20px 30px rgba(0, 0, 0, 0.2);
+      }
+    }
+  }
+  /deep/ .el-form-item__content {
+    p {
+      font-size: 12px;
+      color: #999999;
+      line-height: 20px;
+      margin-top: 8px;
+    }
+    .el-input__inner,.el-textarea__inner{
+      border-radius: 0;
+      border: 1px solid transparent;
+      color: #333;
+      background: #F9F9F9;
+      &:focus{
+        border-color: #C5AA7B;
+      }
+    }
+  }
+}
+.hide {
+  /deep/ .el-upload--picture-card {
+    display: none;
+  }
+}
+.avatar-uploader {
+  img {
+    width: 100%;
+  }
+}
+</style>

src/views/home/index.vue

@@ -24,16 +24,23 @@
           </div>
           <!-- 申请跳转按钮 -->
           <div class="entranceBtn">
+            <div class="btnContainer" v-for="item in pcBtnList" :key="item.value"
+              @click="goToApplication(type = item.type)">
+              <img :src="item.img" alt="">
+              <span>{{ item.label }}</span>
+            </div>
+          </div>
+          <!-- <div class="entranceBtn">
             <div
               class="btnContainer"
-              v-for="item in pcBtnList"
+              v-for="item in newPcBtnList"
               :key="item.value"
               @click="goToApplication(type = item.type)"
             >
-              <img :src="item.img" alt="">
+              <div class="maskImage"><img class="smallImg" :src="item.img" alt=""></div>
               <span>{{ item.label }}</span>
             </div>
-          </div>
+          </div> -->
         </div>
       </div>
     </div>
@@ -46,9 +53,7 @@
       </div>
       <div class="wapCent">
         <div class="wapCentBox">
-          <div class="wapItemBox"
-            v-for="item in mbBtnList"
-            :key="item.value">
+          <div class="wapItemBox" v-for="item in mbBtnList" :key="item.value">
             <span>
               <img :src="item.img">{{ item.label }}
             </span>
@@ -65,17 +70,31 @@ import { Decrypt } from '@/util/secret.js'
 import Cookie from 'js-cookie'
 export default {
   name: 'login',
-  data () {
+  data() {
     return {
       userName: '',
+      // newPcBtnList: [
+      //   {
+      //     value: 4,
+      //     img: 'static/imgs/pc/yxchsRUZHU.svg',
+      //     label: '营销策划师',
+      //     type: 'planner'
+      //   },
+      //   {
+      //     value: 5,
+      //     img: 'static/imgs/pc/fengongsi.svg',
+      //     label: '分公司',
+      //     type: 'SubsidiaryCompany'
+      //   }
+      // ],
       // pc端列表渲染
       pcBtnList: [
-        {
-          value: 0,
-          img: 'static/imgs/pc/pc-personal.svg',
-          label: '个人商户',
-          type: 'personal'
-        },
+        // {
+        //   value: 0,
+        //   img: 'static/imgs/pc/pc-personal.svg',
+        //   label: '个人商户',
+        //   type: 'personal'
+        // },
         {
           value: 1,
           img: 'static/imgs/pc/pc-IndividualBusiness.svg',
@@ -88,21 +107,21 @@ export default {
           label: '企业商户',
           type: 'enterprisesApply'
         },
-        {
-          value: 3,
-          img: 'static/imgs/pc/pc-organization.svg',
-          label: '其他组织',
-          type: 'organization'
-        }
+        // {
+        //   value: 3,
+        //   img: 'static/imgs/pc/pc-organization.svg',
+        //   label: '其他组织',
+        //   type: 'organization'
+        // }
       ],
       // 手机端列表渲染
       mbBtnList: [
-        {
-          value: 0,
-          img: 'static/imgs/mb/mb-personal.svg',
-          label: '个人商户',
-          type: 'mPersonal'
-        },
+        // {
+        //   value: 0,
+        //   img: 'static/imgs/mb/mb-personal.svg',
+        //   label: '个人商户',
+        //   type: 'mPersonal'
+        // },
         {
           value: 1,
           img: 'static/imgs/mb/mb-mUinitBusiness.svg',
@@ -115,18 +134,36 @@ export default {
           label: '企业商户',
           type: 'mEnterprise'
         },
-        {
-          value: 3,
-          img: 'static/imgs/mb/mb-mOtherOrg.svg',
-          label: '其他组织',
-          type: 'mOtherOrg'
-        }
+        // {
+        //   value: 4,
+        //   img: 'static/imgs/mb/cehuashi.svg',
+        //   label: '营销策划师',
+        //   type: 'mPlanner'
+        // },
+        // {
+        //   value: 5,
+        //   img: 'static/imgs/mb/fengongsi.svg',
+        //   label: '分公司',
+        //   type: 'mSubsidiaryCompany'
+        // },
+        // {
+        //   value: 3,
+        //   img: 'static/imgs/mb/mb-mOtherOrg.svg',
+        //   label: '其他组织',
+        //   type: 'mOtherOrg'
+        // }
       ]
     }
   },
-  created () {
+  created() {
+    localStorage.removeItem('INVITATION_CODE')
     if (this.userName === '') {
       let data = this.getQueryString('user')
+      const invitationCode = this.getQueryString('code')
+      if (invitationCode) {
+        localStorage.setItem('INVITATION_CODE', invitationCode)
+      }
+
       if (data !== '' && data !== undefined) {
         let user = Decrypt(data)
         console.log(user, 'token')
@@ -140,33 +177,45 @@ export default {
     }
   },
   methods: {
-    goToApplication (type) {
+    goToApplication(type) {
       if (type === 'IndividualBusiness') {
-        this.$router.push({path: '/individualBusiness'})
+        this.$router.push({ path: '/individualBusiness' })
       }
       if (type === 'personal') {
-        this.$router.push({path: '/personal'})
+        this.$router.push({ path: '/personal' })
       }
       if (type === 'enterprisesApply') {
-        this.$router.push({path: '/enterprisesApply'})
+        this.$router.push({ path: '/enterprisesApply' })
       }
       if (type === 'organization') {
-        this.$router.push({path: '/organization'})
+        this.$router.push({ path: '/organization' })
+      }
+      if (type === 'planner') {
+        this.$router.push({ path: '/planner' })
+      }
+      if (type === 'SubsidiaryCompany') {
+        this.$router.push({ path: '/SubsidiaryCompany' })
       }
       if (type === 'mUinitBusiness') {
-        this.$router.push({path: '/mUinitBusiness'})
+        this.$router.push({ path: '/mUinitBusiness' })
       }
       if (type === 'mEnterprise') {
-        this.$router.push({path: '/mEnterprise'})
+        this.$router.push({ path: '/mEnterprise' })
       }
       if (type === 'mPersonal') {
-        this.$router.push({path: '/mPersonal'})
+        this.$router.push({ path: '/mPersonal' })
       }
       if (type === 'mOtherOrg') {
-        this.$router.push({path: '/mOtherOrg'})
+        this.$router.push({ path: '/mOtherOrg' })
+      }
+      if (type === 'mPlanner') {
+        this.$router.push({ path: '/mPlanner' })
+      }
+      if (type === 'mSubsidiaryCompany') {
+        this.$router.push({ path: '/mSubsidiaryCompany' })
       }
     },
-    getQueryString (name) {
+    getQueryString(name) {
       const reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i')
       const urlObj = window.location
       const url = window.location.href
@@ -180,6 +229,21 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.maskImage {
+  background-color: #ffffff1c;
+  width: 80px;
+  height: 80px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 10px;
+
+  .smallImg {
+    width: 55px !important;
+    height: 55px !important;
+  }
+}
+
 .login {
   height: 100%;
   min-height: 870px;
@@ -188,24 +252,29 @@ export default {
   background-image: url('../../assets/images/background.webp');
   background-repeat: no-repeat;
   background-size: 100% 100%;
+
   .loginTop {
     background-color: #333333;
     position: relative;
     z-index: 999;
+
     .loginLogo {
       height: 50px;
       color: #fff;
       display: flex;
       align-items: center;
       justify-content: space-between;
+
       img {
         width: 180px;
         margin-right: 30px;
       }
+
       span {
         font-size: 18px;
         color: $fontColor;
       }
+
       .loginImgBox {
         width: 51px;
         height: 40px;
@@ -213,17 +282,21 @@ export default {
         display: flex;
         margin-right: 20px;
         cursor: pointer;
+
         img {
           width: 100%;
         }
       }
+
       .leftBox {
         display: flex;
         align-items: center;
         font-weight: 400;
       }
+
       .rightBox {
         font-size: 16px;
+
         span {
           color: #C5AA7B;
           padding-left: 10px;
@@ -232,20 +305,23 @@ export default {
       }
     }
   }
+
   .loginCent {
     margin-top: 100px;
     font-family: Microsoft YaHei;
     display: flex;
     justify-content: center;
     align-items: center;
+
     .entrance {
-      .entranceInfo{
-        img{
+      .entranceInfo {
+        img {
           display: block;
           width: 480px;
           margin: auto;
         }
-        p{
+
+        p {
           margin: 30px 0;
           font-size: 16px;
           text-align: center;
@@ -253,19 +329,25 @@ export default {
         }
       }
     }
+
     .entranceBtn {
       width: 700px;
-      display: flex;
-      justify-content: space-around;
-      .btnContainer{
+      display: grid;
+      grid-template-columns: repeat(2, 2fr);
+      justify-items: center;
+      margin-bottom: 18px;
+
+      .btnContainer {
         width: 80px;
         cursor: pointer;
-        img{
+
+        img {
           display: block;
           width: 80px;
           height: 80px;
         }
-        span{
+
+        span {
           display: block;
           margin-top: 18px;
           text-align: center;
@@ -274,9 +356,11 @@ export default {
       }
     }
   }
+
   .wap {
     display: none;
   }
+
   .pc {
     height: 100%;
     display: flex;
@@ -284,10 +368,12 @@ export default {
     min-height: 768px;
   }
 }
+
 @media screen and (max-width: 750px) {
   .warp {
     width: 100%;
   }
+
   .login {
     background: #F8F8F8;
     position: relative;
@@ -307,21 +393,25 @@ export default {
         font-size: 18px;
         text-align: center;
       }
+
       .wapBan {
         width: 100%;
         background: url("../../assets/images/mb-background.png") no-repeat top center;
         background-size: contain;
         height: 300px;
       }
+
       .wapCent {
         position: absolute;
         top: 25%;
         width: 100%;
+
         .wapCentBox {
           width: 94%;
           margin: -50px auto 0 auto;
           padding: 5%;
           background: #FFFFFF;
+
           // box-shadow: 0px 1px 32px 2px #F4F4F4;
           // border-radius: 10px;
           .wapItemBox {
@@ -331,19 +421,23 @@ export default {
             justify-content: space-between;
             width: 100%;
             border-bottom: 1px solid #F6F4F7;
-            >>> .el-button--primary {
+
+            >>>.el-button--primary {
               width: 80px;
               color: #FFEBC4;
               background-color: #333333;
               border-radius: 0;
             }
           }
+
           .wapItemBox:last-child {
             border-bottom: none;
           }
+
           span {
             display: flex;
             align-items: center;
+
             img {
               width: 35px;
               height: 35px;

src/views/layout.vue

@@ -1,7 +1,17 @@
+<!--
+ * @Author: aliyun0758874076 2300202994@qq.com
+ * @Date: 2023-09-14 10:59:00
+ * @LastEditors: aliyun0758874076 2300202994@qq.com
+ * @LastEditTime: 2023-09-18 16:03:09
+ * @FilePath: \jufeng-pc-settle\src\views\layout.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
 <template>
   <div class="layout">
     <v-header class="vHeader"></v-header>
-    <router-view class="centBox"></router-view>
+    <keep-alive>
+      <router-view class="centBox"></router-view>
+    </keep-alive>
   </div>
 </template>
 
@@ -15,7 +25,7 @@
 <style lang="scss">
 .layout {
   flex-direction: column;
-  height: 100%;
+  height: 100vh;
   display: flex;
   background-image: url("../assets/images/personal-bc.webp");
   background-repeat: no-repeat;

src/views/moblie/mOtherOrg.vue

@@ -29,11 +29,76 @@
               <div class="labelTit"><label><i>*</i>负责人电话：</label></div>
               <input type="text" v-model="personalForm.chargePersonPhone" placeholder="请输入负责人电话">
             </div>
-            <div class="inputItem arrow">
-              <div class="labelTit"><label><i>*</i>店铺地址：</label></div>
-              <input @click="showPopup" @focus="noBomBox" v-model="shopAdress" type="text" placeholder="请选择所在地区">
-              <span class="iconfont">&#xe6ab;</span>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>店铺类型</label></div>
+              <!-- <input type="text" v-model="plannerForm.email" placeholder="请选择性别"> -->
+              <div class="input">
+                <van-radio-group v-model="personalForm.shopType" direction="horizontal">
+                  <van-radio name="1">商城</van-radio>
+                  <van-radio name="2">本地</van-radio>
+                </van-radio-group>
+              </div>
+            </div>
+            <div class="inputItem arrow" style="margin-top: 20px;">
+              <div class="labelTit"><label><i>*</i>请选择地址</label></div>
+              <div class="input" style="background-color: #a4a4a41f;" @click="show1 = true">
+                {{ fieldValue || '请选择地区' }}
+              </div>
+              <!-- <span class="iconfont">&#xe6ab;</span> -->
               <input type="text" v-model="personalForm.storeAddressDetail" placeholder="请输入详细地址">
+              <van-popup v-model="show1" round position="bottom">
+                <!-- v-if="isRequestAddres" sb玩意不动态刷新，现在换了给方法，强行重新赋值，不完全完美的解决问题 -->
+                <van-cascader
+                  v-model="personalForm.areaId"
+                  title="请选择所在地区"
+                  :options="options"
+                  @close="show1 = false"
+                  @change="onAddresChange"
+                  :field-names="{ text: 'name', value: 'id', children: 'children' }"
+                />
+              </van-popup>
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>营销策划师</label></div>
+              <div class="input" style="background-color: #a4a4a41f;" v-if="personalForm.areaId.length <= 0">
+                请先选择详细地址
+              </div>
+              <div class="input" style="background-color: #a4a4a41f;" v-else @click="showSubCompany = true">
+                {{ companyValue || '请选择营销策划师' }}
+              </div>
+              <van-popup v-model="showSubCompany" round position="bottom" :style="{ height: '50%' }">
+                 <van-picker
+                    title="选择您的营销策划师"
+                    show-toolbar
+                    :columns="plannerColumns"
+                    value-key="name"
+                    @confirm="onPlannerConfirm"
+                    @cancel="showSubCompany = false"
+                    @change="onPlannerChange"
+                    visible-item-count="7"
+                  />
+                  <div class="loadingBox">
+                      <van-button :loading="companyLoading" type="default" @click="getMoreCompany" loading-text="加载中...">点击加载更多</van-button>
+                  </div>
+              </van-popup>
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>入驻套餐</label></div>
+              <div class="input" style="background-color: #a4a4a41f;" @click="showSetMeal = true">
+                {{ setMealValue || '请选择你的套餐'}}
+              </div>
+              <van-popup v-model="showSetMeal" round position="bottom" :style="{ height: '50%' }">
+                 <van-picker
+                    title="请选择你的套餐"
+                    show-toolbar
+                    :columns="setMealData"
+                    value-key="title"
+                    @confirm="onSetMealfirm"
+                    @cancel="showSetMeal = false"
+                    @change="onSetMealChange"
+                    visible-item-count="7"
+                  />
+              </van-popup>
             </div>
           </div>
         </div>
@@ -221,7 +286,7 @@
   </div>
 </template>
 <script>
-import { Area, Popup, DatetimePicker, Uploader, Toast, Picker } from 'vant'
+import { Area, Popup, DatetimePicker, Uploader, Toast, Picker, Cascader, RadioGroup, Radio, Button } from 'vant'
 import api from '@/api'
 import { listSearchMixin } from '@/config/mixin'
 import AreaList from '../../util/area'
@@ -234,7 +299,11 @@ export default {
     [DatetimePicker.name]: DatetimePicker,
     [Uploader.name]: Uploader,
     [Toast.name]: Toast,
-    [Picker.name]: Picker
+    [Picker.name]: Picker,
+    [Cascader.name]: Cascader,
+    [RadioGroup.name]: RadioGroup,
+    [Radio.name]: Radio,
+    [Button.name]: Button
   },
   data () {
     return {
@@ -283,8 +352,24 @@ export default {
         otherCardStartTime: '', // 证件有效开始时间
         otherCardEndTime: '', // 证件有效结束时间
         otherCardPositive: '', // 身份证正面照
-        otherCardSide: '' // 身份证反面照
+        otherCardSide: '', // 身份证反面照
+        parentId: '',
+        shopType: '1', // 店铺类型 1商城 2本地
+        isVoucher: 1, // 是否支持使用代金卷
+        voucherReturn: '', // 代金卷的抵扣比例/返还比例
+        areaId: '', // 区域ID
+        packageId: ''
       },
+      show1: false,
+      showSubCompany: false,
+      showSetMeal: false,
+      plannerColumns: [],
+      companyLoading: false,
+      options: null,
+      setMealData: [],
+      companyValue: '',
+      fieldValue: '',
+      setMealValue: '',
       idCardList: [],
       dictName: '证件类型',
       columns: []
@@ -293,6 +378,28 @@ export default {
   mounted () {
     this.getDictList()
   },
+  created () {
+    this.sendReq({
+        url: api.getTreeClass,
+        method: 'GET',
+        params: {}
+      }, (res) => {
+        // console.log(res) // 获取地址选择器数据并去除空的子项
+        this.options = res.data
+        // console.log(this.options)
+      })
+    this.sendReq({
+        url: api.getAdditional, // 套餐购买类型：1-商家，2-策划师 3-分公司
+        method: 'GET',
+        params: {
+          type: 1
+        }
+      }, (res) => {
+        // console.log(res) // 获取地址选择器数据并去除空的子项
+        this.setMealData = res.data
+        // console.log(this.options)
+      })
+  },
   methods: {
     getDictList () {
       let self = this
@@ -591,12 +698,130 @@ export default {
           Toast.fail(res.message)
         }
       })
+    },
+    onAddresChange ({value, selectedOptions, tabIndex}) { // 选择完地址后转为显示的字符串
+      let cacheArray = []
+      let addresString = ''
+      let level = ''
+      this.sendReq({
+        url: api.getTreeOne,
+        method: 'GET',
+        params: {
+          parentId: value
+        }
+        }, (res) => {
+          if (res.data && res.data.length > 0) {
+              selectedOptions[selectedOptions.length - 1].children = res.data
+              cacheArray = this.options.map(item => { // 这里重新再赋值一遍是因为这里直接改变数组页面不会动态刷新，所以每次都重新给options赋值，强制刷新
+                return item
+              })
+              this.options = cacheArray
+            }
+          // this.isRequestAddres = true
+      })
+      for (let i = 0; i < selectedOptions.length; i++) {
+        if (i >= selectedOptions.length - 1) {
+          addresString += selectedOptions[i].name
+          level = selectedOptions[i].level // 获取最后选择的地址的层级
+          this.level = level
+        } else {
+          addresString += selectedOptions[i].name + ' / '
+        }
+      }
+      this.fieldValue = addresString
+      this.sendReq({ // 获取可选择的分公司
+        url: api.selectAnd,
+        method: 'POST',
+        data: {
+          area: value, // 地区编号
+          type: 2,
+          level, // "区级别不能为空"
+          page: this.queryData.page,
+          pageSize: this.queryData.size
+        }
+        }, (res) => {
+          this.plannerColumns = res.data.list
+          console.log(res)
+        })
+      // console.log(this.personalForm)
+    },
+    onPlannerConfirm (value) { // 确认选择的公司
+      this.companyValue = value.name
+      this.personalForm.parentId = value.platformUserId
+      this.showSubCompany = false
+    },
+    onPlannerChange (value) {
+      // console.log(value)
+    },
+    getMoreCompany () {
+      this.companyLoading = true
+      // eslint-disable-next-line eqeqeq
+      if (this.plannerColumns.length == this.queryData.total) {
+        this.queryData.pageSize += 7
+        this.sendReq({ // 获取可选择的分公司
+          url: api.selectAnd,
+          method: 'POST',
+          data: {
+            area: this.personalForm.areaId, // 地区编号
+            type: 2,
+            level: this.level, // "区级别不能为空"
+            page: this.queryData.page,
+            pageSize: this.queryData.size
+          }
+          }, (res) => {
+            this.plannerColumns = res.data.list
+            this.companyLoading = false
+            // console.log(res)
+          })
+      } else {
+        Toast.fail('没有更多了')
+        this.companyLoading = false
+      }
+    },
+    onSetMealfirm (value) {
+      // console.log(value)
+      this.setMealValue = value.title
+      this.personalForm.packageId = value.id
+      this.showSetMeal = false
+    },
+    onSetMealChange (value) {
+      // console.log(value)
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
+.loadingBox {
+  display: flex;
+  justify-content: center;
+}
+.plannerItem {
+  display: flex;
+  align-items: center;
+  .avatar {
+    margin-top: -3px;
+    width: 30px;
+    height: 30px;
+  }
+  .custom-title {
+    margin-top: -5px;
+    margin-left: 20px;
+  }
+}
+.input {
+  width: 100%;
+  margin: 10px 0px;
+  border-bottom: 1px solid #F6F4F7;
+  height: 40px;
+  border-radius: 50px;
+  line-height: 40px;
+  font-size: 16px;
+  color: #666666;
+  padding-left: 10px;
+  display: flex;
+  align-items: center;
+}
 .mOtherOrg {
   padding-bottom: 60px;
   .topTitle {

src/views/moblie/mPersonal.vue

@@ -28,12 +28,81 @@
               <div class="labelTit"><label><i>*</i>负责人电话：</label></div>
               <input type="text" v-model="personalForm.chargePersonPhone" placeholder="请输入负责人电话">
             </div>
-            <div class="inputItem arrow">
-              <div class="labelTit"><label><i>*</i>店铺地址：</label></div>
-              <input @click="showPopup" @focus="noBomBox" v-model="shopAdress" type="text" placeholder="请选择所在地区">
-              <span class="iconfont">&#xe6ab;</span>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>店铺类型</label></div>
+              <!-- <input type="text" v-model="plannerForm.email" placeholder="请选择性别"> -->
+              <div class="input">
+                <van-radio-group v-model="personalForm.shopType" direction="horizontal">
+                  <van-radio name="1">商城</van-radio>
+                  <van-radio name="2">本地</van-radio>
+                </van-radio-group>
+              </div>
+            </div>
+            <div class="inputItem arrow" style="margin-top: 20px;">
+              <div class="labelTit"><label><i>*</i>请选择地址</label></div>
+              <div class="input" style="background-color: #a4a4a41f;" @click="show = true">
+                {{ fieldValue || '请选择地区' }}
+              </div>
+              <!-- <span class="iconfont">&#xe6ab;</span> -->
               <input type="text" v-model="personalForm.storeAddressDetail" placeholder="请输入详细地址">
+              <van-popup v-model="show" round position="bottom">
+                <!-- v-if="isRequestAddres" sb玩意不动态刷新，现在换了给方法，强行重新赋值，不完全完美的解决问题 -->
+                <van-cascader
+                  v-model="personalForm.areaId"
+                  title="请选择所在地区"
+                  :options="options"
+                  @close="show = false"
+                  @change="onAddresChange"
+                  :field-names="{ text: 'name', value: 'id', children: 'children' }"
+                />
+              </van-popup>
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>营销策划师</label></div>
+              <div class="input" style="background-color: #a4a4a41f;" v-if="personalForm.areaId.length <= 0">
+                请先选择详细地址
+              </div>
+              <div class="input" style="background-color: #a4a4a41f;" v-else @click="showSubCompany = true">
+                {{ companyValue || '请选择营销策划师' }}
+              </div>
+              <van-popup v-model="showSubCompany" round position="bottom" :style="{ height: '50%' }">
+                 <van-picker
+                    title="选择您的营销策划师"
+                    show-toolbar
+                    :columns="plannerColumns"
+                    value-key="name"
+                    @confirm="onPlannerConfirm"
+                    @cancel="showSubCompany = false"
+                    @change="onPlannerChange"
+                    visible-item-count="7"
+                  />
+                  <div class="loadingBox">
+                      <van-button :loading="companyLoading" type="default" @click="getMoreCompany" loading-text="加载中...">点击加载更多</van-button>
+                  </div>
+              </van-popup>
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>入驻套餐</label></div>
+              <div class="input" style="background-color: #a4a4a41f;" @click="showSetMeal = true">
+                {{ setMealValue || '请选择你的套餐'}}
+              </div>
+              <van-popup v-model="showSetMeal" round position="bottom" :style="{ height: '50%' }">
+                 <van-picker
+                    title="请选择你的套餐"
+                    show-toolbar
+                    :columns="setMealData"
+                    value-key="title"
+                    @confirm="onSetMealfirm"
+                    @cancel="showSetMeal = false"
+                    @change="onSetMealChange"
+                    visible-item-count="7"
+                  />
+              </van-popup>
             </div>
+            <!-- <div class="inputItem arrow">
+              <div class="labelTit"><label><i>*</i>店铺地址：</label></div>
+              <input @click="showPopup" @focus="noBomBox" v-model="shopAdress" type="text" placeholder="请选择所在地区">
+            </div> -->
           </div>
         </div>
         <div class="subjectInfo" v-show="active === 2">
@@ -114,9 +183,9 @@
       <button class="nextBtn" @click="next" v-show="active < 2">下一步</button>
       <button class="nextBtn" @click="submitForm" v-show="active > 1">提交</button>
     </div>
-    <van-popup v-model="show" round position="bottom" :style="{ height: '40%' }">
+    <!-- <van-popup v-model="show" round position="bottom" :style="{ height: '40%' }">
       <van-area title="请选择地区" :area-list="areaList" @confirm="selectArea" @cancel="closeSelect"/>
-    </van-popup>
+    </van-popup> -->
     <van-popup v-model="idCardStartShow" round position="bottom" :style="{ height: '40%' }">
       <van-datetime-picker
         v-model="idCardStartDate"
@@ -153,7 +222,7 @@
   </div>
 </template>
 <script>
-import { Area, Popup, DatetimePicker, Uploader, Toast, Picker } from 'vant'
+import { Area, Popup, DatetimePicker, Uploader, Toast, Picker, Cascader, RadioGroup, Radio, Button } from 'vant'
 import api from '@/api'
 import { listSearchMixin } from '@/config/mixin'
 import AreaList from '../../util/area'
@@ -166,12 +235,18 @@ export default {
     [DatetimePicker.name]: DatetimePicker,
     [Uploader.name]: Uploader,
     [Toast.name]: Toast,
-    [Picker.name]: Picker
+    [Picker.name]: Picker,
+    [Cascader.name]: Cascader,
+    [RadioGroup.name]: RadioGroup,
+    [Radio.name]: Radio,
+    [Button.name]: Button
   },
   data () {
     return {
+      options: [],
       active: 1,
       areaList: AreaList,
+      fieldValue: '',
       show: false,
       minDate: new Date(1960, 1, 1),
       maxDate: new Date(2077, 12, 31),
@@ -205,13 +280,53 @@ export default {
         personalCardEndTime: '', // 证件有效结束时间
         personalCardPositive: '', // 身份证正面照
         personalCardSide: '', // 身份证反面照
-        personalCardHand: '' // 手持证件照
+        personalCardHand: '', // 手持证件照
+        parentId: '',
+        shopType: '1', // 店铺类型 1商城 2本地
+        isVoucher: 1, // 是否支持使用代金卷
+        voucherReturn: '', // 代金卷的抵扣比例/返还比例
+        areaId: '', // 区域ID
+        packageId: ''
       },
+      queryData: {
+        page: 1,
+        size: 10,
+        total: 0
+      },
+      setMealValue: '',
+      setMealData: [],
+      showSubCompany: false,
+      companyLoading: false,
+      showSetMeal: false,
+      companyValue: '',
+      plannerColumns: [],
       idCardList: [],
       dictName: '证件类型',
       columns: []
     }
   },
+  created () {
+    this.sendReq({
+        url: api.getTreeClass,
+        method: 'GET',
+        params: {}
+      }, (res) => {
+        // console.log(res) // 获取地址选择器数据并去除空的子项
+        this.options = res.data
+        // console.log(this.options)
+      })
+    this.sendReq({
+        url: api.getAdditional, // 套餐购买类型：1-商家，2-策划师 3-分公司
+        method: 'GET',
+        params: {
+          type: 1
+        }
+      }, (res) => {
+        // console.log(res) // 获取地址选择器数据并去除空的子项
+        this.setMealData = res.data
+        // console.log(this.options)
+      })
+  },
   mounted () {
     this.getDictList()
     this.idCardStartDate = new Date()
@@ -458,12 +573,156 @@ export default {
           Toast.fail(res.message)
         }
       })
+    },
+    onAddresChange ({value, selectedOptions, tabIndex}) { // 选择完地址后转为显示的字符串
+      let cacheArray = []
+      let addresString = ''
+      let level = ''
+      this.sendReq({
+        url: api.getTreeOne,
+        method: 'GET',
+        params: {
+          parentId: value
+        }
+        }, (res) => {
+          if (res.data && res.data.length > 0) {
+              selectedOptions[selectedOptions.length - 1].children = res.data
+              cacheArray = this.options.map(item => { // 这里重新再赋值一遍是因为这里直接改变数组页面不会动态刷新，所以每次都重新给options赋值，强制刷新
+                return item
+              })
+              this.options = cacheArray
+            }
+          // this.isRequestAddres = true
+      })
+      for (let i = 0; i < selectedOptions.length; i++) {
+        if (i >= selectedOptions.length - 1) {
+          addresString += selectedOptions[i].name
+          level = selectedOptions[i].level // 获取最后选择的地址的层级
+          this.level = level
+        } else {
+          addresString += selectedOptions[i].name + ' / '
+        }
+      }
+      this.fieldValue = addresString
+      this.sendReq({ // 获取可选择的营销策划师
+        url: api.selectAnd,
+        method: 'POST',
+        data: {
+          area: value, // 地区编号
+          type: 2,
+          level, // "区级别不能为空"
+          page: this.queryData.page,
+          pageSize: this.queryData.size
+        }
+        }, (res) => {
+          this.plannerColumns = res.data.list
+          console.log(res)
+        })
+      // console.log(this.personalForm)
+    },
+    onPlannerConfirm (value) { // 确认选择的公司
+      this.companyValue = value.name
+      this.personalForm.parentId = value.platformUserId
+      this.showSubCompany = false
+    },
+    onPlannerChange (value) {
+      // console.log(value)
+    },
+    getMoreCompany () {
+      this.companyLoading = true
+      // eslint-disable-next-line eqeqeq
+      if (this.plannerColumns.length == this.queryData.total) {
+        this.queryData.pageSize += 7
+        this.sendReq({ // 获取可选择的分公司
+          url: api.selectAnd,
+          method: 'POST',
+          data: {
+            area: this.personalForm.areaId, // 地区编号
+            type: 2,
+            level: this.level, // "区级别不能为空"
+            page: this.queryData.page,
+            pageSize: this.queryData.size
+          }
+          }, (res) => {
+            this.plannerColumns = res.data.list
+            this.companyLoading = false
+            // console.log(res)
+          })
+      } else {
+        Toast.fail('没有更多了')
+        this.companyLoading = false
+      }
+    },
+    onSetMealfirm (value) {
+      // console.log(value)
+      this.setMealValue = value.title
+      this.personalForm.packageId = value.id
+      this.showSetMeal = false
+    },
+    onSetMealChange (value) {
+      // console.log(value)
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
+.loadingBox {
+  display: flex;
+  justify-content: center;
+}
+.plannerItem {
+  display: flex;
+  align-items: center;
+  .avatar {
+    margin-top: -3px;
+    width: 30px;
+    height: 30px;
+  }
+  .custom-title {
+    margin-top: -5px;
+    margin-left: 20px;
+  }
+}
+.input {
+  width: 100%;
+  margin: 10px 0px;
+  border-bottom: 1px solid #F6F4F7;
+  height: 40px;
+  border-radius: 50px;
+  line-height: 40px;
+  font-size: 16px;
+  color: #666666;
+  padding-left: 10px;
+  display: flex;
+  align-items: center;
+}
+.header {
+  z-index: 1000;
+  width: 100%;
+  height: 50px;
+  background-color: #333;
+  color: #fff;
+  font-weight: 600;
+  text-align: center;
+  line-height: 50px;
+  position: fixed;
+  top: 0;
+  left: 0;
+  display: flex;
+  align-items: center;
+  .comeback {
+    margin-left: 10px;
+    width: 30px;
+    height: 30px;
+  }
+  > span {
+    position: absolute;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+}
+
 .mUinitBusiness {
   padding-bottom: 60px;
   .topTitle {
@@ -572,6 +831,19 @@ export default {
             }
           }
         }
+        .input {
+          width: 100%;
+          margin: 10px 0px;
+          border-bottom: 1px solid #F6F4F7;
+          height: 40px;
+          border-radius: 50px;
+          line-height: 40px;
+          font-size: 16px;
+          color: #666666;
+          padding-left: 10px;
+          display: flex;
+          align-items: center;
+        }
         input {
           width: 100%;
           border-bottom: 1px solid #F6F4F7;
@@ -668,7 +940,7 @@ export default {
 }
 
 .centBox {
-  > > > .el-step {
+  > .el-step {
     .el-step:nth-child(1) {
       .el-step__icon-inner {
       }

src/views/moblie/mPlanner.vue

@@ -0,0 +1,684 @@
+<template>
+  <div class="mUinitBusiness">
+    <div class="header">
+      <img class="comeback" src="@/assets/images/fanhui.png" alt="" @click="goHome" >
+      <span>营销策划师入驻</span>
+    </div>
+    <div class="topTitle">
+      <h3>营销策划师入驻</h3>
+      <p>请认真填写申请信息，以便我们为您提供更好的服务！</p>
+    </div>
+    <div class="centBox">
+      <!-- <el-steps :active="active" align-center>
+        <el-step @click.native="changeActive(index = 1)" title="个人信息"></el-step>
+        <el-step @click.native="changeActive(index = 2)" title="详细信息"></el-step>
+      </el-steps> -->
+       <div class="mFormBox">
+        <div class="shopInfo">
+          <div class="form">
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>账户名/手机号码</label></div>
+              <input type="text" v-model="plannerForm.username" placeholder="请输入账号或电话号码">
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>昵称/姓名</label></div>
+              <input type="text" v-model="plannerForm.name" placeholder="请输入昵称">
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>手机号</label></div>
+              <input type="text" v-model="plannerForm.phone" placeholder="请输入手机号">
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>邮箱</label></div>
+              <input type="text" v-model="plannerForm.email" placeholder="请输入邮箱">
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>性别</label></div>
+              <!-- <input type="text" v-model="plannerForm.email" placeholder="请选择性别"> -->
+              <div class="input">
+                <van-radio-group v-model="plannerForm.sex" direction="horizontal">
+                <van-radio name="男">男</van-radio>
+                <van-radio name="女">女</van-radio>
+              </van-radio-group>
+              </div>
+            </div>
+            <div class="inputItem arrow" style="margin-top: 20px;">
+              <div class="labelTit"><label><i>*</i>请选择地址</label></div>
+              <div class="input" style="background-color: #a4a4a41f;" @click="show = true">
+                {{ fieldValue || '请选择地区' }}
+              </div>
+              <!-- <input @click="show = true" v-model="fieldValue" type="text" placeholder="请选择所在地区"> -->
+              <!-- <van-field
+                v-model="fieldValue"
+                is-link
+                readonly
+                label="请选择地址"
+                placeholder="请选择所在地区"
+                @click="show = true"
+              /> -->
+              <van-popup v-model="show" round position="bottom">
+                <!-- v-if="isRequestAddres" sb玩意不动态刷新，现在换了给方法，强行重新赋值，不完全完美的解决问题 -->
+                <van-cascader
+                  v-model="plannerForm.region"
+                  title="请选择所在地区"
+                  :options="options"
+                  @close="show = false"
+                  @change="onAddresChange"
+                  :field-names="{ text: 'name', value: 'id', children: 'children' }"
+                />
+              </van-popup>
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>详细地址</label></div>
+              <input type="text" v-model="plannerForm.addres" placeholder="请输入详细地址">
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>分公司</label></div>
+              <div class="input" style="background-color: #a4a4a41f;" v-if="plannerForm.region.length <= 0">
+                请先选择详细地址
+              </div>
+              <div class="input" style="background-color: #a4a4a41f;" v-else @click="showSubCompany = true">
+                {{ companyValue || '请选择分公司' }}
+              </div>
+              <van-popup v-model="showSubCompany" round position="bottom" :style="{ height: '50%' }">
+                 <van-picker
+                    title="选择您的分公司"
+                    show-toolbar
+                    :columns="plannerColumns"
+                    value-key="name"
+                    @confirm="onPlannerConfirm"
+                    @cancel="showSubCompany = false"
+                    @change="onPlannerChange"
+                    visible-item-count="7"
+                  />
+                  <div class="loadingBox">
+                      <van-button :loading="companyLoading" type="default" @click="getMoreCompany" loading-text="加载中...">点击加载更多</van-button>
+                  </div>
+              </van-popup>
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>入驻套餐</label></div>
+              <div class="input" style="background-color: #a4a4a41f;" @click="showSetMeal = true">
+                {{ setMealValue || '请选择你的套餐'}}
+              </div>
+              <van-popup v-model="showSetMeal" round position="bottom" :style="{ height: '50%' }">
+                 <van-picker
+                    title="请选择你的套餐"
+                    show-toolbar
+                    :columns="setMealData"
+                    value-key="title"
+                    @confirm="onSetMealfirm"
+                    @cancel="showSetMeal = false"
+                    @change="onSetMealChange"
+                    visible-item-count="7"
+                  />
+              </van-popup>
+            </div>
+          </div>
+        </div>
+        <!-- <div class="subjectInfo" v-show="active === 2">
+          <div class="form">
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>生效日期</label></div>
+              <div class="input" style="background-color: #a4a4a41f;" @click="showDate = true">
+                {{ dateValue || '请选择生效日期' }}
+              </div>
+              <van-calendar :min-date="minDate" :max-date="maxDate" v-model="showDate" type="range" @confirm="getDataArray" />
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>合同是否有效</label></div>
+              <div class="input">
+                <van-radio-group v-model="plannerForm.contractState" direction="horizontal">
+                <van-radio name="1">是</van-radio>
+                <van-radio name="0">否</van-radio>
+              </van-radio-group>
+              </div>
+            </div>
+          </div>
+        </div> -->
+       </div>
+       <!-- <button class="nextBtn" @click="active = 2" v-show="active < 2">下一步</button> -->
+       <!-- <button class="nextBtn" @click="active = 1" v-show="active >= 2">上一步</button> -->
+       <button class="nextBtn" @click="submitForm" v-show="active > 1">提交</button>
+    </div>
+  </div>
+</template>
+
+<script>
+import api from '@/api'
+import { listSearchMixin } from '@/config/mixin'
+// eslint-disable-next-line no-unused-vars
+import { formatDate, unemptyArray } from '@/util/ArrayFunction'
+// eslint-disable-next-line no-unused-vars
+import { Field, Popup, DatetimePicker, Toast, Picker, RadioGroup, Radio, Cascader, Calendar, Button } from 'vant'
+export default {
+  mixins: [listSearchMixin],
+  components: {
+    [Field.name]: Field,
+    [Popup.name]: Popup,
+    [DatetimePicker.name]: DatetimePicker,
+    [Toast.name]: Toast,
+    [Picker.name]: Picker,
+    [RadioGroup.name]: RadioGroup,
+    [Radio.name]: Radio,
+    [Cascader.name]: Cascader,
+    [Calendar.name]: Calendar,
+    [Button.name]: Button
+  },
+  data () {
+    return {
+      active: 3,
+      show: false, // 控制地区选择
+      // isRequestAddres: true, // 原本是用来动态刷新地址选择栏的，但是有闪屏问题，遗弃掉
+      showDate: false, // 控制时间选择
+      showSetMeal: false,
+      companyLoading: false, // 控制公司选择加载
+      showSubCompany: false, // 控制公司选择
+      minDate: new Date(1991, 0, 1), // 控制时间区间选择的最小年份
+      maxDate: new Date(2099, 0, 31), // 控制时间区间选择的最大年份
+      level: '', // 地区的等级
+      fieldValue: '',
+      dateValue: '',
+      companyValue: '',
+      setMealValue: '',
+      options: [],
+      plannerColumns: [], // 可供选择的策划师的数据
+      setMealData: [], // 可供选择的套餐数据
+      queryData: {
+        page: 1,
+        size: 10,
+        total: 0
+      },
+      plannerForm: {
+          username: '', // 账号
+          name: '', // 姓名
+          phone: '', // 电话号码
+          email: '', // 邮箱
+          sex: '男', // 性别
+          region: '', // 区域编码
+          addres: '', //
+          packageId: '',
+          // startTime: '',
+          // endTime: '',
+          effectiveDate: '', // 生效日期  即时生效-设置当前时间 有值-指定日期生效
+          effectiveYear: '', // 生效时限（年）
+          contractState: '', // 合同状态 1-有效 0-无效
+          type: '2', // 类型： 1为分公司 2为策划师
+          parentId: '' // 父级ID 如果为分公司则为null
+        }
+    }
+  },
+  created () {
+    this.sendReq({
+        url: api.getTreeClass,
+        method: 'GET',
+        params: {}
+      }, (res) => {
+        // console.log(res) // 获取地址选择器数据并去除空的子项
+        this.options = res.data
+        // console.log(this.options)
+      })
+    this.sendReq({
+        url: api.getAdditional, // 套餐购买类型：1-商家，2-策划师 3-分公司
+        method: 'GET',
+        params: {
+          type: 2
+        }
+      }, (res) => {
+        // console.log(res) // 获取地址选择器数据并去除空的子项
+        this.setMealData = res.data
+        // console.log(this.options)
+      })
+  },
+  methods: {
+    submitForm () {
+      let phoneReg = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/
+      let emailReg = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
+      if (this.plannerForm.phone === '' || !phoneReg.test(this.plannerForm.phone)) {
+        Toast.fail('请输入正确的电话号码')
+        return false
+      }
+      if (this.plannerForm.email === '' || !emailReg.test(this.plannerForm.email)) {
+        Toast.fail('请输入正确的邮箱')
+        return false
+      }
+      if (this.plannerForm.username === '') {
+        Toast.fail('请输入用户名')
+        return false
+      }
+      if (this.plannerForm.name === '') {
+        Toast.fail('请输入姓名')
+        return false
+      }
+      if (this.plannerForm.region === '' || this.plannerForm.addres === '') {
+        Toast.fail('请选择地区，并填好详细地址')
+        return false
+      }
+      // if (this.plannerForm.effectiveDate === '' || this.plannerForm.effectiveYear === '') {
+      //   Toast.fail('请选择生效时间')
+      //   return false
+      // }
+      if (this.plannerForm.parentId === '') {
+        Toast.fail('请选择绑定的策划师')
+        return false
+      }
+      // if (this.plannerForm.contractState === '') {
+      //   Toast.fail('请确认合同是否有效')
+      //   return false
+      // }
+      this.sendReq({
+        url: api.plannerCheck,
+        method: 'POST',
+        data: this.plannerForm
+        }, (res) => {
+          console.log(res)
+          if (res.code === '200') {
+            Toast.success('提交成功')
+            this.$router.push({path: '/mStatus'})
+          } else {
+            Toast.fail(res.message)
+          }
+      })
+    },
+    getDataArray (dateArray = []) { // 获取选择的时间区间
+      const [start, end] = dateArray
+      // 先拿到有多少年的生效时间
+      let arr = dateArray.map(item => {
+        return formatDate(item).split('-')[0]
+      })
+      this.plannerForm.effectiveYear = arr[1] - arr[0]
+
+      this.dateValue = `${formatDate(start)} - ${formatDate(end)}` + `    有效期${this.plannerForm.effectiveYear}年`
+      this.plannerForm.effectiveDate = `${formatDate(start)} - ${formatDate(end)}`
+      // console.log(this.dateValue)
+      this.showDate = false
+    },
+    changeActive (index) { // 切换表单栏
+      this.active = index
+    },
+    onAddresChange ({value, selectedOptions, tabIndex}) { // 选择完地址后转为显示的字符串
+      let cacheArray = []
+      let addresString = ''
+      let level = ''
+      this.sendReq({
+        url: api.getTreeOne,
+        method: 'GET',
+        params: {
+          parentId: value
+        }
+        }, (res) => {
+          if (res.data && res.data.length > 0) {
+              selectedOptions[selectedOptions.length - 1].children = res.data
+              cacheArray = this.options.map(item => { // 这里重新再赋值一遍是因为这里直接改变数组页面不会动态刷新，所以每次都重新给options赋值，强制刷新
+                return item
+              })
+              this.options = cacheArray
+            }
+          // this.isRequestAddres = true
+      })
+      for (let i = 0; i < selectedOptions.length; i++) {
+        if (i >= selectedOptions.length - 1) {
+          addresString += selectedOptions[i].name
+          level = selectedOptions[i].level // 获取最后选择的地址的层级
+          this.level = level
+        } else {
+          addresString += selectedOptions[i].name + ' / '
+        }
+      }
+      this.fieldValue = addresString
+      this.sendReq({ // 获取可选择的分公司
+        url: api.selectAnd,
+        method: 'POST',
+        data: {
+          area: value, // 地区编号
+          type: 1,
+          level, // "区级别不能为空"
+          page: this.queryData.page,
+          pageSize: this.queryData.size
+        }
+        }, (res) => {
+          this.plannerColumns = res.data.list
+          console.log(res)
+        })
+    },
+    onPlannerConfirm (value) { // 确认选择的公司
+      this.companyValue = value.name
+      this.plannerForm.parentId = value.platformUserId
+      this.showSubCompany = false
+    },
+    onPlannerChange (value) {
+      // console.log(value)
+    },
+    getMoreCompany () {
+      this.companyLoading = true
+      // eslint-disable-next-line eqeqeq
+      if (this.plannerColumns.length == this.queryData.total) {
+        this.queryData.pageSize += 7
+        this.sendReq({ // 获取可选择的分公司
+          url: api.selectAnd,
+          method: 'POST',
+          data: {
+            area: this.plannerForm.region, // 地区编号
+            type: 1,
+            level: this.level, // "区级别不能为空"
+            page: this.queryData.page,
+            pageSize: this.queryData.size
+          }
+          }, (res) => {
+            this.plannerColumns = res.data.list
+            this.companyLoading = false
+            // console.log(res)
+          })
+      } else {
+        Toast.fail('没有更多了')
+        this.companyLoading = false
+      }
+    },
+    goHome () {
+      this.$router.replace({
+        path: '/'
+      })
+    },
+    onSetMealChange (value) {
+      // console.log(value)
+    },
+    onSetMealfirm (value) {
+      // console.log(value)
+      this.setMealValue = value.title
+      this.plannerForm.packageId = value.id
+      this.showSetMeal = false
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.loadingBox {
+  display: flex;
+  justify-content: center;
+}
+.plannerItem {
+  display: flex;
+  align-items: center;
+  .avatar {
+    margin-top: -3px;
+    width: 30px;
+    height: 30px;
+  }
+  .custom-title {
+    margin-top: -5px;
+    margin-left: 20px;
+  }
+}
+.header {
+  z-index: 1000;
+  width: 100%;
+  height: 50px;
+  background-color: #333;
+  color: #fff;
+  font-weight: 600;
+  text-align: center;
+  line-height: 50px;
+  position: fixed;
+  top: 0;
+  left: 0;
+  display: flex;
+  align-items: center;
+  .comeback {
+    margin-left: 10px;
+    width: 30px;
+    height: 30px;
+  }
+  > span {
+    position: absolute;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+}
+/* 此处使用样式穿透更改vant组件的样式 但是不起作用， 因素很多 包的版本 vant的less样式 问题很多，期待下一位挑战者 */
+.subjectInfo {
+ /deep/ .van-calendar__day--start {
+  background-color: #080707 !important;
+}
+/deep/ .van-calendar__day--end {
+  background-color: #080707 !important;
+}
+/deep/ .van-calendar__day--middle::after {
+  background-color: #3f3f3f86 !important;
+}
+/deep/ .van-calendar__day--middle {
+  color: #080707;
+}
+/deep/ .van-button--danger {
+  background-color: #080707;
+  border: 1px solid #080707;
+}
+}
+
+.mUinitBusiness {
+  padding-top: 30px;
+  padding-bottom: 60px;
+  .topTitle {
+    padding: 0 5%;
+    h3 {
+      /* background-color: #a4a4a41f; */
+      font-size: 21px;
+      color: #333333;
+      margin-bottom: 22px;
+    }
+    p {
+      font-size: 12px;
+      color: #676870;
+    }
+    margin:50px 0 28px 0;
+  }
+  ::v-deep .el-step__head {
+    color: #E9EAEB;
+    .el-step__icon {
+      background: #FFFFFF;
+      width: 50px;
+      height: 50px;
+      border-radius: 0;
+      border: 1px solid #F3F4F5;
+    }
+  }
+  ::v-deep .el-step__head.is-process {
+    border-color: #CDCDCD
+  }
+  ::v-deep .el-step__line {
+    background-color: #F3F4F5;
+    height: 1px !important;
+    top: 50% !important;
+    overflow: hidden;
+  }
+  ::v-deep .is-finish {
+    border-color: #C5AA7B;
+    color: #FFFFFF;
+    font-weight: 500 !important;
+    .el-step__icon {
+      background: #FFFFFF;
+      height: 50px;
+      width: 50px;
+      color: #C5AA7B;
+      border: 1px solid #C5AA7B;
+      border-radius: 0;
+    }
+  }
+  ::v-deep .el-step__main {
+    .is-finish {
+      color: #333333;
+    }
+  }
+  ::v-deep .el-step__title.is-process {
+    font-size: 14px;
+    color: #999999;
+    font-weight: 500;
+  }
+  ::v-deep .el-step__title.is-wait {
+    font-size: 14px;
+    color: #676870;
+    font-weight: 500;
+  }
+  ::v-deep .el-step__main {
+    .el-step__title {
+      font-size: 14px;
+    }
+    .is-success {
+      color: #FFEBC4;
+    }
+  }
+  .mFormBox {
+    padding: 0 5%;
+    margin-top: 41px;
+    .formTit {
+      span {
+        font-size: 17px;
+        font-weight: bold;
+        color: #444444;
+        line-height: 18px;
+        position: relative;
+        i {
+          background: linear-gradient(267deg, #FF8F25 0%, rgba(254, 179, 24, 0.48) 52%, rgba(255, 255, 255, 0) 100%);
+          opacity: 0.7;
+          display: block;
+          height: 11px;
+          width: 100%;
+          bottom: -2px;
+          position: absolute;
+        }
+      }
+    }
+    .form {
+      margin-top: 25px;
+      .inputItem {
+        margin-top: 20px;
+        .labelTit {
+          display: flex;
+          label {
+            color: #333333;
+            font-weight: 500;
+            font-size: 14px;
+            i {
+              color: #FFEBC4;
+              font-size: 15px;
+              margin-right: 5px;
+            }
+          }
+        }
+        .input {
+          width: 100%;
+          margin: 10px 0px;
+          border-bottom: 1px solid #F6F4F7;
+          height: 40px;
+          border-radius: 50px;
+          line-height: 40px;
+          font-size: 16px;
+          color: #666666;
+          padding-left: 10px;
+          display: flex;
+          align-items: center;
+        }
+        input {
+          width: 100%;
+          border-bottom: 1px solid #F6F4F7;
+          height: 50px;
+          line-height: 50px;
+          font-size: 13px;
+          color: #666666;
+          padding-left: 10px;
+        }
+        input::placeholder {
+          color: #999999;
+        }
+      }
+      .arrow {
+        position: relative;
+        span {
+          position: absolute;
+          right: 5px;
+          top: 30px;
+          color: #999999;
+        }
+      }
+      .arrowTime {
+        position: relative;
+        span {
+          position: absolute;
+          right: 5px;
+          top: 20px;
+          color: #999999;
+        }
+      }
+      .describe {
+        color: #BBBBBB;
+        font-size: 12px;
+        margin-top: 10px;
+        line-height: 20px;
+      }
+    }
+  }
+  .nextBtn {
+    display: block;
+    margin: 30px auto 0 auto;
+    width: 315px;
+    height: 42px;
+    background: #333333;
+    color: #FFEBC4;
+  }
+  .businessLicense {
+    width: 100%;
+    background: #F3F4F5;
+    margin-top: 10px;
+    display: flex;
+    .van-uploader {
+      margin: 10px auto;
+    }
+    ::v-deep .van-uploader__preview-image {
+      width: 162px;
+      height: 135px;
+    }
+    .updateLicense {
+      width: 162px;
+      height: 135px;
+      .updateTop {
+        display: flex;
+        justify-content: center;
+        height: 110px;
+        align-items: center;
+        img {
+          width: 169px;
+          height: 100px;
+        }
+      }
+      .updateBottom {
+        width: 162px;
+        height: 25px;
+        font-size: 13px;
+        line-height: 25px;
+        color: #999999;
+        text-align: center;
+      }
+    }
+  }
+}
+.preview-cover {
+  position: absolute;
+  bottom: 0;
+  box-sizing: border-box;
+  width: 100%;
+  padding: 4px;
+  color: #fff;
+  font-size: 12px;
+  text-align: center;
+  background: rgba(0, 0, 0, 0.3);
+}
+
+.centBox {
+  > .el-step {
+    .el-step:nth-child(1) {
+      .el-step__icon-inner {
+      }
+    }
+  }
+}
+</style>

src/views/moblie/mStatus.vue

@@ -16,51 +16,56 @@
 export default {
   name: 'mStatus',
   methods: {
-    goToHome () {
-      this.$router.push({name: 'home'})
+    goToHome() {
+      // this.$router.push({name: 'home'})
+      window.location.href = 'https://www.tuanfengkeji.cn/TFShop_Uni_H5/#/'
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-  .mStatus {
-    display: flex;
-    height: 100%;
-    align-items: center;
-    justify-content: center;
-    .statusCent {
-      .status {
-        text-align: center;
-        img {
-          width: 140px;
-          height: 140px;
-        }
-        h3 {
-          font-size: 18px;
-          color: #333333;
-          margin: 20px 0;
-        }
-        p {
-          width: 80%;
-          margin: 0 auto;
-          color: #999999;
-          font-size: 12px;
-          line-height: 25px;
-        }
+.mStatus {
+  display: flex;
+  height: 100%;
+  align-items: center;
+  justify-content: center;
+
+  .statusCent {
+    .status {
+      text-align: center;
+
+      img {
+        width: 140px;
+        height: 140px;
       }
-      .btnBack {
-        width: 80px;
-        height: 35px;
-        line-height: 35px;
-        background: #FFEBC4;
-        color: #FFFFFF;
-        font-size: 14px;
-        text-align: center;
-        cursor: pointer;
-        margin: 30px auto 0 auto;
-        border-radius: 4px;
+
+      h3 {
+        font-size: 18px;
+        color: #333333;
+        margin: 20px 0;
       }
+
+      p {
+        width: 80%;
+        margin: 0 auto;
+        color: #999999;
+        font-size: 12px;
+        line-height: 25px;
+      }
+    }
+
+    .btnBack {
+      width: 80px;
+      height: 35px;
+      line-height: 35px;
+      background: #FFEBC4;
+      color: #FFFFFF;
+      font-size: 14px;
+      text-align: center;
+      cursor: pointer;
+      margin: 30px auto 0 auto;
+      border-radius: 4px;
     }
   }
-</style>
+}</style>

src/views/moblie/mSubsidiaryCompany.vue

@@ -0,0 +1,622 @@
+<template>
+  <div class="mUinitBusiness">
+    <div class="header">
+      <img class="comeback" src="@/assets/images/fanhui.png" alt="" @click="goHome" >
+      <span>分公司入驻</span>
+    </div>
+    <div class="topTitle">
+      <h3>分公司入驻</h3>
+      <p>请认真填写申请信息，以便我们为您提供更好的服务！</p>
+    </div>
+    <div class="centBox">
+      <!-- <el-steps :active="active" align-center>
+        <el-step @click.native="changeActive(index = 1)" title="个人信息"></el-step>
+        <el-step @click.native="changeActive(index = 2)" title="详细信息"></el-step>
+      </el-steps> -->
+       <div class="mFormBox">
+        <div class="shopInfo" v-show="active === 1">
+          <div class="form">
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>账户名/手机号码</label></div>
+              <input type="text" v-model="plannerForm.username" placeholder="请输入账号或电话号码">
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>昵称/姓名</label></div>
+              <input type="text" v-model="plannerForm.name" placeholder="请输入昵称">
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>手机号</label></div>
+              <input type="text" v-model="plannerForm.phone" placeholder="请输入手机号">
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>邮箱</label></div>
+              <input type="text" v-model="plannerForm.email" placeholder="请输入邮箱">
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>性别</label></div>
+              <!-- <input type="text" v-model="plannerForm.email" placeholder="请选择性别"> -->
+              <div class="input">
+                <van-radio-group v-model="plannerForm.sex" direction="horizontal">
+                <van-radio name="男">男</van-radio>
+                <van-radio name="女">女</van-radio>
+              </van-radio-group>
+              </div>
+            </div>
+            <div class="inputItem arrow" style="margin-top: 20px;">
+              <div class="labelTit"><label><i>*</i>请选择地址</label></div>
+              <div class="input" style="background-color: #a4a4a41f;" @click="show = true">
+                {{ fieldValue || '请选择地区' }}
+              </div>
+              <!-- <input @click="show = true" v-model="fieldValue" type="text" placeholder="请选择所在地区"> -->
+              <!-- <van-field
+                v-model="fieldValue"
+                is-link
+                readonly
+                label="请选择地址"
+                placeholder="请选择所在地区"
+                @click="show = true"
+              /> -->
+              <van-popup v-model="show" round position="bottom">
+                <!-- v-if="isRequestAddres" sb玩意不动态刷新，现在换了给方法，强行重新赋值，不完全完美的解决问题 -->
+                <van-cascader
+                  v-model="plannerForm.region"
+                  title="请选择所在地区"
+                  :options="options"
+                  @close="show = false"
+                  @change="onAddresChange"
+                  :field-names="{ text: 'name', value: 'id', children: 'children' }"
+                />
+              </van-popup>
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>详细地址</label></div>
+              <input type="text" v-model="plannerForm.addres" placeholder="请输入详细地址">
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>入驻套餐</label></div>
+              <div class="input" style="background-color: #a4a4a41f;" @click="showSetMeal = true">
+                {{ setMealValue || '请选择你的套餐'}}
+              </div>
+              <van-popup v-model="showSetMeal" round position="bottom" :style="{ height: '50%' }">
+                 <van-picker
+                    title="请选择你的套餐"
+                    show-toolbar
+                    :columns="setMealData"
+                    value-key="title"
+                    @confirm="onSetMealfirm"
+                    @cancel="showSetMeal = false"
+                    @change="onSetMealChange"
+                    visible-item-count="7"
+                  />
+              </van-popup>
+            </div>
+          </div>
+        </div>
+        <!-- <div class="subjectInfo" v-show="active === 2">
+          <div class="form">
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>生效日期</label></div>
+              <div class="input" style="background-color: #a4a4a41f;" @click="showDate = true">
+                {{ dateValue || '请选择生效日期' }}
+              </div>
+              <van-calendar :min-date="minDate" :max-date="maxDate" v-model="showDate" type="range" @confirm="getDataArray" />
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>合同是否有效</label></div>
+              <div class="input">
+                <van-radio-group v-model="plannerForm.contractState" direction="horizontal">
+                <van-radio name="1">是</van-radio>
+                <van-radio name="0">否</van-radio>
+              </van-radio-group>
+              </div>
+            </div>
+          </div>
+        </div> -->
+       </div>
+       <!-- <button class="nextBtn" @click="active = 2" v-show="active < 2">下一步</button>
+       <button class="nextBtn" @click="active = 1" v-show="active >= 2">上一步</button> -->
+       <button class="nextBtn" @click="submitForm">提交</button>
+    </div>
+  </div>
+</template>
+
+<script>
+import api from '@/api'
+import { listSearchMixin } from '@/config/mixin'
+// eslint-disable-next-line no-unused-vars
+import { formatDate, unemptyArray } from '@/util/ArrayFunction'
+// eslint-disable-next-line no-unused-vars
+import { Field, Popup, DatetimePicker, Toast, Picker, RadioGroup, Radio, Cascader, Calendar } from 'vant'
+export default {
+  mixins: [listSearchMixin],
+  components: {
+    [Field.name]: Field,
+    [Popup.name]: Popup,
+    [DatetimePicker.name]: DatetimePicker,
+    [Toast.name]: Toast,
+    [Picker.name]: Picker,
+    [RadioGroup.name]: RadioGroup,
+    [Radio.name]: Radio,
+    [Cascader.name]: Cascader,
+    [Calendar.name]: Calendar
+  },
+  data () {
+    return {
+      active: 1,
+      show: false, // 控制地区选择
+      // isRequestAddres: true, // 原本是用来动态刷新地址选择栏的，但是有闪屏问题，遗弃掉
+      showDate: false, // 控制时间选择
+      showSetMeal: false, // 控制套餐选择
+      showSubCompany: false, // 控制公司选择
+      minDate: new Date(1991, 0, 1), // 控制时间区间选择的最小年份
+      maxDate: new Date(2099, 0, 31), // 控制时间区间选择的最大年份
+      fieldValue: '',
+      dateValue: '',
+      companyValue: '',
+      setMealValue: '',
+      options: [],
+      plannerColumns: [],
+      setMealData: [],
+      queryData: {
+        page: 1,
+        size: 10
+      },
+      plannerForm: {
+          username: '', // 账号
+          name: '', // 姓名
+          phone: '', // 电话号码
+          email: '', // 邮箱
+          sex: '男', // 性别
+          region: '', // 区域编码
+          addres: '', //
+          packageId: '',
+          // startTime: '',
+          // endTime: '',
+          effectiveDate: '', // 生效日期  即时生效-设置当前时间 有值-指定日期生效
+          effectiveYear: '', // 生效时限（年）
+          contractState: '', // 合同状态 1-有效 0-无效
+          type: '1', // 类型： 1为分公司 2为策划师
+          parentId: '' // 父级ID 如果为分公司则为null
+        }
+    }
+  },
+  created () {
+    this.sendReq({
+        url: api.getTreeClass,
+        method: 'GET',
+        params: {}
+      }, (res) => {
+        // console.log(res) // 获取地址选择器数据并去除空的子项
+        this.options = res.data
+        // console.log(this.options)
+      })
+      this.sendReq({
+        url: api.getAdditional, // 套餐购买类型：1-商家，2-策划师 3-分公司
+        method: 'GET',
+        params: {
+          type: 3
+        }
+      }, (res) => {
+        // console.log(res) // 获取地址选择器数据并去除空的子项
+        this.setMealData = res.data
+        // console.log(this.options)
+      })
+  },
+  methods: {
+    submitForm () {
+      let phoneReg = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/
+      let emailReg = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
+      if (this.plannerForm.phone === '' || !phoneReg.test(this.plannerForm.phone)) {
+        Toast.fail('请输入正确的电话号码')
+        return false
+      }
+      if (this.plannerForm.email === '' || !emailReg.test(this.plannerForm.email)) {
+        Toast.fail('请输入正确的邮箱')
+        return false
+      }
+      if (this.plannerForm.username === '') {
+        Toast.fail('请输入用户名')
+        return false
+      }
+      if (this.plannerForm.name === '') {
+        Toast.fail('请输入姓名')
+        return false
+      }
+      if (this.plannerForm.region === '' || this.plannerForm.addres === '') {
+        Toast.fail('请选择地区，并填好详细地址')
+        return false
+      }
+      // if (this.plannerForm.effectiveDate === '' || this.plannerForm.effectiveYear === '') {
+      //   Toast.fail('请选择生效时间')
+      //   return false
+      // }
+      // if (this.plannerForm.contractState === '') {
+      //   Toast.fail('请确认合同是否有效')
+      //   return false
+      // }
+      this.sendReq({
+        url: api.subsidiaryCompanyCheck,
+        method: 'POST',
+        data: this.plannerForm
+        }, (res) => {
+          console.log(res)
+          if (res.code === '200') {
+            Toast.success('提交成功')
+            this.$router.push({path: '/mStatus'})
+          } else {
+            Toast.fail(res.message)
+          }
+      })
+    },
+    getDataArray (dateArray = []) { // 获取选择的时间区间
+      const [start, end] = dateArray
+      // 先拿到有多少年的生效时间
+      let arr = dateArray.map(item => {
+        return formatDate(item).split('-')[0]
+      })
+      this.plannerForm.effectiveYear = arr[1] - arr[0]
+
+      this.dateValue = `${formatDate(start)} - ${formatDate(end)}` + `             有效期${this.plannerForm.effectiveYear}年`
+      this.plannerForm.effectiveDate = `${formatDate(start)} - ${formatDate(end)}`
+      // console.log(this.dateValue)
+      this.showDate = false
+    },
+    changeActive (index) { // 切换表单栏
+      this.active = index
+    },
+    onAddresChange ({value, selectedOptions, tabIndex}) { // 选择完地址后转为显示的字符串
+    let cacheArray = []
+      // console.log(value, selectedOptions, tabIndex)
+      // this.isRequestAddres = false
+      let addresString = ''
+      // eslint-disable-next-line no-unused-vars
+      let level = ''
+      this.sendReq({
+        url: api.getTreeOne,
+        method: 'GET',
+        params: {
+          parentId: value
+        }
+        }, (res) => {
+          if (res.data && res.data.length > 0) {
+              selectedOptions[selectedOptions.length - 1].children = res.data
+              cacheArray = this.options.map(item => { // 这里重新再赋值一遍是因为这里直接改变数组页面不会动态刷新，所以每次都重新给options赋值，强制刷新
+                return item
+              })
+              this.options = cacheArray
+            }
+          // this.isRequestAddres = true
+        })
+      for (let i = 0; i < selectedOptions.length; i++) {
+        if (i >= selectedOptions.length - 1) {
+          addresString += selectedOptions[i].name
+          level = selectedOptions[i].level // 获取最后选择的地址的层级
+        } else {
+          addresString += selectedOptions[i].name + ' / '
+        }
+      }
+      this.fieldValue = addresString
+      // this.sendReq({ // 获取可选择的分公司
+      //   url: api.selectAnd,
+      //   method: 'POST',
+      //   data: {
+      //     area: value, // 地区编号
+      //     type: 1,
+      //     level, // "区级别不能为空"
+      //     page: this.queryData.page,
+      //     pageSize: this.queryData.size
+      //   }
+      //   }, (res) => {
+      //     this.plannerColumns = res.data.list
+      //     console.log(res)
+      //   })
+    },
+    onPlannerConfirm (value) { // 确认选择的公司
+      this.companyValue = value.name
+      this.plannerForm.parentId = value.platformUserId
+      this.showSubCompany = false
+    },
+    goHome () {
+      this.$router.replace({
+        path: '/'
+      })
+    },
+    onSetMealChange (value) {
+      // console.log(value)
+    },
+    onSetMealfirm (value) {
+      // console.log(value)
+      this.setMealValue = value.title
+      this.plannerForm.packageId = value.id
+      this.showSetMeal = false
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.plannerItem {
+  display: flex;
+  align-items: center;
+  .avatar {
+    margin-top: -3px;
+    width: 30px;
+    height: 30px;
+  }
+  .custom-title {
+    margin-top: -5px;
+    margin-left: 20px;
+  }
+}
+.header {
+  z-index: 1000;
+  width: 100%;
+  height: 50px;
+  background-color: #333;
+  color: #fff;
+  font-weight: 600;
+  text-align: center;
+  line-height: 50px;
+  position: fixed;
+  top: 0;
+  left: 0;
+  display: flex;
+  align-items: center;
+  .comeback {
+    margin-left: 10px;
+    width: 30px;
+    height: 30px;
+  }
+  > span {
+    position: absolute;
+    left: 50%;
+    transform: translateX(-50%);
+    // margin-left: 90px;
+  }
+}
+/* 此处使用样式穿透更改vant组件的样式 但是不起作用， 因素很多 包的版本 vant的less样式 问题很多，期待下一位挑战者 */
+.subjectInfo {
+ /deep/ .van-calendar__day--start {
+  background-color: #080707 !important;
+}
+/deep/ .van-calendar__day--end {
+  background-color: #080707 !important;
+}
+/deep/ .van-calendar__day--middle::after {
+  background-color: #3f3f3f86 !important;
+}
+/deep/ .van-calendar__day--middle {
+  color: #080707;
+}
+/deep/ .van-button--danger {
+  background-color: #080707;
+  border: 1px solid #080707;
+}
+}
+
+.mUinitBusiness {
+  padding-top: 30px;
+  padding-bottom: 60px;
+  .topTitle {
+    padding: 0 5%;
+    h3 {
+      /* background-color: #a4a4a41f; */
+      font-size: 21px;
+      color: #333333;
+      margin-bottom: 22px;
+    }
+    p {
+      font-size: 12px;
+      color: #676870;
+    }
+    margin:50px 0 28px 0;
+  }
+  ::v-deep .el-step__head {
+    color: #E9EAEB;
+    .el-step__icon {
+      background: #FFFFFF;
+      width: 50px;
+      height: 50px;
+      border-radius: 0;
+      border: 1px solid #F3F4F5;
+    }
+  }
+  ::v-deep .el-step__head.is-process {
+    border-color: #CDCDCD
+  }
+  ::v-deep .el-step__line {
+    background-color: #F3F4F5;
+    height: 1px !important;
+    top: 50% !important;
+    overflow: hidden;
+  }
+  ::v-deep .is-finish {
+    border-color: #C5AA7B;
+    color: #FFFFFF;
+    font-weight: 500 !important;
+    .el-step__icon {
+      background: #FFFFFF;
+      height: 50px;
+      width: 50px;
+      color: #C5AA7B;
+      border: 1px solid #C5AA7B;
+      border-radius: 0;
+    }
+  }
+  ::v-deep .el-step__main {
+    .is-finish {
+      color: #333333;
+    }
+  }
+  ::v-deep .el-step__title.is-process {
+    font-size: 14px;
+    color: #999999;
+    font-weight: 500;
+  }
+  ::v-deep .el-step__title.is-wait {
+    font-size: 14px;
+    color: #676870;
+    font-weight: 500;
+  }
+  ::v-deep .el-step__main {
+    .el-step__title {
+      font-size: 14px;
+    }
+    .is-success {
+      color: #FFEBC4;
+    }
+  }
+  .mFormBox {
+    padding: 0 5%;
+    margin-top: 41px;
+    .formTit {
+      span {
+        font-size: 17px;
+        font-weight: bold;
+        color: #444444;
+        line-height: 18px;
+        position: relative;
+        i {
+          background: linear-gradient(267deg, #FF8F25 0%, rgba(254, 179, 24, 0.48) 52%, rgba(255, 255, 255, 0) 100%);
+          opacity: 0.7;
+          display: block;
+          height: 11px;
+          width: 100%;
+          bottom: -2px;
+          position: absolute;
+        }
+      }
+    }
+    .form {
+      margin-top: 25px;
+      .inputItem {
+        margin-top: 20px;
+        .labelTit {
+          display: flex;
+          label {
+            color: #333333;
+            font-weight: 500;
+            font-size: 14px;
+            i {
+              color: #FFEBC4;
+              font-size: 15px;
+              margin-right: 5px;
+            }
+          }
+        }
+        .input {
+          width: 100%;
+          margin: 10px 0px;
+          border-bottom: 1px solid #F6F4F7;
+          height: 30px;
+          line-height: 30px;
+          font-size: 13px;
+          color: #666666;
+          padding-left: 10px;
+          display: flex;
+          align-items: center;
+        }
+        input {
+          width: 100%;
+          border-bottom: 1px solid #F6F4F7;
+          height: 50px;
+          line-height: 50px;
+          font-size: 13px;
+          color: #666666;
+          padding-left: 10px;
+        }
+        input::placeholder {
+          color: #999999;
+        }
+      }
+      .arrow {
+        position: relative;
+        span {
+          position: absolute;
+          right: 5px;
+          top: 30px;
+          color: #999999;
+        }
+      }
+      .arrowTime {
+        position: relative;
+        span {
+          position: absolute;
+          right: 5px;
+          top: 20px;
+          color: #999999;
+        }
+      }
+      .describe {
+        color: #BBBBBB;
+        font-size: 12px;
+        margin-top: 10px;
+        line-height: 20px;
+      }
+    }
+  }
+  .nextBtn {
+    display: block;
+    margin: 30px auto 0 auto;
+    width: 315px;
+    height: 42px;
+    background: #333333;
+    color: #FFEBC4;
+  }
+  .businessLicense {
+    width: 100%;
+    background: #F3F4F5;
+    margin-top: 10px;
+    display: flex;
+    .van-uploader {
+      margin: 10px auto;
+    }
+    ::v-deep .van-uploader__preview-image {
+      width: 162px;
+      height: 135px;
+    }
+    .updateLicense {
+      width: 162px;
+      height: 135px;
+      .updateTop {
+        display: flex;
+        justify-content: center;
+        height: 110px;
+        align-items: center;
+        img {
+          width: 169px;
+          height: 100px;
+        }
+      }
+      .updateBottom {
+        width: 162px;
+        height: 25px;
+        font-size: 13px;
+        line-height: 25px;
+        color: #999999;
+        text-align: center;
+      }
+    }
+  }
+}
+.preview-cover {
+  position: absolute;
+  bottom: 0;
+  box-sizing: border-box;
+  width: 100%;
+  padding: 4px;
+  color: #fff;
+  font-size: 12px;
+  text-align: center;
+  background: rgba(0, 0, 0, 0.3);
+}
+
+.centBox {
+  > .el-step {
+    .el-step:nth-child(1) {
+      .el-step__icon-inner {
+      }
+    }
+  }
+}
+</style>

src/views/moblie/mUinitBusiness.vue

@@ -1,231 +1,352 @@
 <template>
- <div class="mUinitBusiness">
+  <div class="mUinitBusiness">
     <div class="topTitle">
       <h3>个体工商户入驻</h3>
       <p>请认真填写申请信息，以便我们为您提供更好的服务！</p>
     </div>
-   <div class="centBox">
-     <el-steps :active="active" align-center>
-       <el-step @click.native="changeActive(index = 1)" title="店铺信息"></el-step>
-       <el-step @click.native="changeActive(index = 2)" title="主体信息"></el-step>
-       <el-step @click.native="changeActive(index = 3)" title="经营者信息"></el-step>
-     </el-steps>
-     <div class="mFormBox">
-       <div class="shopInfo" v-show="active === 1">
-         <div class="form">
-           <div class="inputItem">
-             <div class="labelTit"><label><i>*</i>店铺名称：</label></div>
-             <input type="text" v-model="personalForm.shopName" placeholder="请输入店铺名称">
-           </div>
-           <div class="inputItem">
-             <div class="labelTit"><label><i>*</i>客服电话：</label></div>
-             <input type="text" v-model="personalForm.servicePhone" placeholder="请输入客服电话">
-           </div>
-           <div class="inputItem">
-             <div class="labelTit"><label><i>*</i>店铺负责人：</label></div>
-             <input type="text" v-model="personalForm.chargePersonName" placeholder="请输入店铺负责人">
-           </div>
-           <div class="inputItem">
-             <div class="labelTit"><label><i>*</i>负责人电话：</label></div>
-             <input type="text" v-model="personalForm.chargePersonPhone" placeholder="请输入负责人电话">
-           </div>
-           <div class="inputItem arrow">
+    <div class="centBox">
+      <el-steps :active="active" align-center>
+        <el-step @click.native="changeActive(index = 1)" title="店铺信息"></el-step>
+        <el-step @click.native="changeActive(index = 2)" title="主体信息"></el-step>
+        <!-- <el-step @click.native="changeActive(index = 3)" title="经营者信息"></el-step> -->
+      </el-steps>
+      <div class="mFormBox">
+        <div class="shopInfo" v-show="active === 1">
+          <div class="form">
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>店铺名称：</label></div>
+              <input type="text" v-model="personalForm.shopName" placeholder="请输入店铺名称">
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>客服电话：</label></div>
+              <input type="text" v-model="personalForm.servicePhone" placeholder="请输入客服电话">
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>店铺负责人：</label></div>
+              <input type="text" v-model="personalForm.chargePersonName" placeholder="请输入店铺负责人">
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>负责人电话：</label></div>
+              <input type="text" v-model="personalForm.chargePersonPhone" placeholder="请输入负责人电话">
+            </div>
+
+            <div class="inputItem">
+              <div class="labelTit"><label>邀请码：</label></div>
+              <input type="text" v-model="personalForm.invitationCode" placeholder="请输入邀请码">
+            </div>
+            <!-- <div class="inputItem arrow">
              <div class="labelTit"><label><i>*</i>店铺地址：</label></div>
              <input @click="showPopup" @focus="noBomBox" v-model="shopAdress" type="text" placeholder="请选择所在地区">
              <span class="iconfont">&#xe6ab;</span>
              <input type="text" v-model="personalForm.storeAddressDetail" placeholder="请输入详细地址">
-           </div>
-         </div>
-       </div>
-       <div class="subjectInfo" v-show="active === 2">
-         <div class="form">
-           <div class="inputItem">
-             <div class="labelTit"><label><i>*</i>商户名称：</label></div>
-             <input type="text" v-model="personalForm.subjectName" placeholder="请输入商户名称">
-           </div>
-           <p class="describe">需与当地政府颁发的商业许可证书或企业注册证上的企业名称完全一致，信息审核审核
-             成功后，企业名称不可修改</p>
-           <div class="inputItem">
-             <div class="labelTit"><label><i>*</i>社会信用代码：</label></div>
-             <input type="text" v-model="personalForm.subjectCode" placeholder="请输入社会信用代码">
-           </div>
-           <div class="inputItem arrow">
-             <div class="labelTit"><label><i>*</i>注册地址：</label></div>
-             <input @click="showRegionPopup" @focus="noBomBox" v-model="personalForm.subjectRegion" type="text" placeholder="请选择注册地址">
-             <span class="iconfont">&#xe6ab;</span>
-             <input type="text" v-model="personalForm.subjectAdress" placeholder="请输入详细地址">
-           </div>
-           <div class="inputItem arrow">
-             <div class="labelTit"><label><i>*</i>营业期限：</label></div>
-             <input type="text" @focus="noBomBox" v-model="personalForm.subjectStartTime" placeholder="请选择营业开始时间" @click="selectStartDateBtn">
-             <span class="iconfont">&#xe6ab;</span>
-           </div>
-           <div class="inputItem arrowTime">
-             <input @focus="noBomBox" v-model="personalForm.subjectEndTime" type="text" placeholder="请选择营业截止时间" @click="selectEndDateBtn">
-             <span class="iconfont">&#xe6ab;</span>
-           </div>
-           <p class="describe">
-             请填写营业执照上的营业期限 注意参照示例中的格式 结束时间需大于开始时间 有效期
-             必须大于60天
-           </p>
-           <div class="inputItem">
-             <div class="labelTit"><label><i>*</i>营业执照：</label></div>
-             <div class="businessLicense">
-               <van-uploader v-model="fileList" :max-count="1" :after-read="(file)=>{return afterRead(file, type = 'license')}" @oversize="onOversize">
-<!--               <van-uploader v-model="fileList" :max-count="1" :after-read="afterRead" @oversize="onOversize">-->
-                 <div icon="plus" type="primary">
-                   <div class="updateLicense">
-                     <div class="updateTop">
-                       <img src="../../assets/images/yingyezhiz@2x.png" alt="">
-                     </div>
-                     <div class="updateBottom">添加营业执照</div>
-                   </div>
-                 </div>
-                 <template #preview-cover="{ file }">
-                   <div class="preview-cover van-ellipsis">营业执照</div>
-                 </template>
-               </van-uploader>
-             </div>
-           </div>
-           <p class="describe">
-             仅支持在有效期内的中国大陆工商局或市场监督管理局颁发的工商营业执照。格式要求：
-             原证照片、扫描件或者 复印件加盖企业公章后的扫描
-           </p>
-         </div>
-       </div>
-       <div class="subjectInfo" v-show="active === 3">
-         <div class="form">
-           <div class="inputItem">
-             <div class="labelTit"><label><i>*</i>经营者姓名：</label></div>
-             <input v-model="personalForm.subjectOperator" type="text" placeholder="请输入经营者姓名">
-           </div>
-           <div class="inputItem arrow">
-             <div class="labelTit"><label><i>*</i>证件类型：</label></div>
-             <input v-model="idType" @focus="noBomBox" type="text" placeholder="请选择证件类型" @click="idTypeShowFn">
-             <span class="iconfont">&#xe6ab;</span>
-           </div>
-           <div class="inputItem">
-             <div class="labelTit"><label><i>*</i>身份证号码：</label></div>
-             <input v-model="personalForm.subjectIdCard" type="text" placeholder="请输入居民身份证号">
-           </div>
-           <div class="inputItem arrow">
-             <div class="labelTit"><label><i>*</i>身份证有效期：</label></div>
-             <input v-model="personalForm.subjectCardStartTime" @focus="noBomBox" type="text" placeholder="请选择身份证开始时间" @click="selectIdStartDateBtn">
-             <span class="iconfont">&#xe6ab;</span>
-           </div>
-           <div class="inputItem arrowTime">
-             <input v-model="personalForm.subjectCardEndTime" @focus="noBomBox" type="text" placeholder="请选择身份证有效期结束时间" @click="selectIdEndDateBtn">
-             <span class="iconfont">&#xe6ab;</span>
-           </div>
-           <div class="inputItem">
-             <div class="labelTit"><label><i>*</i>证件照片：</label></div>
-             <div class="businessLicense">
-               <van-uploader v-model="positive" :max-count="1" :after-read="(file)=>{return afterRead(file, type = 'positive')}" @oversize="onOversize">
-                 <div icon="plus" type="primary">
-                   <div class="updateLicense">
-                     <div class="updateTop">
-                       <img src="../../assets/images/shouchishenfenz@2x.png" alt="">
-                     </div>
-                     <div class="updateBottom">身份证人像面</div>
-                   </div>
-                 </div>
-                 <template #preview-cover="{ file }">
-                   <div class="preview-cover van-ellipsis">身份证人像面</div>
-                 </template>
-               </van-uploader>
-             </div>
-             <div class="businessLicense">
-               <van-uploader v-model="backIdImg" :max-count="1" :after-read="(file)=>{return afterRead(file, type = 'back')}" @oversize="onOversize">
-                 <div icon="plus" type="primary">
-                   <div class="updateLicense">
-                     <div class="updateTop">
-                       <img src="../../assets/images/shenfenzb@2x.png" alt="">
-                     </div>
-                     <div class="updateBottom">身份证国徽面</div>
-                   </div>
-                 </div>
-                 <template #preview-cover="{ file }">
-                   <div class="preview-cover van-ellipsis">身份证国徽面</div>
-                 </template>
-               </van-uploader>
-             </div>
-           </div>
-         </div>
-       </div>
-     </div>
-     <button class="nextBtn" @click="next" v-show="active < 3">下一步</button>
-     <button class="nextBtn" @click="submitForm" v-show="active > 2">提交</button>
-   </div>
-   <van-popup v-model="show" round position="bottom" :style="{ height: '40%' }">
-     <van-area title="请选择地区" :area-list="areaList" @confirm="selectArea" @cancel="closeSelect"/>
-   </van-popup>
-   <van-popup v-model="regionShow" round position="bottom" :style="{ height: '40%' }">
-     <van-area title="请选择地区" :area-list="areaRegionList" @confirm="selectRegionArea" @cancel="closeRegionSelect"/>
-   </van-popup>
-   <van-popup v-model="startDateShow" round position="bottom" :style="{ height: '40%' }">
-     <van-datetime-picker
-       v-model="startDate"
-       type="date"
-       title="请选择营业执照开始时间"
-       :min-date="minDate"
-       :max-date="maxDate"
-       :formatter="formatter"
-       @confirm="selectStartTime"
-       @cancel="closeStartTime"
-     />
-   </van-popup>
-   <van-popup v-model="endDateShow" round position="bottom" :style="{ height: '40%' }">
-     <van-datetime-picker
-       v-model="endDate"
-       type="date"
-       title="请选择营业执照到期时间"
-       :min-date="minDate"
-       :max-date="maxDate"
-       :formatter="formatter"
-       @confirm="selectEndTime"
-       @cancel="closeEndTime"
-     />
-   </van-popup>
-   <van-popup v-model="idCardStartShow" round position="bottom" :style="{ height: '40%' }">
-     <van-datetime-picker
-       v-model="idCardStartDate"
-       type="date"
-       title="请选择身份证开始时间"
-       :min-date="minDate"
-       :max-date="maxDate"
-       :formatter="formatter"
-       @confirm="selectIdCardStartTime"
-       @cancel="closeIdCardStartTime"
-     />
-   </van-popup>
-   <van-popup v-model="idCardEndShow" round position="bottom" :style="{ height: '40%' }">
-     <van-datetime-picker
-       v-model="idCardEndDate"
-       type="date"
-       title="请选择身份证到期时间"
-       :min-date="minDate"
-       :max-date="maxDate"
-       :formatter="formatter"
-       @confirm="selectIdCardEndTime"
-       @cancel="closeIdCardEndTime"
-     />
-   </van-popup>
-   <van-popup v-model="idTypeShow" round position="bottom" :style="{ height: '40%' }">
-     <van-picker
-       title="请选择证件类型"
-       show-toolbar
-       :columns="columns"
-       @confirm="onConfirm"
-       @cancel="onCancel"
-     />
-   </van-popup>
- </div>
+           </div> -->
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>是否支持使用代金券</label></div>
+              <!-- <input type="text" v-model="plannerForm.email" placeholder="请选择性别"> -->
+              <div class="input">
+                <van-radio-group v-model="personalForm.isVoucher" direction="horizontal">
+                  <van-radio :name="1">支持</van-radio>
+                  <van-radio :name="0">不支持</van-radio>
+                </van-radio-group>
+              </div>
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>店铺类型</label></div>
+              <!-- <input type="text" v-model="plannerForm.email" placeholder="请选择性别"> -->
+              <div class="input">
+                <van-radio-group v-model="personalForm.shopType" direction="horizontal">
+                  <van-radio name="1">商城</van-radio>
+                  <van-radio name="2">本地</van-radio>
+                </van-radio-group>
+              </div>
+            </div>
+            <div class="time-select-container" v-show="personalForm.shopType === '2'">
+              <div class="inputItem">
+                <div class="labelTit"><label><i>*</i>营业开始时间</label></div>
+                <input @focus="noBomBox" type="text" v-model="personalForm.startTime" placeholder="请选择营业开始时间"
+                  @click="startTimeShow = true">
+              </div>
+
+              <div class="inputItem">
+                <div class="labelTit"><label><i>*</i>营业结束时间</label></div>
+                <input @focus="noBomBox" type="text" v-model="personalForm.endtime" placeholder="请选择营业开始时间"
+                  @click="endTimeShow = true">
+              </div>
+            </div>
+
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>店铺分类</label></div>
+              <input @focus="noBomBox" type="text" placeholder="请选择店铺所属分类" v-model="selectShopCategoryStr"
+                @click="show2 = true">
+              <van-popup v-model="show2" round position="bottom">
+
+                <div v-show="isQueryShopCategory" class="loading-container"><van-loading color="#ee0a24" type="spinner" />
+                </div>
+                <van-cascader v-model="personalForm.classificationId" title="请选择店铺所属分类" :field-names="categoryFieldName"
+                  :options="shopCategoryOptions" @close="show2 = false"
+                  @change="onShopCategoryChange($event, onFinishChooseShopCategory)" />
+              </van-popup>
+            </div>
+            <div class="inputItem arrow" style="margin-top: 20px;">
+              <div class="labelTit"><label><i>*</i>请选择地址</label></div>
+              <div class="input" style="background-color: #a4a4a41f; overflow: hidden; white-space: nowrap; "
+                @click="show1 = true">
+                {{ fieldValue || '请选择地区' }}
+              </div>
+              <!-- <span class="iconfont">&#xe6ab;</span> -->
+              <input type="text" v-model="personalForm.storeAddressDetail" placeholder="请输入详细地址">
+              <van-popup :close-on-click-overlay="false" v-model="show1" round position="bottom"
+                @close="handleClosePopup('areaId')">
+                <!-- v-if="isRequestAddres" sb玩意不动态刷新，现在换了给方法，强行重新赋值，不完全完美的解决问题 -->
+                <van-cascader v-model="personalForm.areaId" title="请选择所在地区" :options="options" @close="show1 = false"
+                  @change="onAddresChange" :field-names="{ text: 'name', value: 'id', children: 'children' }" />
+              </van-popup>
+            </div>
+            <!--  代金券返还比例 人均消费 广告图 砍掉 -->
+            <!-- <div class="inputItem arrow" style="margin-top: 20px;">
+              <div class="labelTit"><label><i>*</i>代金券返还比例</label></div>
+              <div class="voucher-wrapper">
+                <input type="number" v-model.number="personalForm.voucherReturn" placeholder="请输入代金券返还比例，0 ~ 100%">
+                %
+              </div>
+            </div>
+
+            <div class="inputItem arrow" style="margin-top: 20px;">
+              <div class="labelTit"><label><i>*</i>人均消费</label></div>
+              <div class="voucher-wrapper">
+                <input type="number" v-model.number="personalForm.perCapita" placeholder="人均消费额">
+                元
+              </div>
+            </div>
+
+
+            <div class="inputItem arrow" style="margin-top: 20px;">
+              <div class="labelTit"><label><i>*</i>广告图</label></div>
+              <van-uploader style="margin-top: 20px;" v-model="advertisementList" @delete="handleDeleteAdvertisement"
+                :after-read="(file) => { return afterRead(file, type = 'advertisement') }" />
+            </div> -->
+
+            <!-- <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>营销策划师</label></div>
+              <div class="input" style="background-color: #a4a4a41f;" v-if="personalForm.areaId.length <= 0">
+                请先选择详细地址
+              </div>
+              <div class="input" style="background-color: #a4a4a41f;" v-else @click="showSubCompany = true">
+                {{ companyValue || '请选择营销策划师' }}
+              </div>
+              <van-popup v-model="showSubCompany" round position="bottom" :style="{ height: '50%' }">
+                 <van-picker
+                    title="选择您的营销策划师"
+                    show-toolbar
+                    :columns="plannerColumns"
+                    value-key="name"
+                    @confirm="onPlannerConfirm"
+                    @cancel="showSubCompany = false"
+                    @change="onPlannerChange"
+                    visible-item-count="7"
+                  />
+                  <div class="loadingBox">
+                      <van-button :loading="companyLoading" type="default" @click="getMoreCompany" loading-text="加载中...">点击加载更多</van-button>
+                  </div>
+              </van-popup>
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>入驻套餐</label></div>
+              <div class="input" style="background-color: #a4a4a41f;" @click="showSetMeal = true">
+                {{ setMealValue || '请选择你的套餐'}}
+              </div>
+              <van-popup v-model="showSetMeal" round position="bottom" :style="{ height: '50%' }">
+                 <van-picker
+                    title="请选择你的套餐"
+                    show-toolbar
+                    :columns="setMealData"
+                    value-key="title"
+                    @confirm="onSetMealfirm"
+                    @cancel="showSetMeal = false"
+                    @change="onSetMealChange"
+                    visible-item-count="7"
+                  />
+              </van-popup>
+            </div> -->
+          </div>
+        </div>
+        <div class="subjectInfo" v-show="active === 2">
+          <div class="form">
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>营业执照：</label></div>
+              <div class="businessLicense">
+                <van-uploader v-model="fileList" :max-count="1"
+                  :after-read="(file) => { return afterRead(file, type = 'license') }" @oversize="onOversize">
+                  <!--               <van-uploader v-model="fileList" :max-count="1" :after-read="afterRead" @oversize="onOversize">-->
+                  <div icon="plus" type="primary">
+                    <div class="updateLicense">
+                      <div class="updateTop">
+                        <img src="../../assets/images/yingyezhiz@2x.png" alt="">
+                      </div>
+                      <div class="updateBottom">添加营业执照</div>
+                    </div>
+                  </div>
+                  <template #preview-cover="{ file }">
+                    <div class="preview-cover van-ellipsis">营业执照</div>
+                  </template>
+                </van-uploader>
+              </div>
+            </div>
+            <p class="describe">
+              仅支持在有效期内的中国大陆工商局或市场监督管理局颁发的工商营业执照。格式要求：
+              原证照片、扫描件或者 复印件加盖企业公章后的扫描
+            </p>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>商户名称：</label></div>
+              <input type="text" v-model="personalForm.subjectName" placeholder="请输入商户名称">
+            </div>
+            <p class="describe">需与当地政府颁发的商业许可证书或企业注册证上的企业名称完全一致，信息审核审核
+              成功后，企业名称不可修改</p>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>社会信用代码：</label></div>
+              <input type="text" v-model="personalForm.subjectCode" placeholder="请输入社会信用代码">
+            </div>
+            <div class="inputItem arrow">
+              <div class="labelTit"><label><i>*</i>注册地址：</label></div>
+              <input @click="showRegionPopup" @focus="noBomBox" v-model="personalForm.subjectRegion" type="text"
+                placeholder="请选择注册地址">
+              <span class="iconfont">&#xe6ab;</span>
+              <input type="text" v-model="personalForm.subjectAdress" placeholder="请输入详细地址">
+            </div>
+            <div class="inputItem arrow">
+              <div class="labelTit"><label><i>*</i>营业期限：</label></div>
+              <input type="text" @focus="noBomBox" v-model="personalForm.subjectStartTime" placeholder="请选择营业开始时间"
+                @click="selectStartDateBtn">
+              <span class="iconfont">&#xe6ab;</span>
+            </div>
+            <div class="inputItem arrowTime">
+              <input @focus="noBomBox" v-model="personalForm.subjectEndTime" type="text" placeholder="请选择营业截止时间"
+                @click="selectEndDateBtn">
+              <span class="iconfont">&#xe6ab;</span>
+            </div>
+            <p class="describe">
+              请填写营业执照上的营业期限 注意参照示例中的格式 结束时间需大于开始时间 有效期
+              必须大于60天
+            </p>
+          </div>
+        </div>
+
+        <!--  身份证认证模块砍掉 -->
+        <!-- <div class="subjectInfo" v-show="active === 3">
+          <div class="form">
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>证件照片：</label></div>
+              <div class="businessLicense">
+                <van-uploader v-model="positive" :max-count="1"
+                  :after-read="(file) => { return afterRead(file, type = 'positive') }" @oversize="onOversize">
+                  <div icon="plus" type="primary">
+                    <div class="updateLicense">
+                      <div class="updateTop">
+                        <img src="../../assets/images/shouchishenfenz@2x.png" alt="">
+                      </div>
+                      <div class="updateBottom">身份证人像面</div>
+                    </div>
+                  </div>
+                  <template #preview-cover="{ file }">
+                    <div class="preview-cover van-ellipsis">身份证人像面</div>
+                  </template>
+                </van-uploader>
+              </div>
+              <div class="businessLicense">
+                <van-uploader v-model="backIdImg" :max-count="1"
+                  :after-read="(file) => { return afterRead(file, type = 'back') }" @oversize="onOversize">
+                  <div icon="plus" type="primary">
+                    <div class="updateLicense">
+                      <div class="updateTop">
+                        <img src="../../assets/images/shenfenzb@2x.png" alt="">
+                      </div>
+                      <div class="updateBottom">身份证国徽面</div>
+                    </div>
+                  </div>
+                  <template #preview-cover="{ file }">
+                    <div class="preview-cover van-ellipsis">身份证国徽面</div>
+                  </template>
+                </van-uploader>
+              </div>
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>经营者姓名：</label></div>
+              <input v-model="personalForm.subjectOperator" type="text" placeholder="请输入经营者姓名">
+            </div>
+            <div class="inputItem arrow">
+              <div class="labelTit"><label><i>*</i>证件类型：</label></div>
+              <input v-model="idType" @focus="noBomBox" type="text" placeholder="请选择证件类型" @click="idTypeShowFn">
+              <span class="iconfont">&#xe6ab;</span>
+            </div>
+            <div class="inputItem">
+              <div class="labelTit"><label><i>*</i>身份证号码：</label></div>
+              <input v-model="personalForm.subjectIdCard" type="text" placeholder="请输入居民身份证号">
+            </div>
+            <div class="inputItem arrow">
+              <div class="labelTit"><label><i>*</i>身份证有效期：</label></div>
+              <input v-model="personalForm.subjectCardStartTime" @focus="noBomBox" type="text" placeholder="请选择身份证开始时间"
+                @click="selectIdStartDateBtn">
+              <span class="iconfont">&#xe6ab;</span>
+            </div>
+            <div class="inputItem arrowTime">
+              <input v-model="personalForm.subjectCardEndTime" @focus="noBomBox" type="text" placeholder="请选择身份证有效期结束时间"
+                @click="selectIdEndDateBtn">
+              <span class="iconfont">&#xe6ab;</span>
+            </div>
+          </div>
+        </div> -->
+      </div>
+      <button class="nextBtn" @click="next" v-show="active < 2">下一步</button>
+      <button class="nextBtn" @click="submitForm" v-show="active > 1">提交</button>
+
+
+      <button @click="handleShowData"></button>
+    </div>
+    <van-popup v-model="show" round position="bottom" :style="{ height: '40%' }">
+      <van-area title="请选择地区" :area-list="areaList" @confirm="selectArea" @cancel="closeSelect" />
+    </van-popup>
+    <van-popup v-model="regionShow" round position="bottom" :style="{ height: '40%' }">
+      <van-area title="请选择地区" :area-list="areaRegionList" @confirm="selectRegionArea" @cancel="closeRegionSelect" />
+    </van-popup>
+    <van-popup v-model="startDateShow" round position="bottom" :style="{ height: '40%' }">
+      <van-datetime-picker v-model="startDate" type="date" title="请选择营业执照开始时间" :min-date="minDate" :max-date="maxDate"
+        :formatter="formatter" @confirm="selectStartTime" @cancel="closeStartTime" />
+    </van-popup>
+    <van-popup v-model="endDateShow" round position="bottom" :style="{ height: '40%' }">
+      <van-datetime-picker v-model="endDate" type="date" title="请选择营业执照到期时间" :min-date="minDate" :max-date="maxDate"
+        :formatter="formatter" @confirm="selectEndTime" @cancel="closeEndTime" />
+    </van-popup>
+    <van-popup v-model="idCardStartShow" round position="bottom" :style="{ height: '40%' }">
+      <van-datetime-picker v-model="idCardStartDate" type="date" title="请选择身份证开始时间" :min-date="minDate"
+        :max-date="maxDate" :formatter="formatter" @confirm="selectIdCardStartTime" @cancel="closeIdCardStartTime" />
+    </van-popup>
+    <van-popup v-model="idCardEndShow" round position="bottom" :style="{ height: '40%' }">
+      <van-datetime-picker v-model="idCardEndDate" type="date" title="请选择身份证到期时间" :min-date="minDate" :max-date="maxDate"
+        :formatter="formatter" @confirm="selectIdCardEndTime" @cancel="closeIdCardEndTime" />
+    </van-popup>
+    <van-popup v-model="idTypeShow" round position="bottom" :style="{ height: '40%' }">
+      <van-picker title="请选择证件类型" show-toolbar :columns="columns" @confirm="onConfirm" @cancel="onCancel" />
+    </van-popup>
+    <van-popup v-model="startTimeShow" round position="bottom">
+      <van-datetime-picker @confirm="startTimeShow = false" @cancel="startTimeShow = false" type="time" title="请选择营业开始时间"
+        :min-hour="1" :max-hour="24" v-model="personalForm.startTime" />
+    </van-popup>
+    <van-popup v-model="endTimeShow" round position="bottom">
+      <van-datetime-picker @confirm="endTimeShow = false" @cancel="endTimeShow = false" type="time" title="请选择营业结束时间"
+        :min-hour="1" :max-hour="24" v-model="personalForm.endtime" />
+    </van-popup>
+
+    <PageLoading ref="pageLoadingRef"></PageLoading>
+  </div>
 </template>
 <script>
-import { Area, Popup, DatetimePicker, Uploader, Toast, Picker } from 'vant'
+import { Area, Popup, DatetimePicker, Uploader, Toast, Picker, Cascader, RadioGroup, Radio, Button, Loading } from 'vant'
 import api from '@/api'
 import { listSearchMixin } from '@/config/mixin'
 import AreaList from '../../util/area'
+import PageLoading from '../../components/pageLoading.vue'
+import { cardIdentify,businessIdentify,saveData } from "@/util/identify"
+
 export default {
   mixins: [listSearchMixin],
   name: 'mPersonalBusiness',
@@ -235,14 +356,21 @@ export default {
     [DatetimePicker.name]: DatetimePicker,
     [Uploader.name]: Uploader,
     [Toast.name]: Toast,
-    [Picker.name]: Picker
+    [Picker.name]: Picker,
+    [Cascader.name]: Cascader,
+    [RadioGroup.name]: RadioGroup,
+    [Radio.name]: Radio,
+    [Button.name]: Button,
+    [Loading.name]: Loading,
+    PageLoading
   },
-  data () {
+  data() {
     return {
       active: 1,
       areaList: AreaList,
       areaRegionList: AreaList,
       show: false,
+      show2: false,
       regionShow: false,
       minDate: new Date(1960, 1, 1),
       maxDate: new Date(2077, 12, 31),
@@ -255,13 +383,18 @@ export default {
       idCardStartShow: false,
       idCardEndShow: false,
       idTypeShow: false,
+      startTimeShow: false,
+      endTimeShow: false,
       idType: '',
       fileList: [],
       backIdImg: [],
+      // advertisementList: [], // 广告图数组
+      advertisementList:"",
       positive: [],
       shopAdress: '', // 店铺地区
       subjectRegion: '', // 注册地址地区
       personalForm: {
+        startTime: '', // 营业开始时间
         shopName: '', // 店铺名称
         shopPhone: '', // 手机号
         servicePhone: '', // 客服电话
@@ -284,18 +417,84 @@ export default {
         subjectCardStartTime: '', // 证件有效开始时间
         subjectCardEndTime: '', // 证件有效结束时间
         subjectCardPositive: '', // 身份证正面照
-        subjectCardSide: '' // 身份证反面照
+        subjectCardSide: '', // 身份证反面照
+        parentId: '',
+        shopType: '1', // 店铺类型 1商城 2本地
+        isVoucher: 1, // 是否支持使用代金卷
+        voucherReturn: '', // 代金卷的抵扣比例/返还比例
+        areaId: '', // 区域ID
+        packageId: '',
+        classificationId: '', // 商家所属分类
+        perCapita: "", // 人均消费
+        invitationCode: localStorage.getItem('INVITATION_CODE'), // 邀请码
+        advertisement: [],
+        longitude: "",
+        latitude: ''
       },
+      show1: false,
+      show3: false,
+      showSubCompany: false,
+      showSetMeal: false,
+      plannerColumns: [],
+      companyLoading: false,
+      options: null,
+      shopCategoryOptions: [],
+      setMealData: [],
+      companyValue: '',
+      fieldValue: '',
+      selectShopCategoryStr: "",
+      setMealValue: '',
       idCardList: [],
       dictName: '证件类型',
-      columns: []
+      columns: [],
+      categoryFieldName: {
+        text: 'storeName',
+        value: 'id',
+        children: 'items',
+      },
+      isQueryShopCategory: false
     }
   },
-  mounted () {
+  mounted() {
     this.getDictList()
+    //  刷新保存数据
+    saveData(this)
+    // console.log(localStorage.getItem('INVITATION_CODE'));
+  },
+  created() {
+    this.sendReq({
+      url: api.getTreeClass,
+      method: 'GET',
+      params: {}
+    }, (res) => {
+      // console.log(res) // 获取地址选择器数据并去除空的子项
+      this.options = res.data
+      // console.log(this.options)
+    })
+    this.sendReq({
+      url: api.getAdditional, // 套餐购买类型：1-商家，2-策划师 3-分公司
+      method: 'GET',
+      params: {
+        type: 1
+      }
+    }, (res) => {
+      // console.log(res) // 获取地址选择器数据并去除空的子项
+      this.setMealData = res.data
+      // console.log(this.options)
+    })
+
+    this.sendReq({
+      url: api.getCategoryList,
+      method: 'GET',
+      params: {
+        levelId: 1
+      }
+    }, res => {
+      this.shopCategoryOptions = res.data
+    })
   },
   methods: {
-    getDictList () {
+    getDictList() {
       let self = this
       let params = {
         url: api.getByName + '?dictName=' + self.dictName,
@@ -313,47 +512,47 @@ export default {
         }
       })
     },
-    showPopup () {
+    showPopup() {
       this.show = true
     },
-    showRegionPopup () {
+    showRegionPopup() {
       this.regionShow = true
     },
-    next () {
+    next() {
       this.active++
       if (this.active === 4) {
       }
     },
-    selectArea (address) {
+    selectArea(address) {
       this.shopAdress = `${address[0].name}-${address[1].name}-${address[2].name}`
       this.personalForm.shopAdressProvince = address[0].name
       this.personalForm.shopAdressCity = address[1].name
       console.log(address)
       this.show = false
     },
-    selectRegionArea (address) {
+    selectRegionArea(address) {
       this.personalForm.subjectRegion = `${address[0].name}-${address[1].name}-${address[2].name}`
       this.regionShow = false
     },
-    closeRegionSelect () {
+    closeRegionSelect() {
       this.regionShow = false
     },
-    closeSelect () {
+    closeSelect() {
       this.show = false
     },
-    selectStartDateBtn () {
+    selectStartDateBtn() {
       this.startDateShow = true
     },
-    selectEndDateBtn () {
+    selectEndDateBtn() {
       this.endDateShow = true
     },
-    selectIdStartDateBtn () {
+    selectIdStartDateBtn() {
       this.idCardStartShow = true
     },
-    selectIdEndDateBtn () {
+    selectIdEndDateBtn() {
       this.idCardEndShow = true
     },
-    dateTime (value) {
+    dateTime(value) {
       let date = value
       let m = date.getMonth() + 1
       let d = date.getDate()
@@ -365,59 +564,59 @@ export default {
       }
       return date.getFullYear() + '年-' + m + '月-' + d + '日'
     },
-    idTypeShowFn () {
+    idTypeShowFn() {
       this.idTypeShow = true
     },
     // 选择证件类型
-    onConfirm (type) {
+    onConfirm(type) {
       this.idType = type.text
       this.personalForm.subjectCardType = type.value
       this.idTypeShow = false
     },
-    onCancel () {
+    onCancel() {
       this.personalForm.subjectCardType = ''
       this.idTypeShow = false
     },
     // 选择开始时间
-    selectStartTime (value) {
+    selectStartTime(value) {
       this.personalForm.subjectStartTime = this.dateTime(value)
       this.startDateShow = false
     },
     // 取消选择开始时间
-    closeStartTime () {
+    closeStartTime() {
       this.startDateShow = false
     },
     // 选择截止时间
-    selectEndTime (value) {
+    selectEndTime(value) {
       this.personalForm.subjectEndTime = this.dateTime(value)
       this.endDateShow = false
     },
     // 取消选择截止时间
-    closeEndTime () {
+    closeEndTime() {
       this.endDateShow = false
     },
     // 选择证件日期开始时间
-    selectIdCardStartTime (value) {
+    selectIdCardStartTime(value) {
       this.personalForm.subjectCardStartTime = this.dateTime(value)
       this.idCardStartShow = false
     },
     // 取消选择身份证开始时间
-    closeIdCardStartTime () {
+    closeIdCardStartTime() {
       this.idCardStartShow = false
     },
     // 证件到期时间
-    selectIdCardEndTime (value) {
+    selectIdCardEndTime(value) {
       this.personalForm.subjectCardEndTime = this.dateTime(value)
       this.idCardEndShow = false
     },
     // 取消选择身份证到期时间
-    closeIdCardEndTime () {
+    closeIdCardEndTime() {
       this.idCardEndShow = false
     },
-    changeActive (index) {
+    changeActive(index) {
       this.active = index
     },
-    formatter (type, val) {
+    formatter(type, val) {
       if (type === 'year') {
         return `${val}年`
       } else if (type === 'month') {
@@ -427,7 +626,7 @@ export default {
       }
       return val
     },
-    afterRead (file, type) {
+    afterRead(file, type) {
       // console.log(file.content, file.file.name)
       // let fileData = this.dataURLtoFileFun(file.content, file.file.name)
       let formData = new FormData()
@@ -440,18 +639,35 @@ export default {
         contentType: 'multipart/form-data',
         data: formData
       }
+
+      this.$refs.pageLoadingRef.showPageLoading('上传中...')
       self.sendReq(params, (res) => {
         if (res.code === '200') {
+        this.$refs.pageLoadingRef.cloasePageLoading()
+        // console.log(res);
           if (type === 'license') {
+            //  营业执照识别
+            businessIdentify(res.data.url,this,0)
             self.personalForm.subjectLicense = res.data.url
           } else if (type === 'positive') {
+            console.log(res.data.url);
+            //  身份证正面识别
+            cardIdentify(res.data.url,0,this)
             self.personalForm.subjectCardPositive = res.data.url
           } else if (type === 'back') {
+            //  身份证反面识别
+            cardIdentify(res.data.url,1,this)
             self.personalForm.subjectCardSide = res.data.url
+          } else if (type === 'advertisement') {
+            self.personalForm.advertisement.push(res.data.url)
           }
+
+          // console.log("这是为什么呢？", this.advertisementList, res.data);
         } else {
           Toast.fail(res.message)
         }
+      }, () => {
+        this.$refs.pageLoadingRef.cloasePageLoading()
       })
       // file.status = 'uploading'
       // file.message = '上传中...'
@@ -460,7 +676,7 @@ export default {
       //   file.message = '上传失败'
       // }, 1000)
     },
-    dataURLtoFileFun (dataurl, filename) {
+    dataURLtoFileFun(dataurl, filename) {
       // 将base64转换为文件，dataurl为base64字符串，filename为文件名（必须带后缀名，如.jpg,.png）
       let arr = dataurl.split(',')
       let mime = arr[0].match(/:(.*?);/)[1]
@@ -472,339 +688,649 @@ export default {
       }
       return new File([u8arr], filename, { type: mime })
     },
-    onOversize (file) {
+    onOversize(file) {
       console.log(file)
       Toast.fail('文件大小不能超过 500kb')
     },
     // 禁止弹出键盘
-    noBomBox (Event) {
+    noBomBox(Event) {
       document.activeElement.blur()
     },
+    handleClosePopup(type) {
+      if (type === 'areaId') {
+        if (!this.personalForm.shopAdressProvince || !this.personalForm.shopAdressCity) {
+          this.personalForm.areaId = null
+          this.fieldValue = ''
+          this.personalForm.shopAdressProvince = ''
+          this.personalForm.shopAdressCity = ''
+          this.personalForm.storeAddressDetail = ''
+        }
+      }
+    },
     // 提交申请
-    submitForm () {
+    submitForm() {
       let self = this
-      self.personalForm.shopAdress = ''
+      const subData = JSON.parse(JSON.stringify(self.personalForm))
+      subData.shopAdress = ''
       let reg = /^1[13456789]\d{9}$/
       var idReg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/
-      self.personalForm.shopPhone = self.personalForm.servicePhone
-      self.personalForm.shopAdress = `${self.shopAdress}，${self.personalForm.storeAddressDetail}`
+      subData.shopPhone = subData.servicePhone
+      subData.shopAdress = `${self.shopAdress}，${subData.storeAddressDetail}`
       // alert('submit!')
-      if (self.personalForm.shopName === '') {
+      if (subData.shopName === '') {
         Toast.fail('请输入店铺名称')
         return false
       }
-      if (self.personalForm.servicePhone === '') {
+      if (subData.servicePhone === '') {
         Toast.fail('请输入客服电话')
         return false
-      } else if (!reg.test(self.personalForm.servicePhone)) {
+      } else if (!reg.test(subData.servicePhone)) {
         Toast.fail('客服电话号格式错误')
         return false
       }
-      if (self.personalForm.chargePersonName === '') {
+
+      if (subData.chargePersonName === '') {
         Toast.fail('请输入店铺负责人')
         return false
       }
-      if (self.personalForm.chargePersonPhone === '') {
+      if (subData.chargePersonPhone === '') {
         Toast.fail('请输入负责人电话')
         return false
-      } else if (!reg.test(self.personalForm.chargePersonPhone)) {
+      } else if (!reg.test(subData.chargePersonPhone)) {
         Toast.fail('负责人电话式错误')
         return false
       }
-      if (self.personalForm.shopAdress === '') {
+
+      if (subData.shopType === '2') {
+        if (!subData.startTime) {
+          Toast.fail('请选择营业开始时间')
+          return
+        }
+
+        if (!subData.endtime) {
+          Toast.fail('请选择营业结束时间')
+          return
+        }
+      }
+
+      if (subData.shopAdress === '') {
         Toast.fail('请选择所在地区')
         return false
       }
-      if (self.personalForm.storeAddressDetail === '') {
+      if (subData.storeAddressDetail === '') {
         Toast.fail('请输入详细地址')
         return false
       }
-      if (self.personalForm.subjectName === '') {
+
+      if (!subData.classificationId) {
+        Toast.fail('请选择店铺所属分类')
+        return
+      }
+
+      //  代金券 人均消费 广告图都砍掉
+      // if (!subData.voucherReturn && subData.voucherReturn != 0) {
+      //   Toast.fail('请输入代金券返回比例')
+      //   return
+      // } else {
+      //   if (isNaN(subData.voucherReturn) || subData.voucherReturn < 0 || subData.voucherReturn > 100) {
+      //     Toast.fail('代金券返还比例应是0 ~ 100的数字')
+      //     return
+      //   }
+      // }
+
+      // if (!subData.perCapita) {
+      //   Toast.fail('请填写人均消费额')
+      //   return
+      // } else if (isNaN(subData.perCapita) || subData.perCapita <= 0) {
+      //   Toast.fail('人均消费额不能小于等于0元')
+      //   return
+      // }
+
+      // if (!subData.advertisement.length) {
+      //   Toast.fail('请上传广告图')
+      //   return
+      // } else {
+      //   subData.advertisement = subData.advertisement.join(",")
+      // }
+
+      if (subData.subjectName === '') {
         Toast.fail('请输入商户名称')
         return false
       }
-      if (self.personalForm.subjectCode === '') {
+      if (subData.subjectCode === '') {
         Toast.fail('请输入社会信用代码')
         return false
       }
-      if (self.personalForm.subjectRegion === '') {
+      if (subData.subjectRegion === '') {
         Toast.fail('请输入注册地址')
         return false
       }
-      if (self.personalForm.subjectAdress === '') {
+      if (subData.subjectAdress === '') {
         Toast.fail('请输入注册详情地址')
         return false
       }
-      if (self.personalForm.subjectStartTime === '') {
+      if (subData.subjectStartTime === '') {
         Toast.fail('请选择营业开始时间')
         return false
       }
-      if (self.personalForm.subjectEndTime === '') {
+      if (subData.subjectEndTime === '') {
         Toast.fail('请选择营业截止时间')
         return false
       }
-      if (self.personalForm.subjectLicense === '') {
+      if (subData.subjectLicense === '') {
         Toast.fail('请上传营业执照')
         return false
       }
-      if (self.personalForm.subjectOperator === '') {
-        Toast.fail('请输入经营者姓名')
-        return false
-      }
-      if (self.personalForm.subjectCardType === '') {
-        Toast.fail('请选择证件类型')
-        return false
-      }
-      if (self.personalForm.subjectIdCard === '') {
-        Toast.fail('请输入居民身份证号')
-        return false
-      } else if (!idReg.test(self.personalForm.subjectIdCard)) {
-        Toast.fail('身份证号码格式错误')
-        return false
-      }
-      if (self.personalForm.subjectCardStartTime === '') {
-        Toast.fail('请选择身份证开始时间')
-        return false
-      }
-      if (self.personalForm.subjectCardEndTime === '') {
-        Toast.fail('请选择身份证有效期结束时间')
-        return false
-      }
-      if (self.personalForm.subjectCardPositive === '') {
-        Toast.fail('请上传身份证正面照')
-        return false
-      }
-      if (self.personalForm.subjectCardSide === '') {
-        Toast.fail('请上传身份证背面照')
-        return false
-      }
+
+      // 按要求砍掉身份验证
+      // if (subData.subjectOperator === '') {
+      //   Toast.fail('请输入经营者姓名')
+      //   return false
+      // }
+      // if (subData.subjectCardType === '') {
+      //   Toast.fail('请选择证件类型')
+      //   return false
+      // }
+      // if (subData.subjectIdCard === '') {
+      //   Toast.fail('请输入居民身份证号')
+      //   return false
+      // } else if (!idReg.test(subData.subjectIdCard)) {
+      //   Toast.fail('身份证号码格式错误')
+      //   return false
+      // }
+      // if (subData.subjectCardStartTime === '') {
+      //   Toast.fail('请选择身份证开始时间')
+      //   return false
+      // }
+      // if (subData.subjectCardEndTime === '') {
+      //   Toast.fail('请选择身份证有效期结束时间')
+      //   return false
+      // }
+      // if (subData.subjectCardPositive === '') {
+      //   Toast.fail('请上传身份证正面照')
+      //   return false
+      // }
+      // if (subData.subjectCardSide === '') {
+      //   Toast.fail('请上传身份证背面照')
+      //   return false
+      // }
       let params = {
         url: api.individualCheck,
         method: 'POST',
-        data: self.personalForm
+        data: subData
       }
       self.sendReq(params, (res) => {
         if (res.code === '200') {
           Toast.success('提交成功')
-          self.$router.push({path: '/mStatus'})
+          self.$router.push({ path: '/mStatus' })
         } else {
           Toast.fail(res.message)
         }
       })
+    },
+    onAddresChange({ value, selectedOptions, tabIndex }) { // 选择完地址后转为显示的字符串
+      this.fieldValue = ''
+      let cacheArray = []
+      let addresString = ''
+      let level = ''
+      this.sendReq({
+        url: api.getTreeOne,
+        method: 'GET',
+        params: {
+          parentId: value
+        }
+      }, (res) => {
+
+
+        if (res.data && res.data.length > 0) {
+          selectedOptions[selectedOptions.length - 1].children = res.data
+          cacheArray = this.options.map(item => { // 这里重新再赋值一遍是因为这里直接改变数组页面不会动态刷新，所以每次都重新给options赋值，强制刷新
+            return item
+          })
+          this.options = cacheArray
+        }
+        // this.isRequestAddres = true
+      })
+
+      for (let i = 0; i < selectedOptions.length; i++) {
+        if (i >= selectedOptions.length - 1) {
+          addresString += selectedOptions[i].name
+          level = selectedOptions[i].level // 获取最后选择的地址的层级
+          this.level = level
+        } else {
+          addresString += selectedOptions[i].name + ' / '
+        }
+      }
+      if (selectedOptions.length === 4) {
+        const addeessInfo = selectedOptions[3]
+        console.log("拿到地址了", addeessInfo);
+        this.personalForm.latitude = addeessInfo.latitude
+        this.personalForm.longitude = addeessInfo.longitude
+        // alert(this.personalForm.latitude)
+        this.fieldValue = addresString
+        this.personalForm.shopAdressProvince = selectedOptions[0].name
+        this.personalForm.shopAdressCity = selectedOptions[1].name
+        this.show1 = false
+
+        // this.personalForm.province = 
+      }
+      // this.sendReq({ // 获取可选择的分公司
+      //   url: api.selectAnd,
+      //   method: 'POST',
+      //   data: {
+      //     area: value, // 地区编号
+      //     type: 2,
+      //     level, // "区级别不能为空"
+      //     page: this.queryData.page,
+      //     pageSize: this.queryData.size
+      //   }
+      // }, (res) => {
+      //   this.plannerColumns = res.data.list
+      //   console.log(res)
+      // })
+      // console.log(this.personalForm)
+    },
+    onPlannerConfirm(value) { // 确认选择的公司
+      this.companyValue = value.name
+      this.personalForm.parentId = value.platformUserId
+      this.showSubCompany = false
+    },
+    onPlannerChange(value) {
+      // console.log(value)
+    },
+    getMoreCompany() {
+      this.companyLoading = true
+      // eslint-disable-next-line eqeqeq
+      if (this.plannerColumns.length == this.queryData.total) {
+        this.queryData.pageSize += 7
+        this.sendReq({ // 获取可选择的营销策划师
+          url: api.selectAnd,
+          method: 'POST',
+          data: {
+            area: this.personalForm.areaId, // 地区编号
+            type: 2,
+            level: this.level, // "区级别不能为空"
+            page: this.queryData.page,
+            pageSize: this.queryData.size
+          }
+        }, (res) => {
+          this.plannerColumns = res.data.list
+          this.companyLoading = false
+          // console.log(res)
+        })
+      } else {
+        Toast.fail('没有更多了')
+        this.companyLoading = false
+      }
+    },
+    onSetMealfirm(value) {
+      // console.log(value)
+      this.setMealValue = value.title
+      this.personalForm.packageId = value.id
+      this.showSetMeal = false
+    },
+    onSetMealChange(value) {
+      // console.log(value)
+    },
+
+    // 店铺所属分类change
+    async onShopCategoryChange(e, finishCB) {
+      try {
+        this.isQueryShopCategory = true
+        let cacheArray = []
+        const childCategoryList = await this.getChildCategory(e.value)
+        if (childCategoryList.length) {
+          e.selectedOptions[e.selectedOptions.length - 1].items = childCategoryList
+          cacheArray = this.shopCategoryOptions.map(item => {
+            return item
+          })
+          this.shopCategoryOptions = cacheArray
+        } else {
+          finishCB(e)
+        }
+        this.isQueryShopCategory = false
+      } catch (error) {
+        finishCB(e)
+        this.isQueryShopCategory = false
+
+      }
+    },
+
+    // 确认选择店铺所属分类
+    onFinishChooseShopCategory(e) {
+      this.selectShopCategoryStr = e.selectedOptions[e.selectedOptions.length - 1].storeName
+      this.show2 = false
+    },
+
+    // 获取子集分类
+    getChildCategory(dressing) {
+      const _this = this
+      return new Promise(async (resolve, reject) => {
+        _this.sendReq({
+          url: api.getChildCategoryList,
+          method: "GET",
+          params: {
+            dressing
+          }
+        }, res => {
+          resolve(res.data)
+        })
+      })
+    },
+
+    // 删除广告图
+    handleDeleteAdvertisement(_, { index }) {
+      this.personalForm.advertisement.splice(index, 1)
+    },
+
+    handleShowData() {
+      alert(this.personalForm.longitude)
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-  .mUinitBusiness {
-    padding-bottom: 60px;
-    .topTitle {
-      padding: 0 5%;
-      h3 {
-        font-size: 21px;
-        color: #333333;
-        margin-bottom: 22px;
-      }
-      p {
-        font-size: 12px;
-        color: #676870;
-      }
-      margin:50px 0 28px 0;
-    }
-    >>> .el-step__head {
-      color: #E9EAEB;
-      .el-step__icon {
-        background: #FFFFFF;
-        width: 50px;
-        height: 50px;
-        border-radius: 0;
-        border: 1px solid #F3F4F5;
-      }
-    }
-    >>> .el-step__head.is-process {
-      border-color: #CDCDCD
+.loadingBox {
+  display: flex;
+  justify-content: center;
+}
+
+.plannerItem {
+  display: flex;
+  align-items: center;
+
+  .avatar {
+    margin-top: -3px;
+    width: 30px;
+    height: 30px;
+  }
+
+  .custom-title {
+    margin-top: -5px;
+    margin-left: 20px;
+  }
+}
+
+.input {
+  width: 100%;
+  margin: 10px 0px;
+  border-bottom: 1px solid #F6F4F7;
+  height: 40px;
+  border-radius: 50px;
+  line-height: 40px;
+  font-size: 16px;
+  color: #666666;
+  padding-left: 10px;
+  display: flex;
+  align-items: center;
+}
+
+.mUinitBusiness {
+  padding-bottom: 60px;
+
+  .topTitle {
+    padding: 0 5%;
+
+    h3 {
+      font-size: 21px;
+      color: #333333;
+      margin-bottom: 22px;
     }
-    >>> .el-step__line {
-      background-color: #F3F4F5;
-      height: 1px !important;
-      top: 50% !important;
-      overflow: hidden;
+
+    p {
+      font-size: 12px;
+      color: #676870;
     }
-    >>> .is-finish {
-      border-color: #C5AA7B;
-      color: #FFFFFF;
-      font-weight: 500 !important;
-      .el-step__icon {
-        background: #FFFFFF;
-        height: 50px;
-        width: 50px;
-        color: #C5AA7B;
-        border: 1px solid #C5AA7B;
-        border-radius: 0;
-      }
+
+    margin:50px 0 28px 0;
+  }
+
+  >>>.el-step__head {
+    color: #E9EAEB;
+
+    .el-step__icon {
+      background: #FFFFFF;
+      width: 50px;
+      height: 50px;
+      border-radius: 0;
+      border: 1px solid #F3F4F5;
     }
-    >>> .el-step__main {
-     .is-finish {
-       color: #333333;
-     }
+  }
+
+  >>>.el-step__head.is-process {
+    border-color: #CDCDCD
+  }
+
+  >>>.el-step__line {
+    background-color: #F3F4F5;
+    height: 1px !important;
+    top: 50% !important;
+    overflow: hidden;
+  }
+
+  >>>.is-finish {
+    border-color: #C5AA7B;
+    color: #FFFFFF;
+    font-weight: 500 !important;
+
+    .el-step__icon {
+      background: #FFFFFF;
+      height: 50px;
+      width: 50px;
+      color: #C5AA7B;
+      border: 1px solid #C5AA7B;
+      border-radius: 0;
     }
-    >>> .el-step__title.is-process {
-      font-size: 14px;
-      color: #999999;
-      font-weight: 500;
+  }
+
+  >>>.el-step__main {
+    .is-finish {
+      color: #333333;
     }
-    >>> .el-step__title.is-wait {
+  }
+
+  >>>.el-step__title.is-process {
+    font-size: 14px;
+    color: #999999;
+    font-weight: 500;
+  }
+
+  >>>.el-step__title.is-wait {
+    font-size: 14px;
+    color: #999999;
+    font-weight: 500;
+  }
+
+  >>>.el-step__main {
+    .el-step__title {
       font-size: 14px;
-      color: #999999;
-      font-weight: 500;
     }
-    >>> .el-step__main {
-      .el-step__title {
-        font-size: 14px;
-      }
-      .is-success {
-        color: $mainColor;
-      }
+
+    .is-success {
+      color: $mainColor;
     }
-    .mFormBox {
-      padding: 0 5%;
-      margin-top: 41px;
-      .formTit {
-        span {
-          font-size: 17px;
-          font-weight: bold;
-          color: #444444;
-          line-height: 18px;
-          position: relative;
-          i {
-            background: linear-gradient(267deg, #FF8F25 0%, rgba(254, 179, 24, 0.48) 52%, rgba(255, 255, 255, 0) 100%);
-            opacity: 0.7;
-            display: block;
-            height: 11px;
-            width: 100%;
-            bottom: -2px;
-            position: absolute;
-          }
+  }
+
+  .mFormBox {
+    padding: 0 5%;
+    margin-top: 41px;
+
+    .formTit {
+      span {
+        font-size: 17px;
+        font-weight: bold;
+        color: #444444;
+        line-height: 18px;
+        position: relative;
+
+        i {
+          background: linear-gradient(267deg, #FF8F25 0%, rgba(254, 179, 24, 0.48) 52%, rgba(255, 255, 255, 0) 100%);
+          opacity: 0.7;
+          display: block;
+          height: 11px;
+          width: 100%;
+          bottom: -2px;
+          position: absolute;
         }
       }
-      .form {
-        margin-top: 25px;
-        .inputItem {
-          margin-top: 20px;
-          .labelTit {
-            display: flex;
-            label {
-              color: #333333;
-              font-weight: 500;
-              font-size: 14px;
-              i {
-                color: $mainColor;
-                font-size: 15px;
-                margin-right: 5px;
-              }
-            }
-          }
-          input {
-            width: 100%;
-            border-bottom: 1px solid #F6F4F7;
-            height: 50px;
-            line-height: 50px;
+    }
+
+    .form {
+      margin-top: 25px;
+
+      .inputItem {
+        margin-top: 20px;
+
+        .labelTit {
+          display: flex;
+
+          label {
+            color: #333333;
+            font-weight: 500;
             font-size: 14px;
-            color: #666666;
-            padding-left: 10px;
-          }
-          input::placeholder {
-            color: #999999;
-          }
-        }
-        .arrow {
-          position: relative;
-          span {
-            position: absolute;
-            right: 5px;
-            top: 30px;
-            color: #999999;
-          }
-        }
-        .arrowTime {
-          position: relative;
-          span {
-            position: absolute;
-            right: 5px;
-            top: 20px;
-            color: #999999;
+
+            i {
+              color: $mainColor;
+              font-size: 15px;
+              margin-right: 5px;
+            }
           }
         }
-        .describe {
-          color: #BBBBBB;
-          font-size: 12px;
-          margin-top: 10px;
-          line-height: 20px;
+
+        input {
+          width: 100%;
+          border-bottom: 1px solid #F6F4F7;
+          height: 50px;
+          line-height: 50px;
+          font-size: 14px;
+          color: #666666;
           padding-left: 10px;
         }
-      }
-    }
-    .nextBtn {
-      display: block;
-      margin: 50px auto 0 auto;
-      width: 315px;
-      height: 42px;
-      background: #333333;
-      color: $mainColor;
-    }
-    .businessLicense {
-      width: 100%;
-      background: #F3F4F5;
-      margin-top: 10px;
-      display: flex;
-      .van-uploader {
-        margin: 10px auto;
-      }
-      >>> .van-uploader__preview-image {
-        width: 162px;
-        height: 135px;
-      }
-      .updateLicense {
-        width: 162px;
-        height: 135px;
-        .updateTop {
+
+        input::placeholder {
+          color: #999999;
+        }
+
+        .voucher-wrapper {
           display: flex;
-          justify-content: center;
-          height: 110px;
           align-items: center;
-          img {
-            width: 169px;
-            height: 100px;
-          }
         }
-        .updateBottom {
-          width: 162px;
-          height: 25px;
-          font-size: 13px;
-          line-height: 25px;
+      }
+
+      .arrow {
+        position: relative;
+
+        span {
+          position: absolute;
+          right: 5px;
+          top: 30px;
           color: #999999;
-          text-align: center;
         }
       }
+
+      .arrowTime {
+        position: relative;
+
+        span {
+          position: absolute;
+          right: 5px;
+          top: 20px;
+          color: #999999;
+        }
+      }
+
+      .describe {
+        color: #BBBBBB;
+        font-size: 12px;
+        margin-top: 10px;
+        line-height: 20px;
+        padding-left: 10px;
+      }
     }
   }
-  .preview-cover {
-    position: absolute;
-    bottom: 0;
-    box-sizing: border-box;
-    width: 100%;
-    padding: 4px;
-    color: #fff;
-    font-size: 12px;
-    text-align: center;
-    background: rgba(0, 0, 0, 0.3);
+
+  .nextBtn {
+    display: block;
+    margin: 50px auto 0 auto;
+    width: 315px;
+    height: 42px;
+    background: #333333;
+    color: $mainColor;
   }
-  .centBox {
-    >>> .el-step {
-      .el-step:nth-child(1) {
-        .el-step__icon-inner {}
+
+  .businessLicense {
+    width: 100%;
+    background: #F3F4F5;
+    margin-top: 10px;
+    display: flex;
+
+    .van-uploader {
+      margin: 10px auto;
+    }
+
+    >>>.van-uploader__preview-image {
+      width: 162px;
+      height: 135px;
+    }
+
+    .updateLicense {
+      width: 162px;
+      height: 135px;
+
+      .updateTop {
+        display: flex;
+        justify-content: center;
+        height: 110px;
+        align-items: center;
+
+        img {
+          width: 169px;
+          height: 100px;
+        }
+      }
+
+      .updateBottom {
+        width: 162px;
+        height: 25px;
+        font-size: 13px;
+        line-height: 25px;
+        color: #999999;
+        text-align: center;
       }
     }
   }
+}
+
+.preview-cover {
+  position: absolute;
+  bottom: 0;
+  box-sizing: border-box;
+  width: 100%;
+  padding: 4px;
+  color: #fff;
+  font-size: 12px;
+  text-align: center;
+  background: rgba(0, 0, 0, 0.3);
+}
+
+.centBox {
+  >>>.el-step {
+    .el-step:nth-child(1) {
+      .el-step__icon-inner {}
+    }
+  }
+}
+
+.loading-container {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  height: 400px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1000;
+}
 </style>

static/imgs/mb/fengongsi.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="#1b1b1b" d="M568.888889 0a113.777778 113.777778 0 0 1 113.777778 113.777778v113.777778h227.555555a113.777778 113.777778 0 0 1 113.777778 113.777777v682.666667H0V113.777778a113.777778 113.777778 0 0 1 113.777778-113.777778h455.111111z m0 56.888889H113.777778a56.888889 56.888889 0 0 0-56.490667 50.232889L56.888889 113.777778v853.333333h113.777778v-170.666667a113.777778 113.777778 0 0 1 113.777777-113.777777h113.777778a113.777778 113.777778 0 0 1 113.777778 113.777777v170.666667h113.777778V113.777778a56.888889 56.888889 0 0 0-50.232889-56.490667L568.888889 56.888889z m341.333333 227.555555h-227.555555v682.666667h284.444444V341.333333a56.888889 56.888889 0 0 0-50.232889-56.490666L910.222222 284.444444z m-512 455.111112H284.444444a56.888889 56.888889 0 0 0-56.490666 50.232888L227.555556 796.444444v170.666667h227.555555v-170.666667a56.888889 56.888889 0 0 0-50.232889-56.490666L398.222222 739.555556z m85.333334-284.444445a28.444444 28.444444 0 0 1 0 56.888889h-284.444445a28.444444 28.444444 0 0 1 0-56.888889h284.444445z m0-170.666667a28.444444 28.444444 0 0 1 0 56.888889h-284.444445a28.444444 28.444444 0 0 1 0-56.888889h284.444445z" /></svg>

static/imgs/pc/yxchsRUZHU.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="#ffebc4" d="M399.080727 678.074182h326.562909a37.608727 37.608727 0 1 0 0-75.217455h-251.345454L709.492364 367.709091A37.608727 37.608727 0 0 0 656.290909 314.507636l-299.240727 299.287273a38.912 38.912 0 0 0-0.232727 0.232727l-299.287273 299.240728a37.608727 37.608727 0 1 0 53.201454 53.154909l288.349091-288.349091zM890.88 132.747636A292.445091 292.445091 0 0 0 682.682182 46.545455c-78.661818 0-152.529455 30.626909-208.151273 86.202181L185.856 421.422545a37.608727 37.608727 0 0 0-11.031273 26.624v363.52c0 20.759273 16.849455 37.608727 37.608728 37.608728h363.52c10.007273 0 19.549091-4.002909 26.670545-11.077818l288.209455-289.047273a292.445091 292.445091 0 0 0 86.202181-208.151273c0-78.661818-30.626909-152.529455-86.202181-208.151273z m-53.201455 363.101091l-277.271272 278.109091H250.042182V463.592727l277.690182-277.643636a217.693091 217.693091 0 0 1 154.949818-64.232727c58.507636 0 113.570909 22.807273 154.949818 64.232727a217.693091 217.693091 0 0 1 64.186182 154.949818c0 58.507636-22.807273 113.570909-64.186182 154.949818z"  /></svg>

static/js/canvas-nest.min.js

@@ -0,0 +1,91 @@
+/*
+ * @Author: aliyun0758874076 2300202994@qq.com
+ * @Date: 2023-08-30 11:07:46
+ * @LastEditors: aliyun0758874076 2300202994@qq.com
+ * @LastEditTime: 2023-09-14 17:28:02
+ * @FilePath: \公司发展事件时间轴js特效\js\canvas-nest.min.js
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
+!(function () {
+    function o (w, v, i) {
+        return w.getAttribute(v) || i
+    }
+
+    function j (i) {
+        return document.getElementsByTagName(i)
+    }
+
+    function l () {
+        var i = j('script'),
+            w = i.length,
+            v = i[w - 1]
+        return {
+            l: w,
+            z: o(v, 'zIndex', 999),
+            o: o(v, 'opacity', 1), // 控制透明度
+            c: o(v, 'color', '255,255,255'),
+            n: o(v, 'count', 299) // 控制数量
+        }
+    }
+
+    function k () {
+        r = u.width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth, n = u.height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight
+    }
+
+    function b () {
+        e.clearRect(0, 0, r, n)
+        var w = [f].concat(t)
+        var x, v, A, B, z, y
+        t.forEach(function (i) {
+            i.x += i.xa, i.y += i.ya, i.xa *= i.x > r || i.x < 0 ? -1 : 1, i.ya *= i.y > n || i.y < 0 ? -1 : 1, e.fillRect(i.x - 0.5, i.y - 0.5, 1, 1)
+            for (v = 0; v < w.length; v++) {
+                x = w[v]
+                if (i !== x && x.x !== null && x.y !== null) {
+                    B = i.x - x.x, z = i.y - x.y, y = B * B + z * z
+                    y < x.max && (x === f && y >= x.max / 2 && (i.x -= 0.03 * B, i.y -= 0.03 * z), A = (x.max - y) / x.max, e.beginPath(), e.lineWidth = A / 2, e.strokeStyle = 'rgba(' + s.c + ',' + (A + 0.2) + ')', e.moveTo(i.x, i.y), e.lineTo(x.x, x.y), e.stroke())
+                }
+            }
+            w.splice(w.indexOf(i), 1)
+        }), m(b)
+    }
+    var u = document.createElement('canvas'),
+        s = l(),
+        c = 'c_n' + s.l,
+        e = u.getContext('2d'),
+        r, n, m = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function (i) {
+            window.setTimeout(i, 1000 / 45)
+        },
+        a = Math.random,
+        f = {
+            x: null,
+            y: null,
+            max: 20000
+        }
+    u.id = c
+    u.style.cssText = 'position:fixed;top:0;pointer-events:none;left:0;z-index:' + s.z + ';opacity:' + s.o
+    j('body')[0].appendChild(u)
+    k(), window.onresize = k
+    window.onmousemove = function (i) {
+        i = i || window.event, f.x = i.clientX, f.y = i.clientY
+    }, window.onmouseout = function () {
+        f.x = null, f.y = null
+    }
+    for (var t = [], p = 0; s.n > p; p++) {
+        var h = a() * r,
+            g = a() * n,
+            q = 2 * a() - 1,
+            d = 2 * a() - 1
+            // console.log(r,n) // 屏幕的大小
+            // console.log(q,d) // 初始的位置偏移量
+        t.push({
+            x: h,
+            y: g,
+            xa: q,
+            ya: d,
+            max: 9000
+        })
+    }
+    setTimeout(function () {
+        b()
+    }, 10)
+}())