页面上方标题组件；普通项目管理和工作组项目管理接口联调

src/components/ProgressBar.vue

@@ -1,22 +1,25 @@
 <!--进度组件-->
 <template>
-  <div class="progress">
-    <!--    将全部付款和部分付款放入一个div中-->
-    <div class="full-and-partial"
-         :style="{width: (data.payInFull + data.partialPayment)/(data.payInFull + data.partialPayment + data.nonPayment) * 100 + '%'}">
-      <div :style="{width: data.payInFull/(data.payInFull + data.partialPayment) * 100 + '%'}"
-           class="progress-item pay-in-full">
-        {{ data.payInFull }}
+  <div>
+    <div class="progress" v-if="(data.allPayment + data.partPayment + data.notPayment) !== 0">
+      <!--    将全部付款和部分付款放入一个div中-->
+      <div class="full-and-partial"
+           :style="{width: (data.allPayment + data.partPayment)/(data.allPayment + data.partPayment + data.notPayment) * 100 + '%'}">
+        <div :style="{width: data.allPayment/(data.allPayment + data.partPayment) * 100 + '%'}"
+             class="progress-item pay-in-full">
+          {{ data.allPayment }}
+        </div>
+        <div :style="{width: data.partPayment/(data.allPayment + data.partPayment) * 100 + '%'}"
+             class="progress-item partial-payment">
+          {{ data.partPayment }}
+        </div>
       </div>
-      <div :style="{width: data.partialPayment/(data.payInFull + data.partialPayment) * 100 + '%'}"
-           class="progress-item partial-payment">
-        {{ data.partialPayment }}
+      <div :style="{width: data.notPayment/(data.allPayment + data.partPayment + data.notPayment) * 100 + '%'}"
+           class="progress-item non-payment">
+        {{ data.notPayment }}
       </div>
     </div>
-    <div :style="{width: data.nonPayment/(data.payInFull + data.partialPayment + data.nonPayment) * 100 + '%'}"
-         class="progress-item non-payment">
-      {{ data.nonPayment }}
-    </div>
+    <div class="progress progress-null" v-else>0</div>
   </div>
 </template>
 
@@ -27,9 +30,9 @@ export default {
     /**
      * 进度字段，
      * {
-     *   payInFull: 10, // 已付全款
-     *   partialPayment: 10, // 部分付款
-     *   nonPayment: 10, // 未付款
+     *   allPayment: 10, // 已付全款
+     *   partPayment: 10, // 部分付款
+     *   notPayment: 10, // 未付款
      * }
      */
     data: {
@@ -46,35 +49,42 @@ export default {
 <style scoped lang="less">
 .progress {
   border-radius: 10px;
-  background-color: rgb(232, 232, 232);
+  background: #e8e8e8;
   height: 20px;
   width: 100%;
   display: flex;
+
+  &-null {
+    justify-content: center;
+  }
 }
 
 .full-and-partial {
-  background-color: rgb(0, 133, 192);
+  background: linear-gradient(0deg,#0075a9 0%, #008dcc 100%);
   display: flex;
   border-radius: 10px;
+  box-sizing: border-box;
 }
 
 .progress-item {
+  height: 20px;
   border-radius: 10px;
   color: white;
   line-height: 20px;
   text-align: center;
+  box-sizing: border-box;
 }
 
 .pay-in-full {
-  background-color: rgb(7, 168, 161);
+  background: linear-gradient(0deg,#069f99 0%, #07b1aa 100%);
 }
 
 .partial-payment {
-  background-color: rgb(0, 133, 192);
+  background: linear-gradient(0deg,#0075a9 0%, #008dcc 100%);
 }
 
 .non-payment {
-  color: rgb(88,100,95);
-  background-color: rgb(232, 232, 232);
+  color: #57635e;
+  background: #e8e8e8;
 }
 </style>

src/components/company/SelectContacts.vue

@@ -8,7 +8,8 @@
                   v-on="$listeners"
                   show-search
                   option-filter-prop="children"
-                  :filter-option="filterOption">
+                  :filter-option="filterOption"
+                  @dropdownVisibleChange="handleDropdownOpen">
           <a-select-option v-for="item in contactsList" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
         </a-select>
       </a-col>
@@ -40,6 +41,14 @@ export default {
         return {}
       }
     },
+    // 编辑时回显的数据, 需要id，name两个字段
+    initfContacts: {
+      type: Object,
+      required: false,
+      default: () => {
+        return {}
+      }
+    },
     value: {
       type: String,
       required: false,
@@ -49,13 +58,12 @@ export default {
   data() {
     return {
       contactsList: [], // 该企业下联系人列表
+      isFirstOpen: true, // 编辑状态下是否为第一次打开
     }
   },
   created() {
     // 编辑 第一次不回显的问题
-    if(this.selectedCompany!== null && this.selectedCompany.hasOwnProperty('id')){
-      this.getContactsList()
-    }
+    this.getContactsList()
   },
   watch: {
     /**
@@ -66,6 +74,15 @@ export default {
         this.getContactsList()
       },
       deep: true
+    },
+    /**
+     * 编辑联系人变化
+     */
+    initfContacts: {
+      handler() {
+        this.isFirstOpen = true
+      },
+      deep: true
     }
   },
   methods: {
@@ -73,12 +90,15 @@ export default {
      * 获取联系人数据
      */
     getContactsList() {
-      if (this.selectedCompany) {
+      if (this.selectedCompany && this.selectedCompany.hasOwnProperty('id')) {
         const params = {
           companyId: this.selectedCompany.id
         }
         getContactsByCompany(params).then(res => {
           this.contactsList = res.result
+          if (this.initfContacts && this.initfContacts.hasOwnProperty('id')) {
+            this.contactsList.push(this.initfContacts)
+          }
         })
       }
     },
@@ -99,6 +119,17 @@ export default {
       return (
           option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
       );
+    },
+    handleDropdownOpen() {
+      if (this.isFirstOpen && this.initfContacts && this.initfContacts.hasOwnProperty('id')) {
+        this.contactsList.forEach((item, index) => {
+          if (item.id === this.initfContacts.id) {
+            this.$emit('change', undefined)
+            this.contactsList.splice(index, 1)
+          }
+        })
+        this.isFirstOpen = false
+      }
     }
   },
   model: {

src/components/company/SelectPrincipal.vue

@@ -5,7 +5,7 @@
             show-search
             option-filter-prop="children"
             :filter-option="filterOption">
-    <a-select-option v-for="item in userList" :key="item.id" :value="item.id">{{ `${item.username}(${item.orgCodeTxt})` }}</a-select-option>
+    <a-select-option v-for="item in userList" :key="item.id" :value="item.id">{{ `${item.realname}(${item.orgCodeTxt})` }}</a-select-option>
   </a-select>
 </template>
 

src/components/layouts/PageHeaderTitle.vue

@@ -0,0 +1,76 @@
+<template>
+  <div class="page-header">
+    <!--    页面-->
+    <template v-if="isLevelOne">
+      <img :src="imgForIcon" class="page-header-icon">
+      <span class="page-header-title">{{ $route.meta.title }}</span>
+    </template>
+    <!--    需要有返回操作的页面-->
+    <template v-else>
+      <img :src="IconBack" class="page-header-icon page-header-icon-back" @click="backPage">
+      <span class="page-header-title">{{ levelTwoTitle }}</span>
+    </template>
+  </div>
+</template>
+
+<script>
+import IconBack from '@/assets/imgs/icon/icon_back.png'
+
+export default {
+  name: 'PageHeaderTitle',
+  props: {
+    // 是否为一级菜单
+    isLevelOne: {
+      type: Boolean,
+      default: true
+    },
+    // 图标图片
+    imgForIcon: {
+      type: String,
+      default: ''
+    },
+    // 有返回页面的标题
+    levelTwoTitle: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      IconBack
+    }
+  },
+  methods: {
+    backPage() {
+      this.$router.go(-1)
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+.page-header {
+  height: 60px;
+  background: #ffffff;
+  margin-bottom: 2px;
+  display: flex;
+  align-items: center;
+  padding-left: 20px;
+
+  &-icon {
+    height: 20px;
+    max-width: 30px;
+  }
+
+  &-icon-back {
+    cursor: pointer;
+  }
+
+  &-title {
+    margin-left: 10px;
+    font-size: 16px;
+    font-family: PingFang SC, PingFang SC-Medium;
+    color: #666666;
+  }
+}
+</style>

src/views/businessManagement/BusinessManagement.vue

@@ -1,75 +1,80 @@
 <template>
-  <a-card :bordered="false">
-    <!--    查询区域-start -->
-    <div class="table-page-search-wrapper">
-      <a-form layout="inline" @keyup.enter.native="searchQuery">
-        <a-row>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
-            <a-form-item label="企业名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-input placeholder="请输入企业名称" v-model="queryParam.companyName"></a-input>
-            </a-form-item>
-          </a-col>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
+  <div>
+    <page-header-title :img-for-icon="IconImg"></page-header-title>
+    <a-card :bordered="false">
+      <!--    查询区域-start -->
+      <div class="table-page-search-wrapper">
+        <a-form layout="inline" @keyup.enter.native="searchQuery">
+          <a-row>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="企业名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input placeholder="请输入企业名称" v-model="queryParam.companyName"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
             <span class="table-page-search-submitButtons">
               <a-button type="primary" icon="search" @click="searchQuery">查询</a-button>
               <a-button icon="reload" @click="searchReset">重置</a-button>
             </span>
-          </a-col>
-        </a-row>
-      </a-form>
-    </div>
-    <!--    查询区域-end-->
+            </a-col>
+          </a-row>
+        </a-form>
+      </div>
+      <!--    查询区域-end-->
 
-    <!--    操作按钮区域-->
-    <div class="table-operator">
-      <a-button type="primary" icon="plus" @click="handleAdd">新增</a-button>
-      <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
-        <a-button type="primary" icon="import">导入</a-button>
-      </a-upload>
-      <a-button type="primary" icon="export" @click="handleExportXls('企业管理')">导出</a-button>
-      <a-button type="primary" icon="download" @click="downTemplate('企业管理导入模板')">下载模板</a-button>
-      <a-button type="danger" icon="delete" @click="batchDel">批量删除</a-button>
-    </div>
-    <!--    操作按钮区域-end-->
+      <!--    操作按钮区域-->
+      <div class="table-operator">
+        <a-button type="primary" icon="plus" @click="handleAdd">新增</a-button>
+        <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
+          <a-button type="primary" icon="import">导入</a-button>
+        </a-upload>
+        <a-button type="primary" icon="export" @click="handleExportXls('企业管理')">导出</a-button>
+        <a-button type="primary" icon="download" @click="downTemplate('企业管理导入模板')">下载模板</a-button>
+        <a-button type="danger" icon="delete" @click="batchDel">批量删除</a-button>
+      </div>
+      <!--    操作按钮区域-end-->
 
-    <!--    table表格区域-->
-    <div>
-      <a-table
-          ref="table"
-          size="middle"
-          bordered
-          rowKey="id"
-          :columns="columns"
-          :scroll="{x: 1500}"
-          :dataSource="dataSource"
-          :pagination="ipagination"
-          :loading="loading"
-          :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
-          @change="handleTableChange"
-          class="j-table-force-nowrap">
+      <!--    table表格区域-->
+      <div>
+        <a-table
+            ref="table"
+            size="middle"
+            bordered
+            rowKey="id"
+            :columns="columns"
+            :scroll="{x: 1500}"
+            :dataSource="dataSource"
+            :pagination="ipagination"
+            :loading="loading"
+            :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
+            @change="handleTableChange"
+            class="j-table-force-nowrap">
 
-        <template slot="text" slot-scope="text,record">
-          <j-ellipsis :value="text" :length="18"></j-ellipsis>
-        </template>
+          <template slot="text" slot-scope="text,record">
+            <j-ellipsis :value="text" :length="18"></j-ellipsis>
+          </template>
 
-        <span slot="action" class="action-span-cell" slot-scope="text, record">
+          <span slot="action" class="action-span-cell" slot-scope="text, record">
           <a @click="handleEdit(record)">编辑</a>
           <a @click="handleDelete(record.id)">删除</a>
         </span>
-      </a-table>
-    </div>
-    <business-management-module ref="modalForm" @ok="modalFormOk"></business-management-module>
-  </a-card>
+        </a-table>
+      </div>
+      <business-management-module ref="modalForm" @ok="modalFormOk"></business-management-module>
+    </a-card>
+  </div>
 </template>
 
 <script>
 import { JeroListMixin } from '@/mixins/JeroListMixin'
 import JEllipsis from '@comp/jero/JEllipsis'
 import BusinessManagementModule from './modules/BusinessManagementModule'
+import PageHeaderTitle from '@comp/layouts/PageHeaderTitle'
+import IconImg from '@/assets/imgs/icon/icon_company_management.png'
 
 export default {
   name: 'BusinessManagement',
-  components: { JEllipsis, BusinessManagementModule },
+  components: { JEllipsis, BusinessManagementModule, PageHeaderTitle },
   mixins: [JeroListMixin],
   computed: {
     importExcelUrl: function(){
@@ -78,6 +83,7 @@ export default {
   },
   data() {
     return {
+      IconImg,
       labelCol: {
         xs: { span: 24 },
         sm: { span: 5 }

src/views/businessManagement/ContactManagement.vue

@@ -1,84 +1,89 @@
 <template>
-  <a-card :bordered="false">
-    <!--    查询区域-start -->
-    <div class="table-page-search-wrapper">
-      <a-form layout="inline" @keyup.enter.native="searchQuery">
-        <a-row>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
-            <a-form-item label="姓名" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-input placeholder="请输入姓名" v-model="queryParam.name"></a-input>
-            </a-form-item>
-          </a-col>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
-            <a-form-item label="企业名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-input placeholder="请输入企业名称" v-model="queryParam.companyName"></a-input>
-            </a-form-item>
-          </a-col>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
-            <a-form-item label="手机号" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-input placeholder="请输入手机号" v-model="queryParam.phone"></a-input>
-            </a-form-item>
-          </a-col>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
+  <div>
+    <page-header-title :img-for-icon="IconImg"></page-header-title>
+    <a-card :bordered="false">
+      <!--    查询区域-start -->
+      <div class="table-page-search-wrapper">
+        <a-form layout="inline" @keyup.enter.native="searchQuery">
+          <a-row>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="姓名" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input placeholder="请输入姓名" v-model="queryParam.name"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="企业名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input placeholder="请输入企业名称" v-model="queryParam.companyName"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="手机号" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input placeholder="请输入手机号" v-model="queryParam.phone"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
             <span class="table-page-search-submitButtons">
               <a-button type="primary" icon="search" @click="searchQuery">查询</a-button>
               <a-button icon="reload" @click="searchReset">重置</a-button>
             </span>
-          </a-col>
-        </a-row>
-      </a-form>
-    </div>
-    <!--    查询区域-end-->
+            </a-col>
+          </a-row>
+        </a-form>
+      </div>
+      <!--    查询区域-end-->
 
-    <!--    操作按钮区域-->
-    <div class="table-operator">
-      <a-button type="primary" icon="plus" @click="handleAdd">新增</a-button>
-      <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
-        <a-button type="primary" icon="import">导入</a-button>
-      </a-upload>
-      <a-button type="primary" icon="export" @click="handleExportXls('联系人管理')">导出</a-button>
-      <a-button type="primary" icon="download" @click="downTemplate('联系人管理导入模板')">下载模板</a-button>
-      <a-button type="danger" icon="delete" @click="batchDel">批量删除</a-button>
-    </div>
-    <!--    操作按钮区域-end-->
+      <!--    操作按钮区域-->
+      <div class="table-operator">
+        <a-button type="primary" icon="plus" @click="handleAdd">新增</a-button>
+        <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
+          <a-button type="primary" icon="import">导入</a-button>
+        </a-upload>
+        <a-button type="primary" icon="export" @click="handleExportXls('联系人管理')">导出</a-button>
+        <a-button type="primary" icon="download" @click="downTemplate('联系人管理导入模板')">下载模板</a-button>
+        <a-button type="danger" icon="delete" @click="batchDel">批量删除</a-button>
+      </div>
+      <!--    操作按钮区域-end-->
 
-    <!--    table表格区域-->
-    <div>
-      <a-table
-          ref="table"
-          size="middle"
-          bordered
-          rowKey="id"
-          :columns="columns"
-          :scroll="{x: 1500}"
-          :dataSource="dataSource"
-          :pagination="ipagination"
-          :loading="loading"
-          :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
-          @change="handleTableChange"
-          class="j-table-force-nowrap">
+      <!--    table表格区域-->
+      <div>
+        <a-table
+            ref="table"
+            size="middle"
+            bordered
+            rowKey="id"
+            :columns="columns"
+            :scroll="{x: 1500}"
+            :dataSource="dataSource"
+            :pagination="ipagination"
+            :loading="loading"
+            :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
+            @change="handleTableChange"
+            class="j-table-force-nowrap">
 
-        <template slot="text" slot-scope="text,record">
-          <j-ellipsis :value="text" :length="18"></j-ellipsis>
-        </template>
+          <template slot="text" slot-scope="text,record">
+            <j-ellipsis :value="text" :length="18"></j-ellipsis>
+          </template>
 
-        <span slot="action" class="action-span-cell" slot-scope="text, record">
+          <span slot="action" class="action-span-cell" slot-scope="text, record">
           <a @click="handleEdit(record)">编辑</a>
           <a @click="handleDelete(record.id)">删除</a>
         </span>
-      </a-table>
-    </div>
-    <contact-management-module ref="modalForm" @ok="modalFormOk"></contact-management-module>
-  </a-card>
+        </a-table>
+      </div>
+      <contact-management-module ref="modalForm" @ok="modalFormOk"></contact-management-module>
+    </a-card>
+  </div>
 </template>
 
 <script>
 import { JeroListMixin } from '@/mixins/JeroListMixin'
 import ContactManagementModule from './modules/ContactManagementModule'
+import PageHeaderTitle from '@comp/layouts/PageHeaderTitle'
+import IconImg from '@/assets/imgs/icon/icon_company_management.png'
 
 export default {
   name: 'ContactManagement',
-  components: { ContactManagementModule },
+  components: { ContactManagementModule, PageHeaderTitle },
   mixins: [JeroListMixin],
   computed: {
     importExcelUrl: function(){
@@ -87,6 +92,7 @@ export default {
   },
   data() {
     return {
+      IconImg,
       labelCol: {
         xs: { span: 24 },
         sm: { span: 5 }

src/views/projectManagement/GeneralProjectManagement.vue

@@ -1,106 +1,109 @@
 <template>
-  <a-card :bordered="false">
-    <!--    查询区域-start -->
-    <div class="table-page-search-wrapper">
-      <a-form layout="inline" @keyup.enter.native="searchQuery">
-        <a-row>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
-            <a-form-item label="来款项目" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-input placeholder="请输入来款项目" v-model="queryParam.chargeProject"></a-input>
-            </a-form-item>
-          </a-col>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
-            <a-form-item label="来款单位" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-input placeholder="请输入来款单位" v-model="queryParam.chargeCompanyName"></a-input>
-            </a-form-item>
-          </a-col>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
-            <a-form-item label="负责人" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <select-principal placeholder="请选择负责人" v-model="queryParam.principalId"></select-principal>
-            </a-form-item>
-          </a-col>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
-            <a-form-item label="来款用途" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <j-dict-select-tag v-model="queryParam.chargeUse" placeholder="请选择来款用途" dictCode="payment_charge_use"/>
-            </a-form-item>
-          </a-col>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
-            <a-form-item label="联系人" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-input placeholder="请输入来款项目" v-model="queryParam.businessName"></a-input>
-            </a-form-item>
-          </a-col>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
-            <a-form-item label="来款年份" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <j-year-date style="width:100%" placeholder="请选择来款年份" v-model="queryParam.paymentDate"></j-year-date>
-            </a-form-item>
-          </a-col>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
-            <a-form-item label="运行年份" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <j-year-date style="width:100%" placeholder="请选择运行年份" v-model="queryParam.year"></j-year-date>
-            </a-form-item>
-          </a-col>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
+  <div>
+    <page-header-title :img-for-icon="IconProjectManagement"></page-header-title>
+    <a-card :bordered="false">
+      <!--    查询区域-start -->
+      <div class="table-page-search-wrapper">
+        <a-form layout="inline" @keyup.enter.native="searchQuery">
+          <a-row>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="来款项目" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input placeholder="请输入来款项目" v-model="queryParam.chargeProject"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="来款单位" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input placeholder="请输入来款单位" v-model="queryParam.chargeCompanyName"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="负责人" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <select-principal placeholder="请选择负责人" v-model="queryParam.principalId"></select-principal>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="来款用途" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <j-dict-select-tag v-model="queryParam.chargeUse" placeholder="请选择来款用途" dictCode="payment_charge_use"/>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="联系人" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input placeholder="请输入来款项目" v-model="queryParam.businessName"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="来款年份" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <j-year-date style="width:100%" placeholder="请选择来款年份" v-model="queryParam.paymentDate"></j-year-date>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="运行年份" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <j-year-date style="width:100%" placeholder="请选择运行年份" v-model="queryParam.year"></j-year-date>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
             <span class="table-page-search-submitButtons">
               <a-button type="primary" icon="search" @click="searchQuery">查询</a-button>
               <a-button icon="reload" @click="searchReset">重置</a-button>
             </span>
-          </a-col>
-        </a-row>
-      </a-form>
-    </div>
-    <!--    查询区域-end-->
+            </a-col>
+          </a-row>
+        </a-form>
+      </div>
+      <!--    查询区域-end-->
 
-    <!--    操作按钮区域-->
-    <div class="table-operator">
-      <a-button type="primary" icon="plus" @click="handleAdd">新增</a-button>
-      <a-button type="danger" icon="delete" @click="batchDel">批量删除</a-button>
-    </div>
-    <!--    操作按钮区域-end-->
+      <!--    操作按钮区域-->
+      <div class="table-operator">
+        <a-button type="primary" icon="plus" @click="handleAdd">新增</a-button>
+        <a-button type="danger" icon="delete" @click="batchDel">批量删除</a-button>
+      </div>
+      <!--    操作按钮区域-end-->
 
-    <!--    table表格区域-->
-    <div>
-      <a-table
-          ref="table"
-          size="middle"
-          bordered
-          rowKey="id"
-          :columns="columns"
-          :scroll="{x: 1000}"
-          :dataSource="dataSource"
-          :pagination="ipagination"
-          :loading="loading"
-          :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
-          @change="handleTableChange"
-          class="j-table-force-nowrap">
+      <!--    table表格区域-->
+      <div>
+        <a-table
+            ref="table"
+            size="middle"
+            bordered
+            rowKey="id"
+            :columns="columns"
+            :scroll="{x: 1000}"
+            :dataSource="dataSource"
+            :pagination="ipagination"
+            :loading="loading"
+            :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
+            @change="handleTableChange"
+            class="j-table-force-nowrap">
 
-        <!--        项目名称-->
-        <template slot="projectName" slot-scope="text, record">
-          <j-ellipsis :value="text" :length="18" class="primary-color" @click="openDetailModal(record)"></j-ellipsis>
-        </template>
+          <!--        项目名称-->
+          <template slot="projectName" slot-scope="text, record">
+            <j-ellipsis :value="text" :length="18" class="primary-color" @click="openDetailModal(record)"></j-ellipsis>
+          </template>
 
 
-        <template slot="text" slot-scope="text,record">
-          <j-ellipsis :value="text" :length="18"></j-ellipsis>
-        </template>
+          <template slot="text" slot-scope="text,record">
+            <j-ellipsis :value="text" :length="18"></j-ellipsis>
+          </template>
 
-        <!--        打包、需要发票、到账、开票、邮寄状态-->
-        <template slot="status" slot-scope="text,record">
-          <status-slot :statu-obj="record" :status-no="text" :status-type="true"></status-slot>
-        </template>
+          <!--        打包、需要发票、到账、开票、邮寄状态-->
+          <template slot="status" slot-scope="text,record">
+            <status-slot :statu-obj="record" :status-no="text" :status-type="true"></status-slot>
+          </template>
 
-        <template slot="status-pack" slot-scope="text,record">
-          <status-slot :statu-obj="record" :status-no="text"></status-slot>
-        </template>
+          <template slot="status-pack" slot-scope="text,record">
+            <status-slot :statu-obj="record" :status-no="text"></status-slot>
+          </template>
 
-        <span slot="action" class="action-span-cell" slot-scope="text, record">
+          <span slot="action" class="action-span-cell" slot-scope="text, record">
           <a @click="handleEdit(record)">编辑</a>
           <a @click="handleDelete(record.id)">删除</a>
         </span>
-      </a-table>
-    </div>
-    <general-project-module ref="modalForm" @ok="modalFormOk"></general-project-module>
-    <project-detail-modal ref="projectDetail"></project-detail-modal>
-  </a-card>
+        </a-table>
+      </div>
+      <general-project-module ref="modalForm" @ok="modalFormOk"></general-project-module>
+      <project-detail-modal ref="projectDetail"></project-detail-modal>
+    </a-card>
+  </div>
 </template>
 
 <script>
@@ -110,19 +113,21 @@ import GeneralProjectModule from './modules/GeneralProjectModule'
 import SelectPrincipal from '@comp/company/SelectPrincipal'
 import ProjectDetailModal from '@comp/ProjectDetailModal'
 import StatusSlot from '@comp/tools/StatusSlot'
-
+import PageHeaderTitle from '@comp/layouts/PageHeaderTitle'
+import IconProjectManagement from '@/assets/imgs/icon/icon_project_management.png'
 
 export default {
   name: 'GeneralProjectManagement',
-  components: { JYearDate, GeneralProjectModule, SelectPrincipal, ProjectDetailModal, StatusSlot },
+  components: { JYearDate, GeneralProjectModule, SelectPrincipal, ProjectDetailModal, StatusSlot, PageHeaderTitle },
   mixins: [JeroListMixin],
   computed: {
-    importExcelUrl: function(){
-      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
-    },
+    importExcelUrl: function () {
+      return `${ window._CONFIG['domianURL'] }/${ this.url.importExcelUrl }`
+    }
   },
   data() {
     return {
+      IconProjectManagement,
       labelCol: {
         xs: { span: 24 },
         sm: { span: 5 }
@@ -231,8 +236,7 @@ export default {
     /*
     * 打开项目详情模态框
     * */
-    openDetailModal(record){
-      console.log(record)
+    openDetailModal(record) {
       const basicInfo = {
         principalName: record.principalName,
         receivableAmount: record.receivableAmount,
@@ -240,7 +244,7 @@ export default {
       }
       this.$refs.basicInfo = basicInfo
       this.$refs.projectDetail.open(record)
-    },
+    }
   }
 }
 </script>

src/views/projectManagement/MemberUnitMaintenance.vue

@@ -1,117 +1,113 @@
 <template>
-  <a-card :bordered="false">
-    <!--    标题区域-->
-    <div class="title">
-      <a-icon type="left" :style="{ fontSize: '22px' }" @click="backWorkingGroupProject"></a-icon>
-      <span class="title-text">{{ workingGroupProject }}</span>
-    </div>
-    <div class="divider"></div>
-    <!--    /标题区域-->
+  <div>
+    <page-header-title :is-level-one="false" :level-two-title="workingGroupProject"></page-header-title>
+    <a-card :bordered="false">
+      <!--    工作组信息区域-->
+      <div class="work-group-detail">
+        <div class="work-group-detail-item work-group-detail-item-small" v-for="item in detailTitleList"
+             :key="item.title">
+          <div class="work-group-detail-item-title">{{ item.title }}:</div>
+          <div class="work-group-detail-item-content"></div>
+        </div>
+        <div class="work-group-detail-item">
+          <div class="work-group-detail-item-title">任务及目标:</div>
+          <div class="work-group-detail-item-content"></div>
+        </div>
+        <div class="work-group-detail-item">
+          <div class="work-group-detail-item-title">备注:</div>
+          <div class="work-group-detail-item-content"></div>
+        </div>
+      </div>
+      <!--    /工作组信息区域-->
 
-    <!--    工作组信息区域-->
-    <div class="work-group-detail">
-      <div class="work-group-detail-item work-group-detail-item-small" v-for="item in detailTitleList"
-           :key="item.title">
-        <div class="work-group-detail-item-title">{{ item.title }}:</div>
-        <div class="work-group-detail-item-content"></div>
-      </div>
-      <div class="work-group-detail-item">
-        <div class="work-group-detail-item-title">任务及目标:</div>
-        <div class="work-group-detail-item-content"></div>
-      </div>
-      <div class="work-group-detail-item">
-        <div class="work-group-detail-item-title">备注:</div>
-        <div class="work-group-detail-item-content"></div>
-      </div>
-    </div>
-    <!--    /工作组信息区域-->
-
-    <!--    查询区域-->
-    <div class="table-page-search-wrapper">
-      <a-form layout="inline" @keyup.enter.native="searchQuery">
-        <a-row>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
-            <a-form-item label="成员单位" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-input placeholder="请输入成员单位" v-model="queryParam.workingGroupProject"></a-input>
-            </a-form-item>
-          </a-col>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
-            <a-form-item label="来款年份" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <j-year-date style="width:100%" placeholder="请选择年份" v-model="queryParam.year"></j-year-date>
-            </a-form-item>
-          </a-col>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
+      <!--    查询区域-->
+      <div class="table-page-search-wrapper">
+        <a-form layout="inline" @keyup.enter.native="searchQuery">
+          <a-row>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="成员单位" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input placeholder="请输入成员单位" v-model="queryParam.workingGroupProject"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="来款年份" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <j-year-date style="width:100%" placeholder="请选择年份" v-model="queryParam.year"></j-year-date>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
             <span class="table-page-search-submitButtons">
               <a-button type="primary" icon="search" @click="searchQuery">查询</a-button>
               <a-button icon="reload" @click="searchReset">重置</a-button>
             </span>
-          </a-col>
-        </a-row>
-      </a-form>
-    </div>
-    <!--    /查询区域-->
+            </a-col>
+          </a-row>
+        </a-form>
+      </div>
+      <!--    /查询区域-->
 
-    <!--    操作按钮区域-->
-    <div class="table-operator">
-      <a-button type="primary" icon="plus" @click="handleAdd">添加成员</a-button>
-      <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl"
-                @change="handleImportExcel">
-        <a-button type="primary" icon="import">导入</a-button>
-      </a-upload>
-      <a-button type="primary" icon="export" @click="handleExportXls('企业管理')">导出</a-button>
-      <a-button type="primary" icon="download" @click="downTemplate('企业管理导入模板')">下载模板</a-button>
-      <a-button type="danger" icon="delete" @click="batchDel">批量删除</a-button>
-      <a-button type="primary" @click="">设置收费通知</a-button>
-    </div>
-    <!--    /操作按钮区域-end-->
+      <!--    操作按钮区域-->
+      <div class="table-operator">
+        <a-button type="primary" icon="plus" @click="handleAdd">添加成员</a-button>
+        <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl"
+                  @change="handleImportExcel">
+          <a-button type="primary" icon="import">导入</a-button>
+        </a-upload>
+        <a-button type="primary" icon="export" @click="handleExportXls('企业管理')">导出</a-button>
+        <a-button type="primary" icon="download" @click="downTemplate('企业管理导入模板')">下载模板</a-button>
+        <a-button type="danger" icon="delete" @click="batchDel">批量删除</a-button>
+        <a-button type="primary" @click="">设置收费通知</a-button>
+      </div>
+      <!--    /操作按钮区域-end-->
 
-    <!--    table表格区域-->
-    <div>
-      <a-table
-          ref="table"
-          size="middle"
-          bordered
-          rowKey="id"
-          :columns="columns"
-          :scroll="{x: 1500}"
-          :dataSource="dataSource"
-          :pagination="ipagination"
-          :loading="loading"
-          :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
-          @change="handleTableChange"
-          class="j-table-force-nowrap">
+      <!--    table表格区域-->
+      <div>
+        <a-table
+            ref="table"
+            size="middle"
+            bordered
+            rowKey="id"
+            :columns="columns"
+            :scroll="{x: 1500}"
+            :dataSource="dataSource"
+            :pagination="ipagination"
+            :loading="loading"
+            :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
+            @change="handleTableChange"
+            class="j-table-force-nowrap">
 
-        <!--        工作组名称-->
-<!--        <template slot="projectName" slot-scope="text, record">-->
-<!--          <div class="project-name" @click="goMemberUnitMaintenance(record)">{{ text }}</div>-->
-<!--        </template>-->
+          <!--        工作组名称-->
+          <!--        <template slot="projectName" slot-scope="text, record">-->
+          <!--          <div class="project-name" @click="goMemberUnitMaintenance(record)">{{ text }}</div>-->
+          <!--        </template>-->
 
-        <template slot="text" slot-scope="text,record">
-          <j-ellipsis :value="text" :length="20"></j-ellipsis>
-        </template>
+          <template slot="text" slot-scope="text,record">
+            <j-ellipsis :value="text" :length="20"></j-ellipsis>
+          </template>
 
-        <span slot="action" class="action-span-cell" slot-scope="text, record">
+          <span slot="action" class="action-span-cell" slot-scope="text, record">
           <a @click="goConferenceMaintenance(record)">会议维护</a>
           <a @click="handleEdit(record)">编辑</a>
           <a @click="handleDelete(record.id)">删除</a>
         </span>
-      </a-table>
-    </div>
-  </a-card>
+        </a-table>
+      </div>
+    </a-card>
+  </div>
 </template>
 
 <script>
 import { JeroListMixin } from '@/mixins/JeroListMixin'
 import JYearDate from '@comp/jero/JYearDate'
+import PageHeaderTitle from '@comp/layouts/PageHeaderTitle'
 
 export default {
   name: 'MemberUnitMaintenance',
-  components: { JYearDate },
+  components: { JYearDate, PageHeaderTitle },
   mixins: [JeroListMixin],
   computed: {
     importExcelUrl: function () {
       return `${ window._CONFIG['domianURL'] }/${ this.url.importExcelUrl }`
-    },
+    }
   },
   data() {
     return {
@@ -193,12 +189,12 @@ export default {
           title: '应收金额',
           align: 'center',
           dataIndex: '',
-          width: 180,
+          width: 180
         }, {
           title: '实收金额',
           align: 'center',
           dataIndex: '',
-          width: 180,
+          width: 180
         }, {
           title: '打包',
           align: 'center',
@@ -233,7 +229,7 @@ export default {
           width: 180,
           scopedSlots: { customRender: 'action' }
         }
-      ],
+      ]
     }
   },
   created() {

src/views/projectManagement/WorkingGroupProjectManagement.vue

@@ -1,99 +1,102 @@
 <template>
-  <a-card :bordered="false">
-    <!--    查询区域-start -->
-    <div class="table-page-search-wrapper">
-      <a-form layout="inline" @keyup.enter.native="searchQuery">
-        <a-row>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
-            <a-form-item label="工作组项目" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-input placeholder="请输入工作组项目" v-model="queryParam.workingGroupProject"></a-input>
-            </a-form-item>
-          </a-col>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
-            <a-form-item label="负责人A" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <select-principal placeholder="请选择负责人" v-model="queryParam.principalId"></select-principal>
-            </a-form-item>
-          </a-col>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
-            <a-form-item label="运行年份" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <j-year-date style="width:100%" placeholder="请选择运行年份" v-model="queryParam.year"></j-year-date>
-            </a-form-item>
-          </a-col>
-          <a-col :xl="6" :lg="7" :md="8" :sm="24">
+  <div>
+    <page-header-title :img-for-icon="IconWorkingGruop"></page-header-title>
+    <a-card :bordered="false">
+      <!--    查询区域-start -->
+      <div class="table-page-search-wrapper">
+        <a-form layout="inline" @keyup.enter.native="searchQuery">
+          <a-row>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="工作组项目" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input placeholder="请输入工作组项目" v-model="queryParam.workingGroupProject"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="负责人A" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <select-principal placeholder="请选择负责人" v-model="queryParam.principalIdA"></select-principal>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="运行年份" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <j-year-date style="width:100%" placeholder="请选择运行年份" v-model="queryParam.year"></j-year-date>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
             <span class="table-page-search-submitButtons">
               <a-button type="primary" icon="search" @click="searchQuery">查询</a-button>
               <a-button icon="reload" @click="searchReset">重置</a-button>
             </span>
-          </a-col>
-        </a-row>
-      </a-form>
-    </div>
-    <!--    /查询区域-end-->
-
-    <!--    操作按钮区域-->
-    <div class="table-operator">
-      <a-button type="primary" icon="plus" @click="handleAdd">新增</a-button>
-      <a-button type="danger" icon="delete" @click="batchDel">批量删除</a-button>
-
-      <!--      进度条tooltip-->
-      <div class="tooltip">
-        <div class="tooltip-item">
-          <div class="tooltip-color tooltip-pay-in-full"></div>
-          <span>已付全款</span>
-        </div>
-        <div class="tooltip-item">
-          <div class="tooltip-color tooltip-partial-payment"></div>
-          <span>部分付款</span>
-        </div>
-        <div class="tooltip-item">
-          <div class="tooltip-color tooltip-non-payment"></div>
-          <span>未付款</span>
-        </div>
+            </a-col>
+          </a-row>
+        </a-form>
       </div>
-      <!--      /进度条tooltip-->
-    </div>
-    <!--    /操作按钮区域-end-->
+      <!--    /查询区域-end-->
 
-    <!--    table表格区域-->
-    <div>
-      <a-table
-          ref="table"
-          size="middle"
-          bordered
-          rowKey="id"
-          :columns="columns"
-          :scroll="{x: 1000}"
-          :dataSource="dataSource"
-          :pagination="ipagination"
-          :loading="loading"
-          :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
-          @change="handleTableChange"
-          class="j-table-force-nowrap">
+      <!--    操作按钮区域-->
+      <div class="table-operator">
+        <a-button type="primary" icon="plus" @click="handleAdd">新增</a-button>
+        <a-button type="danger" icon="delete" @click="batchDel">批量删除</a-button>
 
-        <!--        工作组名称-->
-        <template slot="projectName" slot-scope="text, record">
-          <div class="project-name" @click="goMemberUnitMaintenance(record)">{{ text }}</div>
-        </template>
+        <!--      进度条tooltip-->
+        <div class="tooltip">
+          <div class="tooltip-item">
+            <div class="tooltip-color tooltip-pay-in-full"></div>
+            <span>已付全款</span>
+          </div>
+          <div class="tooltip-item">
+            <div class="tooltip-color tooltip-partial-payment"></div>
+            <span>部分付款</span>
+          </div>
+          <div class="tooltip-item">
+            <div class="tooltip-color tooltip-non-payment"></div>
+            <span>未付款</span>
+          </div>
+        </div>
+        <!--      /进度条tooltip-->
+      </div>
+      <!--    /操作按钮区域-end-->
 
-        <!--        进度-->
-        <template slot="rateOfProgress" slot-scope="text, record">
-          <progress-bar :data="text"></progress-bar>
-        </template>
+      <!--    table表格区域-->
+      <div>
+        <a-table
+            ref="table"
+            size="middle"
+            bordered
+            rowKey="id"
+            :columns="columns"
+            :scroll="{x: 1000}"
+            :dataSource="dataSource"
+            :pagination="ipagination"
+            :loading="loading"
+            :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
+            @change="handleTableChange"
+            class="j-table-force-nowrap">
 
-        <template slot="text" slot-scope="text,record">
-          <j-ellipsis :value="text" :length="20"></j-ellipsis>
-        </template>
+          <!--        工作组名称-->
+          <template slot="projectName" slot-scope="text, record">
+            <div class="project-name" @click="goMemberUnitMaintenance(record)">{{ text }}</div>
+          </template>
 
-        <span slot="action" class="action-span-cell" slot-scope="text, record">
+          <!--        进度-->
+          <template slot="rateOfProgress" slot-scope="text, record">
+            <progress-bar :data="text"></progress-bar>
+          </template>
+
+          <template slot="text" slot-scope="text,record">
+            <j-ellipsis :value="text" :length="20"></j-ellipsis>
+          </template>
+
+          <span slot="action" class="action-span-cell" slot-scope="text, record">
           <a @click="goConferenceMaintenance(record)">会议维护</a>
           <a @click="handleEdit(record)">编辑</a>
           <a @click="handleDelete(record.id)">删除</a>
         </span>
-      </a-table>
-    </div>
-    <!--    /table表格区域-->
-    <working-group-project-module ref="modalForm" @ok="modalFormOk"></working-group-project-module>
-  </a-card>
+        </a-table>
+      </div>
+      <!--    /table表格区域-->
+      <working-group-project-module ref="modalForm" @ok="modalFormOk"></working-group-project-module>
+    </a-card>
+  </div>
 </template>
 
 <script>
@@ -102,13 +105,16 @@ import JYearDate from '@comp/jero/JYearDate'
 import WorkingGroupProjectModule from '@views/projectManagement/modules/WorkingGroupProjectModule'
 import SelectPrincipal from '@comp/company/SelectPrincipal'
 import ProgressBar from '@comp/ProgressBar'
+import PageHeaderTitle from '@comp/layouts/PageHeaderTitle'
+import IconWorkingGruop from '@/assets/imgs/icon/icon_working_group.png'
 
 export default {
   name: 'WorkingGroupProjectManagement',
-  components: { JYearDate, WorkingGroupProjectModule, SelectPrincipal, ProgressBar },
+  components: { JYearDate, WorkingGroupProjectModule, SelectPrincipal, ProgressBar, PageHeaderTitle },
   mixins: [JeroListMixin],
   data() {
     return {
+      IconWorkingGruop,
       labelCol: {
         xs: { span: 24 },
         sm: { span: 5 }
@@ -118,12 +124,9 @@ export default {
         sm: { span: 10 }
       },
       url: {
-        list: '',
-        delete: '',
-        deleteBatch: '',
-        exportXlsUrl: '',
-        importExcelUrl: '',
-        downTemplateUrl: ''
+        list: '/project/payWorkingGroup/list',
+        delete: '/project/payWorkingGroup/delete',
+        deleteBatch: '/project/payWorkingGroup/deleteBatch'
       },
       columns: [
         {
@@ -147,7 +150,7 @@ export default {
         }, {
           title: '进度',
           align: 'center',
-          dataIndex: 'post',
+          dataIndex: 'obj',
           width: 250,
           scopedSlots: { customRender: 'rateOfProgress' }
         }, {
@@ -225,14 +228,14 @@ export default {
   }
 
   &-color {
-    width: 15px;
-    height: 15px;
+    width: 13px;
+    height: 13px;
     margin-right: 5px;
     border-radius: 2px;
   }
 
   &-pay-in-full {
-    background-color: rgb(7, 168, 161);
+    background: linear-gradient(0deg, #069f99 0%, #07b0a9 100%);
   }
 
   &-partial-payment {

src/views/projectManagement/modules/WorkingGroupProjectModule.vue

@@ -36,16 +36,14 @@
           <a-form-item label="负责人A" :labelCol="labelCol" :wrapperCol="wrapperCol">
             <select-principal placeholder="请选择负责人A"
                               v-decorator="['principalIdA',validatorRules.principalIdA]"
-                              :maxLength='50'
-                              @change="e => {e.target.value = (e.target.value + '').trim()}"></select-principal>
+                              :maxLength='50'></select-principal>
           </a-form-item>
         </a-col>
         <a-col :span="12">
           <a-form-item label="负责人B" :labelCol="labelCol" :wrapperCol="wrapperCol">
             <select-principal placeholder="请选择负责人B"
                               v-decorator="['principalIdB',validatorRules.principalIdB]"
-                              :maxLength='50'
-                              @change="e => {e.target.value = (e.target.value + '').trim()}"></select-principal>
+                              :maxLength='50'></select-principal>
           </a-form-item>
         </a-col>
       </a-row>
@@ -93,7 +91,8 @@
         </a-col>
         <a-col :span="12">
           <a-form-item label="收费通知A" :labelCol="labelCol" :wrapperCol="wrapperCol">
-            <j-upload :number="1" file-type="word,pdf" v-decorator="['chargeNoticeAId']"
+            <j-upload file-type="pdf" file-type-error-message="请上传收费通知" :multiple="false" :number="1" :return-id="true"
+                      bizPath="payment" v-decorator="['chargeNoticeAId']"
                       :trigger-change="true"></j-upload>
           </a-form-item>
         </a-col>
@@ -115,16 +114,17 @@
       </a-row>
       <a-row>
         <a-col :span="12">
-          <a-form-item label="收费通知号A" :labelCol="labelCol" :wrapperCol="wrapperCol">
-            <a-input placeholder="请输入收费通知号A"
+          <a-form-item label="收费通知号B" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input placeholder="请输入收费通知号B"
                      v-decorator="['chargeNoticeNoB']"
                      :maxLength='50'
                      @change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
           </a-form-item>
         </a-col>
         <a-col :span="12">
-          <a-form-item label="收费通知A" :labelCol="labelCol" :wrapperCol="wrapperCol">
-            <j-upload :number="1" file-type="word,pdf" v-decorator="['chargeNoticeBId']"
+          <a-form-item label="收费通知B" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <j-upload file-type="pdf" file-type-error-message="请上传收费通知" :multiple="false" :number="1" :return-id="true"
+                      bizPath="payment" v-decorator="['chargeNoticeBId']"
                       :trigger-change="true"></j-upload>
           </a-form-item>
         </a-col>
@@ -205,7 +205,10 @@ export default {
           validateTrigger: 'blur'
         }
       },
-      userList: [], // 用户列表
+      url: {
+        add: '/project/payWorkingGroup/add',
+        edit: '/project/payWorkingGroup/edit'
+      }
     }
   },
   methods: {
@@ -217,7 +220,7 @@ export default {
       this.model = Object.assign({}, record)
       this.visible = true
       this.$nextTick(() => {
-        this.form.setFieldsValue(pick(this.model, 'workingGroupProject', 'year', 'principalIdA', 'principalIdB', 'convokeNum', 'operationCycle', 'yearChargeA', 'chargeNoticeNoA', 'chargeNoticeAId', ''))
+        this.form.setFieldsValue(pick(this.model, 'workingGroupProject', 'year', 'principalIdA', 'principalIdB', 'convokeNum', 'operationCycle', 'yearChargeA', 'chargeNoticeNoA', 'chargeNoticeAId', 'yearChargeB', 'chargeNoticeNoB', 'chargeNoticeBId', 'missionAndObjectives', 'remarks'))
       })
     },
     close() {
@@ -236,6 +239,8 @@ export default {
           } else {
             httpurl += this.url.edit
           }
+          values.yearChargeA = values.yearChargeA ? Number(values.yearChargeA) : null
+          values.yearChargeB = values.yearChargeB ? Number(values.yearChargeB) : null
           const formData = Object.assign(this.model, values)
           console.log('表单提交数据', formData)
           httpAction(httpurl, formData, method).then((res) => {