[update]-企业端 修改标协会员-会员管理、增加标协会员-缴费信息的功能

public/production_address_config.js

@@ -20,3 +20,4 @@ window._CONFIG['singUpQRCodeURL'] = 'http://10.10.10.46:8055/signupentrance'
 window._CONFIG["memberURL"] = "/memberApi";
 // 会员系统的静态文件的地址
 window._CONFIG["memberStaticDomainURL"] = window._CONFIG["memberURL"] + "/sys/common/static";
+window._CONFIG["memberDomianWebSocketURL"] = "http://10.0.10.78:9000/memberApi";

src/api/memberManage.js

@@ -169,7 +169,6 @@ export function getFileAccessHttpUrl(avatar,subStr) {
       return avatar
     }else{
       if(avatar && avatar.length>0 && avatar.indexOf('[') === -1){
-        console.log('window._CONFIG[\'memberStaticDomainURL\']=======', window._CONFIG['memberStaticDomainURL'])
         return window._CONFIG['memberStaticDomainURL'] + '/' + avatar
       }
     }

src/api/standardsAssociationApi.js

@@ -17,7 +17,7 @@ const previewPdf = (file) => {
   // return `${process.env.BASE_URL}pdfjs/web/viewer.html?file=` + encodeURIComponent(url) + '&.pdf'
   // const token = Vue.ls.get(ACCESS_TOKEN)
   // todo 先写死token
-  const token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJleHAiOjE2MzkzNzY3MzcsInVzZXJuYW1lIjoiMGI4ZDQ2YTBiZTI0NGJlZGI5ZDI1Y2Y5ZmQ5OTc3MTcifQ.FvA0UgdKJm1m0rbkaS4CX72-GozZVPDmcZ296FvaBfQ'
+  const token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJleHAiOjE2Mzk0NjEyMzcsInVzZXJuYW1lIjoiMGI4ZDQ2YTBiZTI0NGJlZGI5ZDI1Y2Y5ZmQ5OTc3MTcifQ.jKG-mtZ4VHS5BAFGayuwOJgBBzZTiKQc3bkbya2YTNA'
   const fileFullUrl = `${window._CONFIG['memberDomianWebSocketURL']}/sys/common/download/${file.id}?token=${token}&fullfilename=${file.fileName}`
   console.log(fileFullUrl, '$$$$$$$$')
   let url = `${window._CONFIG['onlinePreviewDomainURL']}?url=${encodeURIComponent(fileFullUrl)}`
@@ -35,11 +35,49 @@ const getEncryptedString = () => getAction('/sys/getRSAPublicKey', {})
 // 通过文件的id获取文件的名称
 const getFilesByIds = (params) => getAction('/sys/common/static/getFilesByIds', params)
 
+// 验证企业是否存在
+const checkOnlyCompany = (params) => getAction('/memberInfo/memberInfo/checkOnlyCompany', params)
+// 会员变更单位名称
+const changeCompany = (params) => postAction('/memberInfo/companyNameRecord/add', params)
+// 会员编辑变更单位全称
+const changeCompanyEdit = (params) => postAction('/memberInfo/companyNameRecord/edit', params)
+// 字典标签专用（通过code获取字典数组）
+const ajaxGetDictItems = (code, params) => getAction(`/sys/dict/getDictItems/${code}`, params)
+/****证书管理列表页所用接口-开始 ****/
+const getLastPaymentByMemberId = (params) => getAction('/paymentInfo/getLastPaymentByMemberId', params)
+const getCertificateByMemberId = (params) => getAction('/vinCertificate/vinCertificate/getCertificateByMemberId', params)
+/****证书管理列表页所用接口-结束 ****/
+
+/****会员缴费 列表页所用接口-开始 ****/
+const getMemberInfoById = (params) => getAction('/memberInfo/memberInfo/queryById', params)
+const getCheckInfo = (params) => getAction('/paymentInfo/paymentCheckinfo/queryByPaymentId', params)
+const getByMemberTime = (params) => getAction('/threshold/thresholdSetting/getByMemberTime', params)
+// 会员下载缴费通知单
+const downNewestNotice = (params) => getAction('/approvalDocumentNumber/approvalDocumentNumber/queryLatest', params)
+/****会员缴费 列表页所用接口-结束 ****/
+/****证书缴费 列表页所用接口-开始 ****/
+// 证书缴费
+const getCertificateById = (params) => getAction('/vinCertificate/vinCertificate/getCertificateById', params)
+
+/****证书缴费 列表页所用接口-结束 ****/
 
 export {
   queryCommonProjectById,
   queryApprovalNo,
   previewPdf,
   getEncryptedString,
-  getFilesByIds
+  getFilesByIds,
+  checkOnlyCompany,
+  changeCompany,
+  changeCompanyEdit,
+  ajaxGetDictItems,
+  getLastPaymentByMemberId,
+  getCertificateByMemberId,
+
+  getMemberInfoById,
+  getCheckInfo,
+  getByMemberTime,
+  downNewestNotice,
+
+  getCertificateById
 }

src/components/standardsAssociation/JDictSelectTag.vue

@@ -0,0 +1,110 @@
+<template>
+  <a-radio-group v-if="tagType=='radio'" @change="handleInput" :value="getValueSting" :disabled="disabled">
+    <a-radio v-for="(item, key) in dictOptions" :key="key" :value="item.value">{{ item.text }}</a-radio>
+  </a-radio-group>
+
+  <a-radio-group v-else-if="tagType=='radioButton'"  buttonStyle="solid" @change="handleInput" :value="getValueSting" :disabled="disabled">
+    <a-radio-button v-for="(item, key) in dictOptions" :key="key" :value="item.value">{{ item.text }}</a-radio-button>
+  </a-radio-group>
+
+  <a-select v-else-if="tagType=='select'" :getPopupContainer = "getPopupContainer" :placeholder="placeholder" :disabled="disabled" :value="getValueSting" @change="handleInput">
+    <a-select-option :value="undefined">请选择</a-select-option>
+    <a-select-option v-for="(item, key) in dictOptions" :key="key" :value="item.value">
+      <span style="display: inline-block;width: 100%" :title=" item.text || item.label ">
+        {{ item.text || item.label }}
+      </span>
+    </a-select-option>
+  </a-select>
+</template>
+
+<script>
+  import {ajaxGetDictItems} from '@/api/standardsAssociationApi'
+
+  export default {
+    name: 'JDictSelectTag',
+    props: {
+      dictCode: String,
+      placeholder: String,
+      triggerChange: Boolean,
+      disabled: Boolean,
+      value: [String, Number],
+      type: String,
+      getPopupContainer:{
+        type: Function,
+        default: (node) => node.parentNode
+      }
+    },
+    data() {
+      return {
+        dictOptions: [],
+        tagType:''
+      }
+    },
+    watch:{
+      dictCode:{
+        immediate:true,
+        handler() {
+          this.initDictData()
+        },
+      }
+    },
+    created() {
+      // console.log(this.dictCode);
+      if(!this.type || this.type==='list'){
+        this.tagType = 'select'
+      }else{
+        this.tagType = this.type
+      }
+      //获取字典数据
+      // this.initDictData();
+    },
+    computed: {
+      getValueSting(){
+        // update-begin author:wangshuai date:20200601 for: 不显示placeholder的文字 ------
+        // 当有null或“” placeholder不显示
+        return this.value != null ? this.value.toString() : undefined
+        // update-end author:wangshuai date:20200601 for: 不显示placeholder的文字 ------
+      },
+    },
+    methods: {
+      initDictData() {
+        //优先从缓存中读取字典配置
+        // if(getDictItemsFromCache(this.dictCode)){
+        //   this.dictOptions = getDictItemsFromCache(this.dictCode)
+        //   return
+        // }
+
+        //根据字典Code, 初始化字典数组
+        ajaxGetDictItems(this.dictCode, null).then((res) => {
+          if (res.success) {
+//                console.log(res.result);
+            this.dictOptions = res.result
+          }
+        })
+      },
+      handleInput(e) {
+        let val
+        if(this.tagType=='radio'){
+          val = e.target.value
+        }else{
+          val = e
+        }
+        console.log(val)
+        if(this.triggerChange){
+          this.$emit('change', val)
+        }else{
+          this.$emit('input', val)
+        }
+      },
+      setCurrentDictOptions(dictOptions){
+        this.dictOptions = dictOptions
+      },
+      getCurrentDictOptions(){
+        return this.dictOptions
+      }
+    }
+  }
+</script>
+
+<style scoped>
+</style>

src/components/standardsAssociation/JImageUpload.vue

@@ -115,7 +115,7 @@ export default {
   created() {
     // const token = Vue.ls.get(ACCESS_TOKEN)
     //TODO 暂时将token写成固定值，后续再做动态
-    const token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJleHAiOjE2MzkzNzY3MzcsInVzZXJuYW1lIjoiMGI4ZDQ2YTBiZTI0NGJlZGI5ZDI1Y2Y5ZmQ5OTc3MTcifQ.FvA0UgdKJm1m0rbkaS4CX72-GozZVPDmcZ296FvaBfQ'
+    const token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJleHAiOjE2Mzk0NjEyMzcsInVzZXJuYW1lIjoiMGI4ZDQ2YTBiZTI0NGJlZGI5ZDI1Y2Y5ZmQ5OTc3MTcifQ.jKG-mtZ4VHS5BAFGayuwOJgBBzZTiKQc3bkbya2YTNA'
     this.headers = { 'X-Access-Token': token }
   },
   methods: {

src/components/standardsAssociation/JMultiSelectTag.vue

@@ -0,0 +1,132 @@
+<template>
+  <a-checkbox-group v-if="tagType=='checkbox'" @change="onChange" :value="arrayValue" :disabled="disabled">
+    <a-checkbox v-for="(item, key) in dictOptions" :key="key" :value="item.value">{{ item.text || item.label }}</a-checkbox>
+  </a-checkbox-group>
+
+  <a-select
+    v-else-if="tagType=='select'"
+    :value="arrayValue"
+    @change="onChange"
+    :disabled="disabled"
+    mode="multiple"
+    :placeholder="placeholder"
+    :getPopupContainer="getParentContainer"
+    optionFilterProp="children"
+    :filterOption="filterOption"
+    allowClear>
+    <a-select-option
+      v-for="(item,index) in dictOptions"
+      :key="index"
+      :value="item.value">
+      <span style="display: inline-block;width: 100%" :title=" item.text || item.label ">
+        {{ item.text || item.label }}
+      </span>
+    </a-select-option>
+  </a-select>
+
+</template>
+
+<script>
+  import {ajaxGetDictItems} from '@/api/standardsAssociationApi'
+  export default {
+    name: 'JMultiSelectTag',
+    props: {
+      dictCode: String,
+      placeholder: String,
+      disabled: Boolean,
+      value: String,
+      type: String,
+      options:Array,
+      spliter:{
+        type: String,
+        required: false,
+        default: ','
+      },
+      popContainer:{
+        type:String,
+        default:'',
+        required:false
+      },
+    },
+    data() {
+      return {
+        dictOptions: [],
+        tagType:'',
+        arrayValue:!this.value?[]:this.value.split(this.spliter)
+      }
+    },
+    created() {
+      if(!this.type || this.type==='list_multi'){
+        this.tagType = 'select'
+      }else{
+        this.tagType = this.type
+      }
+      //获取字典数据
+      //this.initDictData();
+    },
+    watch:{
+      options: function(val){
+        this.setCurrentDictOptions(val)
+      },
+      dictCode:{
+        immediate:true,
+        handler() {
+          this.initDictData()
+        },
+      },
+      value (val) {
+        if(!val){
+          this.arrayValue = []
+        }else{
+          this.arrayValue = this.value.split(this.spliter)
+        }
+      }
+    },
+    methods: {
+      initDictData() {
+        if(this.options && this.options.length>0){
+          this.dictOptions = [...this.options]
+        }else{
+          //优先从缓存中读取字典配置
+          // let cacheOption = getDictItemsFromCache(this.dictCode)
+          // if(cacheOption && cacheOption.length>0){
+          //   this.dictOptions = cacheOption
+          //   return
+          // }
+          //根据字典Code, 初始化字典数组
+          ajaxGetDictItems(this.dictCode, null).then((res) => {
+            if (res.success) {
+              this.dictOptions = res.result
+            }
+          })
+        }
+
+      },
+      onChange (selectedValue) {
+        this.$emit('change', selectedValue.join(this.spliter))
+      },
+      setCurrentDictOptions(dictOptions){
+        this.dictOptions = dictOptions
+      },
+      getCurrentDictOptions(){
+        return this.dictOptions
+      },
+      getParentContainer(node){
+        if(!this.popContainer){
+          return node.parentNode
+        }else{
+          return document.querySelector(this.popContainer)
+        }
+      },
+      // update--begin--autor:lvdandan-----date:20201120------for：LOWCOD-1086 下拉多选框,搜索时只字典code进行搜索不能通过字典text搜索
+      filterOption(input, option) {
+        return option.componentOptions.children[0].children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+      }
+      // update--end--autor:lvdandan-----date:20201120------for：LOWCOD-1086 下拉多选框,搜索时只字典code进行搜索不能通过字典text搜索
+    },
+    model: {
+      prop: 'value',
+      event: 'change'
+    }
+  }
+</script>

src/components/standardsAssociation/JSearchSelectTag.vue

@@ -0,0 +1,246 @@
+<template>
+
+  <a-select
+    v-if="async"
+    showSearch
+    labelInValue
+    :disabled="disabled"
+    :getPopupContainer="getParentContainer"
+    @search="loadData"
+    :placeholder="placeholder"
+    v-model="selectedAsyncValue"
+    style="width: 100%"
+    :filterOption="false"
+    @change="handleAsyncChange"
+    allowClear
+    :notFoundContent="loading ? undefined : null"
+  >
+    <a-spin v-if="loading" slot="notFoundContent" size="small"/>
+    <a-select-option v-for="d in options" :key="d.value" :value="d.value">{{ d.text }}</a-select-option>
+  </a-select>
+
+  <a-select
+    v-else
+    :getPopupContainer="getParentContainer"
+    showSearch
+    :disabled="disabled"
+    :placeholder="placeholder"
+    optionFilterProp="children"
+    style="width: 100%"
+    @change="handleChange"
+    :filterOption="filterOption"
+    v-model="selectedValue"
+    allowClear
+    :notFoundContent="loading ? undefined : null">
+    <a-spin v-if="loading" slot="notFoundContent" size="small"/>
+    <a-select-option v-for="d in options" :key="d.value" :value="d.value">{{ d.text }}</a-select-option>
+  </a-select>
+
+</template>
+
+<script>
+  import { ajaxGetDictItems } from '@/api/standardsAssociationApi'
+  import debounce from 'lodash/debounce'
+  import { getAction } from '../../api/memberManage'
+
+  export default {
+    name: 'JSearchSelectTag',
+    props:{
+      disabled: Boolean,
+      value: [String, Number],
+      dict: String,
+      dictOptions: Array,
+      async: Boolean,
+      placeholder:{
+        type:String,
+        default:'请选择',
+        required:false
+      },
+      popContainer:{
+        type:String,
+        default:'',
+        required:false
+      },
+      pageSize:{
+        type: Number,
+        default: 10,
+        required: false
+      }
+    },
+    data(){
+      this.loadData = debounce(this.loadData, 800)//消抖
+      this.lastLoad = 0
+      return {
+        loading:false,
+        selectedValue:[],
+        selectedAsyncValue:[],
+        options: [],
+      }
+    },
+    created(){
+      this.initDictData()
+    },
+    watch:{
+      'value':{
+        immediate:true,
+        handler(val){
+          if(!val){
+            if(val==0){
+              this.initSelectValue()
+            }else{
+              this.selectedValue=[]
+              this.selectedAsyncValue=[]
+            }
+          }else{
+            this.initSelectValue()
+          }
+        }
+      },
+      'dict':{
+        handler(){
+          this.initDictData()
+        }
+      },
+      'dictOptions':{
+        deep: true,
+        handler(val){
+          if(val && val.length>0){
+            this.options = [...val]
+          }
+        }
+      }
+    },
+    methods:{
+      initSelectValue(){
+        if(this.async){
+          if(!this.selectedAsyncValue || !this.selectedAsyncValue.key || this.selectedAsyncValue.key!=this.value){
+            console.log('这才请求后台')
+            getAction(`/sys/dict/loadDictItem/${this.dict}`,{key:this.value}).then(res=>{
+              if(res.success){
+                let obj = {
+                  key:this.value,
+                  label:res.result
+                }
+                this.selectedAsyncValue = {...obj}
+              }
+            })
+          }
+        }else{
+          this.selectedValue = this.value.toString()
+        }
+      },
+      loadData(value){
+        console.log('数据加载',value)
+        this.lastLoad +=1
+        const currentLoad = this.lastLoad
+        this.options = []
+        this.loading=true
+        // 字典code格式：table,text,code
+        getAction(`/sys/dict/loadDict/${this.dict}`,{keyword:value, pageSize: this.pageSize}).then(res=>{
+          this.loading=false
+          if(res.success){
+            if(currentLoad!=this.lastLoad){
+              return
+            }
+            this.options = res.result
+            console.log('我是第一个',res)
+          }else{
+            this.$message.warning(res.message)
+          }
+
+        })
+
+      },
+      initDictData(){
+        if(!this.async){
+          //如果字典项集合有数据
+          if(this.dictOptions && this.dictOptions.length>0){
+            this.options = [...this.dictOptions]
+          }else{
+            //根据字典Code, 初始化字典数组
+            let dictStr = ''
+            if(this.dict){
+                let arr = this.dict.split(',')
+                if(arr[0].indexOf('where')>0){
+                  let tbInfo = arr[0].split('where')
+                  dictStr = tbInfo[0].trim()+','+arr[1]+','+arr[2]+','+encodeURIComponent(tbInfo[1])
+                }else{
+                  dictStr = this.dict
+                }
+                // if (this.dict.indexOf(',') == -1) {
+                //   //优先从缓存中读取字典配置
+                //   if (getDictItemsFromCache(this.dictCode)) {
+                //     this.options = getDictItemsFromCache(this.dictCode)
+                //     return
+                //   }
+                // }
+                ajaxGetDictItems(dictStr, null).then((res) => {
+                  if (res.success) {
+                    this.options = res.result
+                  }
+                })
+            }
+          }
+        }else{
+          //异步一开始也加载一点数据
+          this.loading=true
+          getAction(`/sys/dict/loadDict/${this.dict}`,{pageSize: this.pageSize, keyword:''}).then(res=>{
+            this.loading=false
+            if(res.success){
+              this.options = res.result
+            }else{
+              this.$message.warning(res.message)
+            }
+          })
+        }
+      },
+      filterOption(input, option) {
+        return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+      },
+      handleChange (selectedValue) {
+        console.log('selectedValue',selectedValue)
+        this.selectedValue = selectedValue
+        this.callback()
+      },
+      handleAsyncChange(selectedObj){
+        //update-begin-author:scott date:20201222 for:【搜索】搜索查询组件，删除条件，默认下拉还是上次的缓存数据，不好 JT-191
+        if(selectedObj){
+          this.selectedAsyncValue = selectedObj
+          this.selectedValue = selectedObj.key
+        }else{
+          this.selectedAsyncValue = null
+          this.selectedValue = null
+          this.options = null
+          this.loadData('')
+        }
+        this.callback()
+        //update-end-author:scott date:20201222 for:【搜索】搜索查询组件，删除条件，默认下拉还是上次的缓存数据，不好 JT-191
+      },
+      callback(){
+        this.$emit('change', this.selectedValue)
+      },
+      setCurrentDictOptions(dictOptions){
+        this.options = dictOptions
+      },
+      getCurrentDictOptions(){
+        return this.options
+      },
+      getParentContainer(node){
+        if(!this.popContainer){
+          return node.parentNode
+        }else{
+          return document.querySelector(this.popContainer)
+        }
+      },
+
+    },
+    model: {
+      prop: 'value',
+      event: 'change'
+    }
+  }
+</script>
+
+<style scoped>
+
+</style>

src/components/standardsAssociation/JUpload.vue

@@ -0,0 +1,539 @@
+<template>
+  <div :id="containerId" style="position: relative">
+    <a-upload
+      name="file"
+      :action="uploadAction"
+      :headers="headers"
+      :data="{'biz':bizPath}"
+      :fileList="fileList"
+      :beforeUpload="beforeUpload"
+      @change="handleChange"
+      :disabled="disabled"
+      :returnUrl="returnUrl"
+      :listType="complistType"
+      @preview="handlePreview"
+      v-bind="$attrs"
+      v-on="childListeners"
+      :class="{'uploadty-disabled':disabled}">
+      <template>
+        <div v-if="isImageComp">
+          <a-icon type="plus"/>
+          <div class="ant-upload-text">{{ text }}</div>
+        </div>
+        <a-button v-else-if="buttonVisible">
+          <a-icon type="upload"/>
+          {{ text }}
+        </a-button>
+      </template>
+    </a-upload>
+<!--     :show-upload-list="showUploadList"-->
+    <!-- 增加上传文件的下载和查看的按钮，主要思想是生成相应的元素，用定位的思想定位到原来的文件列表中 -->
+    <template v-if="showOtherIcon">
+      <div class="file-list-html">
+        <template v-for="(item,index) in fileList">
+          <div :key="index" class="file-item" :class="{'show': item.status === 'done'}">
+          <span class="file-item-btn" @click.prevent.stop="myDownload(item)">
+            <a-icon type="download" />
+            下载
+          </span>
+            <span class="file-item-btn" @click.prevent.stop="myPreview(item)">
+            <a-icon type="eye" />
+            查看
+          </span>
+          </div>
+        </template>
+      </div>
+
+    </template>
+  </div>
+</template>
+
+<script>
+
+import Vue from 'vue'
+import {ACCESS_TOKEN} from '@/store/mutation-types'
+import {getFileAccessHttpUrl, downloadFile} from '@/api/manage'
+import {getFileInfo} from '@/api/api'
+
+// eslint-disable-next-line no-undef
+// const Base64 = require('js-base64').Base64
+
+const FILE_TYPE_ALL = 'all'
+const FILE_TYPE_IMG = 'image'
+// const FILE_TYPE_TXT = 'file'
+const uidGenerator = () => {
+  return '-' + parseInt(Math.random() * 10000 + 1, 10)
+}
+export default {
+  name: 'JUpload',
+  data() {
+    return {
+      uploadAction: window._CONFIG['memberURL'] + '/sys/common/upload',
+      headers: {},
+      fileList: [],
+      newFileList: [],
+      uploadGoOn: true,
+      fileTypes: this.fileType
+    }
+  },
+  props: {
+    text: {
+      type: String,
+      required: false,
+      default: '点击上传'
+    },
+    fileType: {
+      type: String,
+      required: false,
+      default: FILE_TYPE_ALL
+    },
+    /*这个属性用于控制文件上传的业务路径*/
+    bizPath: {
+      type: String,
+      required: false,
+      default: 'temp'
+    },
+    value: {
+      type: [String, Array],
+      required: false
+    },
+    // update-begin- --- author:wangshuai ------ date:20190929 ---- for:Jupload组件增加是否能够点击
+    disabled: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    // update-end- --- author:wangshuai ------ date:20190929 ---- for:Jupload组件增加是否能够点击
+    //此属性被废弃了
+    triggerChange: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    /**
+     * update -- author:lvdandan -- date:20190219 -- for:Jupload组件增加是否返回url，
+     * true：仅返回url
+     * false：返回fileName filePath fileSize
+     */
+    returnUrl: {
+      type: Boolean,
+      required: false,
+      default: true
+    },
+    /**
+     *  仅返回文件id
+     *  true 仅返回文件id
+     *  false 返回reurl
+     * */
+    returnId: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    number: {
+      type: Number,
+      required: false,
+      default: 0
+    },
+    buttonVisible: {
+      type: Boolean,
+      required: false,
+      default: true
+    },
+    /**
+     * 是否显示下载和查看按钮
+     **/
+    showOtherIcon: {
+      type: Boolean,
+      required: false,
+      default: true
+    }
+  },
+  watch: {
+    value: {
+      immediate: true,
+      handler() {
+        let val = this.value
+        if (val instanceof Array) {
+          if (this.returnUrl) {
+            this.initFileList(val.join(','))
+          } else {
+            this.initFileListArr(val)
+          }
+        } else {
+          this.initFileList(val)
+        }
+      }
+    }
+  },
+  computed: {
+    //透传给下级组件的事件，需要排除本组件使用的change事件
+    childListeners() {
+      // const vm = this
+      let result = Object.assign({},
+        this.$listeners,
+      )
+      delete result.change
+      return result
+    },
+    isImageComp() {
+      return this.fileType === FILE_TYPE_IMG
+    },
+    complistType() {
+      return this.fileType === FILE_TYPE_IMG ? 'picture-card' : 'text'
+    },
+  },
+  created() {
+    const token = Vue.ls.get(ACCESS_TOKEN)
+    //---------------------------- begin 图片左右换位置 -------------------------------------
+    this.headers = {'X-Access-Token': token}
+    this.containerId = 'container-ty-' + new Date().getTime()
+    //---------------------------- end 图片左右换位置 -------------------------------------
+  },
+  methods: {
+    initFileListArr(val) {
+      if (!val || val.length === 0) {
+        this.fileList = []
+        return
+      }
+      for (let a = 0; a < val.length; a++) {
+        this.fileList.forEach((item) => {
+          if (item.url === val[a]) {
+            item.uid = uidGenerator()
+            item.response.status = 'done'
+          }
+        })
+      }
+    },
+    async initFileList(paths) {
+      if (!paths || paths.length === 0) {
+        this.fileList = []
+        return
+      }
+      let arr = paths.split(',')
+      // 返回路径的时候,对路径进行操作,取出所属id
+      if (!this.returnId && arr.length > 0) {
+        const newArr = []
+        arr.map(item => {
+          let itemArr = item.split('/')
+          newArr.push(itemArr[itemArr.length - 1])
+        })
+        arr = newArr
+      }
+      const fileList = []
+      for (let a = 0; a < arr.length; a++) {
+        // 获取每一个文件的信息，组成fileList
+        // 突然想判断现在的fileList 中是否是历史的信息，如果是的话则先进行匹配
+        let isHistory = this.fileList.find(file => file.response.status === 'history' && (file.response.result || {}).id === arr[a])
+        console.log('isHistory===', isHistory)
+        if (isHistory) {
+          fileList.push(isHistory)
+        } else {
+          const fileObj = await this.getFileInfo(arr[a])
+          const url = getFileAccessHttpUrl(arr[a])
+          fileList.push({
+            uid: uidGenerator(),
+            name: (fileObj || {}).fileName,
+            status: 'done',
+            url: url,
+            response: {
+              status: 'history',
+              message: arr[a],
+              result: fileObj
+            }
+          })
+        }
+      }
+      this.fileList = [...fileList]
+      this.showOtherIcon && this.actionsClass()
+    },
+    handlePathChange() {
+      let uploadFiles = this.fileList
+      let path = ''
+      // 文件id
+      let fileIds = ''
+      if (!uploadFiles || uploadFiles.length === 0) {
+        path = ''
+      }
+      let arr = []
+      // 如果returnid为true 只返回id
+      if (this.returnId) {
+        for (let a = 0; a < uploadFiles.length; a++) {
+          if (uploadFiles[a].status === 'done') {
+            arr.push(uploadFiles[a].response.result.id)
+          } else {
+            return
+          }
+        }
+        if (arr.length > 0) {
+          fileIds = arr.join(',')
+        }
+        this.$emit('change', fileIds)
+        return
+      }
+
+      for (let a = 0; a < uploadFiles.length; a++) {
+        if (uploadFiles[a].status === 'done') {
+          arr.push(uploadFiles[a].url)
+        } else {
+          return
+        }
+      }
+      if (arr.length > 0) {
+        path = arr.join(',')
+      }
+      this.$emit('change', path)
+    },
+    beforeUpload(file) {
+      this.uploadGoOn = true
+      file.uploadGoOn = true
+      const fileSize = file.size // 上传的文件大小
+      const fileType = file.type // 上传的文件类型
+      if (fileSize > 1024 * 1024 * 50) {
+        this.$message.warning('文件大小限制为50M')
+        this.uploadGoOn = false
+        file.uploadGoOn = false
+        return false
+      }
+      // 不等于全部类型可以上传的时候，对上传的文件进行判断
+      if (this.fileType !== FILE_TYPE_ALL) {
+        // filter(tt => fileType.indexOf(tt) > -1)   判断用户传的文件类型，和要求传的文件类型是否一致
+        // 当上传的图片格式为jpg时，在此组件中，会返回类型为 image/jpeg  ElememntUI设计如此 所以需要把用户传下来的jpg强制改成jpeg
+        this.fileTypes = this.fileTypes.replace('jpg', 'jpeg')
+        const arr = this.fileTypes.split(',').filter(tt => fileType.indexOf(tt) > -1)
+        if (arr.length === 0) {
+          this.$message.warning(this.fileTypeErrorMessage || `请上传${this.fileTypes}文件`)
+          this.uploadGoOn = false
+          file.uploadGoOn = false
+          return false
+        }
+      }
+      if (this.fileTypes === FILE_TYPE_IMG) {
+        if (fileType.indexOf('image') < 0) {
+          this.$message.warning('请上传图片')
+          this.uploadGoOn = false
+          file.uploadGoOn = false
+          return false
+        }
+      }
+      // TODO 扩展功能验证文件大小
+      return true
+    },
+    handleChange(info) {
+      if (!info.file.status && this.uploadGoOn === false) {
+        info.fileList.pop()
+      }
+      let fileList = info.fileList
+      if (info.file.status === 'done') {
+        if (this.number > 0) {
+          fileList = fileList.slice(-this.number)
+        }
+        if (info.file.response.success) {
+          fileList = fileList.map((file) => {
+            if (file.response) {
+              // let reUrl = `${file.response.result.id}?token=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.response.result.fileName}`;
+              file.url = getFileAccessHttpUrl(file.response.result.id)
+            }
+            return file
+          })
+        }else{
+          info.fileList.pop()
+          this.uploadGoOn = false
+          this.$message.warn(info.file.response.message)
+        }
+        //this.$message.success(`${info.file.name} 上传成功!`);
+      } else if (info.file.status === 'error') {
+        this.$message.error(`${info.file.name} 上传失败.`)
+      } else if (info.file.status === 'removed') {
+        this.handleDelete(info.file)
+      }
+      this.fileList = fileList
+      if (info.file.status === 'done' || info.file.status === 'removed') {
+        //returnUrl为true时仅返回文件路径
+        if (this.returnUrl) {
+          this.handlePathChange()
+        } else {
+          //returnUrl为false时返回文件名称、文件路径及文件大小
+          this.newFileList = []
+          for (let a = 0; a < fileList.length; a++) {
+            // update-begin-author:lvdandan date:20200603 for:【TESTA-514】【开源issue】多个文件同时上传时，控制台报错
+            if (fileList[a].status === 'done') {
+              let fileJson = {
+                fileName: fileList[a].name,
+                filePath: fileList[a].url,
+                fileSize: fileList[a].size
+              }
+              this.newFileList.push(fileJson)
+            } else {
+              return
+            }
+            // update-end-author:lvdandan date:20200603 for:【TESTA-514】【开源issue】多个文件同时上传时，控制台报错
+          }
+          this.$emit('change', this.newFileList)
+        }
+      }
+    },
+    handleDelete(file) {
+      //如有需要新增 删除逻辑
+      console.log(file)
+    },
+    handlePreview(file) {
+      if (this.showOtherIcon) {
+        return
+      }
+      // eslint-disable-next-line no-unreachable
+      if (file && file.url) {
+        const fileFullUrl = `${window._CONFIG['domianWebSocketURL']}/sys/common/download/${file.response.result.id}?token=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.name}`
+        let url = `${window._CONFIG['onlinePreviewDomainURL']}?url=${encodeURIComponent(fileFullUrl)}`
+        // let url = `${window._CONFIG['onlinePreviewDomainURL']}?url=${encodeURIComponent(fileFullUrl)}`
+        window.open(url)
+      }
+    },
+    getFileUrl(fileId) {
+      return `${window._CONFIG['domianURL']}/sys/common/download/${fileId}`
+    },
+    /**
+     * 通过文件的id获取文件的相关信息
+     * @param id
+     */
+    getFileInfo(id) {
+      return new Promise(resolve => {
+        let result = {}
+        getFileInfo({id: id}).then(res => {
+          if (res.success) {
+            result = res.result
+          }
+        }).finally(() => {
+          resolve(result)
+        })
+      })
+    },
+    // 修改删除按钮的样式，增加文字说明
+    actionsClass(){
+      this.$nextTick(()=>{
+        let content = document.getElementsByClassName('ant-upload-list-item-card-actions')
+        for (let i = 0; i < content.length; i++) {
+          if ( content[i].childNodes.length > 0){
+            // content[i].innerHTML = '<a-icon type="delete" />'
+            content[i].childNodes[0].childNodes[0].innerHTML = ' <svg class="delete-icon" viewBox=\'64 64 896 896\' data-icon=\'delete\' width=\'1em\' height=\'1em\' fill=\'currentColor\'\n' +
+              '                aria-hidden=\'true\' focusable=\'false\' className=\'\'>\n' +
+              '             <path\n' +
+              '               d=\'M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z\'></path>\n' +
+              '           </svg><span class="delete-span">删除</span>'
+          }
+        }
+      })
+    },
+    /**
+     * 单个文件的下载功能
+     * @param file
+     */
+    myDownload(file) {
+      downloadFile(`sys/common/download/${file.response.result.id}`, file.name)
+    },
+    /**
+     * 单个文件的预览功能
+     * @param file
+     */
+    myPreview(file) {
+      if (file && file.url) {
+        const fileFullUrl = `${window._CONFIG['domianWebSocketURL']}/sys/common/download/${file.response.result.id}?token=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.name}`
+        let url = `${window._CONFIG['onlinePreviewDomainURL']}?url=${encodeURIComponent(fileFullUrl)}`
+        // let url = `${window._CONFIG['onlinePreviewDomainURL']}?url=${encodeURIComponent(fileFullUrl)}`
+        window.open(url)
+      }
+    }
+  },
+  mounted() {
+  },
+  model: {
+    prop: 'value',
+    event: 'change'
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.uploadty-disabled {
+  /deep/.ant-upload-list-item {
+    .anticon-close {
+      display: none;
+    }
+
+    .anticon-delete {
+      display: none;
+    }
+  }
+}
+// 新增的文件操作按钮的样式
+/deep/.file-list-html{
+  position: absolute!important;
+  top: 45px!important;
+  right: 60px!important;
+  height: auto!important;
+  z-index:2!important;
+}
+
+
+/deep/.file-item {
+  height: 30px;
+  position: relative;
+  display: flex;
+  align-items: center;
+  transition: opacity 1s;
+  opacity: 0;
+  &.show{
+    opacity: 1;
+    transition: opacity 2s;
+  }
+  & > span {
+    vertical-align: middle;
+  }
+  .file-item-btn {
+    display: inline-block;
+    margin-left: 10px;
+    color: #808080;
+    cursor: pointer;
+  }
+}
+
+
+// 左侧文件名称的样式
+/deep/.ant-upload-list-item-name{
+  width: calc(100% - 150px) !important;
+  height: 23px !important;
+  text-align: left;
+  line-height: 23px;
+  padding-right: 10px !important;
+  text-overflow: ellipsis !important;
+  overflow: hidden !important;
+  white-space: nowrap !important;
+}
+// 删除按钮的样式
+/deep/.ant-upload-list-item-card-actions{
+  opacity: 1!important;
+  color: #808080;
+  cursor: pointer!important;
+}
+// 删除按钮 样式的修改
+/deep/.delete-icon,
+/deep/.delete-span{
+  display: inline-block;
+  vertical-align: middle;
+  margin-top: -4px;
+  cursor: pointer!important;
+  color: #808080;
+}
+
+// 单显hover隐掉
+/deep/.ant-upload-list-item-info:hover {
+  background: none !important;
+;
+}
+
+/deep/.ant-upload-list-item-name:hover {
+  cursor: pointer;
+}
+
+
+</style>

src/config/router.config.js

@@ -172,7 +172,7 @@ export const routerData = [
               keepAlive: false,
               internalOrExternal: false,
               componentName: 'MemberInfo',
-              title: '会员信息'
+              title: '会员缴费'
             },
             name: 'standardsAssociation/PaymentInfo/MemberInfo',
             path: '/standardsAssociation/PaymentInfo/MemberInfo',
@@ -184,7 +184,7 @@ export const routerData = [
               keepAlive: false,
               internalOrExternal: false,
               componentName: 'CertificateInfo',
-              title: '证书信息'
+              title: '证书缴费'
             },
             name: 'standardsAssociation/PaymentInfo/CertificateInfo',
             path: '/standardsAssociation/PaymentInfo/CertificateInfo',
@@ -386,4 +386,4 @@ export const routerData = [
     name: 'council-detail-page',
     id: '12'
   }
-]
+]

src/mixins/JeroListMixin.js

@@ -20,8 +20,10 @@ export const JeroListMixin = {
       lastQueryParam: {},
       /* 数据源 */
       dataSource:[],
-      // 做一步转换，方便会员系统的使用
+      // 做一步转换，方便会员系统使用自己内部的方法
       getAction,
+      deleteAction,
+      getFileAccessHttpUrl,
       /* 分页参数 */
       ipagination:{
         current: 1,
@@ -184,7 +186,7 @@ export const JeroListMixin = {
           content: '是否删除选中数据?',
           onOk: function () {
             that.loading = true
-            deleteAction(that.url.deleteBatch, {ids: ids}).then((res) => {
+            that.deleteAction(that.url.deleteBatch, {ids: ids}).then((res) => {
               if (res.success) {
                 that.$message.success(res.message)
                 // 判断当前删除的数据是否是最后一页的全部数据，如果是的话页码减一
@@ -215,7 +217,7 @@ export const JeroListMixin = {
         title: '确认删除',
         content: '确定要删除此条数据吗?',
         onOk: function() {
-          deleteAction(that.url.delete, {id: id}).then((res) => {
+          that.deleteAction(that.url.delete, {id: id}).then((res) => {
             if (res.success) {
               that.$message.success(res.message)
               // 判断当前删除的数据是否是最后一页的最后一条数据，如果是的话页码减一
@@ -339,7 +341,7 @@ export const JeroListMixin = {
       if(text && text.indexOf(',')>0){
         text = text.substring(0,text.indexOf(','))
       }
-      return getFileAccessHttpUrl(text)
+      return this.getFileAccessHttpUrl(text)
     },
     /* 文件下载 */
     // update--autor:lvdandan-----date:20200630------for：修改下载文件方法名uploadFile改为downloadFile------
@@ -352,7 +354,7 @@ export const JeroListMixin = {
       if(text.indexOf(',')>0){
         text = text.substring(0,text.indexOf(','))
       }
-      let url = getFileAccessHttpUrl(text)
+      let url = this.getFileAccessHttpUrl(text)
       window.open(url)
     },
     /*

src/mixins/RangeDateMixin.js

@@ -21,7 +21,12 @@ export const RangeDateMixin = {
         return false
       }
       // console.log(endValue.valueOf(),'endValue.valueOf()')
-      return startValue.valueOf() > endValue.valueOf() + 86400000
+      if(this.rangeDateFormat.begin === 'YYYY-MM-DD') {
+        return startValue.valueOf() > endValue.valueOf() + 86400000
+      } else {
+        return startValue.valueOf() > endValue.valueOf()
+      }
+
     },
 
     disabledEndDate(endValue) {

src/utils/memberRequest.js

@@ -102,7 +102,7 @@ const err = (error) => {
 service.interceptors.request.use(config => {
   // const token = Vue.ls.get(ACCESS_TOKEN)
   //TODO 暂时将token写成固定值，后续再做动态
-  const token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJleHAiOjE2MzkzNzY3MzcsInVzZXJuYW1lIjoiMGI4ZDQ2YTBiZTI0NGJlZGI5ZDI1Y2Y5ZmQ5OTc3MTcifQ.FvA0UgdKJm1m0rbkaS4CX72-GozZVPDmcZ296FvaBfQ'
+  const token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJleHAiOjE2Mzk0NjEyMzcsInVzZXJuYW1lIjoiMGI4ZDQ2YTBiZTI0NGJlZGI5ZDI1Y2Y5ZmQ5OTc3MTcifQ.jKG-mtZ4VHS5BAFGayuwOJgBBzZTiKQc3bkbya2YTNA'
   if (token) {
     config.headers[ 'X-Access-Token' ] = token // 让每个请求携带自定义 token 请根据实际情况自行修改
   }

src/views/standardsAssociation/BasicInfo.vue

@@ -1,48 +1,48 @@
 <template>
-  <div class='main-box member-basic-info'>
-    <div class='panel-cell'>
+  <div class="main-box member-basic-info">
+    <div class="panel-cell">
       <div class="title">秘书处信息</div>
-      <div class='content'>
-        <div class='info-row'>
-          <span class='label-span'>地址：</span>
-          <span class='value-span'>{{secretariatInfo.address}}</span>
+      <div class="content">
+        <div class="info-row">
+          <span class="label-span">地址：</span>
+          <span class="value-span">{{ secretariatInfo.address }}</span>
         </div>
-        <div class='info-row'>
-          <span class='label-span'>联系人：</span>
-          <span class='value-span'>{{secretariatInfo.contactPerson}}</span>
+        <div class="info-row">
+          <span class="label-span">联系人：</span>
+          <span class="value-span">{{ secretariatInfo.contactPerson }}</span>
         </div>
-        <div class='info-row'>
-          <span class='label-span'>联系人电话：</span>
-          <span class='value-span'>{{secretariatInfo.contactPhone}}</span>
+        <div class="info-row">
+          <span class="label-span">联系人电话：</span>
+          <span class="value-span">{{ secretariatInfo.contactPhone }}</span>
         </div>
-        <div class='info-row'>
-          <span class='label-span'>联系人邮箱：</span>
-          <span class='value-span'>{{secretariatInfo.contactMail}}</span>
+        <div class="info-row">
+          <span class="label-span">联系人邮箱：</span>
+          <span class="value-span">{{ secretariatInfo.contactMail }}</span>
         </div>
       </div>
     </div>
-    <div class='panel-cell'>
+    <div class="panel-cell">
       <div class="title">本企业信息</div>
-      <div class='content'>
-        <div class='info-row'>
-          <span class='label-span'>企业名称：</span>
-          <span class='value-span'>{{memberInfo.companyName}}</span>
+      <div class="content">
+        <div class="info-row">
+          <span class="label-span">企业名称：</span>
+          <span class="value-span">{{ memberInfo.companyName }}</span>
         </div>
-        <div class='info-row'>
-          <span class='label-span'>企业管理员：</span>
-          <span class='value-span'>{{memberInfo.contactPerson}}</span>
+        <div class="info-row">
+          <span class="label-span">企业管理员：</span>
+          <span class="value-span">{{ memberInfo.contactPerson }}</span>
         </div>
-        <div class='info-row'>
-          <span class='label-span'>管理员电话：</span>
-          <span class='value-span'>{{memberInfo.contactPhone}}</span>
+        <div class="info-row">
+          <span class="label-span">管理员电话：</span>
+          <span class="value-span">{{ memberInfo.contactPhone }}</span>
         </div>
-        <div class='info-row'>
-          <span class='label-span'>管理员邮箱：</span>
-          <span class='value-span'>{{memberInfo.contactMail}}</span>
+        <div class="info-row">
+          <span class="label-span">管理员邮箱：</span>
+          <span class="value-span">{{ memberInfo.contactMail }}</span>
         </div>
-        <div class='info-row'>
-          <span class='label-span'>会员有效期：</span>
-          <span class='value-span'>{{memberInfo.memberTerm}}</span>
+        <div class="info-row">
+          <span class="label-span">会员有效期：</span>
+          <span class="value-span">{{ memberInfo.memberTerm }}</span>
         </div>
       </div>
     </div>
@@ -56,10 +56,10 @@ export default {
     return {
       // 秘书处信息
       secretariatInfo: {
-        address: '东丽区' , // 地址
-        contactPerson: '郭某某' , // 联系人
-        contactPhone: '022-5907252' , // 联系人电话
-        contactMail: '113222222222222@qq.c113222222222222113222222222222113222222222222113222222222222113222222222222113222222222222113222222222222om' , // 联系人邮箱
+        address: '东丽区', // 地址
+        contactPerson: '郭某某', // 联系人
+        contactPhone: '022-5907252', // 联系人电话
+        contactMail: '113222222222222@qq.c113222222222222113222222222222113222222222222113222222222222113222222222222113222222222222113222222222222om' // 联系人邮箱
       },
       // 本企业信息
       memberInfo: {
@@ -67,7 +67,7 @@ export default {
         contactPerson: '', //  企业管理员
         contactPhone: '', //  管理员电话
         contactMail: '', //  管理员邮箱
-        memberTerm: 'xxxx年xx月xx日到xxxx年xx月xx日', //  会员有效期
+        memberTerm: 'xxxx年xx月xx日到xxxx年xx月xx日' //  会员有效期
       }
     }
   },
@@ -80,8 +80,9 @@ export default {
 }
 </script>
 
-<style scoped lang='less'>
+<style scoped lang="less">
 @import '~@assets/less/common.less';
+
 .member-basic-info {
   position: relative;
   margin-bottom: 20px;
@@ -92,7 +93,7 @@ export default {
   color: #999;
   opacity: 1;
 
-  .panel-cell{
+  .panel-cell {
     flex: 1;
     width: 0;
     height: 419px;
@@ -101,6 +102,7 @@ export default {
     border-radius: 4px;
     box-shadow: -2px 0px 10px 10px rgba(51, 51, 51, 0.10);
     background: #ffffff;
+
     .title {
       height: 56px;
       line-height: 56px;
@@ -109,22 +111,26 @@ export default {
       padding: 0 20px;
       font-size: 16px;
     }
-    .content{
+
+    .content {
       padding: 10px;
       // 每行数据
-      .info-row{
+      .info-row {
         padding: 10px;
         display: flex;
         flex-direction: row;
         align-items: baseline;
+
         & > span {
           display: inline-block;
           white-space: pre-wrap;
         }
-        .label-span{
+
+        .label-span {
           width: 100px;
         }
-        .value-span{
+
+        .value-span {
           width: 0;
           flex: 1;
           overflow: hidden;
@@ -134,7 +140,8 @@ export default {
       }
     }
   }
-  .panel-cell + .panel-cell{
+
+  .panel-cell + .panel-cell {
     margin-left: 10px;
   }
 }

src/views/standardsAssociation/CertificateManagement.vue

@@ -1,13 +1,563 @@
+<!--标协会员-证书管理-->
 <template>
-  <div>证书管理</div>
+  <div class="main-box">
+    <a-card :bordered="false">
+      <!-- 查询区域 -->
+      <div class="table-page-search-wrapper">
+        <a-form layout="inline" @keyup.enter.native="searchQuery">
+          <a-row :gutter="24">
+            <a-col :span="6" :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="证书类型" class="certificate-type-item">
+                <j-dict-select-tag
+                  placeholder="请选择证书类型"
+                  v-model="queryParam.certificateType"
+                  :title="queryParam.certificateType"
+                  dictCode="certificate_type" />
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="状态">
+                <j-multi-select-tag
+                  placeholder="请选择证书状态"
+                  v-model="queryParam.certificateStatus"
+                  dictCode="certificate_status"
+                >
+
+                </j-multi-select-tag>
+              </a-form-item>
+            </a-col>
+            <template>
+              <a-col :xl="10" :lg="11" :md="12" :sm="24">
+                <a-form-item label="发证时间">
+                  <j-date
+                    placeholder="请选择开始日期"
+                    date-format="YYYY-MM-DD 00:00:00"
+                    class="query-group-cust"
+                    v-model="queryParam.beginCertificationDate"
+                    :disabled-date="disabledStartDate">
+                  </j-date>
+                  <span class="query-group-split-cust"></span>
+                  <j-date
+                    placeholder="请选择结束日期"
+                    date-format="YYYY-MM-DD 23:59:59"
+                    class="query-group-cust"
+                    v-model="queryParam.endCertificationDate"
+                    :disabled-date="disabledEndDate">
+                  </j-date>
+                </a-form-item>
+              </a-col>
+            </template>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24" v-has=" 'vin:applicationHistory'">
+              <a-form-item label="单位全称">
+                <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 style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
+              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">刷新</a-button>
+              <a-button
+                type="primary"
+                @click="applyCertificate"
+                class="primary"
+                style="margin-left: 8px">申请证书
+              </a-button>
+            </span>
+            </a-col>
+          </a-row>
+        </a-form>
+      </div>
+      <!-- 查询区域-END -->
+
+      <!-- table区域-begin -->
+      <div>
+        <a-table
+          ref="table"
+          size="middle"
+          bordered
+          rowKey="id"
+          :columns="columns"
+          :dataSource="dataSource"
+          :pagination="ipagination"
+          :loading="loading"
+          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">
+            <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
+            <a-button
+              v-else
+              :ghost="true"
+              type="primary"
+              icon="download"
+              size="small"
+              @click="uploadFile(text)">
+              下载
+            </a-button>
+          </template>
+
+          <span slot="action" class="action-span-cell" slot-scope="text, record">
+          <a @click="handleDetail(record)">查看</a>
+            <!--          <a v-has="'vin:verify'" v-show="record.certificateStatus == 3">-->
+            <!--            <a href="javascript:;" @click="(record.certificateStatus === 3) && handleVerify(record)">核实</a>-->
+            <!--          </a>-->
+          <a v-show="record.certificateStatus == 4">
+            <a href="javascript:;" @click="(record.certificateStatus == 4) && bindMember(record)">绑定会员</a>
+          </a>
+            <!--           v-show="record.chargeType != 1 && record.certificateModality == 3 && record.certificateStatus == 5"-->
+            <!-- 已绑定的证书不能续费  已支付已缴费的不能续费 需要流程走完才能续费 v-has="'vin:renew'"-->
+          <a
+            v-show="record.certificateStatus === 4 ||record.certificateStatus === 5 || record.certificateStatus === 7 ">
+            <a href="javascript:;" @click="renewCharge(record)">续费</a>
+          </a>
+            <!-- v-has="'vin:renewal'"-->
+          <a
+            v-show="record.certificateModality == 3 && (record.certificateStatus == 1 || record.certificateStatus == 4)">
+            <a href="javascript:;"
+               @click="(record.certificateModality == 3 && (record.certificateStatus == 1 || record.certificateStatus == 4)) && replacement(record)">换证</a>
+          </a>
+          <a v-show="(record.certificateStatus == 6 && record.chargeType == 2) || record.certificateStatus == 0">
+            <a href="javascript:;"
+               @click="((record.certificateStatus == 6 && record.chargeType == 2) || record.certificateStatus == 0) && handleEditRenew(record)">编辑</a>
+          </a>
+            <!--         会员 只有企业证书才 正常使用 已绑定的证书 可授权申请-->
+          <a
+            v-show="roleCode === 'member'&&  record.certificateType === 2 && (record.certificateStatus === 4 ||  record.certificateStatus === 1)"
+          >
+            <a href="javascript:;" @click="authorizationFunc(record)">授权申请</a>
+          </a>
+
+          <a v-show="record.certificateStatus == 6  || record.certificateStatus == 0">
+            <a
+              @click="(record.certificateStatus == 6  || record.certificateStatus == 0) && handleDelete(record.id)">删除</a>
+          </a>
+        </span>
+          <!-- 状态渲染模板 -->
+          <template slot="customRenderStatus" slot-scope="certificateStatus">
+            <a-tag v-if="certificateStatus==0" color="#c37e00">待支付</a-tag>
+            <a-tag v-if="certificateStatus==1" color="#40835e">已绑定</a-tag>
+            <a-tag v-if="certificateStatus==2" color="#40835e">已支付</a-tag>
+            <a-tag v-if="certificateStatus==3" color="#40835e">已缴费</a-tag>
+            <a-tag v-if="certificateStatus==4" color="#40835e">正常使用</a-tag>
+            <a-tag v-if="certificateStatus==5" color="#8a8c8e">已失效</a-tag>
+            <a-tag v-if="certificateStatus==6" color="#8a8c8e">已驳回</a-tag>
+            <a-tag v-if="certificateStatus==7" color="#8a8c8e">绑定已失效</a-tag>
+          </template>
+          <!--        临近证书与超期证书-->
+          <template slot="codeState" slot-scope="text,record">
+            <span v-if="record.codeState === 0 ">{{ text }}<span class="state-0">超期证书</span></span><!--
+          --><span v-if="record.codeState === 1 ">{{ text }}<span class="state-1">临期证书</span></span><!--
+          --><span v-if="record.codeState === 2 ">{{ text }}</span>
+          </template>
+        </a-table>
+      </div>
+
+      <vinCertificate-modal ref="modalForm" @ok="modalFormOk"></vinCertificate-modal>
+    </a-card>
+  </div>
 </template>
 
 <script>
+import '@/assets/less/TableExpand.less'
+import { mixinDevice } from '@/utils/mixin'
+import { JeroListMixin } from '@/mixins/JeroListMixin'
+import VinCertificateModal from './memberManagementModule/VinCertificateModal'
+import JDate from '../../components/tools/JDate'
+import Vue from 'vue'
+import { USER_INFO } from '@/store/mutation-types'
+import JMultiSelectTag from '@comp/standardsAssociation/JMultiSelectTag'
+import { RangeDateMixin } from '@/mixins/RangeDateMixin'
+import JDictSelectTag from '../../components/standardsAssociation/JDictSelectTag'
+// eslint-disable-next-line no-unused-vars
+import { deleteAction, downloadFile, getAction, getFileAccessHttpUrl } from '@/api/memberManage'
+
 export default {
-  name: 'CertificateManagement'
+  name: 'CertificateManagement',
+  mixins: [JeroListMixin, mixinDevice, RangeDateMixin],
+  components: {
+    JMultiSelectTag,
+    JDate,
+    VinCertificateModal,
+    JDictSelectTag
+  },
+  data() {
+    return {
+      deleteAction,
+      getAction,
+      getFileAccessHttpUrl,
+      // 时间范围查询显示的类型
+      rangeDateFormat: {
+        begin: 'YYYY-MM-DD hh:mm:ss',
+        end: 'YYYY-MM-DD'
+      },
+      description: 'VIN证书管理页面',
+      roleCode: Vue.ls.get(USER_INFO).roleCode,
+      // 表头
+      columns: [
+        {
+          title: '序号',
+          dataIndex: '',
+          key: 'rowIndex',
+          width: 60,
+          align: 'center',
+          customRender: function(t, r, index) {
+            return parseInt(index) + 1
+          }
+        },
+        {
+          title: '单位全称',
+          align: 'center',
+          dataIndex: 'companyName'
+        },
+        {
+          title: '证书类型',
+          align: 'center',
+          dataIndex: 'certificateType',
+          customRender: function(text) {
+            if (text === 1) {
+              return '世界制造厂识别代号（WMI）证书'
+            } else if (text === 2) {
+              return '企业名称代号证书'
+            }
+          }
+        },
+        {
+          title: '证书代码',
+          align: 'center',
+          dataIndex: 'code',
+          scopedSlots: { customRender: 'codeState' }
+        },
+        {
+          title: '发证时间',
+          align: 'center',
+          dataIndex: 'certificationDate'
+        },
+        {
+          title: '生效时间',
+          align: 'center',
+          dataIndex: 'effectDate',
+          customRender: function(text) {
+            return !text ? '' : (text.length > 10 ? text.substr(0, 10) : text)
+          }
+        },
+        {
+          title: '失效时间',
+          align: 'center',
+          dataIndex: 'invalidDate',
+          customRender: function(text) {
+            return !text ? '' : (text.length > 10 ? text.substr(0, 10) : text)
+          }
+        },
+        {
+          title: '备案通知书',
+          align: 'center',
+          dataIndex: 'noticeOfFiling',
+          customRender: function(text) {
+            if (text === 1) {
+              return '是'
+            } else if (text === 0) {
+              return '否'
+            } else {
+              return ''
+            }
+          }
+        },
+        {
+          title: '状态',
+          align: 'center',
+          dataIndex: 'certificateStatus',
+          scopedSlots: { customRender: 'customRenderStatus' }
+        },
+        {
+          title: '证书形式',
+          align: 'center',
+          dataIndex: 'certificateModality',
+          customRender: function(text) {
+            if (text === 1) {
+              return '换证'
+            } else if (text === 2) {
+              return '续证'
+            } else if (text === 3) {
+              return '正常'
+            } else if (text === 4) {
+              return '申请'
+            }
+          }
+        },
+        {
+          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: 16 }
+      },
+      url: {
+        list: '/vinCertificate/vinCertificate/getMyVinCertificate',
+        delete: '/vinCertificate/vinCertificate/delete',
+        deleteBatch: '/vinCertificate/vinCertificate/deleteBatch',
+        exportXlsUrl: '/vinCertificate/vinCertificate/exportXls',
+        importExcelUrl: 'vinCertificate/vinCertificate/importExcel'
+      },
+      dictOptions: {},
+      dateKeyObj: {
+        beginKey: 'beginCertificationDate',
+        endKey: 'endCertificationDate'
+      }
+
+    }
+  },
+  computed: {
+    importExcelUrl: function() {
+      return `${window._CONFIG['memberURL']}/${this.url.importExcelUrl}`
+    }
+  },
+  methods: {
+    initDictConfig() {
+    },
+    // 授权
+    authorizationFunc(record) {
+      this.$router.push({
+        name: 'member-vinCertificate-Authorization',
+        query: {
+          id: record.id
+        }
+      })
+    },
+    /*
+      * 授权记录
+      * */
+    authorizationHistoryFunc(record) {
+      this.$router.push({
+        name: 'member-vinCertificate-Authorization',
+        query: {
+          id: record.id
+        }
+      })
+    },
+    // 申请证书
+    applyCertificate: function() {
+      const that = this
+      // 可申请的免费证书的个数
+      let freeCount
+      getAction('/vinCertificate/vinCertificate/getFreeCount').then(res => {
+        if (res.success) {
+          freeCount = res.result
+          that.$refs.modalForm.title = '新增申请'
+          that.$refs.modalForm.disableSubmit = false
+          that.$refs.modalForm.freeCount = freeCount
+          // freeCount 为0 打开收费证书申请窗口
+          if (freeCount === 0) {
+            that.$refs.modalForm.pageType = 6
+          } else {
+            that.$refs.modalForm.pageType = 5
+          }
+          // 弹窗口操作
+          that.$refs.modalForm.add()
+        } else {
+          that.$message.warning(res.message)
+        }
+      })
+    },
+    // 查看证书
+    handleDetail: function(record) {
+      this.$refs.modalForm.title = '查看证书'
+      this.$refs.modalForm.disableSubmit = true
+      this.$refs.modalForm.pageType = 1
+      this.$refs.modalForm.remainingTime = this.remainingTimeCount(record.certificateValidDate)
+      this.$refs.modalForm.edit(record)
+    },
+    // 核实证书
+    handleVerify: function(val) {
+      this.$refs.modalForm.title = '核对证书'
+      this.$refs.modalForm.disableSubmit = true
+      if (val.certificateModality === 1) {
+        this.$refs.modalForm.pageType = 3
+      } else {
+        // 新增和续证使用2号核对窗口
+        this.$refs.modalForm.pageType = 2
+      }
+      // 换证时使用3号核对窗口
+      this.$refs.modalForm.edit(val)
+    },
+    // 绑定会员
+    bindMember: function(record) {
+      this.$refs.modalForm.title = '绑定会员'
+      this.$refs.modalForm.disableSubmit = true
+      // 绑定会员时使用4号窗口
+      this.$refs.modalForm.pageType = 4
+      // 证书id
+      this.$refs.modalForm.vinId = record.id
+      this.$refs.modalForm.edit(record)
+    },
+    // 续费
+    renewCharge: function(record) {
+      // if(!(record.chargeType != 1 && record.certificateModality == 3 && record.certificateStatus == 5)){
+      //   return;
+      // }
+      this.$refs.modalForm.title = '续费'
+      this.$refs.modalForm.disableSubmit = true
+      // 换证显示 1是世界证书
+      this.$refs.modalForm.isChangeCer = record.certificateType
+      // 证书续费时使用7号窗口
+      this.$refs.modalForm.pageType = 7
+      this.$refs.modalForm.edit2(record)
+    },
+    // 换证
+    replacement: function(record) {
+      this.$refs.modalForm.title = '换证'
+      this.$refs.modalForm.disableSubmit = true
+      // 换证的时候使用8号窗口
+      this.$refs.modalForm.pageType = 8
+      this.$refs.modalForm.edit3(record)
+    },
+    // 编辑: 包括免费证书，收费证书，续费，换证
+    handleEditRenew: function(record) {
+      console.log(record)
+      record.certificateModality = Number(record.certificateModality)
+      record.certificateStatus = Number(record.certificateStatus)
+      record.chargeType = Number(record.chargeType)
+      // 分为续证驳回和 非免费证书申请驳回 chargeType 1是免费证书 2是收费证书
+      this.$refs.modalForm.title = ''
+      this.$refs.modalForm.disableSubmit = true
+      //  certificateStatus 0 是待支付
+      if (record.certificateStatus === 0) {
+        if (record.chargeType === 1) {
+          if (record.certificateModality === 4) {
+            // 免费证书申请编辑
+            let freeCount
+            getAction('/vinCertificate/vinCertificate/getFreeCount').then((res) => {
+              freeCount = res.result
+              this.$refs.modalForm.freeCountVin = freeCount + 1
+              this.$refs.modalForm.title = '新增申请'
+              this.$refs.modalForm.disableSubmit = false
+              this.$refs.modalForm.pageType = 10
+              this.$refs.modalForm.edit5(record)
+              return
+            })
+            return
+          } else if (record.certificateModality === 1) {
+            // 免费证书换证编辑
+            this.$refs.modalForm.title = '换证'
+            this.$refs.modalForm.disableSubmit = true
+            // 换证的时候使用13号窗口
+            this.$refs.modalForm.pageType = 13
+            this.$refs.modalForm.edit8(record)
+          }
+        } else if (record.chargeType === 2 && record.certificateModality === 4) {
+          // 收费证书编辑
+          this.$refs.modalForm.title = '新增申请'
+          this.$refs.modalForm.disableSubmit = false
+          this.$refs.modalForm.pageType = 11
+          this.$refs.modalForm.edit6(record)
+        } else if (record.chargeType === 2 && record.certificateModality === 2) {
+          // 续费编辑
+          this.$refs.modalForm.title = '续费'
+          this.$refs.modalForm.disableSubmit = true
+          // 证书续费编辑时使用12号窗口
+          this.$refs.modalForm.pageType = 12
+          this.$refs.modalForm.edit7(record)
+        } else if (record.chargeType === 2 && record.certificateModality === 1) {
+          // 换证编辑
+          this.$refs.modalForm.title = '换证'
+          this.$refs.modalForm.disableSubmit = true
+          // 换证的时候使用13号窗口
+          this.$refs.modalForm.pageType = 13
+          this.$refs.modalForm.edit8(record)
+        }
+      } else {
+        // 新增证书缴费编辑窗口
+        if (record.chargeType === 2 && record.certificateModality === 4 && record.certificateStatus === 6) {
+          this.$refs.modalForm.title = '新增申请'
+          this.$refs.modalForm.disableSubmit = false
+          this.$refs.modalForm.pageType = 11
+          this.$refs.modalForm.edit6(record)
+        } else if (record.chargeType === 2 && record.certificateModality === 2 && record.certificateStatus === 6) {
+          this.$refs.modalForm.title = '续费'
+          this.$refs.modalForm.disableSubmit = true
+          // 证书续费编辑时使用12号窗口
+          this.$refs.modalForm.pageType = 12
+          this.$refs.modalForm.edit7(record)
+        }
+      }
+    },
+    remainingTimeCount: function(date) {
+      if (date === null || date === undefined || date.length === 0) {
+        return 0
+      }
+      date = date.substring(11)
+      var strArr = (date + ' 23:59:59').split(' ')
+      var strDay = strArr[0].split('-')
+      var strTime = strArr[1].split(':')
+      var yy = strDay[0]
+      var mm = strDay[1]
+      var dd = strDay[2]
+      var hh = strTime[0]
+      var mi = strTime[1]
+      var se = strTime[2]
+      var date1 = new Date(Date.UTC(yy, mm - 1, dd, hh - 8, mi, se))
+      var date2 = new Date()
+      if (date1 <= date2) {
+        return 0
+      }
+      // var miao = (date1.getTime() - date2.getTime()) / 1000
+      var fen = ((date1.getTime() - date2.getTime()) / 1000) / 60
+      return parseInt(fen / (24 * 60)) // 得出剩bai余
+    }
+  }
 }
 </script>
 
-<style scoped>
+<style scoped lang="less">
+@import '~@assets/less/common.less';
 
-</style>
+@label-width: 78px;
+.certificate-type-item {
+  /deep/ .ant-form-item-label {
+    min-width: @label-width !important;
+  }
+
+  /deep/ .ant-form-item-control-wrapper {
+    width: calc(100% - @label-width);
+    max-width: calc(100% - @label-width);
+
+    & > span {
+      max-width: 100%;
+    }
+  }
+}
+
+.state-0 {
+  display: inline-block;
+  margin-left: 5px;
+  color: red;
+
+}
+
+.state-1 {
+  display: inline-block;
+  margin-left: 5px;
+  color: #c37e00;
+}
+</style>

src/views/standardsAssociation/MemberManagement.vue

@@ -1,6 +1,6 @@
 <!--企业端的会员管理的相关信息 -->
 <template>
-  <div class='main-box'>
+  <div class="main-box">
     <a-card :bordered="false">
       <!--企业端-编辑框-->
       <div>
@@ -28,28 +28,29 @@
               <a-col :span="6" v-if="memberInfo.memberStatus === 3 ">
                 <a-form-item label="会员批复文件" :labelCol="labelColTopInfo" :wrapperCol="wrapperColTopInfo">
                   <!--                      如果当前没有批复文号 不显示 会员批复文件-->
-                  <span  v-if="currentApproval" class="approveFile" @click="uploadApproveFile(memberInfo)">会员批复文件.pdf</span>
+                  <span v-if="currentApproval" class="approveFile"
+                        @click="uploadApproveFile(memberInfo)">会员批复文件.pdf</span>
                 </a-form-item>
               </a-col>
 
             </a-row>
             <a-row :span="24">
-              <a-col :span='6'>
-                <a-form-item label='会员状态' :labelCol='labelColTopInfo' :wrapperCol='wrapperColTopInfo'>
+              <a-col :span="6">
+                <a-form-item label="会员状态" :labelCol="labelColTopInfo" :wrapperCol="wrapperColTopInfo">
                 <span
-                  data-v-fd11489c=''
-                  class='ant-tag ant-tag-yellow'
-                  v-if='memberInfo.memberStatus === 1'>待审核</span>
-                  <span data-v-fd11489c='' class='ant-tag ant-tag-blue' v-if='memberInfo.memberStatus === 2'>未缴费</span>
+                  data-v-fd11489c=""
+                  class="ant-tag ant-tag-yellow"
+                  v-if="memberInfo.memberStatus === 1">待审核</span>
+                  <span data-v-fd11489c="" class="ant-tag ant-tag-blue" v-if="memberInfo.memberStatus === 2">未缴费</span>
                   <span
-                    data-v-fd11489c=''
-                    class='ant-tag ant-tag-green'
-                    v-if='memberInfo.memberStatus === 3'>已缴费</span>
+                    data-v-fd11489c=""
+                    class="ant-tag ant-tag-green"
+                    v-if="memberInfo.memberStatus === 3">已缴费</span>
                   <span
-                    data-v-fd11489c=''
-                    class='ant-tag ant-tag-gray'
-                    v-if='memberInfo.memberStatus === 4'>会员已过期</span>
-                  <span class='red'>会员还剩<b>{{ remainingTime }}</b>天</span>
+                    data-v-fd11489c=""
+                    class="ant-tag ant-tag-gray"
+                    v-if="memberInfo.memberStatus === 4">会员已过期</span>
+                  <span class="red">会员还剩<b>{{ remainingTime }}</b>天</span>
                 </a-form-item>
               </a-col>
               <a-col :span="6">
@@ -64,29 +65,33 @@
               </a-col>
               <!--                副理事会长才显示推荐表-->
               <a-col :span="6" v-if="memberInfo.memberNature === 1 ">
-                <a-form-item label="推荐表"  :labelCol="labelColTopInfo" :wrapperCol="wrapperColTopInfo">
-                  <span class="approveFile" @click="downRecommendWord(memberInfo.recommendWordId)">{{ memberInfo.recommendWordName }}</span>
+                <a-form-item label="推荐表" :labelCol="labelColTopInfo" :wrapperCol="wrapperColTopInfo">
+                  <span class="approveFile"
+                        @click="downRecommendWord(memberInfo.recommendWordId)">{{ memberInfo.recommendWordName }}</span>
                 </a-form-item>
               </a-col>
             </a-row>
             <div>
               <div class="row clearfix">
                 <div class="col-md-12 column">
-                  <a-tabs @change="switchNav" :animated='false'>
+                  <a-tabs @change="switchNav" :animated="false">
                     <a-tab-pane key="1" tab="会员信息">
-                      <member-info v-if='navIndex === 1' ref='memberInfoDom' :member-info='memberInfo'></member-info>
+                      <member-info v-if="navIndex === 1" ref="memberInfoDom" :member-info="memberInfo"></member-info>
                     </a-tab-pane>
                     <a-tab-pane key="2" tab="缴费记录">
-                      <payment-info v-if='navIndex === 2' ref='paymentInfo' :member-info='memberInfo'></payment-info>
+                      <payment-info v-if="navIndex === 2" ref="paymentInfo" :member-info="memberInfo"></payment-info>
                     </a-tab-pane>
                     <a-tab-pane key="3" tab="证书记录">
-                      <certificate-info v-if='navIndex === 3' ref='certificateInfo' :member-info='memberInfo'></certificate-info>
+                      <certificate-info v-if="navIndex === 3" ref="certificateInfo"
+                                        :member-info="memberInfo"></certificate-info>
                     </a-tab-pane>
                     <a-tab-pane key="4" tab="单位名称变更记录">
-                      <company-name-apply-record v-if='navIndex === 4' ref='companyNameApplyRecord' :member-info='memberInfo'></company-name-apply-record>
+                      <company-name-apply-record v-if="navIndex === 4" ref="companyNameApplyRecord"
+                                                 :member-info="memberInfo"></company-name-apply-record>
                     </a-tab-pane>
                     <a-tab-pane key="5" tab="资源下载记录">
-                      <download-record v-if='navIndex === 5' ref='downloadRecord' :member-info='memberInfo'></download-record>
+                      <download-record v-if="navIndex === 5" ref="downloadRecord"
+                                       :member-info="memberInfo"></download-record>
                     </a-tab-pane>
                   </a-tabs>
                 </div>
@@ -178,7 +183,8 @@ export default {
           return '理事单位'
         case 3:
           return '会员单位'
-        default: return ''
+        default:
+          return ''
       }
     }
   },
@@ -360,7 +366,7 @@ export default {
 }
 </script>
 
-<style scoped lang='less'>
+<style scoped lang="less">
 @import '~@assets/less/common.less';
 // 会员批复文件的样式
 .approveFile {
@@ -368,14 +374,16 @@ export default {
   cursor: pointer;
   margin-left: 10px;
 }
+
 .red {
   color: red;
 }
+
 // 2021-09-23 标题部分的修改
-/deep/.member-panel-title{
+/deep/ .member-panel-title {
   height: 48px;
   line-height: 48px;
-  background: rgba(6,159,153,0.1);
+  background: rgba(6, 159, 153, 0.1);
   font-size: 16px;
   width: calc(100% - 0px);
   color: #2F3133;

src/views/standardsAssociation/PaymentInfo/CertificateInfo.vue

@@ -1,13 +1,306 @@
+<!--缴费信息-证书缴费-->
 <template>
-  <div>缴费信息-证书信息</div>
+  <div class="main-box">
+    <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" v-if="!memberFlag">
+              <a-form-item label="单位全称">
+                <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="缴费状态">
+                <j-dict-select-tag placeholder="请选择缴费状态" v-model="queryParam.paymentStatus"
+                                   dictCode="certificate_payment_status" />
+              </a-form-item>
+            </a-col>
+            <template>
+              <a-col :xl="10" :lg="11" :md="12" :sm="24">
+                <a-form-item label="缴费时间">
+                  <j-date date-format="YYYY-MM-DD 00:00:00" placeholder="请选择开始日期" class="query-group-cust"
+                          v-model="queryParam.submissionTime_begin" :disabled-date="disabledStartDate"></j-date>
+                  <span class="query-group-split-cust"></span>
+                  <j-date date-format="YYYY-MM-DD 23:59:59" placeholder="请选择结束日期" class="query-group-cust"
+                          v-model="queryParam.submissionTime_end" :disabled-date="disabledEndDate"></j-date>
+                </a-form-item>
+              </a-col>
+            </template>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="缴费类型">
+                <j-dict-select-tag placeholder="请选择缴费类型" v-model="queryParam.paymentType"
+                                   dictCode="certificate_payment_type" />
+              </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">查询</a-button>
+              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">刷新</a-button>
+              <!--              <a @click="handleToggleSearch" style="margin-left: 8px">-->
+              <!--                {{ toggleSearchStatus ? '收起' : '展开' }}-->
+              <!--                <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>-->
+              <!--              </a>-->
+            </span>
+            </a-col>
+          </a-row>
+        </a-form>
+      </div>
+      <!-- 查询区域-END -->
+
+      <!-- 操作按钮区域 -->
+      <div class="table-operator">
+        <!--      <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>-->
+      </div>
+
+      <!-- table区域-begin -->
+      <div>
+        <!--      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">-->
+        <!--        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项-->
+        <!--        <a style="margin-left: 24px" @click="onClearSelected">清空</a>-->
+        <!--      </div>-->
+
+        <a-table
+          ref="table"
+          size="middle"
+          bordered
+          rowKey="id"
+          :columns="columns"
+          :dataSource="dataSource"
+          :pagination="ipagination"
+          :loading="loading"
+          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">
+            <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
+            <a-button
+              v-else
+              :ghost="true"
+              type="primary"
+              icon="download"
+              size="small"
+              @click="uploadFile(text)">
+              下载
+            </a-button>
+          </template>
+
+          <span slot="action" class="action-span-cell" slot-scope="text, record">
+<!--          <a v-has="'certificate:paymentinfo:check'" v-show="record.paymentStatus==1" @click="(record.paymentStatus==1) && handleCheck(record)">核对凭证</a>-->
+          <a @click="handleDetail(record)">查看</a>
+        </span>
+
+        </a-table>
+      </div>
+
+      <certificatePaymentInfo-modal ref="modalForm" @ok="modalFormOk"></certificatePaymentInfo-modal>
+    </a-card>
+  </div>
 </template>
 
 <script>
+import '@/assets/less/TableExpand.less'
+import { mixinDevice } from '@/utils/mixin'
+import { JeroListMixin } from '@/mixins/JeroListMixin'
+import CertificatePaymentInfoModal from './modules/CertificatePaymentInfoModal'
+import JDictSelectTag from '@/components/standardsAssociation/JDictSelectTag.vue'
+import JDate from '@/components/tools/JDate.vue'
+import { getMemberInfoById } from '@/api/standardsAssociationApi'
+import { RangeDateMixin } from '@/mixins/RangeDateMixin'
+import { deleteAction, getAction, getFileAccessHttpUrl } from '@/api/memberManage'
+
 export default {
-  name: 'CertificateInfo'
+  name: 'CertificateInfo',
+  mixins: [JeroListMixin, mixinDevice, RangeDateMixin],
+  components: {
+    JDictSelectTag,
+    JDate,
+    CertificatePaymentInfoModal
+  },
+  data() {
+    return {
+      deleteAction,
+      getAction,
+      getFileAccessHttpUrl,
+      // 时间范围查询显示的类型
+      rangeDateFormat: {
+        begin: 'YYYY-MM-DD hh:mm:ss',
+        end: 'YYYY-MM-DD hh:mm:ss'
+      },
+      // todo 目前先固定id
+      userId: '1413419593870872578',
+      description: '证书缴费信息表管理页面',
+      // 表头
+      columns: [],
+      url: {
+        list: '/certificatePaymentInfo/list',
+        delete: '/certificatePaymentInfo/delete',
+        deleteBatch: '/certificatePaymentInfo/deleteBatch',
+        exportXlsUrl: '/certificatePaymentInfo/exportXls',
+        importExcelUrl: '/certificatePaymentInfo/importExcel'
+      },
+      /* 筛选参数 */
+      filters: {
+        column: '',
+        order: ''
+      },
+      dictOptions: {},
+      memberFlag: true,
+      dateKeyObj: {
+        beginKey: 'submissionTime_begin',
+        endKey: 'submissionTime_end'
+      }
+    }
+  },
+  created() {
+    this.loadMember()
+  },
+  methods: {
+    initDictConfig() {
+    },
+    // 核对凭证
+    handleCheck: function(record) {
+      this.$refs.modalForm.handleCheck(record)
+      this.$refs.modalForm.title = '核对凭证'
+      this.$refs.modalForm.pageType = 2
+    },
+    // 查看
+    handleDetail: function(record) {
+      this.$refs.modalForm.detail(record)
+      this.$refs.modalForm.title = '查看'
+      this.$refs.modalForm.disableSubmit = true
+      this.$refs.modalForm.pageType = 2
+    },
+    loadMember() {
+      getMemberInfoById({ id: this.userId }).then((res) => {
+        if (res.success) {
+          this.memberFlag = true
+          // 表头
+          this.columns = [
+            {
+              title: '序号',
+              dataIndex: '',
+              key: 'rowIndex',
+              width: 60,
+              align: 'center',
+              customRender: function(t, r, index) {
+                return parseInt(index) + 1
+              }
+            },
+            {
+              title: '缴费单号',
+              align: 'center',
+              dataIndex: 'billNumber'
+            },
+            {
+              title: '缴费类型',
+              align: 'center',
+              dataIndex: 'paymentType_dictText'
+            },
+            {
+              title: '缴费金额',
+              align: 'center',
+              dataIndex: 'paymentAmount'
+            },
+            {
+              title: '缴费时间',
+              align: 'center',
+              dataIndex: 'submissionTime'
+            },
+            {
+              title: '核对时间',
+              align: 'center',
+              dataIndex: 'checkTime'
+            },
+            {
+              title: '缴费状态',
+              align: 'center',
+              dataIndex: 'paymentStatus_dictText'
+            },
+            {
+              title: '操作',
+              dataIndex: 'action',
+              align: 'center',
+              // fixed:"right",
+              width: 200,
+              scopedSlots: { customRender: 'action' }
+            }
+          ]
+        } else {
+          this.memberFlag = false
+          // 表头
+          this.columns = [
+            {
+              title: '序号',
+              dataIndex: '',
+              key: 'rowIndex',
+              width: 60,
+              align: 'center',
+              customRender: function(t, r, index) {
+                return parseInt(index) + 1
+              }
+            },
+            {
+              title: '缴费单号',
+              align: 'center',
+              dataIndex: 'billNumber'
+            },
+            {
+              title: '单位全称',
+              align: 'center',
+              dataIndex: 'companyName'
+            },
+            {
+              title: '缴费类型',
+              align: 'center',
+              dataIndex: 'paymentType_dictText'
+            },
+            {
+              title: '缴费金额',
+              align: 'center',
+              dataIndex: 'paymentAmount'
+            },
+            {
+              title: '缴费时间',
+              align: 'center',
+              dataIndex: 'submissionTime'
+            },
+            {
+              title: '核对时间',
+              align: 'center',
+              dataIndex: 'checkTime'
+            },
+            {
+              title: '缴费状态',
+              align: 'center',
+              dataIndex: 'paymentStatus_dictText'
+            },
+            {
+              title: '操作',
+              dataIndex: 'action',
+              align: 'center',
+              // fixed:"right",
+              width: 200,
+              scopedSlots: { customRender: 'action' }
+            }
+          ]
+          console.log(res.message)
+        }
+      })
+    }
+  }
 }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped lang="less">
+@import '~@assets/less/common.less';
+</style>

src/views/standardsAssociation/PaymentInfo/InvoiceInfo.vue

@@ -1,13 +1,284 @@
+<!--缴费信息-发票信息-->
 <template>
-  <div>缴费信息-发票信息</div>
+  <div class="main-box">
+    <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="邮寄单号">
+                <a-input placeholder="请输入邮寄单号" :maxLength="20" v-model="queryParam.postNo"></a-input>
+              </a-form-item>
+            </a-col>
+
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="状态">
+                <j-dict-select-tag
+                  placeholder="请选择邮寄状态"
+                  v-model="queryParam.postStatus"
+                  dictCode="post_status" />
+              </a-form-item>
+            </a-col>
+
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="邮寄方式">
+                <j-dict-select-tag
+                  placeholder="请选择邮寄方式"
+                  v-model="queryParam.sendMethod"
+                  dictCode="send_method" />
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="缴费单号">
+                <a-input placeholder="请输入缴费单号" :maxLength="20" v-model="queryParam.billNumber"></a-input>
+              </a-form-item>
+            </a-col>
+
+            <template>
+              <a-col :xl="10" :lg="11" :md="12" :sm="24">
+                <a-form-item label="邮寄日期">
+                  <j-date
+                    placeholder="请选择开始日期"
+                    date-format="YYYY-MM-DD"
+                    class="query-group-cust"
+                    v-model="queryParam.sendDate_begin"
+                    :disabled-date="disabledStartDate"></j-date>
+                  <span class="query-group-split-cust"></span>
+                  <j-date
+                    placeholder="请选择结束日期"
+                    date-format="YYYY-MM-DD"
+                    class="query-group-cust"
+                    v-model="queryParam.sendDate_end"
+                    :disabled-date="disabledEndDate"></j-date>
+                </a-form-item>
+              </a-col>
+            </template>
+
+            <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">查询</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 -->
+
+      <!-- table区域-begin -->
+      <div>
+        <a-table
+          ref="table"
+          size="middle"
+          bordered
+          rowKey="id"
+          :columns="columns"
+          :dataSource="dataSource"
+          :pagination="ipagination"
+          :loading="loading"
+          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">
+            <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
+            <a-button
+              v-else
+              :ghost="true"
+              type="primary"
+              icon="download"
+              size="small"
+              @click="uploadFile(text)">
+              下载
+            </a-button>
+          </template>
+
+          <span slot="action" class="action-span-cell" slot-scope="text, record">
+<!--          <a @click="handlePost(record)" v-has="'bill.post'" v-show="record.postStatus !=2 ">邮寄</a>-->
+          <a @click="handleInfo(record)">查看</a>
+        </span>
+        </a-table>
+      </div>
+
+      <billingInfo-modal ref="modalForm" @ok="modalFormOk"></billingInfo-modal>
+    </a-card>
+  </div>
 </template>
 
 <script>
+import '@/assets/less/TableExpand.less'
+import { mixinDevice } from '@/utils/mixin'
+import { JeroListMixin } from '@/mixins/JeroListMixin'
+import BillingInfoModal from './modules/BillingInfoModal'
+import JDate from '@/components/tools/JDate'
+import { RangeDateMixin } from '@/mixins/RangeDateMixin'
+import { deleteAction, getAction, getFileAccessHttpUrl } from '@/api/memberManage'
+import JDictSelectTag from '../../../components/standardsAssociation/JDictSelectTag'
+
 export default {
-  name: 'InvoiceInfo'
+  name: 'InvoiceInfo',
+  mixins: [JeroListMixin, mixinDevice, RangeDateMixin],
+  components: {
+    BillingInfoModal,
+    JDate,
+    JDictSelectTag
+  },
+  data() {
+    return {
+      deleteAction,
+      getAction,
+      getFileAccessHttpUrl,
+      // 时间范围查询显示的类型
+      rangeDateFormat: {
+        begin: 'YYYY-MM-DD hh:mm:ss',
+        end: 'YYYY-MM-DD hh:mm:ss'
+      },
+      description: '开票信息表管理页面',
+      isMember: true,
+      // 表头
+      columns: [
+        {
+          title: '序号',
+          dataIndex: '',
+          key: 'rowIndex',
+          width: 60,
+          align: 'center',
+          customRender: function(t, r, index) {
+            return parseInt(index) + 1
+          }
+        },
+        {
+          title: '单位全称',
+          align: 'center',
+          dataIndex: 'companyName'
+        },
+        {
+          title: '联系人',
+          align: 'center',
+          dataIndex: 'liaisonMan'
+        },
+        {
+          title: '联系人手机号',
+          align: 'center',
+          dataIndex: 'mobile'
+        },
+        // 邮寄状态
+        {
+          title: '状态',
+          align: 'center',
+          dataIndex: 'postStatus_dictText'
+        },
+        // {
+        //   title: '开票类型',
+        //   align: 'center',
+        //   // rank_dictText
+        //   dataIndex: 'billingType_dictText'
+        // },
+        {
+          title: '缴费单号',
+          align: 'center',
+          dataIndex: 'billNumber'
+        },
+        {
+          title: '缴费时间',
+          align: 'center',
+          dataIndex: 'paymentDate',
+          customRender: function(text) {
+            return !text ? '' : (text.length > 10 ? text.substr(0, 10) : text)
+          }
+        },
+        {
+          title: '发票金额',
+          align: 'center',
+          dataIndex: 'billMoney'
+        },
+        {
+          title: '发票号',
+          align: 'center',
+          // rank_dictText
+          dataIndex: 'billNo'
+        },
+        {
+          title: '邮寄方式',
+          align: 'center',
+          dataIndex: 'sendMethod_dictText'
+        },
+        {
+          title: '邮寄单号',
+          align: 'center',
+          dataIndex: 'postNo'
+        },
+        {
+          title: '邮寄日期',
+          align: 'center',
+          dataIndex: 'sendDate',
+          customRender: function(text) {
+            return !text ? '' : (text.length > 10 ? text.substr(0, 10) : text)
+          }
+        },
+        {
+          title: '操作',
+          dataIndex: 'action',
+          align: 'center',
+          // fixed:"right",
+          width: 147,
+          scopedSlots: { customRender: 'action' }
+        }
+      ],
+      url: {
+        list: '/billingInfo/billingInfo/list',
+        delete: '/billingInfo/billingInfo/delete',
+        deleteBatch: '/billingInfo/billingInfo/deleteBatch',
+        exportXlsUrl: '/billingInfo/billingInfo/exportXls',
+        importExcelUrl: 'billingInfo/billingInfo/importExcel'
+      },
+      dictOptions: {},
+      dateKeyObj: {
+        beginKey: 'sendDate_begin',
+        endKey: 'sendDate_end'
+      }
+    }
+  },
+  created() {
+    // 会员不显示 单位全称列
+    if (this.isMember === 'member') {
+      const index = this.columns.findIndex(item => item.dataIndex === 'companyName')
+      index > -1 ? this.columns.splice(index, 1) : this.columns
+    }
+  },
+  methods: {
+    initDictConfig() {
+    },
+    // 邮寄发票方法
+    handlePost(record) {
+      this.$refs.modalForm.title = '邮寄发票'
+      this.$refs.modalForm.disableSubmit = true
+      this.$refs.modalForm.pageType = 1
+      this.$refs.modalForm.edit(record)
+    },
+    // 查看发票方法
+    handleInfo(record) {
+      this.$refs.modalForm.title = '查看发票'
+      this.$refs.modalForm.disableSubmit = true
+      this.$refs.modalForm.pageType = 2
+      this.$refs.modalForm.edit(record)
+    }
+  }
 }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped lang="less">
+@import '~@assets/less/common.less';
+</style>

src/views/standardsAssociation/PaymentInfo/MemberInfo.vue

@@ -1,13 +1,375 @@
+<!--缴费信息-会员缴费-->
 <template>
-  <div>缴费信息-会员信息</div>
+  <div class="main-box">
+    <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" v-if="!memberFlag">
+              <a-form-item label="单位全称">
+                <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="缴费类型">
+                <j-dict-select-tag placeholder="请选择缴费类型" v-model="queryParam.paymentType" dictCode="payment_type" />
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <a-form-item label="缴费状态">
+                <j-dict-select-tag placeholder="请选择缴费状态" v-model="queryParam.paymentStatus" dictCode="payment_status" />
+              </a-form-item>
+            </a-col>
+
+            <a-col :xl="10" :lg="11" :md="12" :sm="24">
+              <a-form-item label="缴费时间">
+                <j-date date-format="YYYY-MM-DD 00:00:00" placeholder="请选择开始日期" class="query-group-cust"
+                        v-model="queryParam.submissionTime_begin" :disabled-date="disabledStartDate"></j-date>
+                <span class="query-group-split-cust"></span>
+                <j-date date-format="YYYY-MM-DD 23:59:59" placeholder="请选择结束日期" class="query-group-cust"
+                        v-model="queryParam.submissionTime_end" :disabled-date="disabledEndDate"></j-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">查询</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">新增</a-button>
+        <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"
+          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">
+            <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
+            <a-button
+              v-else
+              :ghost="true"
+              type="primary"
+              icon="download"
+              size="small"
+              @click="uploadFile(text)">
+              下载
+            </a-button>
+          </template>
+          <!--    状态   -->
+          <template slot="status" slot-scope="text, record">
+            <span v-if="record.paymentStatus === 1 " style="color:#33A3DC">已支付</span>
+            <span v-if="record.paymentStatus === 2 " style="color:#F56C6C"> 已驳回 </span>
+            <span v-if="record.paymentStatus === 3 " style="color:#40835E">已缴费</span>
+          </template>
+          <template slot="bind">
+          </template>
+
+          <span slot="action" class="action-span-cell" slot-scope="text, record">
+          <a v-show="record.paymentStatus<1 ||record.paymentStatus==2"
+             @click="(record.paymentStatus<1 ||record.paymentStatus==2) && handleEdit(record)">编辑</a>
+          <a v-show="record.paymentStatus<1||record.paymentStatus==2">
+            <a @click="(record.paymentStatus<1||record.paymentStatus==2) && handleDelete(record.id)">删除</a>
+          </a>
+            <!--          <a v-has="'paymentinfo:check'" v-show="record.paymentStatus==1">-->
+            <!--            <a href="javascript:;"   @click="(record.paymentStatus==1) && handleCheck(record)">核对凭证</a>-->
+            <!--          </a>-->
+          <a>
+            <a href="javascript:;" @click="handleDetail(record)">查看</a>
+          </a>
+        </span>
+
+        </a-table>
+      </div>
+
+      <paymentInfo-modal ref="modalForm" @ok="modalFormOk"></paymentInfo-modal>
+    </a-card>
+  </div>
 </template>
 
 <script>
+import '@/assets/less/TableExpand.less'
+import { mixinDevice } from '@/utils/mixin'
+import { JeroListMixin } from '@/mixins/JeroListMixin'
+import PaymentInfoModal from './modules/PaymentInfoModal'
+
+import JDictSelectTag from '@/components/standardsAssociation/JDictSelectTag.vue'
+import JDate from '@/components/tools/JDate.vue'
+import { getMemberInfoById } from '@/api/standardsAssociationApi'
+import { RangeDateMixin } from '@/mixins/RangeDateMixin'
+import { deleteAction, getAction, getFileAccessHttpUrl } from '@/api/memberManage'
+
 export default {
-  name: 'MemberInfo'
+  name: 'MemberInfo',
+  mixins: [JeroListMixin, mixinDevice, RangeDateMixin],
+  components: {
+    JDictSelectTag,
+    JDate,
+    PaymentInfoModal
+  },
+  data() {
+    return {
+      deleteAction,
+      getAction,
+      getFileAccessHttpUrl,
+      // 时间范围查询显示的类型
+      rangeDateFormat: {
+        begin: 'YYYY-MM-DD hh:mm:ss',
+        end: 'YYYY-MM-DD hh:mm:ss'
+      },
+      // todo 目前先固定id
+      userId: '1413419593870872578',
+      isAdmin: false,
+      description: '缴费信息表管理页面',
+      // 表头
+      columns: [],
+      url: {
+        list: '/paymentInfo/list',
+        delete: '/paymentInfo/delete',
+        deleteBatch: '/paymentInfo/deleteBatch',
+        exportXlsUrl: '/paymentInfo/exportXls',
+        importExcelUrl: '/paymentInfo/importExcel'
+      },
+      /* 筛选参数 */
+      filters: {
+        column: '',
+        order: ''
+      },
+      dictOptions: {},
+      memberFlag: true,
+      dateKeyObj: {
+        beginKey: 'submissionTime_begin',
+        endKey: 'submissionTime_end'
+      }
+    }
+  },
+  created() {
+    // 根据会员id获取会员信息
+    this.loadMember()
+  },
+  methods: {
+    initDictConfig() {
+    },
+    // 根据会员id获取会员信息
+    loadMember() {
+      getMemberInfoById({ id: this.userId }).then((res) => {
+        if (res.success) {
+          this.memberFlag = true
+          // 表头
+          this.columns = [
+            {
+              title: '序号',
+              dataIndex: '',
+              key: 'rowIndex',
+              width: 60,
+              align: 'center',
+              customRender: function(t, r, index) {
+                return parseInt(index) + 1
+              }
+            },
+            {
+              title: '缴费单号',
+              align: 'center',
+              dataIndex: 'billNumber'
+            },
+            {
+              title: '缴费类型',
+              align: 'center',
+              dataIndex: 'paymentType_dictText'
+            },
+            {
+              title: '生效日期',
+              align: 'center',
+              dataIndex: 'effectiveDate'
+            },
+            {
+              title: '失效日期',
+              align: 'center',
+              dataIndex: 'invalidationDate'
+            },
+            {
+              title: '缴费时长',
+              align: 'center',
+              dataIndex: 'paymentTime_dictText'
+            },
+            {
+              title: '缴费金额',
+              align: 'center',
+              dataIndex: 'paymentAmount'
+            },
+            {
+              title: '网员服务费',
+              align: 'center',
+              dataIndex: 'serviceCharge'
+            },
+            // {
+            //   title:'证书个数',
+            //   align:"center",
+            //   dataIndex: 'certificatesNum'
+            // },
+            {
+              title: '缴费时间',
+              align: 'center',
+              dataIndex: 'submissionTime'
+            },
+            {
+              title: '核对时间',
+              align: 'center',
+              dataIndex: 'checkTime'
+            },
+            {
+              title: '缴费状态',
+              align: 'center',
+              dataIndex: 'paymentStatus_dictText'
+            },
+            {
+              title: '操作',
+              dataIndex: 'action',
+              align: 'center',
+              // fixed:"right",
+              width: 200,
+              scopedSlots: { customRender: 'action' }
+            }
+          ]
+        } else {
+          this.memberFlag = false
+          // 表头
+          this.columns = [
+            {
+              title: '序号',
+              dataIndex: '',
+              key: 'rowIndex',
+              width: 60,
+              align: 'center',
+              customRender: function(t, r, index) {
+                return parseInt(index) + 1
+              }
+            },
+            {
+              title: '缴费单号',
+              align: 'center',
+              dataIndex: 'billNumber'
+            },
+            {
+              title: '单位全称',
+              align: 'center',
+              dataIndex: 'companyName'
+            },
+            {
+              title: '缴费类型',
+              align: 'center',
+              dataIndex: 'paymentType_dictText'
+            },
+            {
+              title: '生效日期',
+              align: 'center',
+              dataIndex: 'effectiveDate'
+            },
+            {
+              title: '失效日期',
+              align: 'center',
+              dataIndex: 'invalidationDate'
+            },
+            {
+              title: '缴费时长',
+              align: 'center',
+              dataIndex: 'paymentTime_dictText'
+            },
+            {
+              title: '缴费金额',
+              align: 'center',
+              dataIndex: 'paymentAmount'
+            },
+            {
+              title: '缴费时间',
+              align: 'center',
+              dataIndex: 'submissionTime'
+            },
+            {
+              title: '绑定证书',
+              align: 'center',
+              dataIndex: 'bind_dictText',
+              scopedSlots: { customRender: 'bind', title: 'bind' }
+            },
+            {
+              title: '核对时间',
+              align: 'center',
+              dataIndex: 'checkTime'
+            },
+            {
+              title: '缴费状态',
+              align: 'center',
+              dataIndex: 'paymentStatus_dictText',
+              scopedSlots: { customRender: 'status' }
+            },
+            {
+              title: '操作',
+              dataIndex: 'action',
+              align: 'center',
+              // fixed:"right",
+              width: 200,
+              scopedSlots: { customRender: 'action' }
+            }
+          ]
+          console.log(res.message)
+        }
+      })
+    },
+    // 核对凭证
+    handleCheck: function(record) {
+      this.$refs.modalForm.handleCheck(record)
+      this.$refs.modalForm.title = '核对凭证'
+      this.$refs.modalForm.pageType = 2
+    },
+    // 查看
+    handleDetail: function(record) {
+      this.$refs.modalForm.detail(record)
+      this.$refs.modalForm.title = '查看'
+      this.$refs.modalForm.disableSubmit = true
+      this.$refs.modalForm.pageType = 2
+    }
+  }
 }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped lang="less">
+@import '~@assets/less/common.less';
+</style>

src/views/standardsAssociation/PaymentInfo/modules/BillingInfoModal.vue

@@ -0,0 +1,436 @@
+<template>
+  <j-modal
+    :title="title"
+    :width="width"
+    :visible="visible"
+    :confirmLoading="confirmLoading"
+    switchFullscreen
+    @ok="handleOk"
+    @cancel="handleCancel"
+    cancelText="关闭">
+
+    <template v-if="pageType == 1">
+      <a-spin :spinning="confirmLoading">
+        <a-form :form="form">
+          <a-divider orientation="left">
+            缴费信息
+          </a-divider>
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="单位全称" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="50" disabled v-decorator="['companyName']" placeholder="请输入单位全称"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :span="12">
+              <a-form-item label="联系人" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="50" disabled v-decorator="['liaisonMan']" placeholder="请输入联系人"></a-input>
+              </a-form-item>
+            </a-col>
+          </a-row>
+
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="手机" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="50" disabled v-decorator="['mobile', validatorRules.mobile]"
+                         placeholder="请输入手机号"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :span="12">
+              <a-form-item label="通讯地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="50" disabled v-decorator="['address']" placeholder="请输入通讯地址"></a-input>
+              </a-form-item>
+            </a-col>
+          </a-row>
+
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="邮编" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="50" disabled v-decorator="['postcode']" placeholder="请输入邮编"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :span="12">
+              <a-form-item label="开票类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <j-search-select-tag
+                  dict="billing_type"
+                  disabled
+                  v-decorator="['billingType']"
+                  placeholder="请选择开票类型">
+                </j-search-select-tag>
+              </a-form-item>
+            </a-col>
+          </a-row>
+
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="缴费时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <j-date
+                  placeholder="请选择缴费时间"
+                  date-format="YYYY-MM-DD"
+                  disabled
+                  v-decorator="['paymentDate']"
+                  :trigger-change="true"
+                  style="width: 100%" />
+              </a-form-item>
+            </a-col>
+            <a-col :span="12">
+              <a-form-item label="缴费单号" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="50" disabled v-decorator="['billNumber']" placeholder="请输入缴费单号"></a-input>
+              </a-form-item>
+            </a-col>
+          </a-row>
+
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="缴费金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="50" disabled v-decorator="['paymentAmount']" placeholder="请输入缴费金额"></a-input>
+              </a-form-item>
+            </a-col>
+          </a-row>
+
+          <a-divider orientation="left">
+            发票信息
+          </a-divider>
+
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="发票金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input-number
+                  :maxLength="50"
+                  v-decorator="['billMoney',validatorRules.billMoney]"
+                  placeholder="请输入发票金额"
+                  style="width: 100%" />
+              </a-form-item>
+            </a-col>
+            <a-col :span="12">
+              <a-form-item label="发票号码" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="50" @change="e => {e.target.value = (e.target.value + '').trim()}"
+                         v-decorator="['billNo',validatorRules.billNo]" placeholder="请输入发票号码"></a-input>
+              </a-form-item>
+            </a-col>
+          </a-row>
+
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="快递公司" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <j-search-select-tag
+                  dict="send_method"
+                  v-decorator="['sendMethod',validatorRules.sendMethod]"
+                  placeholder="请选择快递公司">
+                </j-search-select-tag>
+              </a-form-item>
+            </a-col>
+            <a-col :span="12">
+              <a-form-item label="邮寄单号" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="20" @change="e => {e.target.value = (e.target.value + '').trim()}"
+                         v-decorator="['postNo',validatorRules.postNo]" placeholder="请输入邮寄单号"></a-input>
+              </a-form-item>
+            </a-col>
+          </a-row>
+
+        </a-form>
+      </a-spin>
+    </template>
+
+    <template v-if="pageType == 2">
+      <a-spin :spinning="confirmLoading">
+        <a-form :form="form">
+          <a-divider orientation="left">
+            缴费信息
+          </a-divider>
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="单位全称" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="50" disabled v-decorator="['companyName']" placeholder="请输入单位全称"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :span="12">
+              <a-form-item label="联系人" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="50" disabled v-decorator="['liaisonMan']" placeholder="请输入联系人"></a-input>
+              </a-form-item>
+            </a-col>
+          </a-row>
+
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="手机" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="50" disabled v-decorator="['mobile']" placeholder="请输入手机号"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :span="12">
+              <a-form-item label="通讯地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="50" disabled v-decorator="['address']" placeholder="请输入通讯地址"></a-input>
+              </a-form-item>
+            </a-col>
+          </a-row>
+
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="邮编" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="50" disabled v-decorator="['postcode']" placeholder="请输入邮编"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :span="12">
+              <a-form-item label="开票类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <j-search-select-tag
+                  disabled
+                  dict="billing_type"
+                  v-decorator="['billingType']"
+                  placeholder="请选择开票类型">
+                </j-search-select-tag>
+              </a-form-item>
+            </a-col>
+          </a-row>
+
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="缴费时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <j-date
+                  disabled
+                  placeholder="请选择缴费时间"
+                  date-format="YYYY-MM-DD"
+                  v-decorator="['paymentDate']"
+                  :trigger-change="true"
+                  style="width: 100%" />
+              </a-form-item>
+            </a-col>
+            <a-col :span="12">
+              <a-form-item label="缴费单号" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="50" disabled v-decorator="['billNumber']" placeholder="请输入缴费单号"></a-input>
+              </a-form-item>
+            </a-col>
+          </a-row>
+
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="缴费金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="50" disabled v-decorator="['paymentAmount']" placeholder="请输入缴费金额"></a-input>
+              </a-form-item>
+            </a-col>
+          </a-row>
+
+          <a-divider orientation="left">
+            发票信息
+          </a-divider>
+
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="发票金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input-number
+                  :maxLength="50"
+                  disabled
+                  v-decorator="['billMoney',{initialValue:model.billMoney}]"
+                  placeholder="请输入发票金额"
+                  style="width: 100%" />
+              </a-form-item>
+            </a-col>
+            <a-col :span="12">
+              <a-form-item label="发票号码" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="50" disabled v-decorator="['billNo',{initialValue:model.billNo}]"
+                         placeholder="请输入发票号码"></a-input>
+              </a-form-item>
+            </a-col>
+          </a-row>
+
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="快递公司" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <j-search-select-tag
+                  disabled
+                  dict="send_method"
+                  v-decorator="['sendMethod',{initialValue:model.sendMethod}]"
+                  placeholder="请选择快递公司">
+                </j-search-select-tag>
+              </a-form-item>
+            </a-col>
+          </a-row>
+
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="邮寄单号" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input :maxLength="20" disabled v-decorator="['postNo',{initialValue:model.postNo}]"
+                         placeholder="请输入邮寄单号"></a-input>
+              </a-form-item>
+            </a-col>
+          </a-row>
+
+          <a-row>
+            <a-col :span="12">
+              <span v-if="model.postNo" @click="searchInfo" class="search-express" style="margin-left: 40px">快递查询</span>
+              <!--              <span @click="searchInfo"href="http://www.kuaidi.com/" target="_blank" style="margin-left: 40px">快递查询</span>-->
+            </a-col>
+          </a-row>
+
+        </a-form>
+      </a-spin>
+    </template>
+
+    <!-- 编辑窗口 -->
+    <template slot="footer" v-if="pageType == 1">
+      <a-button @click="handleCancel">取消</a-button>
+      <a-button @click="handleOk" type="primary">确定</a-button>
+    </template>
+    <!-- 查看窗口-->
+    <template slot="footer" v-if="pageType == 2">
+      <a-button @click="handleCancel" type="primary">返回</a-button>
+    </template>
+  </j-modal>
+</template>
+
+<script>
+
+import JSearchSelectTag from '@/components/standardsAssociation/JSearchSelectTag'
+import { httpAction } from '@/api/memberManage'
+import pick from 'lodash.pick'
+import JDate from '@/components/tools/JDate'
+
+export default {
+  name: 'BillingInfoModal',
+  components: {
+    JDate,
+    JSearchSelectTag
+  },
+  data() {
+    return {
+      form: this.$form.createForm(this),
+      title: '操作',
+      width: 1200,
+      visible: false,
+      model: {},
+      // 页面类型: 1.邮寄; 2.查看
+      pageType: 1,
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 5 }
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 16 }
+      },
+      confirmLoading: false,
+      validatorRules: {
+        mobile: {
+          rules: [
+            { required: true, message: '请输入联系人手机号!' },
+            {
+              pattern: /^1[3|4|5|7|8][0-9]{9}$/,
+              message: '请输入正确的手机号码'
+            },
+            { min: 1, max: 50, message: '长度不超过50个字符' }
+          ]
+        },
+        billMoney: {
+          rules: [
+            { required: true, message: '请输入发票金额!' },
+            {
+              pattern: /^[1-9](\d{1,10})?(\.\d{1,2})$|^0\.([1-9](\d{0,1})|\d[1-9])$|^[1-9]\d{0,10}$|^0$/,
+              message: '请输入合法的金额数字，最多2位小数,11位正数',
+              trigger: 'blur'
+            }
+          ],
+          validateTrigger: 'blur'
+        },
+        billNo: {
+          rules: [
+            { required: true, message: '请输入发票号码!' },
+            { min: 1, max: 50, message: '长度不超过50个字符' }
+          ],
+          validateTrigger: 'blur'
+        },
+        sendMethod: {
+          rules: [
+            { required: true, message: '请选择快递公司!' }
+          ]
+        },
+        postNo: {
+          rules: [
+            { required: true, message: '请输入快递单号!' },
+            { min: 1, max: 20, message: '长度不超过20个字符' }
+          ],
+          validateTrigger: 'blur'
+        }
+      },
+      url: {
+        add: '/billingInfo/billingInfo/add',
+        edit: '/billingInfo/billingInfo/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, 'address', 'postcode', 'paymentAmount', 'companyName', 'sendMethod', 'postNo', 'liaisonMan', 'mobile', 'postStatus', 'billingType', 'billNumber', 'paymentDate', 'sendDate', 'billMoney', 'billNo'))
+      })
+    },
+    close() {
+      this.$emit('close')
+      this.visible = false
+    },
+    handleOk() {
+      const that = this
+      // 触发表单验证
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          that.confirmLoading = true
+          let httpurl = ''
+          let method = ''
+          if (!this.model.id) {
+            httpurl += this.url.add
+            method = 'post'
+          } else {
+            httpurl += this.url.edit
+            method = 'put'
+          }
+          const formData = Object.assign(this.model, values)
+
+          // 将邮寄状态修改为 已邮寄
+          formData.postStatus = 2
+
+          console.log('表单提交数据', formData)
+          httpAction(httpurl, formData, method).then((res) => {
+            if (res.success) {
+              that.$message.success('邮寄成功')
+              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, 'address', 'postcode', 'paymentAmount', 'companyName', 'sendMethod', 'postNo', 'liaisonMan', 'mobile', 'postStatus', 'billingType', 'billNumber', 'paymentDate', 'sendDate', 'billMoney', 'billNo'))
+    },
+    // 查询快递单号
+    searchInfo() {
+      // this.model.sendMethod 1是ems 2是顺丰
+      // https://www.kuaidi100.com/chaxun?com=[]&nu=[]
+      const com = Number(this.model.sendMethod) === 1 && 'ems' || 'shunfeng'
+      window.open(`https://www.kuaidi100.com/chaxun?com=${com}&nu=${this.model.postNo}`)
+    }
+
+  }
+}
+</script>
+<style lang="less" scoped>
+.search-express {
+  cursor: pointer;
+
+  &:hover {
+    color: @primary-color;
+  }
+}
+</style>

src/views/standardsAssociation/PaymentInfo/modules/CertificatePaymentInfoModal.vue

@@ -0,0 +1,880 @@
+<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" style="margin-left: 10px">
+        <a-divider orientation="left">
+          证书缴费信息
+        </a-divider>
+        <a-row>
+          <a-col :span="12">
+
+            <a-form-item label="单位全称" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <a-input :disabled=true v-model="companyName" placeholder="请输入单位名称"></a-input>
+            </a-form-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-item label="联系人" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <a-input :disabled=true v-model="liaisonMan" placeholder="请输入联系人"></a-input>
+            </a-form-item>
+          </a-col>
+        </a-row>
+
+        <a-row>
+          <a-col :span="12">
+            <a-form-item label="手机" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <a-input :disabled=true v-model="mobile" placeholder="请输入手机号"></a-input>
+            </a-form-item>
+          </a-col>
+
+          <a-col :span="12">
+            <a-form-item label="缴费方式" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <j-dict-select-tag
+                :disabled="checkFlag||detailFlag" type="list"
+                v-decorator="['paymentMethod',validatorRules.paymentMethod]" :trigger-change="true"
+                dictCode="payment_method" placeholder="请选择缴费方式" />
+            </a-form-item>
+          </a-col>
+        </a-row>
+
+        <a-row>
+          <a-col :span="12">
+            <a-form-item label="缴费类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <j-dict-select-tag
+                :disabled=true type="list" v-decorator="['paymentType']" :trigger-change="true"
+                dictCode="certificate_payment_type" placeholder="请选择缴费类型" />
+            </a-form-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-item label="缴费单号" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <a-input :disabled=true v-decorator="['billNumber']" placeholder="请输入缴费单号"></a-input>
+            </a-form-item>
+          </a-col>
+        </a-row>
+
+        <a-row>
+          <a-col :span="12">
+            <a-form-item label="缴费金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <a-input-number
+                :disabled="checkFlag||detailFlag"
+                v-decorator="['paymentAmount',validatorRules.paymentAmount]" placeholder="请输入缴费金额"
+                style="width: 100%" />
+            </a-form-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-item label="缴费时长" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <j-dict-select-tag
+                :disabled="checkFlag||detailFlag" @change="changgeType" type="list"
+                v-decorator="['paymentTime',validatorRules.paymentTime]" :trigger-change="true"
+                dictCode="payment_time" placeholder="请选择缴费时长" />
+            </a-form-item>
+          </a-col>
+        </a-row>
+        <a-row>
+          <a-col :span="12">
+            <a-form-item label="缴费日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <j-date
+                :disabled="checkFlag||detailFlag" date-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择缴费时间"
+                v-decorator="['submissionTime',validatorRules.submissionTime]" :trigger-change="true"
+                style="width: 100%" />
+            </a-form-item>
+          </a-col>
+          <a-col :span="12" v-if="paymentMethodFlag==1">
+            <a-form-item label="缴费凭证" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <j-image-upload
+                isLessThan5M
+                isMultiple
+                :number="2"
+                :disabled="checkFlag||detailFlag"
+                bizPath="payment"
+                v-decorator="['paymentRecord',validatorRules.paymentRecord]">
+              </j-image-upload>
+            </a-form-item>
+          </a-col>
+          <a-row>
+            <a-col :span="12" v-if="paymentMethodFlag==2">
+              <a-form-item label="打包协议" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <j-upload
+                  file-type="pdf"
+                  file-type-error-message="请上传pdf文件" :multiple="false" :number="1"
+                  :disabled="checkFlag||detailFlag" bizPath="payment"
+                  v-decorator="['paymentRecord',validatorRules.paymentRecord]"
+                  :trigger-change="true"></j-upload>
+                <span v-show="!detailFlag && !checkFlag" style="color: #bfbfbf">请上传pdf文件</span>
+              </a-form-item>
+            </a-col>
+          </a-row>
+        </a-row>
+        <div v-if="paymentMethodFlag==1">
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="发票" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <j-dict-select-tag
+                  :disabled="checkFlag||detailFlag" @change="invoiceRequirementsChange" type="list"
+                  v-decorator="['invoiceRequirements']" :trigger-change="true"
+                  dictCode="invoice_requirements" placeholder="请选择发票" />
+              </a-form-item>
+            </a-col>
+            <a-col :span="12" v-if="invoiceRequirementsFlag">
+              <a-form-item label="关联付款发票名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input
+                  :disabled="checkFlag||detailFlag"
+                  v-decorator="['headerName',validatorRules.headerName]"
+                  :trigger-change="true" placeholder="请输入关联付款发票名称"></a-input>
+              </a-form-item>
+            </a-col>
+
+          </a-row>
+          <template v-if="invoiceRequirementsFlag">
+            <a-row>
+              <a-col :span="12">
+                <a-form-item label="社会统一代码/税号" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                  <a-input
+                    :disabled="checkFlag||detailFlag" v-decorator="['taxNumber',validatorRules.taxNumber]"
+                    placeholder="请输入社会统一代码/税号"></a-input>
+                </a-form-item>
+              </a-col>
+              <!-- 2021-09-23变更 增加 单位地址  增值税发票的时候存在-->
+              <a-col :span="12" v-if="currentSelectInvoiceType === 2">
+                <a-form-item label="单位地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                  <a-input
+                    :disabled="checkFlag||detailFlag"
+                    @change="event => event.target.value = event.target.value.trim()"
+                    v-decorator="['invoiceAddress', validatorRules.invoiceAddress]"
+                    placeholder="请输入单位地址"
+                    :maxLength="50"></a-input>
+                </a-form-item>
+              </a-col>
+            </a-row>
+            <!-- 2021-09-23变更 增加 电话号码  开户银行 银行账户 增值税发票的时候存在-->
+            <a-row v-if="currentSelectInvoiceType === 2">
+              <a-col :span="12">
+                <a-form-item label="电话号码" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                  <a-input
+                    :disabled="checkFlag||detailFlag"
+                    v-decorator="['invoicePhone', validatorRules.invoicePhone]"
+                    :trigger-change="true"
+                    @change="(e) => {e.target.value = e.target.value.replace(/[^0-9|-]/g,'')}"
+                    placeholder="请输入电话号码"
+                    :maxLength="50"></a-input>
+                </a-form-item>
+              </a-col>
+              <a-col :span="12">
+                <a-form-item label="开户银行" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                  <a-input
+                    :disabled="checkFlag||detailFlag"
+                    @change="event => event.target.value = event.target.value.trim()"
+                    v-decorator="['depositBank', validatorRules.depositBank]"
+                    placeholder="请输入开户银行"
+                    :maxLength="50"></a-input>
+                </a-form-item>
+              </a-col>
+            </a-row>
+            <a-row v-if="currentSelectInvoiceType === 2">
+              <a-col :span="12">
+                <a-form-item label="银行账户" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                  <a-input
+                    :disabled="checkFlag||detailFlag"
+                    @change="(e) => {e.target.value = e.target.value.replace(/[^0-9]/g,'')}"
+                    v-decorator="['bankAccount', validatorRules.bankAccount]"
+                    placeholder="请输入银行账户"
+                    :maxLength="50"></a-input>
+                </a-form-item>
+              </a-col>
+            </a-row>
+          </template>
+        </div>
+        <!--        缴费备注-->
+        <a-row>
+          <a-col :span="24" class="remark">
+            <a-form-item label="备注" :labelCol="labelColText" :wrapperCol="wrapperCol">
+              <a-textarea
+                rows="5" v-decorator="['paymentMark' ]" placeholder="请输入备注" disabled
+                :maxLength="500"></a-textarea>
+            </a-form-item>
+            <span style="color: #bfbfbf" v-show="!detailFlag && !checkFlag">一个缴费单可在多个缴费处上传</span>
+          </a-col>
+        </a-row>
+
+        <div v-show="typeFlag">
+          <a-divider orientation="left">证书需求</a-divider>
+          <a-table
+            :pagination=false bordered :data-source="dataSource" :columns="columns"
+            :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange,getCheckboxProps:getCheckboxProps }">
+            <template slot="imgSlot" slot-scope="text, record">
+              <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
+              <img v-else :src="getImgView(text,record)" height="25px" alt=""
+                   style="max-width:80px;font-size: 12px;font-style: italic;" />
+            </template>
+          </a-table>
+          <div style="position: relative;top: 20px;">
+            <a-row>
+              <a-col :span="12">
+                <a-form-item label="通讯地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                  <a-input :disabled="checkFlag||detailFlag" v-model="address" placeholder="请输入通讯地址"></a-input>
+                </a-form-item>
+              </a-col>
+              <a-col :span="12">
+                <a-form-item label="邮编" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                  <a-input :disabled="checkFlag||detailFlag" v-model="postcode" placeholder="请输入邮编"></a-input>
+                </a-form-item>
+              </a-col>
+            </a-row>
+          </div>
+        </div>
+
+        <div v-show="checkFlag">
+          <a-divider orientation="left">审核结果</a-divider>
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="核对结果" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-radio-group v-decorator="['checkResult',validatorRules.checkResult]" @change="onCheckChange">
+                  <a-radio :value="1">通过</a-radio>
+                  <a-radio :value="0">不通过</a-radio>
+                </a-radio-group>
+              </a-form-item>
+            </a-col>
+          </a-row>
+          <a-row>
+            <a-col :span="24">
+              <a-form-item label="备注" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-textarea
+                  rows="5" v-decorator="['checkMark',validatorRules.checkMark]" placeholder="请输入备注"
+                  :maxLength="500"></a-textarea>
+              </a-form-item>
+            </a-col>
+          </a-row>
+        </div>
+
+        <div v-show="detailFlag">
+          <a-divider orientation="left">审核信息</a-divider>
+          <a-table :pagination=false bordered :data-source="checkInfo" :columns="checkColumns">
+          </a-table>
+        </div>
+      </a-form>
+    </a-spin>
+    <template slot="footer">
+      <a-button @click="handleCancel">关闭</a-button>
+      <a-button @click="handleOk" type="primary" v-show="!detailFlag" :disabled="confirmLoading">提交</a-button>
+    </template>
+
+  </j-modal>
+</template>
+
+<script>
+
+import { httpAction, getFileAccessHttpUrl } from '@/api/memberManage'
+import pick from 'lodash.pick'
+import JDate from '@/components/tools/JDate'
+import JUpload from '@/components/standardsAssociation/JUpload'
+import JImageUpload from '@/components/standardsAssociation/JImageUpload'
+import JDictSelectTag from '@/components/standardsAssociation/JDictSelectTag'
+import { getMemberInfoById, getCertificateById, getCheckInfo, getByMemberTime } from '@/api/standardsAssociationApi'
+
+export default {
+  name: 'CertificatePaymentInfoModal',
+  components: {
+    JDate,
+    JImageUpload,
+    JUpload,
+    JDictSelectTag
+  },
+  data() {
+    return {
+      // todo 目前先固定id
+      userId: '1413419593870872578',
+      // userName: JSON.parse(localStorage.getItem('pro__Login_Userinfo')).value.realname,
+      userName: '',
+      form: this.$form.createForm(this),
+      title: '操作',
+      width: 1100,
+      visible: false,
+      model: {},
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 5 }
+      },
+      labelColText: {
+        xs: { span: 24 },
+        sm: { span: 5 }
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 16 }
+      },
+      confirmLoading: false,
+      validatorRules: {
+        paymentMethod: {
+          rules: [{
+            required: true, message: '请选择缴费方式'
+          }],
+          validateTrigger: ['blur', 'change']
+        },
+        paymentType: {
+          rules: [{
+            required: true, message: '请选择缴费类型'
+          }],
+          validateTrigger: ['blur', 'change']
+        },
+        billNumber: {
+          rules: [{
+            required: true, message: '请输入缴费单号'
+          }],
+          validateTrigger: 'blur'
+        },
+        paymentAmount: {
+          rules: [
+            { required: true, message: '请输入缴费金额' },
+            {
+              pattern: /^[1-9](\d{1,10})?(\.\d{1,2})$|^0\.([1-9](\d{0,1})|\d[1-9])$|^[1-9]\d{0,10}$|^0$/,
+              message: '请输入合法的金额数字，最多2位小数,11位正数',
+              trigger: 'blur'
+            }
+          ],
+          validateTrigger: 'blur'
+        },
+        paymentTime: {
+          rules: [{ required: true, message: '请选择缴费时长' }],
+          validateTrigger: ['blur', 'change']
+        },
+        submissionTime: {
+          rules: [{ required: true, message: '请选择缴费日期!' }],
+          validateTrigger: ['blur', 'change']
+        },
+        paymentRecord: {
+          rules: [{ required: true, message: '请上传缴费凭证' }],
+          validateTrigger: ['blur', 'change']
+        },
+        headerName: {
+          rules: [
+            { required: true, message: '请输入关联付款发票名称' },
+            { min: 1, max: 50, message: '长度不超过50个字符' }
+          ],
+          validateTrigger: 'blur'
+        },
+        taxNumber: {
+          rules: [
+            { required: true, message: '请输入社会统一代码/税号' },
+            // { pattern: /^[A-Z0-9]{15}$|^[A-Z0-9]{17}$|^[A-Z0-9]{18}$|^[A-Z0-9]{20}$/, message: '15位、17位、18位、20位数字和大写英文字母' }
+            {
+              pattern: /^([0-9A-HJ-NPQRTUWXY]{2}\d{6}[0-9A-HJ-NPQRTUWXY]{10}|[1-9]\d{14})$/,
+              message: '请输入15位、18位的社会统一代码/税号'
+            }
+          ],
+          validateTrigger: 'blur'
+        },
+        invoiceAddress: { rules: [{ required: true, message: '请输入单位地址' }], validateTrigger: 'blur' },
+        invoicePhone: {
+          rules: [
+            { required: true, message: '请输入电话号码' },
+            {
+              pattern: /^((13[0-9])|(14[579])|(15([0-3]|[5-9]))|(17[0135678])|(18[0-9])|(19[8|9])|(16[6]))\d{8}$|^([0-9]{3,4}-)[0-9]{7,8}$/,
+              message: '请输入正确格式的电话号码',
+              validateTrigger: 'onBlur'
+            }
+          ],
+          validateTrigger: 'blur'
+        },
+        depositBank: { rules: [{ required: true, message: '请输入开户银行' }], validateTrigger: 'blur' },
+        bankAccount: { rules: [{ required: true, message: '请输入银行账户' }], validateTrigger: 'blur' },
+        address: {
+          rules: [
+            { required: true, message: '请输入通讯地址' },
+            { min: 1, max: 50, message: '长度不超过50个字符' }
+          ],
+          validateTrigger: 'blur'
+        },
+        postcode: {
+          rules: [
+            { required: true, message: '请输入邮编' },
+            { pattern: /^[0-9]\d{5}$/, message: '请输入正确的邮编' }
+          ],
+          validateTrigger: 'blur'
+        },
+        checkResult: {
+          rules: [
+            { required: true, message: '请选择核对结果' }
+          ],
+          validateTrigger: ['blur', 'change']
+        },
+        checkMark: {
+          rules: [
+            { min: 0, max: 500, message: '长度不超过500个字符' }
+          ],
+          validateTrigger: 'blur'
+        }
+      },
+      url: {
+        add: '/certificatePaymentInfo/add',
+        edit: '/certificatePaymentInfo/edit'
+      },
+      // 缴费类型 普通会员 false vip会员 true
+      typeFlag: false,
+      // 添加
+      addFlag: false,
+      // 审核
+      checkFlag: false,
+      // 证书回显
+      certificatesFlag: false,
+      // 查看
+      detailFlag: false,
+      // 发票 否 false 是 ture
+      invoiceRequirementsFlag: false,
+      // 当前选择是否需要发票的值，用于dom的判断 0-无 1-普通发票 2-增值税发票
+      currentSelectInvoiceType: 0,
+      startTime: '',
+      endTime: '',
+      // 申请证书
+      selectedRowKeys: [],
+      // 证书信息
+      dataSource: [],
+      count: 2,
+      // 证书列表
+      columns: [
+        {
+          title: '序号',
+          dataIndex: 'index',
+          width: '10%',
+          align: 'center'
+        },
+        {
+          title: '证书类型',
+          dataIndex: 'certificate',
+          width: '20%',
+          align: 'center'
+        },
+        {
+          title: '证书代码',
+          dataIndex: 'certificate_code',
+          width: '30%',
+          scopedSlots: { customRender: 'code' },
+          align: 'center'
+        },
+        {
+          title: '证书示意图',
+          dataIndex: 'text',
+          width: '30%',
+          align: 'center',
+          scopedSlots: { customRender: 'imgSlot' }
+        }
+      ],
+      // 审核结果  0：驳回  1：通过 2其他
+      checkResult: 2,
+      memberId: '',
+      // 公司名称
+      companyName: '',
+      // 联系人
+      liaisonMan: '',
+      // 电话
+      mobile: '',
+      // 地址
+      address: '',
+      // 邮编
+      postcode: '',
+      certificate: [], // 证书信息
+      checkInfo: [], // 审核信息
+      // 审核列表
+      checkColumns: [
+        {
+          title: '序号',
+          dataIndex: 'index',
+          width: '10%',
+          align: 'center'
+        },
+        {
+          title: '审批人',
+          dataIndex: 'checkMember',
+          width: '15%',
+          align: 'center'
+        },
+        {
+          title: '审批时间',
+          dataIndex: 'checkTime',
+          width: '20%',
+          align: 'center'
+        },
+        {
+          title: '结果',
+          dataIndex: 'checkResult',
+          width: '15%',
+          align: 'center'
+        },
+        {
+          title: '备注',
+          dataIndex: 'checkMark',
+          width: '40%',
+          align: 'center'
+        }
+      ],
+      // 缴费方式  电汇：1 会员打包：2
+      paymentMethodFlag: '',
+      submitFlag: true
+    }
+  },
+  created() {
+
+  },
+  methods: {
+    /* 添加*/
+    add() {
+      this.addFlag = true
+      this.memberId = this.userId
+      this.edit({})
+    },
+    check() {
+      this.checkFlag = true
+      this.memberId = this.userId
+      this.edit({})
+    },
+    /* 审核*/
+    handleCheck(record) {
+      this.paymentMethodFlag = record.paymentMethod
+      this.checkFlag = true
+      this.form.resetFields()
+      this.model = Object.assign({}, record)
+      if (!this.addFlag) {
+        this.memberId = this.model.memberId
+        this.loadMember()
+      } else {
+        this.memberId = this.userId
+        this.loadMember()
+        this.model.certificate = this.certificate
+      }
+      // 查找证书信息
+      this.getCertificateById(record.certificateId)
+      var type = this.model.paymentTime
+      // 会员类型
+      this.changgeType(type)
+      this.visible = true
+      // 审核人
+      this.model.checkMember = this.userName
+      this.model.checkMemberId = this.userId
+      // 查找审核信息
+      this.getCheckInfo(record.id)
+      this.model.certificate = this.certificate
+      this.checkResult = this.model.checkResult
+      // 发票选择
+      if (Number(record.invoiceRequirements) === 0) {
+        this.invoiceRequirementsFlag = false
+      } else {
+        this.invoiceRequirementsFlag = true
+      }
+      this.currentSelectInvoiceType = Number(record.invoiceRequirements)
+      // 审核信息
+      this.checkResult = this.model.checkResult
+      this.$nextTick(() => {
+        this.form.setFieldsValue(pick(this.model, 'billNumber', 'companyName', 'paymentType', 'validPeriod', 'paymentTime', 'paymentAmount', 'certificatesNum', 'submissionTime', 'checkTime', 'paymentStatus', 'paymentMethod', 'paymentRecord', 'invoiceRequirements', 'headerName', 'taxNumber', 'invoiceAddress', 'invoicePhone', 'depositBank', 'bankAccount', 'checkMember', 'checkMemberId', 'memberId', 'certificate', 'address', 'postcode', 'serviceCharge', 'paymentMark'))
+      })
+    },
+    detail(record) {
+      this.paymentMethodFlag = record.paymentMethod
+      this.detailFlag = true
+      this.form.resetFields()
+      this.model = Object.assign({}, record)
+
+      if (!this.addFlag) {
+        this.memberId = this.model.memberId
+        this.loadMember()
+      } else {
+        this.memberId = this.userId
+        this.loadMember()
+        this.model.certificate = this.certificate
+      }
+      this.getCertificateById(record.certificateId)
+      this.getCheckInfo(record.id)
+      var type = this.model.paymentTime
+      this.changgeType(type)
+      this.visible = true
+      this.model.memberId = this.memberId
+      if (this.model.certificatesNum > 0) {
+        this.certificatesFlag = true
+      } else {
+        this.certificatesFlag = false
+      }
+      this.model.certificate = this.certificate
+      this.checkResult = this.model.checkResult
+      // 发票选择
+      if (Number(record.invoiceRequirements) === 0) {
+        this.invoiceRequirementsFlag = false
+      } else {
+        this.invoiceRequirementsFlag = true
+      }
+      this.currentSelectInvoiceType = Number(record.invoiceRequirements)
+      // 审核信息
+      this.checkResult = this.model.checkResult
+      this.$nextTick(() => {
+        this.form.setFieldsValue(pick(this.model, 'billNumber', 'companyName', 'paymentType', 'validPeriod', 'paymentTime', 'paymentAmount', 'certificatesNum', 'submissionTime', 'checkTime', 'paymentStatus', 'paymentMethod', 'paymentRecord', 'invoiceRequirements', 'headerName', 'taxNumber', 'invoiceAddress', 'invoicePhone', 'depositBank', 'bankAccount', 'checkResult', 'checkMark', 'checkMember', 'checkMemberId', 'memberId', 'certificate', 'address', 'postcode', 'paymentMark', 'serviceCharge'))
+      })
+    },
+    /* 备用，目前用不到*/
+    edit(record) {
+      this.form.resetFields()
+      this.model = Object.assign({}, record)
+      this.getCertificateById(record.certificateId)
+      this.getCheckInfo(record.id)
+      var type = this.model.paymentTime
+      this.changgeType(type)
+      if (!this.addFlag) {
+        this.memberId = this.model.memberId
+      } else {
+        this.model.certificate = this.certificate
+        this.model.headerName = this.headerName
+        this.model.taxNumber = this.taxNumber
+      }
+      this.visible = true
+      this.model.memberId = this.memberId
+      if (this.model.certificatesNum > 0) {
+        this.certificatesFlag = true
+      } else {
+        this.certificatesFlag = false
+      }
+      this.$nextTick(() => {
+        this.form.setFieldsValue(pick(this.model, 'billNumber', 'companyName', 'paymentType', 'validPeriod', 'paymentTime', 'paymentAmount', 'certificatesNum', 'submissionTime', 'checkTime', 'paymentStatus', 'paymentMethod', 'paymentRecord', 'invoiceRequirements', 'headerName', 'taxNumber', 'invoiceAddress', 'invoicePhone', 'depositBank', 'bankAccount', 'checkResult', 'checkMark', 'checkMember', 'checkMemberId', 'memberId', 'certificate', 'address', 'postcode'))
+      })
+    },
+    close() {
+      this.$emit('close')
+      this.visible = false
+      this.addFlag = false
+      this.typeFlag = false
+      this.checkFlag = false
+      this.checkResult = 2
+      this.certificatesFlag = false
+      this.dataSource = []
+      this.checkInfo = []
+      this.detailFlag = false
+      this.selectedRowKeys = []
+      this.invoiceRequirementsFlag = false
+      this.currentSelectInvoiceType = 0
+      this.paymentMethodFlag = ''
+      this.submitFlag = true
+    },
+    handleOk() {
+      const that = this
+      // 触发表单验证
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          that.confirmLoading = true
+          let httpurl = ''
+          let method = ''
+          if (!this.model.id) {
+            httpurl += this.url.add
+            method = 'post'
+          } else {
+            httpurl += this.url.edit
+            method = 'put'
+          }
+          if (this.checkResult === 0) {
+            this.checkResult = 2
+            this.model.paymentStatus = 2
+          } else if (this.checkResult === 1) {
+            this.checkResult = 2
+            this.model.paymentStatus = 3
+          } else {
+            this.model.paymentStatus = 1
+          }
+
+          const formData = Object.assign(this.model, values)
+          // if (this.typeFlag) {
+          //   formData.paymentType = 1;
+          // } else {
+          //   formData.paymentType = 0;
+          // }
+
+          this.model.address = this.address
+          this.model.postcode = this.postcode
+
+          this.model.companyName = this.companyName
+          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, 'billNumber', 'paymentType', 'validPeriod', 'paymentTime', 'paymentAmount', 'certificatesNum', 'submissionTime', 'checkTime', 'paymentStatus', 'paymentMethod', 'paymentRecord', 'invoiceRequirements', 'headerName', 'taxNumber', 'invoiceAddress', 'invoicePhone', 'depositBank', 'bankAccount', 'checkResult', 'checkMark', 'checkMember', 'checkMemberId', 'memberId', 'certificate', 'address', 'postcode'))
+    },
+    // 根据会员id获取会员信息
+    loadMember() {
+      getMemberInfoById({ id: this.memberId }).then((res) => {
+        if (res.success) {
+          var memberInfo = res.result
+          this.companyName = memberInfo.companyName
+          this.liaisonMan = memberInfo.liaisonMan
+          this.mobile = memberInfo.mobile
+          this.address = memberInfo.address
+          this.postcode = memberInfo.postcode
+        } else {
+          console.log(res.message)
+        }
+      })
+    },
+    /* 会员类型*/
+    changgeType(value) {
+      if (value === '2') {
+        // 5年
+        this.typeFlag = true
+      } else {
+        this.typeFlag = false
+      }
+    },
+    onCheckChange(e) {
+      this.checkResult = e.target.value
+    },
+    /* 选择发票*/
+    invoiceRequirementsChange(value) {
+      this.currentSelectInvoiceType = Number(value)
+      if (this.currentSelectInvoiceType === 0) {
+        this.invoiceRequirementsFlag = false
+      } else {
+        this.invoiceRequirementsFlag = true
+      }
+    },
+    // table选择
+    onSelectChange(selectedRowKeys) {
+      this.selectedRowKeys = selectedRowKeys
+      this.model.certificatesNum = this.selectedRowKeys.length
+      for (var i in selectedRowKeys) {
+        this.certificate[i] = this.dataSource[i]
+      }
+    },
+    // 设置证书选中 禁用
+    getCheckboxProps: record => ({
+      props: {
+        disabled: record.id !== '',
+        // 某几项默认选中(R: 当state等于1时)
+        defaultChecked: record.id
+      }
+    }),
+    // 证书code改变
+    onCellChange(key, dataIndex, value) {
+      const dataSource = [...this.dataSource]
+      const target = dataSource.find(item => item.key === key)
+      if (target) {
+        target[dataIndex] = value
+        this.dataSource = dataSource
+      }
+    },
+    /* 图片预览 */
+    getImgView(text) {
+      if (text && text.indexOf(',') > 0) {
+        text = text.substring(0, text.indexOf(','))
+      }
+      return getFileAccessHttpUrl(text)
+    },
+    /* 查找证书信息*/
+    getCertificateById(certificateId) {
+      this.dataSource = []
+      if (this.addFlag) {
+        this.dataSource = [
+          {
+            id: '',
+            key: 0,
+            index: '1',
+            certificate: '世界制造厂识别代号(WMI)证书',
+            certificate_code: '',
+            text: 'payment/Snipaste_2020-12-23_17-30-29_1608894552133.png'
+          },
+          {
+            id: '',
+            key: 1,
+            index: '2',
+            certificate: '企业名称代号证书',
+            certificate_code: '',
+            text: 'payment/Snipaste_2020-12-23_17-30-29_1608894552133.png'
+          }
+        ]
+        this.certificate = this.dataSource
+      } else {
+        getCertificateById({ id: certificateId }).then((res) => {
+          if (res.success) {
+            this.dataSource = []
+            this.dataSource = res.result
+            this.certificate = this.dataSource
+          } else {
+            this.dataSource = []
+            this.certificate = this.dataSource
+          }
+        })
+      }
+    },
+
+    /* 查找审核信息*/
+    getCheckInfo(recordId) {
+      this.checkInfo = []
+      getCheckInfo({ id: recordId, paymentType: 1 }).then((res) => {
+        if (res.success) {
+          this.checkInfo = res.result
+        }
+      })
+    },
+    /* 根据缴费时长，获取缴费金额*/
+    getByMemberTime(rule, value, callback) {
+      const type = this.form.getFieldValue('paymentTime')
+      if (type === undefined) {
+        callback(new Error('请选择'))
+      }
+      /* 校验时间和金额*/
+      getByMemberTime({ memberTime: type }).then((res) => {
+        if (res.success) {
+          const thresholdSettings = res.result
+          for (var thresholdSetting of thresholdSettings) {
+            const paymentAmount = this.form.getFieldValue('paymentAmount')
+            if (paymentAmount) {
+              if (paymentAmount < thresholdSetting.memberMoney) {
+                callback('输入金额与时间不符')
+              } else {
+                callback()
+              }
+            } else {
+              callback('请先输入金额')
+            }
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+<style scoped lang="less">
+.table {
+  width: 100%;
+  height: 180px;
+  text-align: center;
+  margin-bottom: 10px;
+  border-color: #ccc;
+  border-collapse: collapse;
+}
+
+.remark span {
+  display: inline-block;
+  font-size: 14px;
+  //margin-left: 100px;
+  transform: translateY(-20px);
+}
+
+// 2021-09-23 新增固定宽度
+/deep/ .ant-form-item-label {
+  width: 140px !important;
+}
+</style>

src/views/standardsAssociation/PaymentInfo/modules/PreViewImgModal.vue

@@ -0,0 +1,68 @@
+<template>
+  <j-modal
+    title="预览"
+    width="800px"
+    :visible="previewVisible"
+    :maskClosable="false"
+    :footer="null"
+    @cancel="handleCancel()"
+    cancelText="关闭">
+    <img :src="imgSrc" class="img" v-if="imgSrc" />
+    <img :src="getImgView()" class="img" v-else />
+  </j-modal>
+</template>
+
+<script>
+import { getFileAccessHttpUrl } from '@/api/memberManage'
+
+export default {
+  name: 'PreViewImgModal',
+  data() {
+    return {
+      previewVisible: false,
+      imgId: '',
+      imgSrc: ''
+    }
+  },
+  methods: {
+    open(val) {
+      this.previewVisible = true
+      this.imgId = val
+    },
+    openPre(val) {
+      this.$nextTick(() => {
+        if (val === 1) {
+          this.imgSrc = require('../../../../assets/imgs/standardsAssociation/certificate/wmi.png')
+        } else if (val === 2) {
+          this.imgSrc = require('../../../../assets/imgs/standardsAssociation/certificate/cam.png')
+        }
+      })
+      this.previewVisible = true
+    },
+    handleCancel() {
+      this.$nextTick(() => {
+        this.imgId = ''
+        this.previewVisible = false
+      })
+    },
+    /* 图片预览 */
+    getImgView() {
+      let text = this.imgId
+      if (text && text.indexOf(',') > 0) {
+        text = text.substring(0, text.indexOf(','))
+      }
+      return getFileAccessHttpUrl(text)
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+.img {
+  max-width: 100%;
+  max-height: 100%;
+  display: block;
+  margin: auto;
+}
+
+</style>

src/views/standardsAssociation/memberInfo/CertificateInfo.vue

@@ -1,48 +1,48 @@
 <!--会员管理-证书的相关信息-->
 <template>
-<div class='table-page-search-wrapper certificate-info-container'>
-  <a-form layout="inline">
-    <a-row :span="24" class="create-date-row" :gutter="24">
-      <a-col :span="8">
-        <a-form-item label="证书代码" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input :maxLength="50" v-model="queryParam.code" placeholder="请输入证书代码"></a-input>
-        </a-form-item>
-      </a-col>
-      <a-col :span="8" class="ope-col">
-        <a-button class="btn btn-primary" type="primary" @click="vinQuery" icon="search">
-          查询
-        </a-button>
-        <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 5px">
-          重置
-        </a-button>
-      </a-col>
-    </a-row>
-  </a-form>
-  <div class="row clearfix">
-    <div class="col-md-12 column">
+  <div class="table-page-search-wrapper certificate-info-container">
+    <a-form layout="inline">
+      <a-row :span="24" class="create-date-row" :gutter="24">
+        <a-col :span="8">
+          <a-form-item label="证书代码" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input :maxLength="50" v-model="queryParam.code" placeholder="请输入证书代码"></a-input>
+          </a-form-item>
+        </a-col>
+        <a-col :span="8" class="ope-col">
+          <a-button class="btn btn-primary" type="primary" @click="vinQuery" icon="search">
+            查询
+          </a-button>
+          <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 5px">
+            重置
+          </a-button>
+        </a-col>
+      </a-row>
+    </a-form>
+    <div class="row clearfix">
+      <div class="col-md-12 column">
 
-      <a-table
-        ref="table"
-        size="middle"
-        bordered
-        rowKey="id"
-        :columns="columns"
-        :dataSource="dataSource"
-        :pagination="ipagination"
-        :loading="loading"
-        @change="handleTableChange"
-        class="j-table-force-nowrap">
-      </a-table>
+        <a-table
+          ref="table"
+          size="middle"
+          bordered
+          rowKey="id"
+          :columns="columns"
+          :dataSource="dataSource"
+          :pagination="ipagination"
+          :loading="loading"
+          @change="handleTableChange"
+          class="j-table-force-nowrap">
+        </a-table>
+      </div>
     </div>
   </div>
-</div>
 
 </template>
 
 <script>
 import { getAction } from '../../../api/memberManage'
 import { JeroListMixin } from '../../../mixins/JeroListMixin'
-import { RangeDateMixin} from '../../../mixins/RangeDateMixin'
+import { RangeDateMixin } from '../../../mixins/RangeDateMixin'
 
 export default {
   name: 'CertificateInfo',
@@ -50,9 +50,7 @@ export default {
     JeroListMixin,
     RangeDateMixin
   ],
-  components: {
-
-  },
+  components: {},
   props: {
     memberInfo: {
       type: Object,
@@ -185,7 +183,7 @@ export default {
   },
   methods: {
     loadData(arg) {
-      if(!this.url.list){
+      if (!this.url.list) {
         this.$message.error('请设置url.list属性!')
         return
       }
@@ -198,18 +196,17 @@ export default {
       getAction(this.url.list, params).then((res) => {
         if (res.success) {
           //update-begin---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
-          this.dataSource = res.result.records||res.result
-          if(res.result.total)
-          {
+          this.dataSource = res.result.records || res.result
+          if (res.result.total) {
             this.ipagination.total = res.result.total
             //清空列表选中
             // this.onClearSelected()
-          }else{
+          } else {
             this.ipagination.total = 0
           }
           //update-end---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
         }
-        if(res.code===510){
+        if (res.code === 510) {
           this.$message.warning(res.message)
         }
         this.loading = false

src/views/standardsAssociation/memberInfo/CompanyNameApplyRecord.vue

@@ -1,29 +1,30 @@
 <!--单位 名称 变更申请-->
 <template>
-<div class='company-name-apply-record'>
-  <table-component
-    :columns="columnsChangeApprove"
-    :data-source="changeApproveData"
-    :page-type="4"
-    :expand-row-by-click="true"
-    :pagination="ipagination"
-    :is-loading="loading"
-    @ok="getChangeHistoryData"
-    @edit="handleApproveEdit">
-  </table-component>
-  <!--    变更申请模态框-->
-<!--  <change-company-modal ref="changeCompany" @ok="getChangeHistoryData"></change-company-modal>-->
-</div>
+  <div class="company-name-apply-record">
+    <table-component
+      :columns="columnsChangeApprove"
+      :data-source="changeApproveData"
+      :expand-row-by-click="true"
+      :pagination="ipagination"
+      :is-loading="loading"
+      @ok="getChangeHistoryData"
+      @edit="handleApproveEdit">
+    </table-component>
+    <!--    变更申请模态框-->
+    <change-company-modal ref="changeCompany" @ok="getChangeHistoryData"></change-company-modal>
+  </div>
 </template>
 
 <script>
 import { getAction } from '../../../api/memberManage'
 import TableComponent from './modules/TableComponent'
+import ChangeCompanyModal from './modules/ChangeCompanyModal'
 
 export default {
   name: 'CompanyNameApplyRecord',
   components: {
-    TableComponent
+    TableComponent,
+    ChangeCompanyModal
   },
   props: {
     memberInfo: {
@@ -129,13 +130,14 @@ export default {
           title: '操作',
           dataIndex: 'action',
           align: 'center',
+          width: 120,
           scopedSlots: { customRender: 'action' }
         }
       ],
       // 单位申请变更数据源
       changeApproveData: [],
       /* 分页参数 */
-      ipagination:{
+      ipagination: {
         current: 1,
         pageSize: 10,
         pageSizeOptions: ['10', '20', '30', '50', '100'],
@@ -207,7 +209,7 @@ export default {
      * */
     handleApproveEdit(record) {
       this.$refs.changeCompany.originCompanyName = record.originCompanyName
-      this.$refs.changeCompany.memberId = this.$route.query.id
+      this.$refs.changeCompany.memberId = this.memberInfo.id
       this.$refs.changeCompany.recordId = record.id
       this.$refs.changeCompany.listEdit = true
       this.$refs.changeCompany.edit(record)

src/views/standardsAssociation/memberInfo/DownloadRecord.vue

@@ -1,19 +1,18 @@
 <!--下载的记录 -->
 <template>
-<div class='download-record'>
-  <table-component
-    :columns="columnsDownFile"
-    :data-source="downFileData"
-    :page-type="5"
-    :pagination="ipagination"
-    :is-loading="loading"
-    @ok="getDownFileList">
-  </table-component>
-</div>
+  <div class="download-record">
+    <table-component
+      :columns="columnsDownFile"
+      :data-source="downFileData"
+      :pagination="ipagination"
+      :is-loading="loading"
+      @ok="getDownFileList">
+    </table-component>
+  </div>
 </template>
 
 <script>
-import { postAction} from '../../../api/memberManage'
+import { postAction } from '../../../api/memberManage'
 import TableComponent from './modules/TableComponent'
 
 export default {
@@ -31,7 +30,7 @@ export default {
     }
   },
   data() {
-    return{
+    return {
       // 资源下载表头
       columnsDownFile: [
         {
@@ -64,7 +63,7 @@ export default {
       // 资源下载数据源
       downFileData: [],
       /* 分页参数 */
-      ipagination:{
+      ipagination: {
         current: 1,
         pageSize: 10,
         pageSizeOptions: ['10', '20', '30', '50', '100'],

src/views/standardsAssociation/memberInfo/MemberInfo.vue

@@ -1,294 +1,298 @@
 <!--会员信息-->
 <template>
-<div class='member-info'>
-  <a-form :form="form">
-    <div class="row clearfix">
-      <div class="column">
-        <p class='member-panel-title'>单位信息</p>
+  <div class="member-info">
+    <a-form :form="form">
+      <div class="row clearfix">
+        <div class="column">
+          <p class="member-panel-title">单位信息</p>
+        </div>
       </div>
-    </div>
-    <a-row :span="24" class='label-width-row'>
-      <a-col :span="16">
-        <a-form-item label="单位全称" :labelCol="labelCol1" :wrapperCol="wrapperCol1">
-          <a-input
-            disabled
-            :maxLength="50"
-            v-decorator="['companyName',validatorRules.companyName]"
-            placeholder="请输入单位全称"></a-input>
-          <!--会员审核通过后 会员才能查看-->
-          <a-button
-            v-has="'memberInfo:companyNameRecord:add'"
-            v-if="memberInfo.memberStatus === 3"
-            class="btn btn-primary changeCompany"
-            type="primary"
-            @click="changeCompanyName"
-            style="z-index: 1000">变更申请
-          </a-button>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <a-row :span="24" class='label-width-row'>
-      <a-col :span="16">
-        <a-form-item label="用户昵称" :labelCol="labelCol1" :wrapperCol="wrapperCol1">
-          <a-input @change="event => event.target.value = event.target.value.trim()" v-decorator="[ 'realname', validatorRules.realname]" placeholder="请输入用户昵称" :maxLength="50"></a-input>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <a-row :span="24" class='label-width-row'>
-      <a-col :span="16">
-        <a-form-item label="隶属部门/集团" :labelCol="labelCol1" :wrapperCol="wrapperCol1">
-          <a-input
-            :maxLength="50"
-            v-decorator="['companyDepartment']"
-            placeholder="请输入隶属部门/集团"></a-input>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <a-row :span="24" class='label-width-row'>
-      <a-col :span="16">
-        <a-form-item label="单位性质" :labelCol="labelCol1" :wrapperCol="wrapperCol1">
-          <j-multi-select-tag
-            v-decorator="['companyNature',validatorRules.companyNature]"
-            :options="dictOptions"
-            type="checkbox">
-          </j-multi-select-tag>
-        </a-form-item>
-      </a-col>
-    </a-row>
+      <a-row :span="24" class="label-width-row">
+        <a-col :span="16">
+          <a-form-item label="单位全称" :labelCol="labelCol1" :wrapperCol="wrapperCol1">
+            <a-input
+              disabled
+              :maxLength="50"
+              v-decorator="['companyName',validatorRules.companyName]"
+              placeholder="请输入单位全称"></a-input>
+            <!--会员审核通过后 会员才能查看-->
+            <!--           v-has="'memberInfo:companyNameRecord:add'"-->
+            <a-button
+              v-if="memberInfo.memberStatus === 3"
+              class="btn btn-primary changeCompany"
+              type="primary"
+              @click="changeCompanyName"
+              style="z-index: 1000">变更申请
+            </a-button>
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <a-row :span="24" class="label-width-row">
+        <a-col :span="16">
+          <a-form-item label="用户昵称" :labelCol="labelCol1" :wrapperCol="wrapperCol1">
+            <a-input @change="event => event.target.value = event.target.value.trim()"
+                     v-decorator="[ 'realname', validatorRules.realname]" placeholder="请输入用户昵称"
+                     :maxLength="50"></a-input>
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <a-row :span="24" class="label-width-row">
+        <a-col :span="16">
+          <a-form-item label="隶属部门/集团" :labelCol="labelCol1" :wrapperCol="wrapperCol1">
+            <a-input
+              :maxLength="50"
+              v-decorator="['companyDepartment']"
+              placeholder="请输入隶属部门/集团"></a-input>
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <a-row :span="24" class="label-width-row">
+        <a-col :span="16">
+          <a-form-item label="单位性质" :labelCol="labelCol1" :wrapperCol="wrapperCol1">
+            <j-multi-select-tag
+              v-decorator="['companyNature',validatorRules.companyNature]"
+              :options="dictOptions"
+              type="checkbox">
+            </j-multi-select-tag>
+          </a-form-item>
+        </a-col>
+      </a-row>
 
-    <a-row :span="24" class='label-width-row'>
-      <a-col :span="16">
-        <a-form-item label="主要业务或主要产品简介" :labelCol="labelCol1" :wrapperCol="wrapperCol1">
-          <a-textarea
-            :maxLength="500"
-            rows="5"
-            v-decorator="['companyBusinessDesc',validatorRules.companyBusinessDesc]"/>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <a-row :span="24" class='label-width-row'>
-      <a-col :span="16">
-        <a-form-item label="营业执照复印件" :labelCol="labelCol1" :wrapperCol="wrapperCol1">
-          <j-image-upload
-            :number="10"
-            bizPath="payment"
-            isMultiple
-            v-decorator="['businessLicenseFileId', validatorRules.businessLicenseFileId]"></j-image-upload>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <!-- 标准化部门信息-->
-    <div class="row clearfix">
-      <div class="column">
-        <p class='member-panel-title'>标准化部门信息</p>
+      <a-row :span="24" class="label-width-row">
+        <a-col :span="16">
+          <a-form-item label="主要业务或主要产品简介" :labelCol="labelCol1" :wrapperCol="wrapperCol1">
+            <a-textarea
+              :maxLength="500"
+              rows="5"
+              v-decorator="['companyBusinessDesc',validatorRules.companyBusinessDesc]" />
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <a-row :span="24" class="label-width-row">
+        <a-col :span="16">
+          <a-form-item label="营业执照复印件" :labelCol="labelCol1" :wrapperCol="wrapperCol1">
+            <j-image-upload
+              :number="10"
+              bizPath="payment"
+              isMultiple
+              v-decorator="['businessLicenseFileId', validatorRules.businessLicenseFileId]"></j-image-upload>
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <!-- 标准化部门信息-->
+      <div class="row clearfix">
+        <div class="column">
+          <p class="member-panel-title">标准化部门信息</p>
+        </div>
       </div>
-    </div>
-    <a-row :span="24" class='label-width-row'>
-      <a-col :span="8">
-        <a-form-item label="标准化部门(主管/监管)" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            :maxLength="50"
-            v-decorator="['standardDepartment',validatorRules.standardDepartment]"
-            placeholder="请输入标准化部门"></a-input>
-        </a-form-item>
-      </a-col>
-      <a-col :span="8">
-        <a-form-item label="标准化工作负责人" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            :maxLength="50"
-            v-decorator="['standardLeadingMan',validatorRules.standardLeadingMan]"
-            placeholder="请输入标准化工作负责人"></a-input>
-        </a-form-item>
-      </a-col>
-      <a-col :span="8">
-        <a-form-item label="固定电话" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            :maxLength="50"
-            v-decorator="['standardPhone',validatorRules.standardPhone]"
-            placeholder="请输入固定电话"></a-input>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <a-row :span="24" class='label-width-row'>
-      <a-col :span="8">
-        <a-form-item label="手机" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            :maxLength="50"
-            v-decorator="['standardMobile',validatorRules.standardMobile]"
-            placeholder="请输入手机"></a-input>
-        </a-form-item>
-      </a-col>
-      <a-col :span="8">
-        <a-form-item label="E-mail" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            :maxLength="50"
-            v-decorator="['standardEmail',validatorRules.standardEmail]"
-            placeholder="请输入E-mail"></a-input>
-        </a-form-item>
-      </a-col>
-      <a-col :span="8">
-        <a-form-item label="职务" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            :maxLength="50"
-            v-decorator="['standardPost',validatorRules.standardPost]"
-            placeholder="请输入职务"></a-input>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <a-row :span="24" class='label-width-row joined-col'>
-      <a-col :span="8" >
-        <a-form-item label="已加入的行业组织/协会/团体/联盟/委员会等" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            :maxLength="50"
-            v-decorator="['industrialOrganization']"
-            placeholder="请输入已加入的行业组织/协会/团体/联盟/委员会等"></a-input>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <!--联系人信息-->
-    <div class="row clearfix">
-      <div class="column">
-        <p class='member-panel-title'>联系人信息</p>
+      <a-row :span="24" class="label-width-row">
+        <a-col :span="8">
+          <a-form-item label="标准化部门(主管/监管)" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              :maxLength="50"
+              v-decorator="['standardDepartment',validatorRules.standardDepartment]"
+              placeholder="请输入标准化部门"></a-input>
+          </a-form-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-item label="标准化工作负责人" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              :maxLength="50"
+              v-decorator="['standardLeadingMan',validatorRules.standardLeadingMan]"
+              placeholder="请输入标准化工作负责人"></a-input>
+          </a-form-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-item label="固定电话" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              :maxLength="50"
+              v-decorator="['standardPhone',validatorRules.standardPhone]"
+              placeholder="请输入固定电话"></a-input>
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <a-row :span="24" class="label-width-row">
+        <a-col :span="8">
+          <a-form-item label="手机" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              :maxLength="50"
+              v-decorator="['standardMobile',validatorRules.standardMobile]"
+              placeholder="请输入手机"></a-input>
+          </a-form-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-item label="E-mail" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              :maxLength="50"
+              v-decorator="['standardEmail',validatorRules.standardEmail]"
+              placeholder="请输入E-mail"></a-input>
+          </a-form-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-item label="职务" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              :maxLength="50"
+              v-decorator="['standardPost',validatorRules.standardPost]"
+              placeholder="请输入职务"></a-input>
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <a-row :span="24" class="label-width-row joined-col">
+        <a-col :span="8">
+          <a-form-item label="已加入的行业组织/协会/团体/联盟/委员会等" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              :maxLength="50"
+              v-decorator="['industrialOrganization']"
+              placeholder="请输入已加入的行业组织/协会/团体/联盟/委员会等"></a-input>
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <!--联系人信息-->
+      <div class="row clearfix">
+        <div class="column">
+          <p class="member-panel-title">联系人信息</p>
+        </div>
       </div>
-    </div>
-    <a-row :span="24" class='label-width-row'>
-      <a-col :span="8">
-        <a-form-item label="联系人" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            :maxLength="50"
-            v-decorator="['liaisonMan',validatorRules.liaisonMan]"
-            placeholder="请输入联系人"></a-input>
-        </a-form-item>
-      </a-col>
-      <a-col :span="8">
-        <a-form-item label="手机" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            :maxLength="50"
-            :disabled="isDisabledAuth('member.phone')"
-            v-decorator="['mobile',validatorRules.mobile]"
-            placeholder="请输入手机"></a-input>
-        </a-form-item>
-      </a-col>
-      <a-col :span="8">
-        <a-form-item label="固定电话" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            :maxLength="50"
-            v-decorator="['phone',validatorRules.phone]"
-            placeholder="请输入固定电话"></a-input>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <a-row :span="24" class='label-width-row'>
-      <a-col :span="8">
-        <a-form-item label="E-mail" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            :maxLength="50"
-            v-decorator="['email',validatorRules.email]"
-            placeholder="请输入E-mail"></a-input>
-        </a-form-item>
-      </a-col>
-      <a-col :span="8">
-        <a-form-item label="通讯地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            :maxLength="50"
-            v-decorator="['address',validatorRules.address]"
-            placeholder="请输入通讯地址"></a-input>
-        </a-form-item>
-      </a-col>
-      <a-col :span="8">
-        <a-form-item label="邮编" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            :maxLength="50"
-            v-decorator="['postcode',validatorRules.postcode]"
-            placeholder="请输入邮编"></a-input>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <!--发票信息-->
-    <div class="row clearfix">
-      <div class="column">
-        <p class='member-panel-title'>发票信息</p>
+      <a-row :span="24" class="label-width-row">
+        <a-col :span="8">
+          <a-form-item label="联系人" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              :maxLength="50"
+              v-decorator="['liaisonMan',validatorRules.liaisonMan]"
+              placeholder="请输入联系人"></a-input>
+          </a-form-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-item label="手机" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              :maxLength="50"
+              :disabled="isDisabledAuth('member.phone')"
+              v-decorator="['mobile',validatorRules.mobile]"
+              placeholder="请输入手机"></a-input>
+          </a-form-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-item label="固定电话" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              :maxLength="50"
+              v-decorator="['phone',validatorRules.phone]"
+              placeholder="请输入固定电话"></a-input>
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <a-row :span="24" class="label-width-row">
+        <a-col :span="8">
+          <a-form-item label="E-mail" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              :maxLength="50"
+              v-decorator="['email',validatorRules.email]"
+              placeholder="请输入E-mail"></a-input>
+          </a-form-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-item label="通讯地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              :maxLength="50"
+              v-decorator="['address',validatorRules.address]"
+              placeholder="请输入通讯地址"></a-input>
+          </a-form-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-item label="邮编" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              :maxLength="50"
+              v-decorator="['postcode',validatorRules.postcode]"
+              placeholder="请输入邮编"></a-input>
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <!--发票信息-->
+      <div class="row clearfix">
+        <div class="column">
+          <p class="member-panel-title">发票信息</p>
+        </div>
       </div>
-    </div>
-    <a-row :span="24" class='label-width-row'>
-      <a-col :span="8">
-        <a-form-item label="关联付款发票名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            :maxLength="50"
-            v-decorator="['invoiceInfo', validatorRules.invoiceInfo]"
-            placeholder="请输入关联付款发票名称"></a-input>
-        </a-form-item>
-      </a-col>
-      <a-col :span="8">
-        <a-form-item label="社会统一代码/税号" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            :maxLength="50"
-            v-decorator="['taxNo', validatorRules.taxNo]"
-            placeholder="请输入社会统一代码/税号"></a-input>
-        </a-form-item>
-      </a-col>
-      <!-- 2021-09-23 增加 单位地址 -->
-      <a-col :span="8">
-        <a-form-item label="单位地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            @change="event => event.target.value = event.target.value.trim()"
-            v-decorator="[ 'invoiceAddress', validatorRules.invoiceAddress]"
-            placeholder="请输入单位地址"
-            :maxLength="50"
-          ></a-input>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <!-- 2021-09-23 增加 电话号码  开户银行 银行账户-->
-    <a-row :span="24" class='label-width-row'>
-      <a-col :span="8">
-        <a-form-item label="电话号码" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            v-decorator="[ 'invoicePhone', validatorRules.invoicePhone]"
-            placeholder="请输入电话号码"
-            :maxLength="50"
-            @change="(e) => {e.target.value = e.target.value.replace(/[^0-9|-]/g,'')}"
-          ></a-input>
-        </a-form-item>
-      </a-col>
-      <a-col :span="8">
-        <a-form-item label="开户银行" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            @change="event => event.target.value = event.target.value.trim()"
-            v-decorator="[ 'depositBank', validatorRules.depositBank]"
-            placeholder="请输入开户银行"
-            :maxLength="50"
-          ></a-input>
-        </a-form-item>
-      </a-col>
-      <a-col :span="8">
-        <a-form-item label="银行账户" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            v-decorator="[ 'bankAccount', validatorRules.bankAccount]"
-            placeholder="请输入银行账户"
-            :maxLength="50"
-            @change="(e) => {e.target.value = e.target.value.replace(/[^0-9]/g,'')}"
-          ></a-input>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <div class="row clearfix">
-      <div class="column">
-        <p class='member-panel-title'>入会申请表</p>
+      <a-row :span="24" class="label-width-row">
+        <a-col :span="8">
+          <a-form-item label="关联付款发票名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              :maxLength="50"
+              v-decorator="['invoiceInfo', validatorRules.invoiceInfo]"
+              placeholder="请输入关联付款发票名称"></a-input>
+          </a-form-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-item label="社会统一代码/税号" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              :maxLength="50"
+              v-decorator="['taxNo', validatorRules.taxNo]"
+              placeholder="请输入社会统一代码/税号"></a-input>
+          </a-form-item>
+        </a-col>
+        <!-- 2021-09-23 增加 单位地址 -->
+        <a-col :span="8">
+          <a-form-item label="单位地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              @change="event => event.target.value = event.target.value.trim()"
+              v-decorator="[ 'invoiceAddress', validatorRules.invoiceAddress]"
+              placeholder="请输入单位地址"
+              :maxLength="50"
+            ></a-input>
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <!-- 2021-09-23 增加 电话号码  开户银行 银行账户-->
+      <a-row :span="24" class="label-width-row">
+        <a-col :span="8">
+          <a-form-item label="电话号码" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              v-decorator="[ 'invoicePhone', validatorRules.invoicePhone]"
+              placeholder="请输入电话号码"
+              :maxLength="50"
+              @change="(e) => {e.target.value = e.target.value.replace(/[^0-9|-]/g,'')}"
+            ></a-input>
+          </a-form-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-item label="开户银行" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              @change="event => event.target.value = event.target.value.trim()"
+              v-decorator="[ 'depositBank', validatorRules.depositBank]"
+              placeholder="请输入开户银行"
+              :maxLength="50"
+            ></a-input>
+          </a-form-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-item label="银行账户" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input
+              v-decorator="[ 'bankAccount', validatorRules.bankAccount]"
+              placeholder="请输入银行账户"
+              :maxLength="50"
+              @change="(e) => {e.target.value = e.target.value.replace(/[^0-9]/g,'')}"
+            ></a-input>
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <div class="row clearfix">
+        <div class="column">
+          <p class="member-panel-title">入会申请表</p>
+        </div>
       </div>
-    </div>
-    <a-row :span="24" class='label-width-row'>
-      <a-col :span="12">
-        <a-form-item label="入会申请表" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          {{applicationWordName}}
-          <span class="preview" @click="previewApplyPdf(memberInfo.applicationWordId)">预览</span>
-          <span class="download" @click="downApplyPdf(memberInfo.applicationWordId)">下载</span>
-        </a-form-item>
-      </a-col>
-      <a-col :span="12"></a-col>
-    </a-row>
-  </a-form>
-</div>
+      <a-row :span="24" class="label-width-row">
+        <a-col :span="12">
+          <a-form-item label="入会申请表" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            {{ applicationWordName }}
+            <span class="preview" @click="previewApplyPdf(memberInfo.applicationWordId)">预览</span>
+            <span class="download" @click="downApplyPdf(memberInfo.applicationWordId)">下载</span>
+          </a-form-item>
+        </a-col>
+        <a-col :span="12"></a-col>
+      </a-row>
+    </a-form>
+    <!-- 变更申请模态框 -->
+    <change-company-modal ref="changeCompany" @ok="getChangeHistoryData"></change-company-modal>
+  </div>
 </template>
 
 <script>
@@ -297,14 +301,17 @@ import JMultiSelectTag from '../../../components/dict/JMultiSelectTag'
 import { previewPdf, getFilesByIds } from '../../../api/standardsAssociationApi'
 import { getFileAccessHttpUrl } from '../../../api/memberManage'
 import { DisabledAuthFilterMixin } from '@/mixins/DisabledAuthFilterMixin'
+import ChangeCompanyModal from './modules/ChangeCompanyModal'
 import pick from 'lodash.pick'
+// eslint-disable-next-line no-unused-vars
 import Vue from 'vue'
 
 export default {
   name: 'MemberInfo',
   components: {
     JImageUpload,
-    JMultiSelectTag
+    JMultiSelectTag,
+    ChangeCompanyModal
   },
   props: {
     // 会员对象
@@ -365,7 +372,10 @@ export default {
           rules: [
             { required: true, message: '请输入单位社会统一代码/税号', validateTrigger: 'blur' },
             // { pattern: /^[A-Z0-9]{15}$|^[A-Z0-9]{17}$|^[A-Z0-9]{18}$|^[A-Z0-9]{20}$/, message: '15位、17位、18位、20位数字和大写英文字母' }
-            { pattern: /^([0-9A-HJ-NPQRTUWXY]{2}\d{6}[0-9A-HJ-NPQRTUWXY]{10}|[1-9]\d{14})$/, message: '请输入15位、18位的社会统一代码/税号' }
+            {
+              pattern: /^([0-9A-HJ-NPQRTUWXY]{2}\d{6}[0-9A-HJ-NPQRTUWXY]{10}|[1-9]\d{14})$/,
+              message: '请输入15位、18位的社会统一代码/税号'
+            }
           ],
           validateTrigger: 'blur'
         },
@@ -557,7 +567,7 @@ export default {
     /*
     * 预览入会申请表
     * */
-    previewApplyPdf(id) {
+    previewApplyPdf() {
       // const url = `${window._CONFIG['memberURL']}/sys/common/static/${id}?type=view&${TokenKey}=${Vue.ls.get(ACCESS_TOKEN)}`
       window.open(previewPdf(this.applicationWordInfo))
       /**
@@ -589,11 +599,25 @@ export default {
     },
     // 初始化数据的方法
     initData(memberInfo) {
-      this.model = { ...memberInfo}
+      this.model = { ...memberInfo }
       this.$nextTick(() => {
         this.form.setFieldsValue(pick(this.model, 'invoiceInfo', 'taxNo', 'userName', 'registerTime', 'companyName', 'companyNature', 'companyDepartment', 'companyBusinessDesc', 'standardDepartment', 'standardLeadingMan', 'standardPhone', 'standardMobile', 'standardEmail', 'standardPost', 'standardSoleDutyCount', 'standardConcurrentCount', 'liaisonMan', 'email', 'phone', 'mobile', 'address', 'postcode', 'memberStatus', 'userId', 'validDate', 'memberType', 'createTime', 'businessLicenseFileId', 'recommendWordId', 'memberNature', 'industrialOrganization', 'applicationWordId', 'realname', 'invoiceAddress', 'invoicePhone', 'depositBank', 'bankAccount'))
       })
       this.getApplyPdfFilesByIds()
+    },
+
+    // 打开变更公司全称模态框
+    changeCompanyName() {
+      this.$refs.changeCompany.originCompanyName = this.memberInfo.companyName
+      this.$refs.changeCompany.memberId = this.memberInfo.id
+      // 是否已经发起变更
+      this.$refs.changeCompany.companyNameApply = this.memberInfo.companyNameApply
+      this.$refs.changeCompany.title = '变更申请'
+      this.$refs.changeCompany.visible = true
+    },
+    // 更新变更
+    getChangeHistoryData() {
+
     }
   },
   created() {
@@ -603,34 +627,47 @@ export default {
 }
 </script>
 
-<style scoped lang='less'>
+<style scoped lang="less">
 @import '~@assets/less/common.less';
-.preview,.download{
+
+.preview, .download {
   display: inline-block;
   margin-left: 8px;
   color: #00A0E9;
   cursor: pointer;
 }
-.joined-col{
-  /deep/label {
+
+.joined-col {
+  /deep/ label {
     white-space: pre-wrap;
-    line-height: 20px!important;
+    line-height: 20px !important;
   }
 }
+
 /* 多选组件的样式 ---开始 */
-/deep/.ant-checkbox-group {
+/deep/ .ant-checkbox-group {
   display: flex;
   flex-wrap: wrap;
 }
-/deep/.ant-checkbox-wrapper + .ant-checkbox-wrapper{
-  width:25%
+
+/deep/ .ant-checkbox-wrapper + .ant-checkbox-wrapper {
+  width: 25%
 }
-/deep/.ant-checkbox-wrapper:nth-child(1){
+
+/deep/ .ant-checkbox-wrapper:nth-child(1) {
   width: 25%;
 }
-/deep/.ant-checkbox-wrapper + .ant-checkbox-wrapper {
+
+/deep/ .ant-checkbox-wrapper + .ant-checkbox-wrapper {
   margin-left: 0px;
 }
+
 /* 多选组件的样式 ---结束 */
 
+// 变更申请 按钮的样式
+.changeCompany {
+  position: absolute;
+  top: -5px;
+  right: -100px;
+}
 </style>

src/views/standardsAssociation/memberInfo/PaymentInfo.vue

@@ -1,66 +1,66 @@
 <!--缴费记录 页面-->
 <template>
-<div class='payment-info'>
-  <div class="table-page-search-wrapper">
-    <a-form layout="inline">
-      <a-row :span="24" :gutter="24" class="create-date-row">
-        <a-col :span="14">
-          <a-form-item label="订单创建日期" :labelCol="labelColDate" :wrapperCol="wrapperColDate">
-            <j-date
-              date-format="YYYY-MM-DD 00:00:00"
-              placeholder="请选择开始日期"
-              v-model="queryParam[dateKeyObj.beginKey]"
-              :disabled-date="disabledStartDate"></j-date>
-            <span class="query-group-split-cust"></span>
-            <j-date
-              date-format="YYYY-MM-DD 23:59:59"
-              placeholder="请选择结束日期"
-              v-model="queryParam[dateKeyObj.endKey]"
-              :disabled-date="disabledEndDate"></j-date>
-          </a-form-item>
-        </a-col>
+  <div class="payment-info">
+    <div class="table-page-search-wrapper">
+      <a-form layout="inline">
+        <a-row :span="24" :gutter="24" class="create-date-row">
+          <a-col :span="14">
+            <a-form-item label="订单创建日期" :labelCol="labelColDate" :wrapperCol="wrapperColDate">
+              <j-date
+                date-format="YYYY-MM-DD 00:00:00"
+                placeholder="请选择开始日期"
+                v-model="queryParam[dateKeyObj.beginKey]"
+                :disabled-date="disabledStartDate"></j-date>
+              <span class="query-group-split-cust"></span>
+              <j-date
+                date-format="YYYY-MM-DD 23:59:59"
+                placeholder="请选择结束日期"
+                v-model="queryParam[dateKeyObj.endKey]"
+                :disabled-date="disabledEndDate"></j-date>
+            </a-form-item>
+          </a-col>
 
-        <a-col :span="8" class="ope-col">
-          <a-button class="btn btn-primary" type="primary" @click="payQuery" icon="searchQuery">查询
-          </a-button>
-          <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 5px">刷新
-          </a-button>
-        </a-col>
-      </a-row>
-    </a-form>
-<!--    <table-component-->
-<!--      :columns="columns"-->
-<!--      :data-source="dataSource"-->
-<!--      :page-type="pageType"-->
-<!--      :pagination="ipagination"-->
-<!--      @ok="paymentSearchQuery"-->
-<!--    ></table-component>-->
+          <a-col :span="8" class="ope-col">
+            <a-button class="btn btn-primary" type="primary" @click="payQuery" icon="searchQuery">查询
+            </a-button>
+            <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 5px">刷新
+            </a-button>
+          </a-col>
+        </a-row>
+      </a-form>
+      <!--    <table-component-->
+      <!--      :columns="columns"-->
+      <!--      :data-source="dataSource"-->
+      <!--      :page-type="pageType"-->
+      <!--      :pagination="ipagination"-->
+      <!--      @ok="paymentSearchQuery"-->
+      <!--    ></table-component>-->
 
-    <div class="row clearfix">
-      <div class="col-md-12 column">
-        <a-table
-          ref="table"
-          size="middle"
-          bordered
-          rowKey="id"
-          :columns="columns"
-          :dataSource="dataSource"
-          :pagination="ipagination"
-          :loading="loading"
-          @change="handleTableChange"
-          class="j-table-force-nowrap">
-        </a-table>
+      <div class="row clearfix">
+        <div class="col-md-12 column">
+          <a-table
+            ref="table"
+            size="middle"
+            bordered
+            rowKey="id"
+            :columns="columns"
+            :dataSource="dataSource"
+            :pagination="ipagination"
+            :loading="loading"
+            @change="handleTableChange"
+            class="j-table-force-nowrap">
+          </a-table>
+        </div>
       </div>
     </div>
   </div>
-</div>
 </template>
 
 <script>
 import moment from 'moment'
 import { getAction } from '../../../api/memberManage'
 import { JeroListMixin } from '../../../mixins/JeroListMixin'
-import { RangeDateMixin} from '../../../mixins/RangeDateMixin'
+import { RangeDateMixin } from '../../../mixins/RangeDateMixin'
 import JDate from '@comp/tools/JDate'
 
 export default {
@@ -93,6 +93,11 @@ export default {
         beginKey: 'submissionTime_begin',
         endKey: 'submissionTime_end'
       },
+      // 时间组件的单位
+      rangeDateFormat: {
+        begin: 'YYYY-MM-DD hh:mm:ss',
+        end: 'YYYY-MM-DD hh:mm:ss'
+      },
       labelColDate: {
         xs: { span: 24 },
         sm: { span: 4 }
@@ -161,7 +166,7 @@ export default {
   methods: {
     moment,
     loadData(arg) {
-      if(!this.url.list){
+      if (!this.url.list) {
         this.$message.error('请设置url.list属性!')
         return
       }
@@ -174,18 +179,17 @@ export default {
       getAction(this.url.list, params).then((res) => {
         if (res.success) {
           //update-begin---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
-          this.dataSource = res.result.records||res.result
-          if(res.result.total)
-          {
+          this.dataSource = res.result.records || res.result
+          if (res.result.total) {
             this.ipagination.total = res.result.total
             //清空列表选中
             // this.onClearSelected()
-          }else{
+          } else {
             this.ipagination.total = 0
           }
           //update-end---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
         }
-        if(res.code===510){
+        if (res.code === 510) {
           this.$message.warning(res.message)
         }
         this.loading = false
@@ -235,7 +239,7 @@ export default {
 }
 </script>
 
-<style scoped lang='less'>
+<style scoped lang="less">
 @import '~@assets/less/common.less';
 
 </style>

src/views/standardsAssociation/memberInfo/modules/ChangeCompanyModal.vue

@@ -16,13 +16,14 @@
         </a-form-item>
         <a-form-item label="变更后单位全称" :labelCol="labelCol" :wrapperCol="wrapperCol">
           <a-input
-v-decorator="['changeCompanyName',validatorRules.changeCompanyName]"
-:maxLength="50"
-                   placeholder="请输入变更后单位全称"
-@change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
+            v-decorator="['changeCompanyName',validatorRules.changeCompanyName]"
+            :maxLength="50"
+            placeholder="请输入变更后单位全称"
+            @change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
         </a-form-item>
         <a-form-item label="工商注册变更证明" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <j-image-upload v-decorator="['registerChangeProve',validatorRules.registerChangeProve]" is-multiple is-less-than5-m :number="2"></j-image-upload>
+          <j-image-upload v-decorator="['registerChangeProve',validatorRules.registerChangeProve]" is-multiple
+                          is-less-than5-m :number="2"></j-image-upload>
         </a-form-item>
       </a-form>
     </a-spin>
@@ -30,9 +31,9 @@ v-decorator="['changeCompanyName',validatorRules.changeCompanyName]"
 </template>
 
 <script>
-import JImageUpload from '@comp/jero/JImageUpload'
+import JImageUpload from '@comp/standardsAssociation/JImageUpload'
 import pick from 'lodash.pick'
-import { checkOnlyCompany, changeCompany, changeCompanyEdit } from '@api/api'
+import { checkOnlyCompany, changeCompany, changeCompanyEdit } from '@api/standardsAssociationApi'
 
 export default {
   name: 'ChangeCompanyModal',
@@ -112,7 +113,8 @@ export default {
           // 为true是编辑
           if (this.listEdit) {
             formData.id = this.recordId
-            formData.registerChangeProve = formData.registerChangeProve.join(',')
+            console.log('------------', formData)
+            // formData.registerChangeProve = formData.registerChangeProve.join(',')
             changeCompanyEdit(formData).then((res) => {
               if (res.success) {
                 that.$message.success('申请变更成功,请等待审批结果')

src/views/standardsAssociation/memberInfo/modules/PreViewImgModal.vue

@@ -7,14 +7,15 @@
     :footer="null"
     @cancel="handleCancel()"
     cancelText="关闭">
-<!--    <img src="../../../../assets/images/wmi.png">-->
+    <!--    <img src="../../../../assets/images/wmi.png">-->
     <img :src="imgSrc" class="img" v-if="imgSrc" />
-    <img :src="getImgView()"  class="img" v-else/>
+    <img :src="getImgView()" class="img" v-else />
   </j-modal>
 </template>
 
 <script>
 import { getFileAccessHttpUrl } from '@/api/memberManage'
+
 export default {
   name: 'PreViewImgModal',
   data() {

src/views/standardsAssociation/memberInfo/modules/TableComponent.vue

@@ -16,11 +16,13 @@
           class="j-table-force-nowrap">
           <template slot="fileSlot" slot-scope="text">
             <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span><!--
-            --><j-ellipsis :value="text" :length="30"/>
+            -->
+            <j-ellipsis :value="text" :length="30" />
           </template>
           <template slot="textSlot" slot-scope="text">
             <span v-if="!text" style="font-size: 12px;font-style: italic;"></span><!--
-            --><j-ellipsis :value="text" :length="30"/>
+            -->
+            <j-ellipsis :value="text" :length="30" />
           </template>
           <template slot="status" slot-scope="text, record">
             <span v-if="record.status === 1 " style="color:red">待审核</span>
@@ -37,12 +39,13 @@
               height="60px"
               alt=""
               class="img"
-              @click.stop="openView(textItem)"/>
+              @click.stop="openView(textItem)" />
           </template>
           <span slot="action" class="action-span-cell action-span-cell-other" slot-scope="text, record">
             <template v-if="record.isParent">
-              <a @click.stop="record.status === 2 && handleApproveEdit(record)" v-show="record.status === 2 && pageType === 1"  v-has="'memberInfo:companyNameRecord:edit' ">编辑</a>
-              <a @click="handleDetail(record)" v-if='record.children && record.children.length > 0'>查看</a>
+              <a @click.stop="record.status === 2 && handleApproveEdit(record)"
+                 v-show="record.status === 2 && pageType === 1">编辑</a>
+              <a @click="handleDetail(record)" v-if="record.children && record.children.length > 0">查看</a>
               <a v-if="!record.children && record.status !== 2">-</a>
             </template>
             <template v-if="!record.isParent">-</template>
@@ -86,15 +89,15 @@ export default {
     expandRowByClick: {
       type: Boolean
     },
+    // 1 是编辑 2-是查看 在企业端应该都是编辑
     pageType: {
       type: Number,
-      default: 2
+      default: 1
     }
 
   },
   data() {
-    return {
-    }
+    return {}
   },
   methods: {
     handleChange(pagination) {
@@ -112,14 +115,14 @@ export default {
       this.$refs.previewModal.open(val)
     },
     /*
-         * 编辑
-         * */
+     * 编辑
+     * */
     handleApproveEdit(record) {
       this.$emit('edit', record)
     },
     /*
-         * 查看
-         * */
+     * 查看
+     * */
     handleDetail(record) {
       console.log(record)
     }
@@ -130,13 +133,14 @@ export default {
 <style scoped lang="less">
 //@import '~@/assets/less/TableExpand.less';
 .img {
-  width:120px;
+  width: 120px;
   font-size: 12px;
   font-style: italic;
   margin-right: 4px;
   cursor: pointer;
 }
-.action-span-cell-other a{
+
+.action-span-cell-other a {
   padding: 0 10px;
 }
 </style>

src/views/standardsAssociation/memberManagementModule/PreViewImgModal.vue

@@ -0,0 +1,50 @@
+<template>
+  <j-modal
+    title="预览"
+    width="500px"
+    :visible="previewVisible"
+    :maskClosable="false"
+    :footer="null"
+    switchFullscreen
+    @cancel="handleCancel()"
+    cancelText="关闭">
+    <!--<img alt="example" style="width: 100%" :src="previewImage"/>-->
+    <img :src="getImgView()" height="300px" alt="this img is flying" style="width: 100%;height: 100%" />
+  </j-modal>
+</template>
+
+<script>
+import { getFileAccessHttpUrl } from '@/api/memberManage'
+
+export default {
+  name: 'PreViewImgModal',
+  data() {
+    return {
+      previewVisible: false,
+      imgId: ''
+    }
+  },
+  methods: {
+    open(val) {
+      this.previewVisible = true
+      this.imgId = val
+    },
+    handleCancel() {
+      this.previewVisible = false
+    },
+    /* 图片预览 */
+    getImgView() {
+      let text = this.imgId
+      if (text && text.indexOf(',') > 0) {
+        text = text.substring(0, text.indexOf(','))
+      }
+      return getFileAccessHttpUrl(text)
+    }
+
+  }
+}
+</script>
+
+<style scoped>
+
+</style>