[add] 企标立项、更改流程

src/App.vue

@@ -99,7 +99,7 @@ export default {
 
 /*头部导航固定*/
 .scroll-box {
-  height: calc(100vh - 0.88rem);
+  height: calc(100vh - 0.92rem);
   overflow: auto;
 }
 

src/assets/less/common.less

@@ -1,3 +1,41 @@
 @primary-color: #E63636;
 @font-color: #1D2129;
 @label-font-color: #767676;
+
+/* switch的样式 */
+.top-wrapper {
+  width: 100%;
+  height: 1.11rem;
+  background: #FFFFFF;
+  display: flex;
+  align-items: center;
+}
+
+.table-operator-tab {
+  width: 4.2rem;
+  height: 0.68rem;
+  line-height: 0.68rem;
+  margin: 0 auto;
+  background-color: #FFFFFF;
+  border-radius: 0.4rem 0.4rem 0.4rem 0.4rem;
+  border: 0.01rem solid @primary-color;
+  overflow: hidden;
+  display: flex;
+}
+
+.table-operator-tab a {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 2.1rem;
+  height: 0.68rem;
+  color: #1D2129;
+  font-size: 0.28rem;
+}
+
+.table-operator-tab a.table-operator-tab-active {
+  background-color: @primary-color;
+  color: #FFFFFF;
+}
+
+/* switch的样式--end */

src/common/lang/en-us.js

@@ -6,5 +6,15 @@ module.exports = {
   chinese: 'chinese',
   english: 'english',
   noMobile: '当前节点不支持手机端操作',
-  toPc: '请前往PC端进行操作'
+  toPc: '请前往PC端进行操作',
+  basicInformation: '基础信息',
+  personalInformation: '人员信息',
+  processInformation: '流程信息',
+  basicServiceInformation: '业务基本信息',
+  processApprovalInformation: '审批意见',
+  processName: '流程名称',
+  expirationDate: '截止日期',
+  processExplain: '流程说明',
+  pleaseSelect: '请选择',
+  pleaseEnter: '请输入'
 }

src/common/lang/zh-cn.js

@@ -6,5 +6,15 @@ module.exports = {
   chinese: '中',
   english: '英',
   noMobile: '当前节点不支持手机端操作',
-  toPc: '请前往PC端进行操作'
+  toPc: '请前往PC端进行操作',
+  basicInformation: '基础信息',
+  personalInformation: '人员信息',
+  processInformation: '流程信息',
+  basicServiceInformation: '业务基本信息',
+  processApprovalInformation: '审批意见',
+  processName: '流程名称',
+  expirationDate: '截止日期',
+  processExplain: '流程说明',
+  pleaseSelect: '请选择',
+  pleaseEnter: '请输入'
 }

src/mixins/WorkCenterMixin.js

@@ -0,0 +1,14 @@
+export const WorkCenterMixin = {
+  data () {
+    return {
+      personnelInfoData: [], // 需要传给PersonnelInfo的数据
+      switchValue: 'base'
+    }
+  },
+  methods: {
+    // switch切换
+    switchChange (value) {
+      this.switchValue = value
+    }
+  }
+}

src/router/index.js

@@ -1,5 +1,6 @@
 import Vue from 'vue'
 import VueRouter from 'vue-router'
+import workCenter from './workCenter'
 
 Vue.use(VueRouter)
 
@@ -41,7 +42,8 @@ const routes = [
   {
     path: '*',
     redirect: '/'
-  }
+  },
+  ...workCenter
 ]
 
 const originalPush = VueRouter.prototype.push

src/router/workCenter/index.js

@@ -0,0 +1,13 @@
+export default [
+  {
+    path: '/workCenter/enterpriseStandardInitChange',
+    name: 'EnterpriseStandardInitChange',
+    component: (resolve) => require(['@/views/workCenter/enterpriseStandardInitChange/EnterpriseStandardInitChange.vue'], resolve),
+    meta: {
+      title: '企标计划立项/变更流程',
+      hasTabbar: false, // 这个属性控制页面是否显示tabbar
+      hasNavBar: true, // 这个属性控制页面是否显示上面的导航栏
+      leftArrow: true // 这个属性控制页面上面的导航栏 是否有返回按钮
+    }
+  }
+]

src/views/Home.vue

@@ -1,12 +1,20 @@
 <template>
   <div class="home">
     首页
+    <van-button type="primary" @click="goEnterpriseStandardInitChange">跳转企标计划立项、变更流程审批</van-button>
   </div>
 </template>
 
 <script>
 export default {
-  name: 'Home'
+  name: 'Home',
+  methods: {
+    goEnterpriseStandardInitChange () {
+      this.$router.push({
+        path: '/workCenter/enterpriseStandardInitChange'
+      })
+    }
+  }
 }
 </script>
 

src/views/workCenter/enterpriseStandardInitChange/EnterpriseStandardInitChange.vue

@@ -0,0 +1,94 @@
+<template>
+  <div class="content-wrapper">
+    <div class="top-wrapper">
+      <div class="table-operator-tab">
+        <a class="switch-item" :class="switchValue === 'base' ? 'table-operator-tab-active' : ''"
+           @click="switchChange('base')">{{ $t('basicInformation') }}
+        </a>
+        <a class="switch-item" :class="switchValue === 'user' ? 'table-operator-tab-active' : ''"
+           @click="switchChange('user')">{{ $t('personalInformation') }}
+        </a>
+      </div>
+    </div>
+    <van-collapse v-model="activeNames">
+      <!--  流程信息 -->
+      <van-collapse-item :title="$t('processInformation')" name="processInformation">
+        <van-form
+          @failed="onFailed"
+          @submit="onSubmit"
+          ref="form"
+          input-align="right"
+          error-message-align="right"
+          :readonly="readonly"
+        >
+          <!--  流程名称  -->
+          <van-field
+            :label="$t('processName')"
+            :placeholder="$t('pleaseEnter') + $t('processName')"
+            readonly
+            maxLength="50"
+            v-model="processInfoForm.prcName" />
+          <!--   截止日期  -->
+<!--          <van-datetime-picker-->
+<!--            :label="$t('expirationDate')"-->
+<!--            v-model="processInfoForm.dueTime"-->
+<!--            type="date"-->
+<!--            readonly-->
+<!--          />-->
+        </van-form>
+      </van-collapse-item>
+      <!--   业务基本信息  -->
+      <van-collapse-item :title="$t('basicServiceInformation')" name="basicServiceInformation">
+        {{ $t('basicServiceInformation') }}
+      </van-collapse-item>
+      <!--   审批意见  -->
+      <van-collapse-item :title="$t('processApprovalInformation')" name="processApprovalInformation" :is-link="false" disabled>
+        {{ $t('processApprovalInformation') }}
+      </van-collapse-item>
+    </van-collapse>
+  </div>
+</template>
+
+<script>
+import { WorkCenterMixin } from '@/mixins/WorkCenterMixin'
+
+export default {
+  name: 'EnterpriseStandardInitChange',
+  mixins: [WorkCenterMixin],
+  data () {
+    return {
+      // 最外层折叠面板当前展开
+      activeNames: [
+        'processInformation',
+        'basicServiceInformation',
+        'processApprovalInformation'
+      ],
+      readonly: false,
+      processInfoForm: {} // 流程信息表单
+    }
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style scoped lang="less">
+@import '~@assets/less/common.less';
+
+.content-wrapper {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  gap: 0.16rem;
+}
+
+/deep/ .van-collapse-item__title--disabled {
+  color: #323233;
+}
+
+/deep/ .van-collapse {
+  display: grid;
+  gap: 0.16rem;
+}
+</style>