index.vue

<template>
	<div class="eContainer">
		<c-page title="柜员配置查询">
			<el-form :model="model" label-width="120px" label-position="right" size="small">
				<div class="eibs-tab">
					<!-- ----------左 ---------->
					<c-col :span="24" class="col-left">
						<c-col :span="8">
							<el-form-item label="机构" style="width: 100%">
								<c-select v-model="form.branchinr" filterable style="width: 100%" placeholder="请选择业务机构">
									<el-option v-for="item in bchtypList" :key="item.branch" :label="item.bchname" :value="item.inr">
									</el-option>
								</c-select>
							</el-form-item>
						</c-col>
						<c-col :span="8">
							<el-form-item label="组别" style="width: 100%">
                    <c-select v-model="form.bizGroup" filterable style="width: 100%" placeholder="请选择业务组别" dbCode="bizgrp">
                    </c-select>
                  </el-form-item>
						</c-col>
            <c-col :span="8">
							<el-form-item label="柜员工号" style="width: 100%">
								<c-select v-model="form.extkey" style="width: 100%" placeholder="请选择柜员" >
                  <el-option v-for="item in usrLst" :key="item.extkey" :value="item.extkey" :label="item.nam + '-' + item.extkey"></el-option>
                </c-select>
							</el-form-item>
						</c-col>
					</c-col>
					<!-- ----------右 ---------->
					<!-- <c-col :span="12" class="col-right">
						<c-col :span="24">
							<el-form-item label="柜员工号" style="width: 100%">
								<c-select v-model="form.extkey" style="width: 100%" placeholder="请选择柜员" >
                  <el-option v-for="item in usrLst" :key="item.extkey" :value="item.extkey" :label="item.nam + '-' + item.extkey"></el-option>
                </c-select>
							</el-form-item>
						</c-col>
					</c-col> -->

					<!-- 操作按钮 -->
					<c-col :span="24">
						<c-col :span="12" style="text-align: left">
							<el-button type="primary" size="small" icon="el-icon-plus" @click="tskusrAdd">新增</el-button>
						</c-col>
						<c-col :span="12" style="text-align: right">
							<el-button size="small" @click="handleReset">重置</el-button>
							<el-button type="primary" icon="el-icon-search" size="small" @click="onSearch">查询
							</el-button>
						</c-col>
					</c-col>

					<c-col :span="24">
            <el-table id='tableRef' size="small"   :data="tskusrData">
              <el-table-column label="柜员工号" prop="extkey" sortable  width="150px">
                <template slot-scope="scope">{{scope.row.extkey}}</template>
              </el-table-column>
              <el-table-column label="柜员姓名" prop="name" sortable  width="150px">
                <template slot-scope="scope">{{scope.row.name}}</template>
              </el-table-column>
               <el-table-column label="业务组别" prop="bizGroup" sortable width="150px"  >
                <template slot-scope="scope">{{getCodelabel(scope.row.bizGroup,"bizGrp")}}</template>
              </el-table-column>
              <el-table-column label="指定复核人员" prop="designatedReviewer" sortable  width="150px" >
                <template slot-scope="scope">{{scope.row.designatedReviewer}}</template>
              </el-table-column>
              <el-table-column label="经办权限" prop="handlePermission" sortable width="150px" show-overflow-tooltip>
                <template slot-scope="scope">{{scope.row.handlePermission}}</template>
              </el-table-column>
              <el-table-column label="复核权限" prop="reviewPermission" sortable width="150px" >
                <template slot-scope="scope">{{scope.row.reviewPermission}}</template>
              </el-table-column>
              <el-table-column label="业务岗位" prop="bizPosition" sortable width="150px" >
                <template slot-scope="scope">{{getCodelabel(scope.row.bizPosition,'bizPst')}}</template>
              </el-table-column>
              <el-table-column label="参与分配标志" prop="participateFlag" sortable width="150px" >
                <template slot-scope="scope">{{flgFormat(scope.row.participateFlag)}}</template>
              </el-table-column>
              <el-table-column label="柜员状态" prop="status" sortable width="150px" >
                <template slot-scope="scope">{{getCodelabel(scope.row.status,'usrSta')}}</template>
              </el-table-column>
              <el-table-column label="上次登录时间" prop="lastLoginTime" sortable width="150px" >
                <template slot-scope="scope">{{scope.row.lastLoginTime}}</template>
              </el-table-column>
              <el-table-column label="已分配任务数" prop="assignedTaskCount" sortable width="150px" >
                <template slot-scope="scope">{{scope.row.assignedTaskCount}}</template>
              </el-table-column>
              <el-table-column label="上次任务提交时间" prop="lastCommitTime" sortable width="150px" >
                <template slot-scope="scope">{{scope.row.lastCommitTime}}</template>
              </el-table-column>
                <el-table-column fixed="right" prop="op" label="操作"  width="240px">
								<template slot-scope="scope">
									<c-button style="margin-left: 5px" size="small" type="text" icon="el-icon-edit" @click="tskusrEdit(scope.row)">修改</c-button>
									<c-button size="small" style="margin-left: 5px" type="text" icon="el-icon-delete" @click="tskusrDelete(scope.row)">删除</c-button>
									<c-button style="margin-left: 5px" size="small" type="text" icon="el-icon-info" @click="tskusrDetail(scope.row)">详情</c-button>
								</template>
							</el-table-column>
              </el-table>
            <el-pagination :current-page.sync="pagenation.pageNo" :page-sizes="[5, 10, 20]" :page-size="pagenation.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="pagenation.total" @size-change="handleSizeChange" @current-change="handleCurrentChange"></el-pagination>	
	
						<!-- <c-paging-table 
						:data="tskusrData" 
						:columns="tskusrColumns" 
						:pageNumber="pagenation.pageNo" 
						:pageSize="pagenation.pageSize" 
						:total="pagenation.total" 
						v-on:queryFunc="queryFunc" 
						:border="true"
						>
							<c-table-column fixed="right" prop="op" label="操作" width="240px">
								<template slot-scope="{ scope }">
									<c-button style="margin-left: 5px" size="small" type="primary" icon="el-icon-edit" @click="tskusrEdit(scope.row)">修改</c-button>
									<c-button size="small" style="margin-left: 5px" icon="el-icon-delete" @click="tskusrDelete(scope.row)">删除</c-button>
								</template>
							</c-table-column>
						</c-paging-table> -->
					</c-col>

					<el-dialog :title="dialogNam[tskusrtyp]" :visible.sync="dialogVisible" :modal-append-to-body="false" :close-on-click-modal="false" center class="dialog">
						<el-form :model="model" :disabled="tskusrtyp == 'info'" ref="modelForm" label-suffix="：" :rules="rules">
							<c-col :span="12" style="padding-right: 20px;">
								<!-- <c-col :span="24">
									<el-form-item label="柜员ID" :label-width="formLabelWidth" prop="inr" :required="tskusrtyp=='add'">
										<c-input v-model="model.inr" autocomplete="off" placeholder="请输入柜员ID" :disabled="tskusrtyp=='edit'"></c-input>
									</el-form-item>
								</c-col> -->
                <c-col :span="24">
									<el-form-item label="柜员工号" :label-width="formLabelWidth" prop="extkey"  :required="tskusrtyp=='add'">
                    <c-select v-model="model.extkey" @change="getNamAndBch" :disabled="tskusrtyp=='edit'" placeholder="请选择柜员">
                      <el-option v-for="item in usrs" :key="item.extkey" :value="item.extkey" :label="item.extkey"></el-option>
                    </c-select>
                  </el-form-item>
								</c-col>
								<c-col :span="24">
									<el-form-item label="业务岗位" :label-width="formLabelWidth" prop="bizPosition">
										<c-select v-model="model.bizPosition" autocomplete="off" placeholder="请输入业务岗位" dbCode="bizpst">
											<!-- <el-option v-for="item in bizPosition" :key="item.value" :label="item.label" :value="item.value"></el-option> -->
										</c-select>
									</el-form-item>
								</c-col>

                 <c-col :span="24">
									<el-form-item label="指定复核人员" :label-width="formLabelWidth" prop="designatedReviewer">
									 <c-select v-model="model.designatedReviewer"  placeholder="请选择复核柜员">
                      <el-option v-for="item in relUsr" :key="item.extkey" :value="item.extkey" :label="item.extkey + '-' + item.name"></el-option>
                    </c-select>
									</el-form-item>
								</c-col>

                <c-col :span="24">
									<el-form-item label="经办任务池" :label-width="formLabelWidth" prop="handlePermissions">
										<c-select v-model="model.handlePermissions" multiple @change="handleUpdate($event)" placeholder="请选择经办权限">
                      		<el-option v-for="item in tskpool" :key="item.poolNumber" :label="item.poolName" :value="item.poolNumber">
                          </el-option>
                    </c-select>
									</el-form-item>
								</c-col>

               
                 <c-col :span="24">
									<el-form-item label="复核任务池" :label-width="formLabelWidth" prop="reviewPermissions">
										<c-select v-model="model.reviewPermissions" multiple @change="handleUpdate($event)"  placeholder="请输入复核权限">
                      <el-option v-for="item in tskpool" :key="item.poolNumber" :label="item.poolName" :value="item.poolNumber">
                      </el-option>
                    </c-select>
									</el-form-item>
								</c-col>

							</c-col>
							<c-col :span="12" style="padding-left: 20px;">
                <c-col :span="24">
									<el-form-item label="柜员姓名" :label-width="formLabelWidth" prop="name" :required="tskusrtyp=='add'">
										<c-input v-model="model.name"  placeholder="请输入柜员姓名" :disabled="true"></c-input>
									</el-form-item>
								</c-col>

								<c-col :span="24">
									<el-form-item label="所属机构" :label-width="formLabelWidth" prop="branchinr" :required="tskusrtyp=='add'">
										<c-select v-model="model.branchinr"  filterable @change="handleChange" autocomplete="off" placeholder="" disabled>
											<el-option v-for="item in bchtypList" :key="item.branch" :label="item.bchname" :value="item.inr"></el-option>
										</c-select>
									</el-form-item>
								</c-col>
								<c-col :span="24">
									<el-form-item label="业务组别" :label-width="formLabelWidth" prop="bizGroup">
                    	<c-select v-model="model.bizGroup" @change="getTskPool" placeholder="请输入业务组别" dbCode="bizgrp">
										  	<!-- <el-option v-for="item in bizGroups" :key="item.value" :label="item.label" :value="item.value"></el-option> -->
										</c-select>
									</el-form-item>
								</c-col>
                <c-col :span="24">
									<el-form-item label="班次" :label-width="formLabelWidth" prop="workRank">
                    	<c-select v-model="model.workRank"  placeholder="请输入班次" >
										  	<el-option v-for="item in workRanks" :key="item.value" :label="item.label" :value="item.value"></el-option>
										</c-select>
									</el-form-item>
								</c-col>
								<c-col :span="24">
									<el-form-item label="是否参与任务分配" :label-width="formLabelWidth" prop="participateFlag">
										<el-radio v-model="model.participateFlag" label="Y">是</el-radio>
										<el-radio v-model="model.participateFlag" label="N">否</el-radio>
									</el-form-item>
								</c-col>
								<c-col :span="12">
								</c-col>
							</c-col>
						</el-form>
						<div slot="footer" class="dialog-footer">
							<el-button type="primary" @click="commitAdd" v-if="tskusrtyp=='add'">提 交</el-button>
							<el-button type="primary" @click="commitEdit" v-if="tskusrtyp=='edit'">提 交</el-button>
							<el-button  type="primary" @click="handleReturn">返回</el-button>
						</div>
					</el-dialog>
				</div>
			</el-form>
		</c-page>
		<!-- <div style="text-align: center">
			<c-button type="primary" @click="goBack">返 回</c-button>
		</div> -->
	</div>
</template>

<script>
import Utils from "~/utils";
import Api from "~/service/Api";
import commonFunctions from "~/mixin/commonFunctions.js";

export default {
  name: "StaticsTskusr",
  mixins: [commonFunctions],
  components: {},
  data() {
    return {
      usrs:[],
      usrLst:[],
      model: {
        inr: "",
        extkey: "",
        name: "",
        branchinr: "",
        workRank:"",
        bizGroup: "",
        bizPosition: "",
        participateFlag: "",
        designatedReviewer: "",
        handlePermissions: [],
        reviewPermissions: [],
        branchName: "",
      },
      dbCodes:{
        bizGrp:[],
        bizPst:[],
        usrSta:[]
      },
      tskpool:[],
			form: {
				branchinr: "",
				bizGroup: "",
				extkey: "",
			},
			pagenation: {
        pageNo: 1,
        pageSize:5,
        total: 0
      },
      tskusrData: [],
      tskusrColumns: [
        { label: "柜员工号", prop: "extkey", width: "120px" },
        { label: "柜员姓名", prop: "name", width: "120px" },
        { label: "机构名称", prop: "branchName", width: "100px" },
        { label: "业务组别", prop: "bizGroup", width: "120px" },
        { label: "指定复核人员", prop: "designatedReviewer", width: "120px" },
        { label: "经办权限", prop: "handlePermission", width: "120px" },
        { label: "复核权限", prop: "reviewPermission", width: "120px" },
        { label: "业务岗位", prop: "bizPosition", width: "120px" },
        { label: "参与分配标志", prop: "participateFlag", width: "150px" },
        { label: "柜员状态", prop: "status", width: "120px" },
        { label: "上次登录时间", prop: "lastLoginTime", width: "150px" },
        { label: "已分配任务数", prop: "assignedTaskCount", width: "150px" },
        { label: "上次任务提交时间", prop: "lastCommitTime", width: "150px" }
      ],
      tskusrtyp: "",
      formLabelWidth: "100px",
      dialogNam: {
        add: "柜员配置新增",
        edit: "柜员配置修改",
        info:"柜员配置详情"
      },
      dialogVisible: false,
       workRanks: [
        { label: "早班", value: "MS" },
        { label: "晚班", value: "NS" },
      ],
      bizPosition: [
        { label: "经办", value: "handler" },
        { label: "复核", value: "reviewer" },
        { label: "主管", value: "supervisor" }
      ],
       bizGroups: [
        { label: "进口组", value: "IM" },
        { label: "出口组", value: "EX" },
        { label: "汇款组", value: "CP" }
      ],
      bchtypList: [],
      relUsr:[],
      rules: {
        inr: [
					{
						validator: (rule, value, callback)=>{
							if(this.tskusrtyp=='add'&&!value){
								callback(new Error('必输项'));
							}else{
								callback();
							}
						},trigger:['blur','change']
					},
          { max: 16, message: "最大长度16个字符", trigger: "blur" }
        ],
        extkey: [
          {
						validator: (rule, value, callback)=>{
							if(this.tskusrtyp=='add'&&!value){
								callback(new Error('必输项'));
							}else{
								callback();
							}
						},trigger:['blur','change']
					},
          { max: 20, message: "最大长度20个字符", trigger: "blur" }
        ],
        name: [
          {
						validator: (rule, value, callback)=>{
							if(this.tskusrtyp=='add'&&!value){
								callback(new Error('必输项'));
							}else{
								callback();
							}
						},trigger:['blur','change']
					},
          { max: 20, message: "最大长度20个字符", trigger: "blur" }
        ],
        branchinr: [
          {
						validator: (rule, value, callback)=>{
							if(this.tskusrtyp=='add'&&!value){
								callback(new Error('必输项'));
							}else{
								callback();
							}
						},trigger:['blur','change']
					},
          { max: 16, message: "最大长度16个字符", trigger: "blur" }
        ],
        bizGroup: [
          {
            required: true,
            message: "必输项",
            type: "string",
            trigger: "blur"
          },
          { max: 20, message: "最大长度20个字符", trigger: "blur" }
        ],
        bizPosition: [
          {
            required: true,
            message: "必输项",
            type: "string",
            trigger: "blur"
          },
          { max: 20, message: "最大长度20个字符", trigger: "blur" }
        ],
        participateFlag: [
          { required: true, message: "必输项", trigger: "blur" },
          { max: 20, message: "最大长度20个字符", trigger: "blur" }
        ]
      }
    };
  },
  activated() {
    const { update } = this.$route.params;
    if (update) {
      this.onSearch();
    }
  },
  mounted() {
    this.getBranchList();
    this.getUsrListByBch();
    this.getReviewer('reviewer');
    this.getdbCode("bizgrp","","bizGrp");
    this.getdbCode("bizpst","","bizPst");
    this.getdbCode("usrsta","","usrSta");
    this.onSearch();
    
  },
  methods: {
    async queryExtkey (extkey) {
          let res = await Api.post("/public/taskdist/user/queryUser", { extkey: extkey });
          if (res.respCode == SUCCESS) {
            this.model.inr=res.data.inr;
            this.$set(this.model,'name',res.data.name);
          } else {
            this.$notify.error("输入工号不存在，请重新输入!");
          }
      },
      
      getNamAndBch(val){
         var obj={}
        obj= this.usrs.find(function(i){
          return i.extkey ===val
        });
        this.model.name = obj.nam
        this.model.branchinr = obj.bchinr
        this.model.inr = obj.inr
        console.log("obj:",obj)
      },
    handleChange (val) {
        var obj={}
        obj= this.bchtypList.find(function(i){
          return i.inr ===val
        });
        this.model.branchName=obj.bchname;
      },
       //页码修改回调
   handleSizeChange(val) {
     console.log('handleSizeChange:',val)
      this.queryFunc(1,val);
    },
    handleCurrentChange(val) {
     console.log('handleCurrentChange:',val)
      this.queryFunc(val,this.pagenation.pageSize);
		},
       //格式化列表显示
     flgFormat(flg){
			if(flg == 'Y'){
				return '参与';
			}else{
				return '不参与';
			}
			
		},
    // 查询
    async onSearch() {
			const loading = this.loading();
			let params = {
				branchinr: this.form.branchinr || null,
				bizGroup: this.form.bizGroup || null,
				extkey: this.form.extkey || null,
				pageNo: this.pagenation.pageNo || null,
				pageSize: this.pagenation.pageSize || null,
			}
      const res = await Api.post(
        "/public/taskdist/user/list",
        params
      );
      if (res.respCode == SUCCESS) {
				this.tskusrData = res.data.records;
				this.pagenation.pageNo = res.data.pageNo;
				this.pagenation.pageSize = res.data.pageSize;
				this.pagenation.total = res.data.total;

      }
      loading.close();
    },
    //获取码表
    async getdbCode(codeType, uil, codeNam) {
    let params = {
      codeType: codeType,
      uil: uil ? uil : 'EN'
    }
    let rtnmsg = await Api.post("/manager/dic/listDicInfo", params)
    if (rtnmsg.respCode === SUCCESS) {
      let curList = rtnmsg.data.map(item => ({
        value: item.codeValue,
        label: item.codeName
      }));
      this.dbCodes[codeNam] = curList
    }
  },
  //表格码表格式化
    getCodelabel(value,codenam) {
          const codeobj = this.dbCodes[codenam].find(obj => obj.value === value)
          return codeobj ? codeobj.label : value;
    },
		//回调
		queryFunc(currentPage,size){
			this.pagenation.pageNo = currentPage;
			this.pagenation.pageSize = size;
			this.onSearch()
		},
    // 重置
    handleReset() {
      this.form.branchinr = "";
      this.form.bizGroup = "";
      this.form.extkey = "";
    },
    //新增
    tskusrAdd() {
			this.model = {};
      this.tskpool = []
      this.dialogVisible = true;
      this.tskusrtyp = "add";
      this.getUsrList();
    },
    //弹出新增界面初始化柜员列表
    async getUsrList(){
     let rtnmsg = await Api.post('/public/taskdist/user/getUsrList');
     if(rtnmsg.respCode == SUCCESS){
      this.usrs = rtnmsg.data
     }
    },
    //获取经办权限任务池编号
    async getTskPool(){
      	let params = {
				branchinr: this.model.branchinr || null,
				grp: this.model.bizGroup || null,
			}
      let rtnmsg = await Api.post('/public/taskdist/pool/config/getTskpool',params);
      if(rtnmsg.respCode == SUCCESS){
        this.tskpool = rtnmsg.data
     }
        this.model.handlePermissions = []
        this.model.reviewPermissions = []
    },
     //查询条件初始化柜员列表
    async getUsrListByBch(){
      let params ={
        branch:JSON.parse(window.sessionStorage.currentOrg).departmentNumber
      }
     let rtnmsg = await Api.post('/public/taskdist/user/getUsrByBch',params);
     if(rtnmsg.respCode == SUCCESS){
      this.usrLst = rtnmsg.data
     }
    },
    async getEidtTskPool(row){
      	let params = {
				branchinr: row.branchinr || null,
				grp: row.bizGroup || null,
			}
      let rtnmsg = await Api.post('/public/taskdist/pool/config/getTskpool',params);
      if(rtnmsg.respCode == SUCCESS){
        this.tskpool = rtnmsg.data
     }
    },
    handleUpdate(e) {
      this.$forceUpdate();
    },
    // 修改
    tskusrEdit(row) {
      this.dialogVisible = true;
      this.tskusrtyp = "edit";
       this.model.inr = row.inr,
        this.model.extkey = row.extkey,
        this.model.name = row.name,
        this.model.branchinr = row.branchinr,
        this.model.workRank = row.workRank,
        this.model.bizGroup = row.bizGroup,
        this.model.bizPosition = row.bizPosition,
        this.model.participateFlag = row.participateFlag,
        this.model.designatedReviewer = row.designatedReviewer,
        this.model.branchName = row.branchName,
        this.model.status = row.status,
     this.model.handlePermissions = row.handlePermission.trim() ? row.handlePermission.split('-') : [];
     this.model.reviewPermissions = row.reviewPermission.trim() ? row.reviewPermission.split('-') : [];
    this.getEidtTskPool(row)
     
    },
     // 详情
    tskusrDetail(row) {
      this.dialogVisible = true;
      this.tskusrtyp = "info";
       this.model.inr = row.inr,
        this.model.extkey = row.extkey,
        this.model.name = row.name,
        this.model.branchinr = row.branchinr,
        this.model.workRank = row.workRank,
        this.model.bizGroup = row.bizGroup,
        this.model.bizPosition = row.bizPosition,
        this.model.participateFlag = row.participateFlag,
        this.model.designatedReviewer = row.designatedReviewer,
        this.model.branchName = row.branchName,
        this.model.status = row.status,
     this.model.handlePermissions = row.handlePermission.trim() ? row.handlePermission.split('-') : [];
     this.model.reviewPermissions = row.reviewPermission.trim() ? row.reviewPermission.split('-') : [];
     this.getEidtTskPool(row)
    },
    // 删除
    tskusrDelete(row) {
			console.log(row,'row')
      this.$confirm("是否确认删除?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(async () => {
          try {
            const res = await Api.post(
              "/public/taskdist/user/delete",
              { extkey: row.extkey }
            );
            if (res.respCode == SUCCESS) {
							this.$notify.success("删除成功！");
							this.onSearch();
						} else {
							this.$notify.error("删除失败！");
						}
          } catch (error) {
            console.log(error);
          }
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    // 取消
    handleReturn() {
      this.dialogVisible = false;
    },
    // 返回任务分配器页面
    goBack() {
      this.$router.history.push({
        path: "/business/tsk"
      });
    },
     //获取复核人员
   async getReviewer(position){
      let params = {
        bizPosition: position,
      }
     const res = await Api.post("/public/taskdist/user/getReviewer",params);
      if (res.respCode == SUCCESS) {
        this.relUsr = res.data
      }
    },
    // 新增表单提交
    commitAdd() {
      this.$refs.modelForm.validate(async (valid) => {
        if (valid) {
					try {
						const params = {
							...this.model
						};
						const res = await Api.post(
							"/public/taskdist/user/create",
							params
						);
						this.$notify.success("添加成功！");
						this.dialogVisible = false;
						this.onSearch();
					} catch (error) {
						console.log(error);
					}
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    // 修改表单提交
    commitEdit() {
      this.$refs.modelForm.validate(async (valid) => {
        if (valid) {
					try {
						const params = {
							...this.model
						};
						const res = await Api.post(
							"/public/taskdist/user/update",
							params
						);
						this.$notify.success("修改成功！");
						this.dialogVisible = false;
						this.onSearch();
					} catch (error) {
						console.log(error);
					}
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    // 机构ID
    async getBranchList() {
      const loading = this.loading();
      let res = await Api.post("/public/taskdist/config/getBranchList");
      if (res.respCode == SUCCESS) {
        this.bchtypList = res.data;
      }
      loading.close();
		},
  },
 
};
</script>

<style lang="less" scoped>
.dialog /deep/ .el-dialog {
  height: calc(100% - 230px);
}
</style>