修改了备样管理

components/table/PTVXETableHeight.vue

+<template>
+  <div>
+    <vxe-grid
+      ref="xTable"
+      :resizable="(resizable === undefined || resizable === true)?true:false"
+      :highlight-current-row="
+      hideCheckbox!==undefined|| hideCheckbox === true"
+      :height="tableHeight"
+      :loading="loading"
+      :auto-resize="true"
+      :pager-config="
+      hidePage === undefined?{total:getPage.total,currentPage:getPage.current,pageSize:getPage.size,pageSizes:pageSizeOpts,background:true}:null"
+      :scroll-y="setOptimization === undefined?defOptimization:setOptimization"
+      :checkbox-config="selectConfig"
+      @checkbox-all="_selectAll"
+      @checkbox-change="_selectRowChange"
+      @page-change="_pageSizeChange"
+      @cell-click="_cellChange"
+      @cell-dblclick="_dbChange"
+      @radio-change="_radioChange"
+      :cell-class-name="_tableCellClassName"
+      :row-class-name="_tableRowClassName"
+      :edit-config="isEdit !== undefined?editConfig:null"
+      :radio-config="isRadio !== undefined?radioConfig:null"
+      :row-key="true"
+      :tooltip-config="{enterable:true}"
+      size="mini"
+      border
+      stripe
+      show-overflow
+      show-header-overflow
+    >
+      <vxe-table-column
+        v-if="hideCheckbox===undefined || hideCheckbox === false"
+        type="checkbox"
+        fixed="left"
+        width="50"
+        align="center"/>
+      <vxe-table-column
+        v-if="isRadio === true"
+        type="radio"
+        title="单选"
+        fixed="left"
+        align="center"
+        width="50"/>
+      <vxe-table-column
+        v-if="!isNoOrder"
+        type="seq"
+        fixed="left"
+        title="序号"
+        width="50"
+        align="center"/>
+      <slot></slot>
+      <vxe-table-column
+        :width="$optColWidth(iconMsg)"
+        v-if="$optColWidth(iconMsg)>0?true:false"
+        title="操作"
+        align="center" fixed="right">
+        <template slot-scope="scope">
+          <VXEIconList :msg="iconMsg" @on-result-change="_iconClick" :rowData="scope.row"
+                       :rowIndex="scope.rowIndex"></VXEIconList>
+        </template>
+      </vxe-table-column>
+      <slot name="col"></slot>
+    </vxe-grid>
+    <!--自定义表格列-->
+    <div style="position: absolute;right:0;top:0;z-index:2000">
+      <slot name="setting"></slot>
+    </div>
+  </div>
+</template>
+
+<script>
+/**
+ * VXE-TABLE 通用 (单选，多选，双击，自定义操作列，自定义表格列)
+ */
+import VXEIconList from '../base/VXEIconList'
+
+export default {
+  name: 'PTVXETable',
+  components: { VXEIconList },
+  props: {
+    formId: null,
+    tableHeight: null,
+    getPage: null,
+    hidePage: null,
+    clickValue: null,
+    selectData: null,
+    hideCheckbox: null,
+    isReport: null, // 判断是否是报告
+    isDataInput: null, // 判断数据录入
+    isTask: null, // 判断是否是检测管理
+    isHandle: null, // 样品
+    tableName: null, // 该值存在，则支持自定义表格
+    iconMsg: null,
+    pageColumns: null,
+    isEdit: null, // 是否可编辑
+    setOptimization: null, // 加载滚动配置项
+    isRadio: null, // 是否是单选
+    isGC: null, // 国抽（抽样单管理）
+    isGroup: null, // 科室为化验室单元格变红色
+    isNoOrder: null, // 如果是true的话，则不显示序号这一列
+    pageSize: null,
+    rows: null,
+    resizable: null // 是否允许列拖动
+  },
+  data() {
+    return {
+      extendsData: {},
+      loading: false,
+      pageParams: {
+        page: 1,
+        rows: this.rows !== undefined ? this.rows : this.$defRow
+      },
+      rowData: {},
+      checkData: [], // 用于多选的高亮显示数据
+      sampleHandleValue: '',
+      // 一系列配置
+      pageSizeOpts:
+        this.pageSize !== undefined
+          ? this.pageSize
+          : [10, 20, 50, 100, 500, 1000],
+      // 默认的配置
+      defOptimization: this.$setOptimization(),
+      selectConfig: { checkField: 'checked', trigger: 'row' },
+      editConfig: {
+        trigger: 'click',
+        mode: 'cell',
+        showIcon: true,
+        autoClear: false,
+        showStatus: true
+      },
+      // 单选的配置项
+      radioConfig: { trigger: 'row' }
+    }
+  },
+  watch: {
+    // 监听数据
+    'getPage.records': function(newVal, oldVal) {
+      this._loadData(newVal)
+    }
+  },
+  methods: {
+    _loadData(data) {
+      // 阻断 vue 对大数组的双向绑定，大数据性能翻倍提升
+      if (this.$refs.xTable) {
+        this.$refs.xTable.loadData(data)
+      }
+    },
+    // 刷新column 和刷新数据
+    _refreshColumn() {
+      this.$refs.xTable.refreshColumn()
+      this.$refs.xTable.syncData()
+    },
+    _clearSelection() {
+      this.$nextTick(function() {
+        this.$refs.xTable.clearCheckboxRow()
+      })
+      this.checkData = []
+      if (this.hideCheckbox === undefined || this.hideCheckbox === false) {
+        if (this.selectData === undefined) {
+          this.$emit('on-result-change', 'selectIds', [])
+        } else {
+          this.$emit('on-result-change', 'selectData', [])
+        }
+      }
+    },
+    _checkAll() {
+      setTimeout(() => {
+        // 控制checkbox状态（加0s的延时才好用）
+        this.$refs.xTable.setAllCheckboxRow(true)
+        // 全选当前界面的数据
+        this._selectRowChange({ selection: this.getPage.records })
+      }, 0)
+    },
+    _pageSizeChange(row) {
+      switch (row.type) {
+        case 'size':
+          this.pageParams.page = 1
+          this.pageParams.rows = row.pageSize
+          this._pageParamsChange()
+          break
+        case 'current':
+          this._pageChange(row.currentPage)
+          break
+      }
+    },
+    _pageChange(page) {
+      this.pageParams.page = page
+      this._pageParamsChange()
+    },
+    _pageParamsChange() {
+      this.$emit('on-result-change', 'changeSize')
+    },
+    _searchParams() {
+      this.loading = true
+      const data = {}
+      const serData = this.$serialize(this.formId)
+      Object.assign(data, serData, this.extendsData)
+      if (this.hidePage === undefined) {
+        return this.$extend(data, this.pageParams)
+      } else {
+        return this.$extend(data)
+      }
+    },
+    _searchFormParams() {
+      const data = {}
+      const serData = this.$serialize(this.formId)
+      Object.assign(data, serData, this.extendsData)
+      if (this.hidePage === undefined) {
+        return this.$extend(data, this.pageParams)
+      } else {
+        return this.$extend(data)
+      }
+    },
+    _page(formId, uri, extendsData) {
+      this.loading = true
+      if (this.tableName) {
+        // tableName存在-----支持自定义表格
+        this._settingCol(formId, uri, extendsData)
+      } else {
+        this._pageTemp(formId, uri, extendsData)
+      }
+    },
+    _settingCol(formId, uri, extendsData) {
+      if (uri) {
+        // 为了避免uri为undefined
+        this.$store
+          .dispatch('SysTableColumn/getByTableName', this.tableName)
+          .then(() => {
+            // 查询用户下的表格数据
+            const userTableCode = this.$store.state.SysTableColumn.model
+            this.$emit(
+              'on-result-change',
+              'table-col',
+              this.$tableColumns(this.pageColumns, userTableCode)
+            )
+            this._pageTemp(formId, uri, extendsData)
+          })
+      }
+    },
+    // 临时
+    _pageTemp(formId, uri, extendsData) {
+      this.formId = formId
+      if (extendsData) {
+        this.extendsData = extendsData
+      }
+      this.$store.dispatch(uri, this._searchParams()).then(() => {
+        this.loading = false
+        this.$emit('on-result-change', 'page', '')
+        this._refreshColumn()
+        // 每次请求完清空上次的选择
+        this._clearSelection()
+      })
+    },
+    // 多选
+    _selectAll: function(data) {
+      this._selectRowChange(data)
+    },
+    _selectRowChange(data) {
+      if (this.hideCheckbox === undefined || this.hideCheckbox === false) {
+        const selData = data.selection
+        this.checkData = selData
+        // 默认返回的是id数组
+        if (this.selectData === undefined) {
+          const idList = []
+          for (let i = 0; i < selData.length; i++) {
+            idList.push(selData[i].id)
+          }
+          this.$emit('on-result-change', 'selectIds', idList, selData)
+        } else {
+          // 有selectData参数时执行
+          this.$emit('on-result-change', 'selectData', selData)
+        }
+      }
+    },
+    // 整行变色
+    _tableRowClassName({ row, rowIndex }) {
+      row.index = rowIndex
+      if (this.checkData.length !== 0) {
+        /* 选中的进行高亮显示 */
+        const index = this.checkData.indexOf(row)
+        if (index !== -1) {
+          return 'high-light-row'
+        }
+      } else {
+        /* 没选中的根据页面逻辑变色 */
+        // if (this.isHandle !== undefined && row.endDate) {
+        //   // 样品待处理界面
+        //   if (this.$warningValue(row.endDate) <= 0) {
+        //     return 'warning-row' // 红色
+        //   } else if (
+        //     this.$warningValue(row.endDate) > 0 &&
+        //     this.$warningValue(row.endDate) <= this.sampleHandleValue
+        //   ) {
+        //     return 'warn-row' // 橙色
+        //   }
+        // }
+      }
+    },
+    // 单元格变色
+    _tableCellClassName({ row, rowIndex, column, columnIndex }) {
+      if (this.isReport !== undefined) {
+        // 报告管理
+        if (
+          column.property === 'sampleProgress' &&
+          row.sampleProgress &&
+          row.sampleProgress.indexOf('退回') !== -1
+        ) {
+          // 含有退回就变红
+          return 'cell-red'
+        }
+        if (
+          column.property === 'progress' &&
+          row.progress &&
+          row.progress.indexOf('退回') !== -1
+        ) {
+          // 含有退回就变红
+          return 'cell-red'
+        }
+        // 是否合格字体变色
+        if (
+          column.property === 'isEligible' &&
+          row.isEligible &&
+          row.isEligible === '合格'
+        ) {
+          return 'cell-blue-color'
+        } else if (
+          column.property === 'isEligible' &&
+          row.isEligible &&
+          row.isEligible === '不合格'
+        ) {
+          return 'cell-red-color'
+        }
+      } else if (this.isDataInput !== undefined) {
+        if (
+          column.property === 'name' &&
+          row.progress &&
+          row.progress.display.indexOf('退回') !== -1
+        ) {
+          // 含有退回就变红
+          return 'cell-red'
+        }
+      } else if (this.isTask !== undefined) {
+        if (
+          column.property === 'serviceType' &&
+          row.serviceType &&
+          row.serviceType.indexOf('加急') !== -1
+        ) {
+          return 'cell-red'
+        }
+        if (
+          column.property === 'name' &&
+          row.name &&
+          row.name.indexOf('复测') !== -1
+        ) {
+          // 含有复测就变红
+          return 'cell-red'
+        }
+      } else if (this.isGC !== undefined) {
+        // 国抽的抽样单管理
+        if (
+          column.property === 'samplingNum' &&
+          row.unsuccessfulCount &&
+          row.unsuccessfulCount > 0
+        ) {
+          // 国抽对接未成功项目数量(抽样单编号变红)
+          return 'cell-red'
+        }
+      } else if (this.isGroup !== undefined) {
+        if (column.property === 'groupName' && row.groupName === '化验室') {
+          // 国抽的检测项目列表，科室为化验室(变红)
+          return 'cell-red'
+        }
+      } else {
+        // 其他列表状态
+        // eslint-disable-next-line no-lonely-if
+        if (column.property === 'progress') {
+          if (undefined === row.progress) {
+            return 'cell-blue-color'
+          } else if (
+            undefined !== row.progress &&
+            undefined !== row.progress.display
+          ) {
+            if (row.progress.display.indexOf('退回') !== -1) {
+              return 'cell-red-color'
+            } else {
+              return 'cell-blue-color'
+            }
+          } else if (undefined !== row.progress) {
+            if (row.progress.indexOf('退回') !== -1) {
+              return 'cell-red-color'
+            } else {
+              return 'cell-blue-color'
+            }
+          } else {
+            return 'cell-blue-color'
+          }
+        } else if (column.property === 'status') {
+          if (
+            row.status &&
+            row.status.display !== undefined &&
+            row.status.display.indexOf('退回') !== -1
+          ) {
+            return 'cell-red-color'
+          } else {
+            return 'cell-blue-color'
+          }
+        }
+      }
+    },
+    // 操作列回调
+    _iconClick(name, rowData, componentName, rowIndex, obj) {
+      this.$emit('on-result-change', 'iconClick', {
+        name: name,
+        rowData: rowData,
+        componentName: componentName,
+        rowIndex: rowIndex,
+        obj: obj
+      })
+    },
+    checkedData() {
+      console.log(this.$refs.xTable.selection)
+      this.$emit('on-result-change', 'allSelect', this.$refs.xTable.selection)
+    },
+    // 双击行操作
+    _dbChange(data, event) {
+      this.$emit('on-result-change', 'dbSelect', data.row)
+    },
+    // 点击单元格触发
+    _cellChange(data, event) {
+      if (this.clickValue !== undefined) {
+        // 有clickValue参数时执行
+        this.$emit('on-result-change', 'singleSelect', data.row)
+      }
+    },
+    // 单选操作
+    _radioChange({ row }) {
+      this.$emit('on-result-change', 'singleSelect', row)
+    },
+    // 关闭loading
+    _hideLoading() {
+      this.loading = false
+    },
+    // 打开loading
+    _showLoading() {
+      this.loading = true
+    },
+    // 只刷新选中行的数据(目前报告盖章中需要)
+    _refreshRows(rowList) {
+      const records = this.getPage.records
+      for (let i = 0; i < rowList.length; i++) {
+        const index = records.findIndex(item => item.id === rowList[i].id)
+        if (index !== -1) {
+          this.$set(this.getPage.records, index, rowList[i])
+        }
+      }
+    }
+  }
+}
+</script>

pages/soil-sample-manage/backups-manage/SampleParpareApply.vue

+<template>
+  <div>
+    <Modal v-model="showModalHandleApply" :mask-closable="false" width="700">
+      <p slot="header">处理申请</p>
+      <div>
+        <Form ref="formObj" :id="formId" :model="formObj" :rules="ruleValidate" :label-width="123" inline>
+          <Form-item label="申请日期:" prop="applyDate" class="width-48">
+            <Date-picker v-model="formObj.applyDate" :editable="false" name="applyDate"
+                         type="date" placeholder="请选择申请日期" style="width: 100%;"
+            ></Date-picker>
+          </Form-item>
+          <Form-item label="申请人:" prop="applyer" class="width-48">
+            <Input v-model="formObj.applyer" name="applyer" readonly></Input>
+          </Form-item>
+          <Form-item label="处理样品批次/数量:" prop="handleBatch" class="width-48">
+            <Input v-model="formObj.handleBatch" name="handleBatch" readonly></Input>
+          </Form-item>
+          <Form-item label="存储期限:" class="width-48">
+            <div>{{formObj.retentionTime}}</div>
+          </Form-item>
+          <Form-item label="样品处理数量:" class="width-48">
+            <Row>
+              <Col span="18">
+                <Input v-model="formObj.handleQuantity" :maxlength="$fieldMaxLength"></Input>
+              </Col>
+              <Col span="6">
+                <div style="padding-left: 10px">{{formObj.sampleUnit}}</div>
+              </Col>
+            </Row>
+          </Form-item>
+          <Form-item label="处理方式:" class="width-48">
+            <el-select v-model="formObj.handleWay" placeholder="请选择"
+                       size="small"
+                       style="width:100%"
+                       clearable>
+              <el-option
+                v-for="item in handleWayList"
+                :key="item.name"
+                :label="item.name"
+                :value="item.name">
+              </el-option>
+            </el-select>
+          </Form-item>
+          <Form-item label="处理原因" prop="handleReason" style="width:100%">
+            <Input :rows="3" v-model="formObj.handleReason" placeholder="请输入处理原因" type="textarea" name="handleReason"/>
+          </Form-item>
+          <Form-item label="附件上传" style="width: 90%;">
+            <div v-for="item in formObj.lmsEquipFiles" class="file-upload-list">
+              <div>
+                <!--<img :src="item.url">-->
+                <div class="file-upload-list-cover">
+                  <Icon @click.native="_handleView(item)" type="ios-eye-outline"></Icon>
+                  <Icon @click.native="_downloadFile(item)" type="ios-cloud-download-outline"></Icon>
+                  <Icon @click.native="_handleRemove(item)" type="ios-trash-outline"></Icon>
+                </div>
+              </div>
+              {{item.orginName }}
+            </div>
+            <Upload
+              :show-upload-list="false"
+              :with-credentials="true"
+              :on-success="_handleSuccess"
+              :before-upload="_handleBeforeUpload"
+              :action="fileAction"
+              :data="fileData"
+              type="drag"
+              style="display: inline-block;width:100px;">
+              <div style="width: 100px;height:100px;line-height: 100px;">
+                <Icon type="ios-cloud-upload" size="20"></Icon>
+              </div>
+            </Upload>
+          </Form-item>
+        </Form>
+      </div>
+      <div slot="footer">
+        <modal-footer ref="footerModal" @on-result-change="_footerResult" :footer="footerList"></modal-footer>
+      </div>
+    </Modal>
+    <Modal v-model="visible" title="查看图片">
+      <img :src="imgSrc" style="width: 100%">
+    </Modal>
+  </div>
+</template>
+<script>
+import Global from '../../../api/config'
+
+export default {
+  components: {},
+  data() {
+    return {
+      lengthLimitList: [{ key: 'handleQuantity', title: '样品处理数量' }],
+      ids: [], // 委托ids
+      showModalHandleApply: false,
+      formObj: {
+        id: '',
+        applyDate: new Date(),
+        applyer: '',
+        handleBatch: '',
+        retentionTime: '',
+        handleReason: '',
+        lmsEquipFiles: [],
+        handleWay: '',
+        handleQuantity: '',
+        sampleUnit: ''
+      },
+      applyId: 0,
+      ruleValidate: {
+        applyer: [
+          { required: true, message: '申请人不能为空', trigger: 'blur' }
+        ]
+      },
+      footerList: [
+        { id: '', name: '取消', type: '' },
+        { id: '', name: '提交', type: 'primary' }
+      ],
+      visible: false,
+      fileAction: Global.baseURL + '/food/v1/sample_handle_apply/uploadFile',
+      fileData: {
+        id: 0,
+        name: ''
+      },
+      formId: '',
+      handleWayList: [],
+      imgSrc: ''
+    }
+  },
+  mounted() {
+    // this._dicSearch()
+  },
+  methods: {
+    // 从字典中查询类别
+    _dicSearch() {
+      this.$store.dispatch('LmsBaseDict/getItem', '样品处理方式').then(() => {
+        const result = this.$store.state.LmsBaseDict.item
+        this.handleWayList = result
+      })
+    },
+    _footerResult(name) {
+      switch (name) {
+        case '取消':
+          this._cancel()
+          break
+        case '提交':
+          this._ok()
+          break
+      }
+    },
+    _open(data) {
+      this.ids = []
+      this.applyId = 0
+      this.fileData.id = 0
+      this.formObj = this.$resetFields(this.formObj)
+      // this._getRetention(data)
+      // this._getSampleBatch(data)
+      this.$refs.footerModal._hideLoading()
+      this.formObj.lmsEquipFiles = []
+      this.showModalHandleApply = true
+      this.formObj.applyer = Global.getUserInfo().realname
+      this.formId = 'handleApplyEditForm' + this.$randomCode()
+    },
+    _getSampleBatch(data) {
+      this.formObj.handleBatch = data.length
+    },
+    // 计算存储期限
+    _getRetention(data) {
+      const handleQuantityList = []
+      const sampleUnitList = []
+      let lastTime = ''
+      const ids = []
+      for (let i = 0; i < data.length; i++) {
+        ids.push(data[i].id)
+
+        // 样品处理数量和单位
+        handleQuantityList.push(data[i].handleQuantity)
+        sampleUnitList.push(data[i].sampleUnit)
+
+        if (lastTime === '') {
+          lastTime = data[i].endDate
+        } else if (lastTime !== '' && lastTime < data[i].endDate) {
+          lastTime = data[i].endDate
+        }
+      }
+      this.ids = ids
+      this.formObj.retentionTime = this.$dateformat(lastTime, 'yyyy-mm-dd')
+
+      // 若勾选的样品处理数量、单位一样则显示
+      // 通过for循环来判断数组的每一元素(若有不重复的，则返回false)
+      this.formObj.handleQuantity =
+        this.$duplicates(handleQuantityList) && handleQuantityList.length > 0
+          ? handleQuantityList[0]
+          : ''
+      this.formObj.sampleUnit =
+        this.$duplicates(sampleUnitList) && sampleUnitList.length > 0
+          ? sampleUnitList[0]
+          : ''
+    },
+    // 附件
+    _handleView(data) {
+      const filePath = data.filePath
+      const index1 = filePath.lastIndexOf('.')
+      const index2 = filePath.length
+      const suffix = filePath.substring(index1 + 1, index2) // 后缀名
+      if (
+        suffix.toLowerCase() === 'png' ||
+        suffix.toLowerCase() === 'jpg' ||
+        suffix.toLowerCase() === 'jpeg'
+      ) {
+        this.visible = true
+        this.imgSrc =
+          Global.baseURL +
+          '/food/v1/sample_handle_apply_attachment/view' +
+          '?id=' +
+          data.id +
+          '&objectKey=' +
+          data.filePath
+      } else {
+        this.$Message.warning({
+          content: '非图片文件无法查看，请下载查看',
+          duration: 3
+        })
+        this.visible = false
+      }
+    },
+    // 下载文件
+    _downloadFile(file) {
+      this.$Modal.confirm({
+        title: '提示',
+        content: '确定要下载？',
+        onOk: () => {
+          const url =
+            Global.baseURL +
+            '/food/v1/sample_handle_apply/downLoadFile?id=' +
+            file.id
+          window.open(url)
+        }
+      })
+    },
+    _handleSuccess(response, file, fileList) {
+      if (response.success) {
+        this.fileData.id = response.data.applyId
+        this.applyId = response.data.applyId
+        this.$Message.success('上传成功!')
+        this.formObj.lmsEquipFiles.push(response.data)
+      } else {
+        this.$Message.error('上传失败!')
+      }
+    },
+    _handleBeforeUpload(file) {},
+    // 删除文件
+    _handleRemove(file) {
+      this.$Modal.confirm({
+        title: '提示',
+        content: '确定删除文件？',
+        onOk: () => {
+          const fileList = this.formObj.lmsEquipFiles
+          this.$store
+            .dispatch('FoodSampleHandleApplyAttachment/deleteByIds', file.id)
+            .then(() => {
+              if (this.$store.state.FoodSampleHandleApplyAttachment.success) {
+                this.formObj.lmsEquipFiles.splice(fileList.indexOf(file), 1)
+                this.$Message.success('删除成功！')
+              }
+            })
+        }
+      })
+    },
+    _ok() {
+      this.$refs.formObj.validate(valid => {
+        if (valid) {
+          const data = this.$serialize(this.formId)
+          data.handleBatch = this.formObj.handleBatch
+          data.id = this.applyId
+          data.handleWay = this.formObj.handleWay
+          data.applyer = this.formObj.applyer
+          data.handleQuantity = this.formObj.handleQuantity
+          // let returnData = {ids: this.ids, obj: data};
+          this.$extend(data, { backupIds: this.ids.join(',') })
+          if (this.$lengthLimitVal(this.lengthLimitList, data) === false) {
+            this._hideLoading()
+            return
+          }
+          this.$store
+            .dispatch('FoodSampleHandleApply/handleApplySubmit', data)
+            .then(() => {
+              if (this.$store.state.FoodSampleHandleApply.success) {
+                this._cancel()
+                this.$Message.success('提交成功')
+                this.$emit('on-result-change')
+              } else {
+                this.$refs.footerModal._hideLoading()
+              }
+            })
+        } else {
+          this.$Message.error('表单验证失败!')
+          this.$refs.footerModal._hideLoading()
+        }
+      })
+    },
+    _cancel() {
+      this.showModalHandleApply = false
+      this.$refs.footerModal._hideLoading()
+    }
+  }
+}
+</script>
+<style scoped>
+.file-upload-list {
+  display: inline-block;
+  width: 100px;
+  height: 100px;
+  text-align: center;
+  line-height: 100px;
+  border: 1px solid transparent;
+  border-radius: 4px;
+  overflow: hidden;
+  background: #fff;
+  position: relative;
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
+  margin-right: 4px;
+}
+.file-upload-list i {
+  color: #fff;
+  font-size: 20px;
+  cursor: pointer;
+  margin: 0 2px;
+}
+.file-upload-list-cover {
+  display: none;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background: rgba(0, 0, 0, 0.6);
+}
+.file-upload-list:hover .file-upload-list-cover {
+  display: block;
+}
+</style>

pages/soil-sample-manage/backups-manage/tab/SampleBackupsManage.vue

@@ -25,17 +25,9 @@
             </btn-list>
           </Col>
           <!--样品数量-->
-          <Col span="24">
-          <div style="display: flex;padding-bottom: 10px;">
-            <div v-for="(item,index) in contList" :key="index" class="reimbursement-item">
-              <p :class="item.color?item.color:''">{{item.value}}</p>
-              <p>{{item.name}}</p>
-            </div>
-          </div>
-          </Col>
           <!-- 表格 -->
           <Col span="24">
-            <PTVXETable
+            <PTVXETableHeight
               id="samplePreManage"
               ref="pageTable"
               :tableHeight="tableHeight"
@@ -109,21 +101,24 @@
                   </template>
                 </vxe-table-column>
               </template>
-            </PTVXETable>
+            </PTVXETableHeight>
           </Col>
         </Row>
       </div>
     </div>
+    <SampleParpareApply ref="applyModal"></SampleParpareApply>
   </div>
 </template>
 <script>
 import AutoCompletes from '../../../../components/base/AutoCompletes'
+import SampleParpareApply from '../SampleParpareApply'
 // eslint-disable-next-line no-unused-vars
 import http from '../../../../api/http'
 import { soilEntrust } from '../../../../api'
 export default {
   components: {
-    AutoCompletes
+    AutoCompletes,
+    SampleParpareApply
   },
   data() {
     return {
@@ -137,6 +132,11 @@ export default {
       btn: [
         {
           type: 'primary',
+          id: '',
+          name: '处理申请'
+        },
+        {
+          type: 'primary',
           id: 'food-sample-preparation-his-all',
           name: '制备'
         },
@@ -214,9 +214,9 @@ export default {
   computed: {
     tableHeight: function() {
       if (this.searchOpen) {
-        return this.$tableHeight('', 385)
+        return this.$tableHeight('', 250)
       } else {
-        return this.$tableHeight('', 300)
+        return this.$tableHeight('', 210)
       }
     },
     colorComputed() {
@@ -360,6 +360,9 @@ export default {
     },
     _btnClick(msg) {
       switch (msg) {
+        case '处理申请':
+          this._applyDispose()
+          break
         case '制备':
           this._preMethod()
           break
@@ -390,6 +393,13 @@ export default {
           break
       }
     },
+    _applyDispose() {
+      if (this.selectIds.length === 0) {
+        this.$Message.warning('请选择一条或多条数据！')
+      } else {
+        this.$refs.applyModal._open(this.selectData)
+      }
+    },
     // 制备
     _preMethod() {
       if (this.selectSampleIds.length === 0) {

plugins/global.js

@@ -9,6 +9,7 @@ import iconList from '../components/base/iconList'
 import elementTable from '../components/table/elementTable'
 import modalFooter from '../components/base/modalFooter'
 import PTVXETable from '../components/table/PTVXETable'
+import PTVXETableHeight from '../components/table/PTVXETableHeight'
 import PTVXETableData from '../components/base/PTVXETableData'
 import VXEIconList from '../components/base/VXEIconList'
 import FileManage from '../components/file/file-manage/FileManage'
@@ -24,6 +25,7 @@ Vue.component('element-table', elementTable)
 Vue.component('element-table-height', elementTableHeight)
 Vue.component('modal-footer', modalFooter)
 Vue.component('PTVXETable', PTVXETable)
+Vue.component('PTVXETableHeight', PTVXETableHeight)
 Vue.component('PTVXETableData', PTVXETableData)
 Vue.component('VXEIconList', VXEIconList)
 Vue.component('VXESettingCol', VXESettingCol)