Dscinsp.vue

<template>
    <div class="eibs-tab">
        <c-col :span="24">

        <c-col :span="12" style="padding-right: 20px">

            <!-- S0000312 : Discrepancies -->
            <c-col :span="24">
              <c-ptap-commons  :cols="50" :rows="70" :minRows="8" :maxRows="8" :model="model"
                      :extCodes="['btdgrp','blk']"
                      lastModel="docdis"
                      :disabledButton="model.btdgrp.blk.docdisflg===''"
                      title="Discrepancies">
              </c-ptap-commons>
            </c-col>

            <!-- S0000313 : Internal Discrepancies -->

            <c-col :span="24">
                <c-ptap-commons  :cols="65" :rows="20" :minRows="8" :maxRows="8" :model="model"
                           :extCodes="['btdgrp','blk']"
                           lastModel="intdis"
                           title="Internal Discrepancies">
                </c-ptap-commons>
            </c-col>
        </c-col>

            <!-- ==================右边================ -->
         <c-col :span="12" style="padding-left: 20px">

             <!-- S0000317 : Discrepancies modified -->
             <c-col :span="24">
                 <el-form-item class="checkbox-left">
                     <c-checkbox 
                        v-model="model.btdgrp.blk.docdisflg"
                        true-label="X"
                        false-label=""
                        @change="onDocdisflgChange"
                     >{{$t('Discrepancies modified')}}</c-checkbox>
                 </el-form-item>
             </c-col>

             <!-- S0000317 : Further Handling -->
             <c-col :span="24">
                 <el-form-item label="Further Handling" prop="bttp.futhndflg">
                     <c-select v-model="model.bttp.futhndflg" style="width:100%"
                               dbCode="FUTHND" :filterKey="['W','R']"
                     >
                     </c-select>
                 </el-form-item>
             </c-col>

             <!-- S0000316 : Document Set Status -->
             <c-col :span="24">
                 <el-form-item label="Document Set Status" prop="btdgrp.rec.docsta">
                     <c-select 
                     v-model="model.btdgrp.rec.docsta" 
                     maxlength="65"
                     dbCode="stadoc"
                     disabled
                     ></c-select>
                 </el-form-item>
             </c-col>

             <!-- S0000314 : Comments and Conclusions -->

            <c-col :span="24">
                <c-ptap-commons  :cols="65" :rows="10" :minRows="8" :maxRows="8" :model="model"
                           :extCodes="['btdgrp','blk']"
                           lastModel="comcon"
                           title="Comments and Conclusions">
                </c-ptap-commons>
            </c-col>

            <!-- S0000311 : Settlement instructions for this Document Set -->
            <c-col :span="24">
                <c-ptap-commons  :cols="65" :rows="20" :minRows="8" :maxRows="8" :model="model"
                            :extCodes="['btdgrp','blk']"
                            lastModel="setinsbt"
                            title="Settlement Instructions transaction field">
                </c-ptap-commons>
            </c-col>

            </c-col>

        </c-col>

        <!-- 弹窗 -->
		<el-dialog
			v-dialogDrag
			width="64%"
			:visible.sync="dialogTableVisible"
			:close-on-click-modal="false"
			:close-on-press-escape="false"
			:show-close="false"
            v-if="dialogTableVisible"
			:modal-append-to-body="false"
			:append-to-body="true"
		>
			<div slot="title" style="font-size: 16px;color: black;position: realtive;">
				{{ dialogTitle }}
				<!-- 关闭按钮 -->
				<div class="close-btn" @click="handleCloseDialogTable"><i class="el-icon-close"></i></div>
			</div>
			<div v-if="!tableLoading && tableList.length === 0">暂无数据</div>
			<div v-else style="width: 100%;height: 100%;">
				<el-table id='tableRef' height="calc(100% - 32px)" style="width: 100%;" v-loading="tableLoading" :data="tableList" @row-dblclick="selectButtxmselData" :before-close="beforeClose">
					<!-- <el-table-column v-for="(item,key) in tableColumn" :key="key" :prop="item.prop" :render-header="renderheader" :label="item.label">
					</el-table-column> -->
                    <el-table-column label="Name" prop="txt" align="left" min-width="150" sortable>
                    </el-table-column>
                    <el-table-column label="Module" prop="extkey" align="left" min-width="150" sortable>
                    </el-table-column>
                    <el-table-column label="Language" prop="uil" align="left" min-width="150" sortable>
                    </el-table-column>
				</el-table>
				<el-pagination
					class="eContainer-pagination"
					layout="prev, pager, next, jumper, ->, sizes, total"
					:page-sizes="pageSizes"
					:page-size="pageSize"
					:current-page="currentPage"
					:total="total"
					@size-change="sizeChange"
					@current-change="currentChange"
				></el-pagination>
			</div>
		</el-dialog>

  </div>
</template>
<script>
    import event from "../event";
export default {
    inject: ['root'],
    props:["model","codes"],
    mixins: [event],
    data(){
        return {
            doc1stBen: {
                columns: [
                    '1 1 "1st" ',
                    '2 2 "2nd" ',
                    '3 3 "Document" ',
                ],
                data: [],
            },
            doc2ndBen: {
                columns: [
                    '1 1 "1st" ',
                    '2 2 "2nd" ',
                    '3 3 "Document" ',
                ],
                data: [],
            },
            dialogTitle: "", // 弹框标题
            dialogTableVisible: false, // 控制弹框的展示和隐藏
            tableLoading: false,
            total: 0,
            isDisabled: false,
            currentPage: 1, // 页数
            pageSizes: [5, 10, 20, 30, 40, 50, 100],
            pageSize: 5, // 条数
            tableList: [],
        }
    },
    methods:{
        

        	// 表头 头部换行，以 / 作为换行标志
    renderheader(h, { column, $index }) {
      return h("span", {}, [
        h("span", {}, column.label.split("/")[0]),
        h("br"),
        h("span", {}, column.label.split("/")[1])
      ]);
    },
		// extkey输入框失焦
		handleExtkeyBlur (e) {
			let extkey = this.model[this.argadr.grp][this.argadr.rol].pts.extkey
			if (extkey && extkey !== this.markExtkey) {
				this.showPtapDialog()
			}
		},
		handleInput(){
			this.isChangeRef = true
		},
		sizeChange(num){
      this.pageSize = num;
      const value = this.model[this.argadr.grp][this.argadr.rol].pts.extkey;
			this.getTableData(value);
		},
    currentChange(num) {
      this.currentPage = num;
      const value = this.model[this.argadr.grp][this.argadr.rol].pts.extkey;
      this.getTableData(value);
    },

    // 关闭弹框
		handleCloseDialogTable () {
			this.dialogTableVisible = false;
			this.$nextTick(()=>{
				this.root.$refs['modelForm'].validateField([`${this.argadr.grp}.${this.argadr.rol}.pts.extkey`]);
			})
			let nam = this.model[this.argadr.grp][this.argadr.rol].pts.cnnam
			let adr = this.model[this.argadr.grp][this.argadr.rol].pts.cnadr
			if (nam && adr){
				this.model[this.argadr.grp][this.argadr.rol].pts.extkey = this.markExtkey
			}
        },
        
        beforeClose(done) {
            this.dialogTableVisible = false;
            this.currentPage = 1;
            done();
        },

    },
    created:function(){

    }
}
</script>
<style>

</style>