biobank/src/dashoo.cn/frontend_animal/src/pages/samples/archived/index.vue

<template>
  <div>
    <el-card class="box-card" style="height: calc(100vh - 92px);">
      <div slot="header" style="height: 20px;">
        <span style="float: left;">
          <i class="icon icon-table2"></i>
        </span>
        <el-breadcrumb class="heading" style="float: left; margin-left: 5px">
          <el-breadcrumb-item :to="{ path: '/' }">平台首页</el-breadcrumb-item>
          <el-breadcrumb-item>已归档样本</el-breadcrumb-item>
        </el-breadcrumb>
        <span style="float: right;">
          <el-form ref="form" :inline="true" style="float: left; margin-top: -11.5px">
          <el-form-item label="样本条码">
            <el-input size="mini" style="width: 165px;" v-model="BarCode" placeholder="请输入样本条码"></el-input>
          </el-form-item>
          <el-form-item>
            <el-dropdown split-button type="primary" size="mini" @click="seachdata" @command="handleSearchCommand">
              查询
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item command="search">高级查询</el-dropdown-item>
                <el-dropdown-item command="clear">查询重置</el-dropdown-item>
                <el-dropdown-item style="color:black;" v-for="item in searchTemplates" :key="item.name"
                                  :command="item.template">{{item.name}}</el-dropdown-item>
                <el-dropdown-item divided style="color:black;" command="编辑">自定义</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </el-form-item>
        </el-form>
          <el-dropdown split-button type="primary" size="mini" style="margin-left:10px; margin-top: -4px;"
            @command="handleExportsamplesCommand">
            导出
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item style="color:black;" command="exportchosen">导出所选样本</el-dropdown-item>
              <el-dropdown-item style="color:black;" command="exportpage">导出当前页样本</el-dropdown-item>
              <el-dropdown-item style="color:black;" command="exportall">导出所有样本</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
          <el-button type="primary" size="mini" style="margin-left:10px; margin-top: -4px;" @click="batchprint">打印
          </el-button>
          <el-button type="primary" size="mini" style="margin-left:10px; margin-top: -4px;" @click="batchdelete">删除
          </el-button>
          <el-button type="primary" size="mini" style="margin-left:10px; margin-top: -4px;"
            @click="columndialogVisible = true">显示列</el-button>
        </span>
      </div>

      <el-table ref="multipleTable" :data="list" bordertooltip-effect="dark" border height="calc(100vh - 230px)"
        style="width: 100%;" @selection-change="handleSelectionChange" @header-dragend="header_dragend">
        <el-table-column type="selection" width="55"></el-table-column>
        <el-table-column label="操作" width="80" align="center" fixed>
          <template slot-scope="scope">
            <el-button size="small" type="text" title="删除" icon="el-icon-delete" @click="deletedata(scope.row)">
            </el-button>
            <router-link
              :to="'/samples/archived/'+scope.row.Id + '/detailed?pname=samples-archived&size='+size+'&currentPage='+currentPage">
              <el-button type="text" size="small" title="详情" style="margin-left:3px;">
                <i class="icon icon-eye"></i>
              </el-button>
            </router-link>
          </template>
        </el-table-column>
        <el-table-column :label="item.name" :key="item.name" v-if="item.show" v-for="item in showcolumn"
          :width="item.columnwidth" align="center" show-overflow-tooltip>
          <template slot-scope="scope">
            <template v-if="item.filed === 'SourceName'">
              <router-link
                :to="'/biobank/source/'+ scope.row.SourceId + '/sourcedetail?pname=samples-prerecorded&size='+size+'&currentPage='+currentPage"
                :style="{color: scope.row.FamilyState === 0 ? 'blue' : 'red'}">
                {{scope.row.SourceName}}
              </router-link>
            </template>
            <template v-else-if="item.filed === 'ValidityDate' || item.filed === 'ReceiveDate'">
              {{jstimehandle(scope.row[item.filed])}}
            </template>
            <template v-else-if="item.filed === 'SurveyDate'">
              {{Jstimehandle(scope.row[item.filed])}}
            </template>
            <template v-else-if="item.filed === 'Genus'">
              <el-popover trigger="hover" placement="top">
                <template v-for="item in ExpandInfoList">
                  <p v-if="scope.row[item.FieldName] != '' && scope.row.SampleType == item.SampleType">
                    {{item.Name}}:{{scope.row[item.FieldName]}}
                  </p>
                </template>
                <div slot="reference" class="name-wrapper">
                  <el-tag size="medium">{{ scope.row[item.filed] }}</el-tag>
                </div>
              </el-popover>
            </template>
            <template v-else>
              {{scope.row[item.filed]}}
            </template>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"
        :page-sizes="[10, 100, 200, 500]" :page-size="size" layout="total, sizes, prev, pager, next, jumper"
        :total="currentItemCount">
      </el-pagination>
    </el-card>

    <el-dialog title="高级查询" :visible.sync="dialogVisible" width="1000px">
      <el-form ref="advancedSearchForm" label-width="90px">
        <el-row>
          <el-col :span="8">
            <el-form-item label="样本条码">
              <el-input v-model="BarCode" placeholder="请输入样本条码" size="mini" style="width:100%"></el-input>
            </el-form-item>
            <el-form-item label="样本内码" v-if="acc !='srNA2'">
              <el-input v-model="InnerCode" placeholder="请输入样本内码" size="mini" style="width:100%"></el-input>
            </el-form-item>
            <el-form-item label="样本类型">
              <el-select v-model="SampleType" clearable placeholder="请选择" @change="selsampletypeChange" size="mini"
                         style="width:100%">
                <el-option v-for="item in sampletypes" :label="item.Name" :value="item.Id" :key="item.Id"></el-option>
              </el-select>
            </el-form-item>

            <el-form-item label="创建日期">
              <el-date-picker
                v-model="StartDate"
                type="date"
                size="mini"
                format="yyyy-MM-dd"
                style="width:100%"
                placeholder="开始日期">
              </el-date-picker>
            </el-form-item>

            <el-form-item label="容器类型">
              <el-select
                size="mini"
                style="width:100%"
                v-model="DItem"
                clearable placeholder="请选择"
                @clear="GetEquipmentClear"
                @change="GetEquipmentInfos">
                <el-option
                  v-for="item in EquipmentList"
                  :key="item.DItem"
                  :label="item.DItemName"
                  :value="item.DItem">
                </el-option>
              </el-select>
            </el-form-item>


          </el-col>
          <el-col :span="8">
            <el-form-item label="样本编码">
              <el-input v-model="SampleCode" placeholder="请输入样本编码" size="mini" style="width:100%"></el-input>
            </el-form-item>
            <el-form-item label="名称">
              <el-input v-model="Name" placeholder="请输入名称" size="mini" style="width:100%"></el-input>
            </el-form-item>
            <el-form-item label="特有扩展">
              <el-select v-model="STNoteField" placeholder="请选择" size="mini" style="width:100%" clearable>
                <el-option v-for="item in typetykzlist" :label="item.Name" :value="item.FieldName"
                           :key="item.FieldName"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="结束日期">
              <el-date-picker
                v-model="EndDate"
                type="date"
                format="yyyy-MM-dd"
                size="mini"
                style="width:100%"
                placeholder="结束日期">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="容器名称">
              <el-select
                size="mini"
                v-model="EquipmentIds"
                multiple
                collapse-tags
                style="width: 100%"
                placeholder="请选择">
                <el-option
                  v-for="item in EquipmentInfosList"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="样本源名称">
              <el-input v-model="SourceName" placeholder="请输入样本源名称" size="mini" style="width:100%"></el-input>
            </el-form-item>
            <el-form-item label="录入人">
              <el-input v-model="CreateBy" placeholder="请输入录入人" size="mini" style="width:100%"></el-input>
            </el-form-item>
            <el-form-item label="特有检索">
              <el-input v-model="Stnotevalue" placeholder="输入检索内容" size="mini" style="width:100%"></el-input>
            </el-form-item>
            <el-form-item label="所属分组">
              <el-input v-model="GroupName" placeholder="输入所属分组" size="mini" style="width:100%"></el-input>
            </el-form-item>
          </el-col>

        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
          <el-button size="mini" @click="dialogVisible = false">取 消</el-button>
          <el-button size="mini" type="primary" @click="seachdata">查 询</el-button>
        </span>
    </el-dialog>

    <el-dialog title="样本导出" :visible.sync="sampleExportVisible" width = "800px">
      <el-form>
        <el-form-item label="样本类型">
          <el-select v-model="SampleType" placeholder="请选择样本类型">
            <el-option v-for="(item, index) in ExportSampleTypeList"
                       :label="item.name"
                       :value="item.id"
                       :key="index"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
          <el-button size="mini" @click="sampleExportVisible = false">取 消</el-button>
          <el-button size="mini" type="primary" @click="exportsamples">导 出</el-button>
        </span>
    </el-dialog>

    <el-dialog title="选中显示列（拖拽可以实现排序）" :visible.sync="columndialogVisible" top="5vh">
      <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange"
        style="margin-left:15px;">全选</el-checkbox>
      <div style="margin: 10px 0;"></div>
      <draggable v-model="showcolumn">
        <transition-group class="sampshowfiledsort_ul sampshowfiledsort_ul_tags" tag="ul">
          <li v-for="item in showcolumn" :key="item.filed">
            <el-checkbox v-model="item.show" :label="item.filed" @change="checkedshowall()">{{item.name}}</el-checkbox>
          </li>
        </transition-group>
      </draggable>
      <div slot="footer" class="dialog-footer">
        <el-button @click="columndialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="saveshowfiled()">确 定</el-button>
      </div>
    </el-dialog>

    <!-- 自定义查询 -->
    <samplesearchdialog @close="closeDialog"
                        ref="samplesearchdialog"></samplesearchdialog>


  </div>
</template>

<script>
import store from 'store'
import {
  mapGetters
} from 'vuex'
import draggable from 'vuedraggable'
import samplesearchdialog from '../../../components/samples/samplesearchdialog'
import service from '../../../utils/micro_request'
export default {
  name: 'samplesunsave',
  computed: mapGetters({
    authUser: 'authUser'
  }),
  components: {
    draggable,
    samplesearchdialog
  },
  data () {
    return {
      dialogVisible: false,
      sampleExportVisible: false, // 样本导出弹框
      exportType: '',
      currentItemCount: 0, // 当前页显示数量
      currentPage: 1, // 当前页
      size: 200, // 每页显示数量
      list: [], // table显示数据集
      BarCode: '', // 样本条码
      SampleCode: '', // 样本编码
      SampleType: '', // 样本类型
      Stnotevalue: '', // 特有扩展检索值
      DItem: '', // 容器类型id
      EquipmentList: [], // 容器类型列表
      EquipmentInfosList: [], // 容器名称列表
      SampleTypeList: [], // 样本类型列表
      ExpandInfoList: [], // 扩展字段列表
      EquipmentIds: [], // 设备id列表
      STNoteField: [], // 特有扩展名称
      CreateBy: '', // 录入人
      CreateOn: [], // 录入时期
      StartDate: '', // 开始时期
      EndDate: '', // 结束时期
      ExportSampleTypeList: [], // 导出的样本类型列表
      GroupName: '', // 所属分组
      Name: '', // 名称
      SourceName: '', // 样本来源
      InnerCode: '', // 样本内码
      dialogFormVisible: false, // 添加弹框是否显示
      showquerydiv: false,
      sampletypes: [], // 样本类型
      // 新增
      typetykzlist: [], // 特有扩展
      multipleSelection: [], // 多选框
      showcolumn: [], // 显示列
      cachecols: [],
      columndialogVisible: false, // 自定义显示列弹框
      isIndeterminate: false,
      checkAll: true,
      searchDialogVisible: false, // 自定义搜索弹框
      searchTemplateName: '自定义搜索1',
      searchTemplates: [],
      currentSearchTemplateName: '',
      searchField: 'BarCode',
      searchValue: {
        BarCode: '',
        SampleCode: '',
        SourceName: '',
        InnerCode: '',
        Name: '',
        CreateBy: '',
        SampleType: '',
        Validity: [],
        Capacity: '',
        Location: '',
        Extension: '',
        GroupName: '' // 所属分组
      },
      orAnd: 'and',
      orAndData: [{
        name: '并且',
        value: 'and'
      },
        {
          name: '或者',
          value: 'or'
        }
      ],
      searchTableData: [],
      searchcolumn: [], // 搜索列
      currentSearchTemplate: '',
      acc: ''
    }
  },
  created () {
    this.acc = this.authUser.Profile.AccCode
    if (this.$route.query.size && this.$route.query.currentPage) {
      this.size = parseInt(this.$route.query.size)
      this.currentPage = parseInt(this.$route.query.currentPage)

      let searchmodel = store.get('samplearchivedseach')
      if (typeof (searchmodel) !== 'undefined') {
        if (searchmodel.BarCode && searchmodel.BarCode !== '') { // 样本条码
          this.BarCode = searchmodel.BarCode
        }
        if (searchmodel.SampleCode && searchmodel.SampleCode !== '') { // 样本编码
          this.SampleCode = searchmodel.SampleCode
        }
        if (searchmodel.SourceName && searchmodel.SourceName !== '') { // 样本来源
          this.SourceName = searchmodel.SourceName
        }
        if (searchmodel.InnerCode && searchmodel.InnerCode !== '') { // 样本内码
          this.InnerCode = searchmodel.InnerCode
        }
        if (searchmodel.Name && searchmodel.Name !== '') { // 名称
          this.Name = searchmodel.Name
        }
        if (searchmodel.CreateBy && searchmodel.CreateBy !== '') { // 录入人
          this.CreateBy = searchmodel.CreateBy
        }
        if (searchmodel.CreateOn && searchmodel.CreateOn.length === 2) { // 录入日期
          this.CreateOn = [new Date(searchmodel.CreateOn[0]), new Date(searchmodel.CreateOn[1])]
        }
        if (searchmodel.SampleType && searchmodel.SampleType !== '') { // 样本类型
          this.SampleType = searchmodel.SampleType
          this.searchsampletypeChange()
        }
        if (searchmodel.STNoteField && searchmodel.STNoteField.length > 0) { // 特有扩展
          this.STNoteField = searchmodel.STNoteField
        }
        if (searchmodel.Stnotevalue && searchmodel.Stnotevalue !== '') { // 特有检索内容
          this.Stnotevalue = searchmodel.Stnotevalue
        }
        if (searchmodel.Validity && searchmodel.Validity.length === 2) { // 有效日期
          this.Validity = [new Date(searchmodel.Validity[0]), new Date(searchmodel.Validity[1])]
        }
        if (searchmodel.GroupName && searchmodel.GroupName !== '') { // 所属分组
          this.GroupName = searchmodel.GroupName
        }
      }
    } else {
      store.set('samplearchivedseach', '')
    }

    this.cachecols = store.get('samplearchivedshowcolumn')
    // 当前显示列无数据，使用已录入样本显示列数据
    if (!(this.cachecols && this.cachecols !== '')) {
      this.cachecols = store.get('sapminputshowcolumn')
    }
    if (this.cachecols && this.cachecols !== '') {
      this.showcolumn = this.cachecols
    } else {
      this.showcolumn = [{
        filed: 'BarCode',
        name: '样本条码',
        show: true,
        kuoz: false
      }, {
        filed: 'SampleCode',
        name: '样本编码',
        show: true,
        kuoz: false
      }, {
        filed: 'SourceName',
        name: '样本来源',
        show: true,
        kuoz: false
      }, {
        filed: 'Genus',
        name: '蜂种名称',
        show: true,
        kuoz: false
      }, {
        filed: 'AddressName',
        name: '取样地区',
        show: true,
        kuoz: false
      }, {
        filed: 'SurveyDate',
        name: '采样日期',
        show: true,
        kuoz: false
      }, {
        filed: 'Name',
        name: '名称',
        show: true,
        kuoz: false
      }, {
        filed: 'SampleTypeName',
        name: '样本类型',
        show: true,
        kuoz: false
      }, {
        filed: 'Capacity',
        name: '可用容量',
        show: true,
        kuoz: false
      }, {
        filed: 'InnerCode',
        name: '样本内码',
        show: true,
        kuoz: false
      }, {
        filed: 'ValidityDate',
        name: '有效日期',
        show: true,
        kuoz: false
      }, {
        filed: 'ReceiveDate',
        name: '接收日期',
        show: true,
        kuoz: false
      }, {
        filed: 'CreateBy',
        name: '录入人',
        show: true,
        kuoz: false
      }, {
        filed: 'GroupName',
        name: '所属分组',
        show: true,
        kuoz: false
      }]
    }
    this.initData()
    this.getextends()
    this.checkedshowall()
    this.getAllSearchTab()
  },
  mounted () {
    let _this = this
    window.clickmodeltypetag = function (val, e) {
      _this.clickmodeltypetag(val)
    }
  },
  methods: {
    initData () {
      this.CreateOn = []
      if ((this.StartDate != '' && this.EndDate == '') || (this.StartDate == '' && this.EndDate != '')) {
        this.$message.error('请输入完整创建日期!')
      } else if (this.StartDate > this.EndDate) {
        this.$message.error('开始日期不能大于结束日期，请重新输入！')
      } else if (this.StartDate != '' && this.EndDate != '') {
        this.CreateOn.push(this.StartDate)
        this.CreateOn.push(this.EndDate)
      }
      this.currentSearchTemplate = ''
      let _this = this
      // 增加自定义显示列，存储位置，之后需要去掉
      let ishaslocation = false
      for (let i = 0; i < _this.showcolumn.length; i++) {
        if (_this.showcolumn[i].filed === 'Location') {
          ishaslocation = true
          break
        }
      }
      if (!ishaslocation) {
        _this.showcolumn.push({
          filed: 'Location',
          name: '存储位置',
          show: true,
          kuoz: false,
          columnwidth: 200
        })
      }
      // paginate
      let params = {
        _currentPage: this.currentPage,
        _size: this.size,
        BarCode: this.BarCode,
        SampleCode: this.SampleCode,
        SampleType: this.SampleType,
        Stnotevalue: this.Stnotevalue,
        STNoteField: this.STNoteField,
        CreateBy: this.CreateBy,
        SourceName: this.SourceName,
        DItem: this.DItem,
        EquipmentIds: (this.EquipmentIds).length == 0 ? '' : this.EquipmentIds.join(','),
        Name: this.Name,
        Validity: this.Validity,
        CreateOn: this.CreateOn,
        InnerCode: this.InnerCode,
        GroupName: _this.GroupName
      }
      if (this.CreateOn && this.CreateOn.length === 2) {
        let params2 = {
          CreateOnstart: this.CreateOn[0] / 1000,
          CreateOnend: this.CreateOn[1] / 1000
        }
        params = Object.assign(params, params2)
      }
      if (this.Validity && this.Validity.length === 2) {
        let params3 = {
          Validitystart: this.Validity[0] / 1000,
          Validityend: this.Validity[1] / 1000
        }
        params = Object.assign(params, params3)
      }
      store.set('samplestoredseach', params)
      _this.getAllSearchTab()
      this.$axios.get('/samplesfiles/animallist', {
        params
      })
        .then(res => {
          _this.list = res.data.items
          _this.currentItemCount = res.data.currentItemCount
        })
        .catch(err => {
          console.error(err)
        })
      // 获取容器类型
      service.postRequest('dashoo.biobank.bee-0.1', 'Equipment', 'GetEquipmentType')
        .then(res => {
          this.EquipmentList = res.data
        })
      /*this.$refs.multipleTable.doLayout()*/
      // 获取样本扩展列表
      service.postRequest('dashoo.biobank.bee-0.1', 'SampleRelated', 'CustomizeSearch', {type: 'Sample'})
        .then(res => {
          this.ExpandInfoList = res.data
        })
      // 获取样本类型列表
      service.postRequest('dashoo.biobank.bee-0.1', 'SampleRelated', 'GetSampleType')
        .then(res => {
          this.SampleTypeList = res.data
        })
    },
    GetEquipmentInfos () {
      if (this.DItem != ''){
        service.postRequest('dashoo.biobank.bee-0.1', 'Equipment', 'GetEquipmentInfos', {DItem: this.DItem})
          .then(res => {
            this.EquipmentInfosList = res.data
          })
      }
    },
    GetEquipmentClear () {
      this.EquipmentInfosList = null
      this.EquipmentIds = null
    },
    // 根据子code获取所有父code
    getparentcodebytopcode (v) {
      let _this = this
      _this.$axios.get('/sampleorgan/getparentcodebytopcode/' + v, {})
        .then(res => {
          _this.selectedzuzhi = []
          let pidarr = res.data.split(',')
          for (var i = pidarr.length - 1; i >= 0; i--) {
            if (pidarr[i] !== '0') {
              _this.selectedzuzhi.push(pidarr[i])
            }
          }
          _this.searchzuzhitreehandleChange()
        })
    },
    getextends () {
      let _this = this
      this.$axios.get('/sampleinput/getsampletype', {
        _currentPage: -1
      })
        .then(res => {
          this.getSampleTypeList(this.multipleSelection)
          this.exportType = 'exportchosen'
          // _this.exportsamples('exportchosen')
          if (store.get('samplearchivedseach').searchWithTemplate && store.get('samplearchivedseach').searchWithTemplate !==
            '') { // 自定义查询
            this.handleSearchCommand(store.get('samplearchivedseach').searchWithTemplate)
          } else {
            this.initData()
          }
        }).catch(() => {})
    },
    seachdata () {
      this.currentPage = 1
      this.initData()
      this.dialogVisible = false
    },
    selsampletypeChange () {
      // 获取特有扩展
      let _this = this
      if (_this.SampleType !== '') {
        _this.$axios.get('/sampletype/gettykzzd?SampleType=' + _this.SampleType, {})
          .then(res => {
            _this.STNoteField = []
            _this.typetykzlist = res.data
          })
      }
    },
    // 返回查询条件执行
    searchsampletypeChange () {
      // 获取特有扩展
      let _this = this
      if (_this.SampleType !== '') {
        _this.$axios.get('/sampletype/gettykzzd?SampleType=' + _this.SampleType, {})
          .then(res => {
            _this.typetykzlist = res.data
          })
      }
    },
    // ---------------------------------------------------
    // 自定义显示列
    checkedshowall () {
      let tc = 0
      for (var i = 0; i < this.showcolumn.length; i++) {
        if (this.showcolumn[i].show) {
          tc++
        }
      }
      if (tc > 0 && tc < this.showcolumn.length) {
        this.isIndeterminate = true
        this.checkAll = false
      } else {
        this.isIndeterminate = false
        if (tc === 0) {
          this.checkAll = false
        } else {
          this.checkAll = true
        }
      }
    },
    handleCheckAllChange (val) {
      for (var i = 0; i < this.showcolumn.length; i++) {
        this.showcolumn[i].show = val
      }
    },
    // 自定义显示列保存操作
    saveshowfiled () {
      store.set('samplearchivedshowcolumn', this.showcolumn)
      this.columndialogVisible = false
      this.$message({
        type: 'success',
        message: '自定义显示列设置成功'
      })
      this.initData()
    },
    header_dragend (newWidth, oldWidth, column, event) {
      for (var i = 0; i < this.showcolumn.length; i++) {
        if (this.showcolumn[i].name === column.label) {
          this.showcolumn[i].columnwidth = newWidth
          store.set('samplearchivedshowcolumn', this.showcolumn)
          return
        }
      }
    },
    // ----------------------------------------------------------------
    // 自定义查询
    handleSearchCommand (command) {
      if (command == 'search') {
        this.dialogVisible = true
      } else if (command == 'clear') {
        this.clearSearch()
      } else if (command == '编辑') {
        // this.$refs.customsearchdialog.creatpage()
        // this.$refs.customsearchdialog.customsearchdialogVisable = true
        // this.searchcolumn = this.showcolumn.filter(function (e) {
        //   return e.filed !== 'PositionInfo'
        // })

        /*          this.searchDialogVisible = true
          this.searchcolumn = this.showcolumn.filter(function (e) {
            return e.filed != "Location"
          }) */

        this.$refs.samplesearchdialog.creatpage()
        this.$refs.samplesearchdialog.samplesearchdialogVisable = true
      } else {
        let params = {
          currentPage: 1,
          size: 200,
          template: command,
          isDelete: 0,
          type: 'Sample',
          status: 'archived'
        }
        console.log(params)
        service.postRequest('dashoo.biobank.bee-0.1', 'SampleRelated', 'SampleSearchByTemplate', params).then(res => {
          this.List = res.data.list
          this.currentItemCount = res.data.total
        })
        this.currentSearchTemplate = command
      }
    },
    // 添加自定义搜索
    addSearchTab (name) {
      for (let i = 0; i < this.searchTemplates.length; i++) {
        if (this.searchTemplates[i].Name == name) {
          this.$message('名称已经存在')
          return
        }
      }
      this.searchTemplates.push({
        Name: name,
        Fields: []
      }),
      this.currentSearchTemplateName = name

      for (let i = 0; i < this.searchTemplates.length; i++) {
        if (this.searchTemplates[i].Name == this.currentSearchTemplateName) {
          this.searchTableData = this.getSearchTableData(this.searchTemplates[i].Fields)
        }
      }
    },
    removeSearchTab (targetName) {
      let _this = this
      this.$axios.delete('/sampleinput/searchTemplate?name=' + targetName, {})
        .then(res => {
          if (res.data.code == 0) {
            let tabs = _this.searchTemplates
            let activeName = _this.currentSearchTemplateName
            if (activeName === targetName) {
              tabs.forEach((tab, index) => {
                if (tab.Name === targetName) {
                  let nextTab = tabs[index + 1] || tabs[index - 1]
                  if (nextTab) {
                    activeName = nextTab.Name
                    _this.searchTableData = this.getSearchTableData(nextTab.Fields)
                  }
                }
              })
            }

            _this.currentSearchTemplateName = activeName
            _this.searchTemplates = tabs.filter(tab => tab.Name !== targetName)
          } else {
            _this.$message({
              type: 'warning',
              message: res.data.message
            })
          }
        })
        .catch(err => {
          console.error(err)
        })
    },
    // 添加自定义搜索详情
    addSearchField () {
      let searchValue
      for (let k in this.searchValue) {
        if (typeof this.searchValue[k] === 'number') {
          searchValue = this.searchValue[k]
          break
        } else if (this.searchValue[k] && this.searchValue[k].length > 0) {
          searchValue = this.searchValue[k]
          break
        }
      }

      if (!searchValue) {
        this.$message('请输入检索数值或范围')
        return
      }

      let s = ''
      if (searchValue instanceof Array && searchValue.length > 0) {
        if (searchValue[0] instanceof Date) {
          let arr = []
          for (let j = 0; j < searchValue.length; j++) {
            arr.push(this.formatDateTime(searchValue[j]))
          }
          s = arr.join('--')
        } else {
          s = searchValue[searchValue.length - 1]
        }
      } else {
        s = searchValue
      }

      for (let i = 0; i < this.searchTemplates.length; i++) {
        if (this.searchTemplates[i].Name == this.currentSearchTemplateName) {
          for (let index in this.searchTemplates[i].Fields) {
            let field = this.searchTemplates[i].Fields[index]
            if (field.Field == this.searchField && field.Value == this.searchValue && field.OrAnd == this.orAnd) {
              this.$message('此查询条件已经存在')
              return
            }
          }

          this.searchTemplates[i].Fields.push({
            Field: this.searchField,
            Value: s + '',
            OrAnd: this.orAnd,
            Name: this.getFieldName(this.searchField)
          })
          this.searchTableData = this.getSearchTableData(this.searchTemplates[i].Fields)
          break
        }
      }
    },
    // 查询自定义搜索详情
    saveAndSearchWithTemplate () {
      let _this = this
      this.saveSearchTemplate(function () {
        _this.currentSearchTemplate = _this.currentSearchTemplateName
        _this.searchWithTemplate(_this.currentSearchTemplateName)
      })
    },
    // 保存自定义搜索详情
    saveSearchTemplate (cb) {
      let _this = this
      let template = JSON.stringify(this.searchTableData)
      this.$axios.put('/sampleinput/searchTemplate?name=' + this.currentSearchTemplateName, template)
        .then(res => {
          if (res.data.code == 0) {
            _this.$message({
              type: 'success',
              message: res.data.message
            })
            if (cb) {
              cb()
            }
          } else {
            _this.$message({
              type: 'warning',
              message: res.data.message
            })
          }
        })
        .catch(err => {
          console.error(err)
        })
    },
    deleteSearchField (v) {
      if (v.Name) {
        for (let i = 0; i < this.searchTemplates.length; i++) {
          if (this.searchTemplates[i].Name == this.currentSearchTemplateName) {
            this.searchTemplates[i].Fields = this.searchTemplates[i].Fields.filter(function (ele) {
              return !(ele.Value == v.Value && ele.Field == v.Field && ele.OrAnd == v.OrAnd)
            })
            this.searchTableData = this.getSearchTableData(this.searchTemplates[i].Fields)
            break
          }
        }
      }
    },
    // 关闭自定义查询
    closeDialog () {
      this.getAllSearchTab()
    },
    searchWithTemplate (name) {
      console.log(name)
      this.searchDialogVisible = false

      let params = {
        _currentPage: this.currentPage,
        _size: this.size

      }
      let _this = this
      this.$axios.get('/samplesfiles/search?name=' + name, {
        params
      })
        .then(res => {
          console.log(res.data.items)
          if (res.data.items) {
            _this.list = res.data.items
            _this.currentItemCount = res.data.currentItemCount
          }
        })
        .catch(err => {
          console.error(err)
        })
    },
    getSearchTableData (searchFields) {
      let data = searchFields.map(function (ele) {
        if (ele['OrAnd'] == 'or') {
          ele['Guanxi'] = '或者'
        } else {
          ele['Guanxi'] = '并且'
        }
        return ele
      })

      return data || []
    },
    clickmodeltypetag (val) {
      this.currentSearchTemplateName = val.getAttribute('id')
      for (let i = 0; i < this.searchTemplates.length; i++) {
        if (this.searchTemplates[i].Name == this.currentSearchTemplateName) {
          this.searchTableData = this.getSearchTableData(this.searchTemplates[i].Fields)
        }
      }
    },
    getAllSearchTab () {
      let _this = this
      // getSearchTemplate({ Type: 'sample' })
      service.postRequest('dashoo.biobank.bee-0.1', 'SampleRelated', 'GetSearchTemplate', {type: 'Sample'})
        .then(res => {
          console.log('res.data', res.data)
          if (res.data && res.data.length > 0) {
            _this.searchTemplates = res.data.map(function (e) {
              e.Fields = JSON.parse(e.template)
              return e
            })
            console.log('_this.searchTemplates', _this.searchTemplates)
            // //当前搜索模板的I

            _this.currentSearchId = _this.searchTemplates[0].id
            _this.currentSearchTemplateName = _this.searchTemplates[0].name
            // console.log(_this.searchTemplates, 'searchTemplatessearchTemplatessearchTemplates')
            // console.log(this.searchTemplates[0].Fields, "this.searchTemplates[0].Fields")
            _this.searchTableData = this.getSearchTableData(this.searchTemplates[0].Fields)
          } else {
            // _this.$message({
            //   type: 'warning',
            //   message: res.data.message,
            // })
          }
        })
        .catch(err => {
          // handle error
          console.error(err)
        })
    },
    changeSearchField (val) {
      this.searchValue = {
        BarCode: '',
        SampleCode: '',
        SourceName: '',
        InnerCode: '',
        Name: '',
        CreateBy: '',
        CreateOn: [],
        StartDate: '', // 开始时期
        EndDate: '', // 结束时期
        selectedzuzhi: [],
        SamplingSite: '',
        SampleType: '',
        Validity: [],
        Capacity: '',
        Location: '',
        Extension: '',
        GroupName: ''
      }
    },
    getFieldName (field) {
      for (let i = 0; i < this.showcolumn.length; i++) {
        if (this.showcolumn[i].filed == field) {
          return this.showcolumn[i].name
        }
      }
      return ''
    },
    // ----------------------------------------------------------------
    // 批量复存
    batchsave () {
      let _this = this
      if (_this.multipleSelection.length < 1) {
        _this.$message({
          type: 'warning',
          message: '请选择要批量复存的样本'
        })
        return
      } else {
        let flage = 0
        let message = ''
        for (let index = 0; index < _this.multipleSelection.length; index++) {
          if (_this.multipleSelection[index].IState !== 5) {
            message += _this.multipleSelection[index].BarCode + ' '
            flage = 1
          }
        }
        if (flage == 1) {
          _this.$message({
            type: 'warning',
            message: '所选样本中包含无位置信息的样本:' + message
          })
          return
        }
      }
      this.$axios.put('/samplesfiles/batchresample', _this.multipleSelection)
        .then(res => {
          if (res.data.code == 0) {
            _this.$message({
              type: 'success',
              message: res.data.message
            })
          } else {
            _this.$message({
              type: 'warning',
              message: res.data.message
            })
          }
          _this.initData()
        })
        .catch(err => {
          console.error(err)
        })
    },
    // 清空查询数据
    clearSearch () {
      this.BarCode = ''
      this.SampleCode = ''
      this.SourceName = ''
      this.DItem = ''
      this.EquipmentIds = ''
      this.InnerCode = ''
      this.Name = ''
      this.CreateBy = ''
      this.CreateOn = []
      this.StartDate = ''
      this.EndDate = ''
      this.SampleType = ''
      this.STNoteField = ''
      this.Stnotevalue = ''
      this.Validity = []
      this.Noteitem = []
      this.Noteitemvalue = ''
      this.currentPage = 1
      this.GroupName = ''
      this.initData()
    },
    // 导出样本
    handleExportsamplesCommand (command) {
      let _this = this
      if (command == 'exportchosen') { // 导出所选数据
        if (_this.multipleSelection.length < 1) {
          _this.$message({
            type: 'warning',
            message: '请选择要导出的样本'
          })
          return
        }
        _this.exportsamples('exportchosen')
      } else if (command == 'exportpage') { // 导出当前页数据
        if (_this.list.length < 1) {
          _this.$message({
            type: 'warning',
            message: '当前页无样本'
          })
          return
        }
        this.getSampleTypeList(null)
        this.exportType = 'exportpage'
        this.sampleExportVisible = true
        // _this.exportsamples('exportpage')
      } else if (command == 'exportall') { // 导出所有数据
        _this.$confirm('此操作将导出所有满足条件的数据！是否继续导出?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'info'
        }).then(() => {
          _this.exportsamples()
        }).catch(() => {})
      }
    },
    // 获取当前选择样本的类型
    getSampleTypeList (multipleSelection) {
      let _this = this
      _this.ExportSampleTypeList = [{
        name: '全部',
        id: 0
      }]
      // 导出当前页，遍历当前页数据的样本类型
      if (multipleSelection != null) {
        for (var i = 0; i < multipleSelection.length; i++) {
          var items = undefined
          items = this.ExportSampleTypeList.find((item) => {
            if (item.id == multipleSelection[i].SampleType) {
              return item
            }
          })
          if (items == undefined) {
            _this.ExportSampleTypeList.push(...this.SampleTypeList.filter(function (e) {
              return e.id == multipleSelection[i].SampleType
            }))
          }
        }
      } else if (multipleSelection == null) {
        for (var i = 0; i < _this.list.length; i++) {
          var items = undefined
          items = this.ExportSampleTypeList.find((item) => {
            if (item.id == _this.list[i].SampleType) {
              return item
            }
          })
          if (items == undefined) {
            this.ExportSampleTypeList.push(...this.SampleTypeList.filter(function (e) {
              return e.id == _this.list[i].SampleType
            }))
          }
        }
      }
    },
    exportsamples () {
      let _this = this
      // 显示列
      let showcolumnarr = []
      let showcolumnnamearr = []
      let id = ''
      for (var i = 0; i < _this.showcolumn.length; i++) {
        if (_this.showcolumn[i].show) {
          showcolumnarr.push(_this.showcolumn[i].filed)
          showcolumnnamearr.push(_this.showcolumn[i].name.replace(/,/g, '，'))
        }
      }
      let params = {
        currentPage: this.currentPage,
        size: this.size,
        bar_code: this.BarCode,
        sample_code: this.SampleCode,
        sample_type: this.SampleType == '' ? 0 : this.SampleType,
        create_on: this.create_on,
        d_item: this.DItem,
        equipment_ids: (this.EquipmentIds).length == 0 ? '' : this.EquipmentIds.join(','),
        stnote_value: this.Stnotevalue,
        stnote_field: this.STNoteField,
        create_by: this.CreateBy,
        source_name: this.SourceName,
        name: this.Name,
        validity: this.Validity,
        inner_code: this.InnerCode,
        group_name: this.GroupName,
        show_column: showcolumnarr + '',
        show_column_name: showcolumnnamearr + '',
        type: 'archived'
        // showcolumnarr: showcolumnarr + '',
        // showcolumnnamearr: showcolumnnamearr + '',
        // ExportFlag: 'archived'
      }
      if (this.CreateOn && this.CreateOn.length === 2) {
        let params2 = {
          CreateOnstart: this.CreateOn[0] / 1000,
          CreateOnend: this.CreateOn[1] / 1000
        }
        params = Object.assign(params, params2)
      }
      if (_this.Validity && _this.Validity.length === 2) {
        let params3 = {
          Validitystart: _this.Validity[0] / 1000,
          Validityend: _this.Validity[1] / 1000
        }
        params = Object.assign(params, params3)
      }
      // 导出所选样本
      if (_this.exportType == 'exportchosen') {
        for (var i = 0; i < _this.multipleSelection.length; i++) {
          if (i == _this.multipleSelection.length - 1) {
            id += _this.multipleSelection[i].Id
          } else {
            id += _this.multipleSelection[i].Id + ','
          }
        }
        let paramsid = {
          Id: id
        }
        params = Object.assign(params, paramsid)
      }
      // 导出当前页样本
      if (_this.exportType == 'exportpage') {
        for (var i = 0; i < _this.list.length; i++) {
          if (i == _this.list.length - 1) {
            id += _this.list[i].Id
          } else {
            id += _this.list[i].Id + ','
          }
        }
        let paramsid = {
          id: id
        }
        params = Object.assign(params, paramsid)
      }
      const dateInfo = this.formatExportDate(new Date())
      const name = dateInfo + '样本来源.xlsx'
      console.log('filename', name)
      // 样本来源相关导出
      service.downloadExcel('dashoo.biobank.bee-0.1', 'SampleRelated', 'ExportExcel', name, params)
      // _this.$axios.get('/sampleinput/exportexcel', {
      //   params
      // })
      //   .then(res => {
      //     _this.exportloading = false
      //     // window.location = 'http://' + res.data
      //   })
      //   .catch(err => {
      //     _this.exportloading = false
      //     // handle error
      //     console.error(err)
      //   })
    },
    formatExportDate (date) {
      var y = date.getFullYear()
      var m = date.getMonth() + 1
      m = m < 10 ? ('0' + m) : m
      var d = date.getDate()
      d = d < 10 ? ('0' + d) : d
      return y + m + d
    },
    // 样本条码批量打印
    batchprint () {
      let _this = this
      if (_this.multipleSelection.length < 1) {
        _this.$message({
          type: 'warning',
          message: '请选择要批量打印的样本'
        })
        return
      }
      this.$axios.get('/printscheme/getdefaultprintscheme', {})
        .then(res => {
          if (res.data && res.data !== '') {
            let idstring = ''
            for (var i = 0; i < _this.multipleSelection.length; i++) {
              idstring += _this.multipleSelection[i].Id + ';'
            }
            idstring = idstring.substring(0, idstring.length - 1)
            // 执行打印操作
            window.PrintReport(res.data, `animalsamplesbatch,${this.authUser.Profile.AccCode},${idstring}`)
          } else {
            _this.$message({
              type: 'warning',
              message: '未设置默认打印方案，可在"系统设置"-"打印方案"中进行设置！'
            })
          }
        })
        .catch(err => {
          // handle error
          console.error(err)
        })
    },
    handleSizeChange (value) {
      this.size = value
      this.currentPage = 1
      if (this.currentSearchTemplate) {
        this.searchWithTemplate(this.currentSearchTemplate)
      } else {
        this.initData()
      }
    },
    handleCurrentChange (value) {
      this.currentPage = value
      if (this.currentSearchTemplate) {
        this.searchWithTemplate(this.currentSearchTemplate)
      } else {
        this.initData()
      }
    },
    handleSelectionChange (val) {
      this.multipleSelection = val
    },
    handleChange (value) {
      console.log(value)
    },
    jstimehandle (val) {
      if (val === '') {
        return '----'
      } else if (val === '0001-01-01T08:00:00+08:00') {
        return '----'
      } else if (val === '5000-01-01T23:59:59+08:00') {
        return '永久'
      } else {
        val = val.replace('T', ' ')
        return val.substring(0, 19)
      }
    },
    Jstimehandle (val) {
      if (val === '') {
        return '----'
      } else if (val === '0001-01-01T08:00:00+08:00') {
        return '----'
      } else if (val === '5000-01-01T23:59:59+08:00') {
        return '永久'
      } else {
        val = val.replace('T', ' ')
        return val.substring(0, 10)
      }
    }
  }
}
</script>

<style lang="scss">
.el-pagination {
  margin: 1rem 0 2rem;
  text-align: right;
}

.sampshowfiledsort_ul_tags {
  padding-left: 12px;
  margin-top: -5px;
}

.sampshowfiledsort_ul_tags:after {
  clear: both;
  content: '';
  display: block;
}

.sampshowfiledsort_ul_tags li {
  color: #fff;
  float: left;
  margin: 2px 2px 3px 0;
  padding: 3px 3px;
  min-width: 15px;
  font-size: 16px;
  text-align: center;
  cursor: move;
  transition: all 1s;
  list-style-type: none;
}

</style>