<template>
  <div class="fullheight">
    <ht-table
      @load="loadData"
      :data="data"
      :selection="true"
      :pageResult="pageResult"
      :quick-search-props="seacrh"
      :show-export="false"
      :show-custom-column="false"
      ref="htTable"
    >
          <!-- action="${portal}/uc/AuthorizationModel/v1/uploadFileLic" -->
      <template v-slot:toolbar>
        <el-upload
          class="upload-demo"
          :show-file-list='false'
          :loadding="true"
          :headers="header"
          :action="url.uplod"
          :on-success="uploadOk"
          :on-error="errorDown"
          :before-upload="filterSuffix"
          accept=".lic"
        >
          <el-button size="small" icon="el-icon-upload2" type="primary">导入</el-button>
        </el-upload>
      </template>
      <template>
        <ht-table-column type="index" width="50" align="center" label="序号" />
        <!-- <ht-table-column
          prop="deptName"
          label="单位名称"
          :show-overflow-tooltip="true"
        >
        </ht-table-column> -->
         <ht-table-column prop="deptName"  label="单位名称">
          <template v-slot="{row}">
            <el-link type="primary" @click="handleShow(row)" title="查看">{{row.deptName}}</el-link>
          </template>
        </ht-table-column>
        <!-- <ht-table-column
          prop="type"
          width="100"
          label="授权类型"
          :show-overflow-tooltip="true"
        >
        </ht-table-column> -->
         <ht-table-column
          prop="type_"
          label="授权类型"
          width="100"
          :filters="[{text:'试用', value:'1'},{text:'永久', value:'2'}]"
        >
          <template v-slot="{row}">
            <el-tag type="info" v-if="row.type=='1'">试用</el-tag>
            <el-tag  v-if="row.type=='2'">永久</el-tag>
          </template>
        </ht-table-column>
        <ht-table-column
          prop="endDate"
          width="280"
          label="到期时间"
          :show-overflow-tooltip="true"
        >
        </ht-table-column>
        <ht-table-column
          prop="sn"
          label="操作"
          width="260"
          :show-overflow-tooltip="true"
        >
          <template slot-scope="scope">
            <el-button
              plain
              icon="el-icon-download"
              @click="downloadFile(scope.row.id)"
              >下载授权文件</el-button
            >
          </template>
        </ht-table-column>
      </template>
    </ht-table>
     <ht-sidebar-dialog
     class="sp-manager__dialog"
      width="30%"
      :visible="logDialogVisible"
      :before-close="beforeCloseDialog"
      title="详情"
    >
    <el-form v-form>
        <ht-form-item label-width="130px" label="单位名">
          <ht-input
            :disabled="true"
            v-model="PortalSysAreas.deptName"
            validate="required"
            placeholder="请输入单位名"
          />
        </ht-form-item>
         <ht-form-item label-width="130px" label="版本号">
          <ht-input
            v-model="PortalSysAreas.versionCode"
            validate="required"
            placeholder="请输入版本号"
          />
        </ht-form-item>
         <ht-form-item label-width="130px" label="联系人">
          <ht-input
            v-model="PortalSysAreas.user"
            placeholder="请输入联系人"
          />
        </ht-form-item>
         <ht-form-item label-width="130px" label="联系电话">
          <ht-input
            v-model="PortalSysAreas.tel"
            validate="mobile: true"
            placeholder="请输入联系电话"
          />
        </ht-form-item>
         <ht-form-item label-width="130px" label="用户数限制">
          <ht-input
            v-model="PortalSysAreas.userNum"
            validate="required"
            type="number"
            placeholder="请输入用户数限制"
          />
        </ht-form-item>
         <ht-form-item label-width="130px" label="机构数">
          <ht-input
            v-model="PortalSysAreas.ognNum"
            validate="required"
             type="number"
            placeholder="请输入机构数"
          />
        </ht-form-item>
         <ht-form-item label-width="130px" label="租户数">
          <ht-input
            v-model="PortalSysAreas.tenantNum"
            validate="required"
             type="number"
            placeholder="请输入租户数"
          />
        </ht-form-item>
        <ht-form-item label="授权类型"  label-width="100px">
          <ht-radio
            v-model="PortalSysAreas.type"
            :options="[{ key: '1', value: '试用'}, { key: '2', value: '永久'}]"
          />
        </ht-form-item>
         <ht-form-item label="安装时间">
        <ht-date
            v-model="PortalSysAreas.installDate"
            placeholder="选择安装时间"
            format="yyyy-MM-dd"
            :validate="{required:true}" />
      </ht-form-item>
      <ht-form-item label="到期时间">
        <ht-date
            v-model="PortalSysAreas.endDate"
            placeholder="选择到期时间"
            format="yyyy-MM-dd"
            :validate="{required:true}" />
      </ht-form-item>
      </el-form>
       <div slot="footer" style="text-align: center">
        <ht-submit-button
           scopeName="SecManForm"
          :url="url.edit"
          :model="PortalSysAreas"
          :request-method="saveMethod"
          scope-name="propertyForm"
          @after-save-data="afterSaveData"
          >保存</ht-submit-button
        >
        <el-button @click="beforeCloseDialog"> 取消 </el-button>
      </div>
    </ht-sidebar-dialog>
    
  </div>
</template>
<script>
import portal from '@/api/portal.js'
import { mapState, mapActions } from "vuex";

export default {
  data() {
    return {
      PortalSysAreas: {
        name: 'name',
      },
      saveMethod:'POST',
      header:{},
      fileSuffix:'.lic',
      seacrh: [{label: '单位名称', prop: 'dept_name_'}],
      loadings: {
        updAcutasLoading: false,
        sequence: false,
      },
      data: [],
      pageResult: {
        page: 1,
        pageSize: 50,
        total: 0,
      },
      url:{
        edit:`${window.context.portal}/uc/AuthorizationModel/v1/save`,
        uplod:`${window.context.portal}/uc/AuthorizationModel/v1/uploadFileLic`
      },
      sysCache: {},
      saveMethod: 'POST',
      logDialogVisible:false,
    }
  },
  mounted() {
    this.$validator = this.$root.$validator
    this.header = { 'Authorization': `Bearer ${this.$store.state.login.currentUser.token}` }
  },
  methods: {
    errorDown(err, file, fileList){
      this.$message({
        type:'error',
        message:'文件上传失败'
      })
    },
    uploadOk(response, file, fileList){
      this.$message({
        type:response.state,
        message:`${file.name} 文件上传成功`
      })
      this.loadData();
    },
    filterSuffix(file) {
      console.log('token', this.header)
      if(file.name.substring(file.name.indexOf('.')) !== this.fileSuffix){
        this.$message({
          type:'error',
          message:'注意上传格式 lic'
        })
        return false;
      }
    },
    loadData(param, cb) {
      portal
        .AuthorizationModel(param)
        .then((res) => {
          console.log(res, '11')
          this.data = res.rows
          this.pageResult = {
            page: res.page,
            pageSize: res.pageSize,
            total: res.total,
          }
          this.$refs.htTable.loading = false
        })
        .finally(() => cb())
    },
    downloadFile(id) {
      let headers = {
        'Content-type': 'application/x-www-form-urlencoded',
      }
      let params = 'id=' + id
      let dt = {
        data: params,
        method: 'post',
        responseType: 'blob',
        headers,
      }
      portal.downloadAuthorizationFile(dt).then((res) => {
        console.log(res, '2222')
      })
    },
    handleShow(row) {
      this.logDialogVisible = true
      this.PortalSysAreas=row
      console.log(this.PortalSysAreas)
      // this.$http
      //   .put(window.context.portal + '/sys/sysLogs/v1/get/' + id)
      //   .then((res) => {
      //     this.log = res.data
      //   })
    },
     afterSaveData() {
      setTimeout(() => {
        this.beforeCloseDialog()
        this.$refs.htTable.load()
      }, 500)
    },
     beforeCloseDialog() {
      // this.refresh()
      this.PortalSysAreas = {}
      this.logDialogVisible = false
      this.loadData()
    },
  },
}
</script>

<style lang="scss" scoped>
.sp-manager__dialog /deep/ > .el-dialog > .el-dialog__body {
  height: calc(100% - 170px);
}
</style>