[update 会员系统迁移来款] 标协会员-批复文号设置页面

2024-03-22 13:54:00 +08:00
parent 1ea8718058
commit f31629627f
2 changed files with 320 additions and 0 deletions
@@ -0,0 +1,184 @@
+<template>
+  <a-card :bordered="false">
+    <!-- 查询区域 -->
+    <div class="table-page-search-wrapper">
+      <a-form layout="inline" @keyup.enter.native="searchQuery">
+        <a-row :gutter="24">
+          <a-col :xl="6" :lg="7" :md="8" :sm="24">
+            <a-form-item label="时间（年）" :labelCol="labelCol" :wrapperCol="wrapperCol">
+<!--              <a-input placeholder="请输入时间（年）" v-model="queryParam.dateYear"></a-input>-->
+              <j-year-date placeholder="请选择时间（年）" v-model="queryParam.dateYear"></j-year-date>
+            </a-form-item>
+          </a-col>
+          <a-col :xl="6" :lg="7" :md="8" :sm="24">
+            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+              <a-button type="primary" @click="searchQuery" icon="search" v-has="'approvalDocumentNumber:search'">查询</a-button>
+              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">刷新</a-button>
+            </span>
+          </a-col>
+        </a-row>
+      </a-form>
+    </div>
+    <!-- 查询区域-END -->
+
+    <!-- 操作按钮区域 -->
+    <div class="table-operator">
+      <a-button @click="handleAdd" type="primary" icon="plus" v-has="'approvalDocumentNumber:add'">新增</a-button>
+      <a-button @click="batchDel" style="background:#ff4d4f;" type="danger" icon="delete" v-has="'approvalDocumentNumber:deleteBatch'">删除</a-button>
+<!--      <a-button type="primary" icon="download" @click="handleExportXls('批复文号表')">导出</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-dropdown v-if="selectedRowKeys.length > 0">-->
+<!--        <a-menu slot="overlay">-->
+<!--          <a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>-->
+<!--        </a-menu>-->
+<!--        <a-button style="margin-left: 8px"> 批量操作 <a-icon type="down" /></a-button>-->
+<!--      </a-dropdown>-->
+    </div>
+
+    <!-- table区域-begin -->
+    <div>
+      <a-table
+        ref="table"
+        size="middle"
+        bordered
+        rowKey="id"
+        :columns="columns"
+        :dataSource="dataSource"
+        :pagination="ipagination"
+        :loading="loading"
+        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
+        class="j-table-force-nowrap"
+        @change="handleTableChange">
+
+        <template slot="htmlSlot" slot-scope="text">
+          <div v-html="text"></div>
+        </template>
+        <template slot="imgSlot" slot-scope="text">
+          <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
+          <img v-else :src="getImgView(text)" height="25px" alt="" style="max-width:80px;font-size: 12px;font-style: italic;"/>
+        </template>
+        <template slot="fileSlot" slot-scope="text,record">
+          <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
+          <j-ellipsis @click.native="downloadFile(record.chargeNoticeFileId)" style="color:#219AFF;cursor: pointer" :value="text" :length="10"/>
+        </template>
+
+        <span slot="action" class="action-span-cell" slot-scope="text, record">
+          <a @click="handleEdit(record)" v-has="'approvalDocumentNumber:edit'">编辑</a>
+          <a @click="handleDelete(record.id)" v-has="'approvalDocumentNumber:delete'">删除</a>
+        </span>
+
+      </a-table>
+    </div>
+
+    <tbApprovalDocumentNumber-modal ref="modalForm" @ok="modalFormOk"></tbApprovalDocumentNumber-modal>
+  </a-card>
+</template>
+
+<script>
+
+import '@/assets/less/TableExpand.less'
+import {mixinDevice} from '@/utils/mixin'
+import JYearDate from '@comp/jero/JYearDate'
+import TbApprovalDocumentNumberModal from '@views/incomePayments/approvalDocument/modules/TbApprovalDocumentNumberModal'
+import JEllipsis from '@comp/jero/JEllipsis'
+import {JeroListMixin} from '@/mixins/JeroListMixin'
+import {getFileAccessHttpUrl} from '@api/manage'
+
+export default {
+  name: 'TbApprovalDocumentNumberList',
+  mixins: [JeroListMixin, mixinDevice],
+  components: {
+    JYearDate,
+    TbApprovalDocumentNumberModal,
+    JEllipsis
+  },
+  data() {
+    return {
+      description: '批复文号表管理页面',
+      // 表头
+      columns: [
+        {
+          title: '序号',
+          dataIndex: '',
+          key: 'rowIndex',
+          width: 60,
+          align: 'center',
+          customRender: function(t, r, index) {
+            return parseInt(index) + 1
+          }
+        },
+        {
+          title: '批复文号',
+          align: 'center',
+          dataIndex: 'approvalDocumentNumber'
+        },
+        {
+          title: '时间（年）',
+          align: 'center',
+          dataIndex: 'dateYear',
+          customRender: function(text) {
+            return text + '年'
+          }
+        },
+        {
+          title: '收费通知单',
+          align: 'center',
+          dataIndex: 'chargeNoticeName',
+          scopedSlots: { customRender: 'fileSlot' }
+        },
+        {
+          title: '操作',
+          dataIndex: 'action',
+          align: 'center',
+          // fixed:"right",
+          width: 147,
+          scopedSlots: { customRender: 'action' }
+        }
+      ],
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 5 }
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 10 }
+      },
+      url: {
+        list: '/approvalDocumentNumber/list',
+        delete: '/approvalDocumentNumber/delete',
+        deleteBatch: '/approvalDocumentNumber/deleteBatch',
+        exportXlsUrl: '/approvalDocumentNumber/exportXls',
+        importExcelUrl: '/approvalDocumentNumber/importExcel'
+      },
+      dictOptions: {}
+    }
+  },
+  computed: {
+    importExcelUrl: function() {
+      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
+    }
+  },
+  methods: {
+    initDictConfig() {
+    },
+    /* 文件下载 */
+    downloadFile(text) {
+      if (!text) {
+        this.$message.warning('未知的文件')
+        return
+      }
+      if (text.indexOf(',') > 0) {
+        text = text.substring(0, text.indexOf(','))
+      }
+      const url = getFileAccessHttpUrl(text)
+      console.log('----------------', url)
+      window.open(url)
+    }
+  }
+}
+</script>
+<style scoped>
+  @import '~@assets/less/common.less';
+</style>
@@ -0,0 +1,136 @@
+<template>
+  <j-modal
+    :title="title"
+    :width="width"
+    :visible="visible"
+    :confirmLoading="confirmLoading"
+    switchFullscreen
+    @ok="handleOk"
+    @cancel="handleCancel"
+    cancelText="关闭">
+    <a-spin :spinning="confirmLoading">
+      <a-form :form="form">
+        <a-form-item label="批复文号" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-input v-decorator="['approvalDocumentNumber',validatorRules.approvalDocumentNumber]" placeholder="请输入批复文号" :maxLength ='50' @change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
+        </a-form-item>
+        <a-form-item label="时间（年）" :labelCol="labelCol" :wrapperCol="wrapperCol">
+<!--          <a-input v-decorator="['dateYear',validatorRules.dateYear]" placeholder="请输入时间（年）"></a-input>-->
+          <j-year-date :disabled="model.id ? true : false" v-decorator="['dateYear',validatorRules.dateYear]" placeholder="请输入时间（年）"></j-year-date>
+        </a-form-item>
+        <a-form-item label="收费通知单" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <j-upload ref="fileModal" v-decorator="['chargeNoticeFileId']" returnId :trigger-change="true" :file-type="fileType" file-type-error-message="请上传pdf或者word" :number="1"></j-upload>
+          <span style="color: #bfbfbf">请上传pdf或者word</span>
+        </a-form-item>
+      </a-form>
+    </a-spin>
+  </j-modal>
+</template>
+
+<script>
+
+
+import JUpload from '@comp/jero/JUpload'
+import JYearDate from '@comp/jero/JYearDate'
+import pick from 'lodash.pick'
+import {httpAction} from '@api/manage'
+
+export default {
+  name: 'TbApprovalDocumentNumberModal',
+  components: {
+    JUpload,
+    JYearDate
+  },
+  data() {
+    return {
+      form: this.$form.createForm(this),
+      title: '操作',
+      width: 800,
+      visible: false,
+      model: {},
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 5 }
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 10 }
+      },
+      // 文件上传的类型
+      fileType: 'pdf,word',
+      confirmLoading: false,
+      validatorRules: {
+        approvalDocumentNumber: {
+          rules: [{ required: true, message: '请输入批复文号' }],
+          validateTrigger: 'blur'
+        },
+        dateYear: {
+          rules: [{ required: true, message: '请选择年份' }],
+          validateTrigger: 'blur'
+        }
+      },
+      url: {
+        add: '/approvalDocumentNumber/add',
+        edit: '/approvalDocumentNumber/edit'
+      }
+    }
+  },
+  created() {
+  },
+  methods: {
+    add() {
+      this.edit({})
+    },
+    edit(record) {
+      this.form.resetFields()
+      this.model = Object.assign({}, record)
+      this.visible = true
+      this.$nextTick(() => {
+        this.form.setFieldsValue(pick(this.model, 'approvalDocumentNumber', 'dateYear', 'chargeNoticeName', 'chargeNoticeFileId'))
+      })
+    },
+    close() {
+      this.$emit('close')
+      this.visible = false
+    },
+    handleOk() {
+      const that = this
+      // 触发表单验证
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          const fileModal = this.$refs.fileModal
+          const length = fileModal.fileList.length
+          values.chargeNoticeName = length ? this.$refs.fileModal.fileList[0].name : ''
+          that.confirmLoading = true
+          let httpurl = ''
+          let method = 'post'
+          if (!this.model.id) {
+            httpurl += this.url.add
+          } else {
+            httpurl += this.url.edit
+          }
+          const formData = Object.assign(this.model, values)
+          console.log('表单提交数据', formData)
+          httpAction(httpurl, formData, method).then((res) => {
+            if (res.success) {
+              that.$message.success(res.message)
+              that.$emit('ok')
+              that.close()
+            } else {
+              that.$message.warning(res.message)
+            }
+          }).finally(() => {
+            that.confirmLoading = false
+          })
+        }
+      })
+    },
+    handleCancel() {
+      this.close()
+    },
+    popupCallback(row) {
+      this.form.setFieldsValue(pick(row, 'approvalDocumentNumber', 'dateYear', 'chargeNoticeName'))
+    }
+
+  }
+}
+</script>