添加手机端

jero-web/package-lock.json

@@ -11,6 +11,7 @@
         "@antv/data-set": "^0.11.4",
         "@tinymce/tinymce-vue": "^2.1.0",
         "@toast-ui/editor": "^2.1.2",
+        "amfe-flexible": "^2.2.1",
         "ant-design-vue": "^1.7.2",
         "area-data": "^5.0.6",
         "axios": "^0.21.1",
@@ -33,6 +34,7 @@
         "nprogress": "^0.2.0",
         "tinymce": "^5.3.2",
         "v-viewer": "^1.6.4",
+        "vant": "^2.12.54",
         "viser-vue": "^2.4.8",
         "vue": "^2.6.10",
         "vue-area-linkage": "^5.1.0",
@@ -1337,7 +1339,6 @@
       "version": "7.12.5",
       "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.12.5.tgz",
       "integrity": "sha512-plcc+hbExy3McchJCEQG3knOsuh3HH+Prx1P6cLIkET/0dLuQDEnrT+s27Axgc9bqfsmNUNHfscgMUdBpC9xfg==",
-      "dev": true,
       "dependencies": {
         "regenerator-runtime": "^0.13.4"
       }
@@ -1718,11 +1719,20 @@
         "node": ">= 8"
       }
     },
+    "node_modules/@vant/icons": {
+      "version": "1.8.0",
+      "resolved": "https://registry.npmmirror.com/@vant/icons/-/icons-1.8.0.tgz",
+      "integrity": "sha512-sKfEUo2/CkQFuERxvkuF6mGQZDKu3IQdj5rV9Fm0weJXtchDSSQ+zt8qPCNUEhh9Y8shy5PzxbvAfOOkCwlCXg=="
+    },
+    "node_modules/@vant/popperjs": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmmirror.com/@vant/popperjs/-/popperjs-1.3.0.tgz",
+      "integrity": "sha512-hB+czUG+aHtjhaEmCJDuXOep0YTZjdlRR+4MSmIFnkCQIxJaXLQdSsR90XWvAI2yvKUI7TCGqR8pQg2RtvkMHw=="
+    },
     "node_modules/@vue/babel-helper-vue-jsx-merge-props": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.2.1.tgz",
-      "integrity": "sha512-QOi5OW45e2R20VygMSNhyQHvpdUwQZqGPc748JLGCYEy+yp8fNFNdbNIGAgZmi9e+2JHPd6i6idRuqivyicIkA==",
+      "integrity": "sha512-QOi5OW45e2R20VygMSNhyQHvpdUwQZqGPc748JLGCYEy+yp8fNFNdbNIGAgZmi9e+2JHPd6i6idRuqivyicIkA=="
-      "dev": true
     },
     "node_modules/@vue/babel-plugin-transform-vue-jsx": {
       "version": "1.2.1",
@@ -2957,6 +2967,11 @@
         "node": ">=0.4.2"
       }
     },
+    "node_modules/amfe-flexible": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmmirror.com/amfe-flexible/-/amfe-flexible-2.2.1.tgz",
+      "integrity": "sha512-L2VfvDzoETBjhRptg5u/IUuzHSuxm22JpSRb404p/TBGeRfwWmmNEbB+TFPIP/sS/+pbM18bCFH9QnMojLuPNw=="
+    },
     "node_modules/ansi-colors": {
       "version": "3.2.4",
       "resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-3.2.4.tgz",
@@ -16596,8 +16611,7 @@
     "node_modules/regenerator-runtime": {
       "version": "0.13.7",
       "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.7.tgz",
-      "integrity": "sha512-a54FxoJDIr27pgf7IgeQGxmqUNYrcV338lf/6gH456HZ/PhX+5BcwHXG9ajESmwe6WRO0tAzRUrRmNONWgkrew==",
+      "integrity": "sha512-a54FxoJDIr27pgf7IgeQGxmqUNYrcV338lf/6gH456HZ/PhX+5BcwHXG9ajESmwe6WRO0tAzRUrRmNONWgkrew=="
-      "dev": true
     },
     "node_modules/regenerator-transform": {
       "version": "0.10.1",
@@ -19224,6 +19238,21 @@
         "spdx-expression-parse": "^3.0.0"
       }
     },
+    "node_modules/vant": {
+      "version": "2.12.54",
+      "resolved": "https://registry.npmmirror.com/vant/-/vant-2.12.54.tgz",
+      "integrity": "sha512-t7DCiLxNosDrg0Jm5EY9p0A5cAMo5OadmizbYtPEc0ru+OJKEa3kcfxtKIK5on7ZPqoOkyYJt8e6BQ1VDMPsrg==",
+      "dependencies": {
+        "@babel/runtime": "7.x",
+        "@vant/icons": "^1.7.1",
+        "@vant/popperjs": "^1.1.0",
+        "@vue/babel-helper-vue-jsx-merge-props": "^1.0.0",
+        "vue-lazyload": "1.2.3"
+      },
+      "peerDependencies": {
+        "vue": ">= 2.6.0"
+      }
+    },
     "node_modules/vary": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
@@ -19401,6 +19430,11 @@
       "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.26.8.tgz",
       "integrity": "sha512-BN2OXolO15AKS95yNF8oOtARibaO6RxyKkAYNV4XpOmL7S4eVZYMIDtyvDv+XGZaiUmBJSH9mdNqzexvGMnK2A=="
     },
+    "node_modules/vue-lazyload": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmmirror.com/vue-lazyload/-/vue-lazyload-1.2.3.tgz",
+      "integrity": "sha512-DC0ZwxanbRhx79tlA3zY5OYJkH8FYp3WBAnAJbrcuoS8eye1P73rcgAZhyxFSPUluJUTelMB+i/+VkNU/qVm7g=="
+    },
     "node_modules/vue-loader": {
       "version": "15.9.6",
       "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.9.6.tgz",
@@ -22253,7 +22287,6 @@
       "version": "7.12.5",
       "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.12.5.tgz",
       "integrity": "sha512-plcc+hbExy3McchJCEQG3knOsuh3HH+Prx1P6cLIkET/0dLuQDEnrT+s27Axgc9bqfsmNUNHfscgMUdBpC9xfg==",
-      "dev": true,
       "requires": {
         "regenerator-runtime": "^0.13.4"
       }
@@ -22602,11 +22635,20 @@
         }
       }
     },
+    "@vant/icons": {
+      "version": "1.8.0",
+      "resolved": "https://registry.npmmirror.com/@vant/icons/-/icons-1.8.0.tgz",
+      "integrity": "sha512-sKfEUo2/CkQFuERxvkuF6mGQZDKu3IQdj5rV9Fm0weJXtchDSSQ+zt8qPCNUEhh9Y8shy5PzxbvAfOOkCwlCXg=="
+    },
+    "@vant/popperjs": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmmirror.com/@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.npmjs.org/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.2.1.tgz",
-      "integrity": "sha512-QOi5OW45e2R20VygMSNhyQHvpdUwQZqGPc748JLGCYEy+yp8fNFNdbNIGAgZmi9e+2JHPd6i6idRuqivyicIkA==",
+      "integrity": "sha512-QOi5OW45e2R20VygMSNhyQHvpdUwQZqGPc748JLGCYEy+yp8fNFNdbNIGAgZmi9e+2JHPd6i6idRuqivyicIkA=="
-      "dev": true
     },
     "@vue/babel-plugin-transform-vue-jsx": {
       "version": "1.2.1",
@@ -23666,6 +23708,11 @@
       "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
       "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
     },
+    "amfe-flexible": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmmirror.com/amfe-flexible/-/amfe-flexible-2.2.1.tgz",
+      "integrity": "sha512-L2VfvDzoETBjhRptg5u/IUuzHSuxm22JpSRb404p/TBGeRfwWmmNEbB+TFPIP/sS/+pbM18bCFH9QnMojLuPNw=="
+    },
     "ansi-colors": {
       "version": "3.2.4",
       "resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-3.2.4.tgz",
@@ -35155,8 +35202,7 @@
     "regenerator-runtime": {
       "version": "0.13.7",
       "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.7.tgz",
-      "integrity": "sha512-a54FxoJDIr27pgf7IgeQGxmqUNYrcV338lf/6gH456HZ/PhX+5BcwHXG9ajESmwe6WRO0tAzRUrRmNONWgkrew==",
+      "integrity": "sha512-a54FxoJDIr27pgf7IgeQGxmqUNYrcV338lf/6gH456HZ/PhX+5BcwHXG9ajESmwe6WRO0tAzRUrRmNONWgkrew=="
-      "dev": true
     },
     "regenerator-transform": {
       "version": "0.10.1",
@@ -37319,6 +37365,18 @@
         "spdx-expression-parse": "^3.0.0"
       }
     },
+    "vant": {
+      "version": "2.12.54",
+      "resolved": "https://registry.npmmirror.com/vant/-/vant-2.12.54.tgz",
+      "integrity": "sha512-t7DCiLxNosDrg0Jm5EY9p0A5cAMo5OadmizbYtPEc0ru+OJKEa3kcfxtKIK5on7ZPqoOkyYJt8e6BQ1VDMPsrg==",
+      "requires": {
+        "@babel/runtime": "7.x",
+        "@vant/icons": "^1.7.1",
+        "@vant/popperjs": "^1.1.0",
+        "@vue/babel-helper-vue-jsx-merge-props": "^1.0.0",
+        "vue-lazyload": "1.2.3"
+      }
+    },
     "vary": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
@@ -37470,6 +37528,11 @@
       "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.26.8.tgz",
       "integrity": "sha512-BN2OXolO15AKS95yNF8oOtARibaO6RxyKkAYNV4XpOmL7S4eVZYMIDtyvDv+XGZaiUmBJSH9mdNqzexvGMnK2A=="
     },
+    "vue-lazyload": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmmirror.com/vue-lazyload/-/vue-lazyload-1.2.3.tgz",
+      "integrity": "sha512-DC0ZwxanbRhx79tlA3zY5OYJkH8FYp3WBAnAJbrcuoS8eye1P73rcgAZhyxFSPUluJUTelMB+i/+VkNU/qVm7g=="
+    },
     "vue-loader": {
       "version": "15.9.6",
       "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.9.6.tgz",

jero-web/package.json

@@ -13,6 +13,7 @@
     "@antv/data-set": "^0.11.4",
     "@tinymce/tinymce-vue": "^2.1.0",
     "@toast-ui/editor": "^2.1.2",
+    "amfe-flexible": "^2.2.1",
     "ant-design-vue": "^1.7.2",
     "area-data": "^5.0.6",
     "axios": "^0.21.1",
@@ -35,6 +36,7 @@
     "nprogress": "^0.2.0",
     "tinymce": "^5.3.2",
     "v-viewer": "^1.6.4",
+    "vant": "^2.12.54",
     "viser-vue": "^2.4.8",
     "vue": "^2.6.10",
     "vue-area-linkage": "^5.1.0",

jero-web/public/index.html

@@ -4,7 +4,8 @@
 <head>
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <meta name="viewport" content="width=device-width,initial-scale=1.0">
+  <meta name="renderer" content="webkit">
+  <meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1, user-scalable=no">
   <title>蔚来全球法规平台</title>
   <!--<link rel="icon" href="<%= BASE_URL %>logo.png">-->
   <script src="<%= BASE_URL %>cdn/babel-polyfill/polyfill_7_2_5.js"></script>

jero-web/src/components/tools/UserMenu.vue

@@ -32,7 +32,7 @@
     <!--      </a>-->
     <!--    </span>-->
     <div class="action" @click="Jumpflybook">
-      <span  class="header-notice">
+      <span class="header-notice">
          <a-tooltip placement="bottomRight" :title="$t('userManual')" overlayClassName="tooltipColor">
           <a-icon style="font-size: 16px; padding: 4px; color: #000000A6" type="question-circle"/>
            </a-tooltip>
@@ -214,8 +214,8 @@
       hiddenClick() {
         this.shows = false
       },
-      Jumpflybook(){
+      Jumpflybook() {
-        window.open('https://eicgyqr5mc.feishu.cn/docx/doxcnY2GbQfMSMqLP0eIFzFlEcd', '_blank');
+        window.open('https://eicgyqr5mc.feishu.cn/docx/doxcnY2GbQfMSMqLP0eIFzFlEcd', '_blank')
       },
       /* update_end author:zhaoxin date:20191129 for: 做头部菜单栏导航*/
       ...mapActions(['Logout']),
@@ -381,6 +381,7 @@
 
   .action {
     color: rgba(0, 0, 0, 0.65) !important;
+    font-size: 14px;
   }
 
   .action .avatar {

jero-web/src/config/router.config.js

@@ -477,6 +477,34 @@ export const constantRouterMap = [
     name: 'TaskPlanList',
     component: () => import(/* webpackChunkName: "user" */ '@/views/projectManagement/projectStatusBoard/components/TaskPlanList')
   },
+
+
+  /*  手机端开始  */
+   //搜索
+  {
+    path: '/phoneSearch',
+    name: 'phoneSearch',
+    component: () => import('@/views/phoneView/search')
+  },
+  //待办中心
+  {
+    path: '/phoneToDoCenter',
+    name: 'phoneToDoCenter',
+    component: () => import('@/views/phoneView/toDoCenter')
+  },
+  //任务数据
+  {
+    path: '/phoneTaskData',
+    name: 'phoneTaskData',
+    component: () => import('@/views/phoneView/taskData')
+  },
+  //我的
+  {
+    path: '/phoneHome',
+    name: 'phoneHome',
+    component: () => import('@/views/phoneView/home')
+  },
+  /*  手机端结束  */
   // {
   //   path:'/vehicleinformation',
   //   name: 'vehicleinformation',

jero-web/src/main.js

@@ -65,12 +65,16 @@ import '@/components/JVxeCells/install'
 // 挂载全局使用的方法
 import VueDraggableResizable from 'vue-draggable-resizable'
 
+import Vant from 'vant';
+import 'vant/lib/index.css';
+import 'amfe-flexible/index.js'
 Vue.component('vue-draggable-resizable', VueDraggableResizable)
 Vue.config.productionTip = false
 Vue.use(Storage, config.storageOptions)
 Vue.use(Antd)
 Vue.use(VueAxios, router)
 Vue.use(Viser)
+Vue.use(Vant);
 Vue.use(hasPermission)
 Vue.use(JDictSelectTag)
 Vue.use(Print)

jero-web/src/views/phoneView/components/header.vue

@@ -0,0 +1,30 @@
+<template>
+    <div class="header">
+      <van-nav-bar
+        title="标题"
+        left-text="返回"
+        right-text="按钮"
+        left-arrow
+        @click-left="onClickLeft"
+        @click-right="onClickRight"
+      />
+    </div>
+</template>
+
+<script>
+  export default {
+    name: 'header',
+    methods:{
+      onClickLeft(){
+
+      },
+      onClickRight(){
+
+      },
+    }
+  }
+</script>
+
+<style scoped>
+
+</style>

jero-web/src/views/phoneView/home.vue

@@ -0,0 +1,13 @@
+<template>
+
+</template>
+
+<script>
+  export default {
+    name: 'phoneHome'
+  }
+</script>
+
+<style scoped>
+
+</style>

jero-web/src/views/phoneView/search.vue

@@ -0,0 +1,193 @@
+<template>
+  <div class="box">
+    <div class="header-box">
+      <img src="~@/assets/logoOne.png" alt="">
+      <span class="logoTitle">NIO GRP</span>
+    </div>
+    <div class="content-box">
+      <van-search v-model="value" left-icon="none" right-icon="search" placeholder="搜索"/>
+    </div>
+    <div class="content-box-value">
+      <div class="left-img">
+        <img src="~@/assets/wendang.png" alt="">
+      </div>
+      <div class="text-left">
+        <div class="text-left-top">文档库</div>
+        <div class="text-left-button">已存储 3074 个文档</div>
+      </div>
+      <div class="text-right">
+        去查看
+      </div>
+    </div>
+    <div class="content-box-value">
+      <div class="left-img">
+        <img src="~@/assets/wendang.png" alt="">
+      </div>
+      <div class="text-left">
+        <div class="text-left-top">知识分享</div>
+        <div class="text-left-button">已存储 568 个知识分享</div>
+      </div>
+      <div class="text-right">
+        去查看
+      </div>
+    </div>
+    <div class="content-box-value">
+      <div class="left-img">
+        <img src="~@/assets/yuebao.png" alt="">
+      </div>
+      <div class="text-left">
+        <div class="text-left-top">法规月报</div>
+        <div class="text-left-button">已存储 2314 个法规月报</div>
+      </div>
+      <div class="text-right">
+        去查看
+      </div>
+    </div>
+    <van-tabbar v-model="active" @change="onChange">
+      <van-tabbar-item name="search" icon="search">搜索</van-tabbar-item>
+      <van-tabbar-item name="toDoCenter" icon="bell">待办中心</van-tabbar-item>
+      <van-tabbar-item name="taskData" icon="underway">任务统计</van-tabbar-item>
+      <van-tabbar-item name="home" icon="manager">我的</van-tabbar-item>
+    </van-tabbar>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'phoneSearch',
+    data() {
+      return {
+        active: 'search',
+        value: ''
+      }
+    },
+    methods: {
+      onChange(value) {
+        console.log(value)
+      }
+    }
+  }
+</script>
+
+<style scoped>
+  ::v-deep .van-tabbar-item--active {
+    color: #00B3BE;
+  }
+
+  .box {
+    padding: 0.4rem;
+  }
+
+  .header-box {
+    width: 100%;
+    text-align: center;
+    padding-top: 2.5rem;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .logoTitle {
+    font-size: 0.64rem;
+    margin-left: 0.24rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #040B29;
+  }
+
+  ::v-deep .van-search {
+    padding: 0;
+  }
+
+  .content-box {
+    margin-top: 1.2rem;
+  }
+
+  .content-box .van-search {
+    width: 100%;
+    height: 1.3rem;
+  }
+
+  ::v-deep .content-box .van-search .van-search__content {
+    height: 1.3rem;
+    background: #FFFFFF;
+    border-radius: 0.24rem 0.24rem 0.24rem 0.24rem;
+    opacity: 1;
+    border: 0.06rem solid #040B29;
+  }
+
+  ::v-deep .van-search__content .van-cell {
+    line-height: 0.96rem;
+  }
+
+  ::v-deep .van-field__body {
+    font-size: 0.4rem;
+  }
+
+  ::v-deep .van-field__body .van-field__right-icon .van-icon {
+    font-size: 0.52rem !important;
+    font-weight: 600 !important;
+  }
+
+  .content-box-value {
+    margin-top: 0.4rem;
+    background: #FFFFFF;
+    border-radius: 0.24rem 0.24rem 0.24rem 0.24rem;
+    opacity: 1;
+    border: 0.05rem solid #E6E7EC;
+    padding: 0.4rem;
+    box-sizing: border-box;
+    overflow: hidden;
+  }
+
+  .left-img {
+    width: 1.1rem;
+    height: 1.1rem;
+    background: #F6F7F8;
+    border-radius: 0.12rem;
+    text-align: center;
+    line-height: 1.1rem;
+    float: left;
+  }
+
+  .left-img img {
+    width: 0.58rem;
+    height: 0.58rem;
+  }
+
+  .text-left {
+    float: left;
+    margin-left: 0.3rem;
+    width: calc(100% - 3.4rem);
+  }
+
+  .text-left-top {
+    font-size: 0.38rem;
+    font-family: Blue Sky Noto-Bold, Blue Sky Noto;
+    font-weight: bold;
+    color: #41475E;
+  }
+
+  .text-left-button {
+    font-size: 0.26rem;
+    font-family: Blue Sky Noto-Light, Blue Sky Noto;
+    font-weight: 300;
+    color: #595E72;
+  }
+
+  .text-right {
+    width: 1.8rem;
+    height: 0.74rem;
+    background: rgba(0, 179, 190, 0.12);
+    border-radius: 99px 99px 99px 99px;
+    opacity: 1;
+    border: 1px solid rgba(0, 179, 190, 0.12);
+    float: right;
+    font-size: 0.3rem;
+    text-align: center;
+    line-height: 0.74rem;
+    font-weight: 500;
+    color: #00B3BE;
+    margin-top: 0.22rem;
+  }
+</style>

jero-web/src/views/phoneView/taskData.vue

@@ -0,0 +1,13 @@
+<template>
+
+</template>
+
+<script>
+  export default {
+    name: 'phoneTaskData'
+  }
+</script>
+
+<style scoped>
+
+</style>

jero-web/src/views/phoneView/toDoCenter.vue

@@ -0,0 +1,13 @@
+<template>
+
+</template>
+
+<script>
+  export default {
+    name: 'phoneToDoCenter'
+  }
+</script>
+
+<style scoped>
+
+</style>