工作组项目管理--成员维护

2021-09-02 15:59:29 +08:00
parent baac93159f
commit d8b540041b
7 changed files with 753 additions and 92 deletions
@@ -0,0 +1,425 @@
+<template>
+  <div>
+    <page-header-title :is-level-one="false" :level-two-title="workingGroupProject"></page-header-title>
+    <a-card :bordered="false">
+      <div class="part-title">
+        <div class="part-title-text">工作组信息</div>
+      </div>
+      <!--    工作组信息区域-->
+      <a-spin :spinning="loading">
+        <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"
+                 v-if="item.fieldName === 'chargeNoticeAId' || item.fieldName === 'chargeNoticeBId'">
+              {{ workingGroupDetail[item.fieldName] }}
+            </div>
+            <div class="work-group-detail-item-content" v-else>{{ workingGroupDetail[item.fieldName] }}</div>
+          </div>
+          <div class="work-group-detail-item">
+            <div class="work-group-detail-item-title">任务及目标:</div>
+            <div class="work-group-detail-item-content">{{ workingGroupDetail.missionAndObjectives }}</div>
+          </div>
+          <div class="work-group-detail-item">
+            <div class="work-group-detail-item-title">备注:</div>
+            <div class="work-group-detail-item-content">{{ workingGroupDetail.remarks }}</div>
+          </div>
+        </div>
+      </a-spin>
+      <!--    /工作组信息区域-->
+
+      <!--    查询区域-->
+      <div class="part-title">
+        <div class="part-title-text">成员信息</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.chargeCompanyTemporaryName"></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">
+            <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>
+      <!--    /查询区域-->
+
+      <!--    操作按钮区域-->
+      <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="setChargeNotic">设置收费通知</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">
+
+          <!--          工作组名称-->
+          <template slot="projectName" slot-scope="text, record">
+            <div class="primary-color" @click="openDetailModal(record)">{{ text }}</div>
+          </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="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="handleEdit(record)">编辑</a>
+            <a @click="handleDelete(record.id)">删除</a>
+          </span>
+        </a-table>
+      </div>
+    </a-card>
+
+    <project-detail-modal ref="projectDetail"></project-detail-modal>
+    <working-group-member-unit-module ref="modalForm" @ok="modalFormOk"></working-group-member-unit-module>
+    <working-group-member-set-charge-notice ref="setChargeNotic"></working-group-member-set-charge-notice>
+  </div>
+</template>
+
+<script>
+import { JeroListMixin } from '@/mixins/JeroListMixin'
+import JYearDate from '@comp/jero/JYearDate'
+import PageHeaderTitle from '@comp/layouts/PageHeaderTitle'
+import { getWorkingGroupById } from '@api/incomePaymentsApi'
+import StatusSlot from '../../components/tools/StatusSlot'
+import ProjectDetailModal from '../../components/ProjectDetailModal'
+import WorkingGroupMemberUnitModule from './modules/WorkingGroupMemberUnitModule'
+import WorkingGroupMemberSetChargeNotice from './modules/WorkingGroupMemberSetChargeNotice'
+
+export default {
+  name: 'WorkingGroupMemberUnitMaintenance',
+  components: {
+    JYearDate,
+    PageHeaderTitle,
+    StatusSlot,
+    ProjectDetailModal,
+    WorkingGroupMemberUnitModule,
+    WorkingGroupMemberSetChargeNotice
+  },
+  mixins: [JeroListMixin],
+  computed: {
+    importExcelUrl: function () {
+      return `${ window._CONFIG['domianURL'] }/${ this.url.importExcelUrl }`
+    }
+  },
+  data() {
+    return {
+      disableMixinCreated: true,
+      workingGroupProject: '',
+      workingGroupProjectId: '',
+      detailTitleList: [
+        {
+          title: '工作组项目名称',
+          fieldName: 'workingGroupProject'
+        }, {
+          title: '负责人A',
+          fieldName: 'principalNameA'
+        }, {
+          title: '负责人B',
+          fieldName: 'principalNameB'
+        }, {
+          title: '每年召开次数',
+          fieldName: 'convokeNum'
+        }, {
+          title: '运行周期',
+          fieldName: 'operationCycle'
+        }, {
+          title: '本年应收款A',
+          fieldName: 'yearChargeA'
+        }, {
+          title: '收费通知号A',
+          fieldName: 'chargeNoticeNoA'
+        }, {
+          title: '收费通知A',
+          fieldName: 'chargeNoticeAId'
+        }, {
+          title: '本年应收款B',
+          fieldName: 'yearChargeB'
+        }, {
+          title: '收费通知号B',
+          fieldName: 'chargeNoticeNoB'
+        }, {
+          title: '收费通知B',
+          fieldName: 'chargeNoticeBId'
+        }
+      ],
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 5 }
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 10 }
+      },
+      url: {
+        list: '/project/payWorkingGroupSubitem/list',
+        delete: '/project/payWorkingGroupSubitem/delete',
+        deleteBatch: '/project/payWorkingGroupSubitem/deleteBatch',
+        exportXlsUrl: '/project/payWorkingGroupSubitem/exportXls',
+        importExcelUrl: '/project/payWorkingGroupSubitem/importExcel',
+        downTemplateUrl: '/project/payWorkingGroupSubitem/downloadExcelModel'
+      },
+      columns: [
+        {
+          title: '序号',
+          dataIndex: '',
+          key: 'rowIndex',
+          width: 60,
+          align: 'center',
+          customRender: function (t, r, index) {
+            return parseInt(index) + 1
+          }
+        }, {
+          title: '成员单位',
+          align: 'center',
+          dataIndex: 'chargeCompanyTemporaryName',
+          scopedSlots: { customRender: 'projectName' }
+        }, {
+          title: '企业联系人',
+          align: 'center',
+          width: 180,
+          dataIndex: 'contactsTemporaryNameOne'
+        }, {
+          title: '应收金额',
+          align: 'center',
+          dataIndex: 'receivableAmount',
+          width: 180
+        }, {
+          title: '实收金额',
+          align: 'center',
+          dataIndex: 'paidAmount',
+          width: 180
+        }, , {
+          title: '打包',
+          align: 'center',
+          width: 80,
+          dataIndex: 'pack',
+          scopedSlots: { customRender: 'status-pack' }
+        }, {
+          title: '需要发票',
+          align: 'center',
+          width: 80,
+          dataIndex: 'needInvoice',
+          scopedSlots: { customRender: 'status-pack' }
+        }, {
+          title: '到账',
+          align: 'center',
+          width: 80,
+          dataIndex: 'inAccount',
+          scopedSlots: { customRender: 'status' }
+        }, {
+          title: '开票',
+          align: 'center',
+          width: 80,
+          dataIndex: 'makeInvoice',
+          scopedSlots: { customRender: 'status' }
+        }, {
+          title: '邮寄',
+          align: 'center',
+          width: 80,
+          dataIndex: 'mail',
+          scopedSlots: { customRender: 'status' }
+        }, {
+          title: '操作',
+          dataIndex: 'action',
+          align: 'center',
+          fixed: 'right',
+          width: 180,
+          scopedSlots: { customRender: 'action' }
+        }
+      ],
+      workingGroupDetail: {},
+      chargeNoticeList: [] // 收费通知号选项
+    }
+  },
+  created() {
+    // 初始化工作组信息
+    this.initWorkGruopData()
+  },
+  methods: {
+    /**
+     * 初始化工作组信息
+     */
+    initWorkGruopData() {
+      this.workingGroupProject = this.$route.query.workingGroupProject
+      this.workingGroupProjectId = this.$route.query.workingGroupProjectId
+      this.filters.workingGroupId = this.workingGroupProjectId
+      this.loadData()
+      let param = {
+        id: this.workingGroupProjectId
+      }
+      getWorkingGroupById(param).then(res => {
+        this.workingGroupDetail = res.result
+      })
+    },
+    handleAdd: function () {
+      this.getChargeNoticeList()
+      this.$refs.modalForm.workingGroupId = this.workingGroupProjectId
+      this.$refs.modalForm.chargeNoticeList = this.chargeNoticeList
+      this.$refs.modalForm.add()
+      this.$refs.modalForm.title = '添加成员'
+      this.$refs.modalForm.disableSubmit = false
+    },
+    handleEdit: function (record) {
+      this.getChargeNoticeList()
+      this.$refs.modalForm.chargeNoticeList = this.chargeNoticeList
+      this.$refs.modalForm.edit(record)
+      this.$refs.modalForm.title = '编辑'
+      this.$refs.modalForm.disableSubmit = false
+    },
+    getChargeNoticeList() {
+      this.chargeNoticeList = []
+      let chargeNoticeA, chargeNoticeB
+      if (this.workingGroupDetail.chargeNoticeNoA && this.workingGroupDetail.chargeNoticeNoA !== '') {
+        chargeNoticeA = {
+          type: 'chargeNoticeA',
+          label: `A：${ this.workingGroupDetail.chargeNoticeNoA }`,
+          value: this.workingGroupDetail.chargeNoticeNoA,
+          yearCharge: this.workingGroupDetail.yearChargeA,
+          chargeNoticeId: this.workingGroupDetail.chargeNoticeAId
+        }
+      }
+      if (this.workingGroupDetail.chargeNoticeNoB && this.workingGroupDetail.chargeNoticeNoB !== '') {
+        chargeNoticeB = {
+          type: 'chargeNoticeB',
+          label: `B：${ this.workingGroupDetail.chargeNoticeNoB }`,
+          value: this.workingGroupDetail.chargeNoticeNoB,
+          yearCharge: this.workingGroupDetail.yearChargeB,
+          chargeNoticeId: this.workingGroupDetail.chargeNoticeBId
+        }
+      }
+      if (chargeNoticeA && chargeNoticeA.hasOwnProperty('value')) {
+        this.chargeNoticeList.push(chargeNoticeA)
+      }
+      if (chargeNoticeB && chargeNoticeB.hasOwnProperty('value')) {
+        this.chargeNoticeList.push(chargeNoticeB)
+      }
+    },
+    /**
+     * 设置收费通知
+     */
+    setChargeNotic() {
+      if (!this.workingGroupDetail.chargeNoticeNoA && !this.workingGroupDetail.chargeNoticeNoB) {
+        this.$message.warn('请先补充该工作组的收费通知信息')
+        return
+      }
+      if (this.selectedRowKeys.length === 0) {
+        this.$message.warn('请先选择成员')
+        return
+      }
+      this.getChargeNoticeList()
+      this.$refs.setChargeNotic.chargeNoticeList = this.chargeNoticeList
+      this.$refs.setChargeNotic.selectedRowKeys = this.selectedRowKeys
+      this.$refs.setChargeNotic.handleOpen()
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+@import '~@assets/less/common.less';
+
+.part-title {
+  padding: 10px 0;
+  font-size: 16px;
+  font-family: PingFang SC, PingFang SC-Bold;
+  font-weight: 700;
+  text-align: left;
+  color: #333333;
+  position: relative;
+
+  &-text {
+    padding-left: 20px;
+  }
+
+  &-text::before {
+    position: absolute;
+    content: "";
+    left: 0;
+    top: 50%;
+    transform: translateY(-50%);
+    width: 10px;
+    height: 10px;
+    background: #069f99;
+  }
+}
+
+.divider {
+  height: 1px;
+  background-color: #cccccc;
+  margin: 15px -24px;
+}
+
+.work-group-detail {
+  display: flex;
+  flex-wrap: wrap;
+  padding-bottom: 20px;
+
+  &-item-small {
+    width: 33.3% !important;
+  }
+
+  &-item {
+    display: flex;
+    padding: 5px 5px;
+    width: 100%;
+    font-size: 14px;
+
+    &-title {
+      flex-shrink: 0;
+      color: #999999;
+    }
+
+    &-content {
+      padding-left: 5px;
+      word-break: break-all;
+      color: #2F3133;
+    }
+  }
+}
+
+</style>