|
|
@@ -0,0 +1,2146 @@
|
|
|
+<template>
|
|
|
+ <div class="boxswai">
|
|
|
+ <div class="boxnei">
|
|
|
+ <el-row :gutter="0" style="height: 100%">
|
|
|
+ <el-col :span="showLeft ? 5 : 0" style="height: 99%">
|
|
|
+ <div style="fontsize: 18px; font-weight: 900" class="marbottom5">
|
|
|
+ 元素识别1
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div style="height: 98%; overflow: auto; width: auto">
|
|
|
+ <div class="flex">
|
|
|
+ <el-input
|
|
|
+ size="small"
|
|
|
+ placeholder="输入关键字搜索"
|
|
|
+ clearable
|
|
|
+ @clear="allTreeShow = false"
|
|
|
+ v-model="filterText"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ <el-button size="small" class="mg-l-10" @click="treeFilter"
|
|
|
+ >搜索</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-tree
|
|
|
+ :default-expanded-keys="expandedKeys"
|
|
|
+ :default-checked-keys="defaultcheckedkeys"
|
|
|
+ :data="treeData"
|
|
|
+ :props="treeProps"
|
|
|
+ @node-click="handleNodeClick"
|
|
|
+ :load="loadNode"
|
|
|
+ :expand-on-click-node="false"
|
|
|
+ lazy
|
|
|
+ v-show="!allTreeShow"
|
|
|
+ ></el-tree>
|
|
|
+
|
|
|
+ <el-tree
|
|
|
+ style="width: 100%"
|
|
|
+ ref="treeall"
|
|
|
+ v-loading="treeloading"
|
|
|
+ :data="allTreeData"
|
|
|
+ :props="treeProps"
|
|
|
+ @node-click="handleNodeClick"
|
|
|
+ node-key="id"
|
|
|
+ :expand-on-click-node="false"
|
|
|
+ :filter-node-method="filterNode"
|
|
|
+ v-show="allTreeShow"
|
|
|
+ >
|
|
|
+ </el-tree>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="showLeft ? 19 : 24" style="height: 98%; display: flex">
|
|
|
+ <div
|
|
|
+ class="flex flex-center"
|
|
|
+ style="width: 20px; height: 100%; cursor: pointer"
|
|
|
+ @click="showLeftChange"
|
|
|
+ >
|
|
|
+ <i v-if="showLeft" class="el-icon-d-arrow-left"></i>
|
|
|
+ <i v-else class="el-icon-d-arrow-right"></i>
|
|
|
+ </div>
|
|
|
+ <div class="flex1" style="padding-left: 10px">
|
|
|
+ <div v-if="addElementForm.nodeName == ''">表名称</div>
|
|
|
+ <div v-else>{{ addElementForm.nodeName }}</div>
|
|
|
+ <el-row class="martop20" :gutter="20" style="height: 96%">
|
|
|
+ <el-col
|
|
|
+ :span="showLeft ? 16 : 12"
|
|
|
+ style="
|
|
|
+ overflow: auto;
|
|
|
+ height: 100%;
|
|
|
+ border: 1px solid black;
|
|
|
+ border-radius: 4px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 10px 10px;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="parent"
|
|
|
+ id="parent"
|
|
|
+ @dblclick="dblBtnClick($event)"
|
|
|
+ @click="parentClick($event)"
|
|
|
+ ></div>
|
|
|
+ </el-col>
|
|
|
+ <el-col
|
|
|
+ :span="showLeft ? 8 : 12"
|
|
|
+ ref="tablescroll"
|
|
|
+ style="height: 100%"
|
|
|
+ :style="{ overflow: 'auto' }"
|
|
|
+ >
|
|
|
+ <div class="title-box">
|
|
|
+ <span style="color:rgb(233, 157, 66);font-weight: bold;" v-if="true">目前未关联元素表!</span>
|
|
|
+ <span style="font-weight: bold;" v-else>A15 检验申请批复单</span>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ size="mini"
|
|
|
+ @click="pushTableData()"
|
|
|
+ :disabled="from.id == ''"
|
|
|
+ >同步到项目</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <el-tabs type="border-card" v-model="editableTabsValue" @tab-click="editableTabhandleClick">
|
|
|
+ <el-tab-pane label="创建新的元素表" name="创建新的元素表">
|
|
|
+ <div class=" flexItemsC " style="justify-content: space-between;">
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ size="mini"
|
|
|
+ @click="pushTableData()"
|
|
|
+ :disabled="from.id == ''"
|
|
|
+ >新增元素</el-button
|
|
|
+ >
|
|
|
+ <div >
|
|
|
+ <el-button
|
|
|
+ type="success"
|
|
|
+ size="mini"
|
|
|
+ @click="establish()"
|
|
|
+ :disabled="from.id == ''"
|
|
|
+ >关联WBS并创建元素</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ type="success"
|
|
|
+ size="mini"
|
|
|
+ icon="el-icon-plus"
|
|
|
+ @click="addtoElement()"
|
|
|
+ :disabled="from.id == ''"
|
|
|
+ >添加到元素库</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="关联已有元素表" name="关联已有元素表">
|
|
|
+
|
|
|
+ <div class=" flexItemsC " style="justify-content: space-between;">
|
|
|
+ <el-select
|
|
|
+ v-model="excelopmodel"
|
|
|
+ placeholder="请选择元素表"
|
|
|
+ filterable size="mini"
|
|
|
+ remote
|
|
|
+ reserve-keyword
|
|
|
+ :remote-method="remoteMethod"
|
|
|
+ :loading="excelopmodelloading"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in exceloptions"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.title"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ size="mini"
|
|
|
+ icon="el-icon-plus"
|
|
|
+ :disabled="from.id == ''"
|
|
|
+ @click="pushTableData(1)"
|
|
|
+ >新增元素
|
|
|
+ </el-button >
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="修改元素信息" name="修改元素信息">
|
|
|
+ <div class=" flexItemsC " style="justify-content: right;">
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ size="mini"
|
|
|
+ icon="el-icon-plus"
|
|
|
+ :disabled="from.id == ''"
|
|
|
+ @click="pushTableData(1)"
|
|
|
+ >新增元素
|
|
|
+ </el-button >
|
|
|
+ <el-button
|
|
|
+ type="success"
|
|
|
+ size="mini"
|
|
|
+ :disabled="from.id == ''"
|
|
|
+ @click="confirmEdit()"
|
|
|
+ >确认修改
|
|
|
+ </el-button >
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="编辑HTML表单" name="编辑HTML表单">
|
|
|
+ <el-tabs v-model="htmlactiveName" @tab-click="htmlhandleClick">
|
|
|
+ <el-tab-pane label="编辑元素坐标" name="first">
|
|
|
+ <div>
|
|
|
+ <el-select
|
|
|
+ style="width:300px;"
|
|
|
+ v-model="value"
|
|
|
+ filterable
|
|
|
+ placeholder="请选择"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in options"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.eName"
|
|
|
+ :value="item.id"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <div class="tihuan">替换为：</div>
|
|
|
+ <el-input
|
|
|
+ style="width:95%;"
|
|
|
+ :disabled="true"
|
|
|
+ type="textarea"
|
|
|
+ :rows="4"
|
|
|
+ placeholder="请输入内容"
|
|
|
+ v-model="names"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ <div class="martop20">
|
|
|
+ <el-button
|
|
|
+ type="info"
|
|
|
+ @click="cancelReplace()"
|
|
|
+ >取消</el-button>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ :disabled="tag"
|
|
|
+ @click="saveReplace()"
|
|
|
+ >保存</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="设置输入框" name="second">
|
|
|
+ <setInputTPT
|
|
|
+ :pkeyId='pkeyId'
|
|
|
+ @cop='domss'
|
|
|
+ :htmlData="htmlData"
|
|
|
+ />
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="电签位置配置" name="third">
|
|
|
+ <electronicSignature :pkeyId1='pkeyId' :htmlData1="htmlData" />
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="编辑默认信息" name="fourth">
|
|
|
+ <editDefault :pkeyId1='pkeyId' :htmlData1="htmlData" />
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="设置提示消息" name="five">
|
|
|
+ <promptSettings :pkeyId1='pkeyId' :htmlData1="htmlData" />
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+
|
|
|
+ <div class="region" >
|
|
|
+
|
|
|
+ <el-table
|
|
|
+ class="martop20"
|
|
|
+ :data="tableData"
|
|
|
+ border
|
|
|
+ :row-class-name="tableRowClassName"
|
|
|
+ style="width: 100%" v-if="editableTabsValue==='创建新的元素表'||editableTabsValue==='修改元素信息'||editableTabsValue==='关联已有元素表'"
|
|
|
+ >
|
|
|
+ <el-table-column type="index" label="坐标">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="textInfo" label="元素名称">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-input
|
|
|
+ v-model="scope.row.textInfo"
|
|
|
+ placeholder="请输入内容"
|
|
|
+ ></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="textElementType" label="数据类型">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-select
|
|
|
+ v-model="scope.row.textElementType"
|
|
|
+ placeholder="请选择"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in dataType"
|
|
|
+ :key="item.dictKey"
|
|
|
+ :label="item.dictValue"
|
|
|
+ :value="item.dictKey"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="textDeviation" label="允许偏差值">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-input
|
|
|
+ v-model="scope.row.textDeviation"
|
|
|
+ placeholder="请输入内容"
|
|
|
+ ></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" width="100">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-link
|
|
|
+ style="margin-right: 16px"
|
|
|
+ type="success"
|
|
|
+ @click="saveELe(scope.row)"
|
|
|
+ >保存</el-link
|
|
|
+ >
|
|
|
+ <el-link
|
|
|
+ type="danger"
|
|
|
+ @click="deleteTableData(scope.$index)"
|
|
|
+ >删除</el-link
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <!-- <el-button
|
|
|
+ type="success"
|
|
|
+ class="martop20 dingwei"
|
|
|
+ @click="establish()"
|
|
|
+ :disabled="from.id==''"
|
|
|
+ >关联WBS并创建元素</el-button> -->
|
|
|
+
|
|
|
+ <el-dialog
|
|
|
+ title="编辑元素信息"
|
|
|
+ :visible.sync="editTitleDialog"
|
|
|
+ width="80%"
|
|
|
+ :modal-append-to-body="false"
|
|
|
+ :append-to-body="false"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <draggable v-model="titleList">
|
|
|
+ <div
|
|
|
+ v-for="(item, key) in titleList"
|
|
|
+ :key="key"
|
|
|
+ class="flexBetween flexItemsC title-item"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <span>{{ item }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="flexItemsC">
|
|
|
+ <i
|
|
|
+ @click="listUp(key)"
|
|
|
+ class="el-icon-top"
|
|
|
+ :style="{
|
|
|
+ 'font-size': '20px',
|
|
|
+ color: key == 0 ? '#aaa' : '#0A8CD5',
|
|
|
+ cursor: key != 0 ? 'pointer' : 'default',
|
|
|
+ }"
|
|
|
+ ></i>
|
|
|
+ <i
|
|
|
+ @click="listDown(key)"
|
|
|
+ class="el-icon-bottom marleft5"
|
|
|
+ :style="{
|
|
|
+ 'font-size': '20px',
|
|
|
+ color:
|
|
|
+ key == titleList.length - 1
|
|
|
+ ? '#aaa'
|
|
|
+ : '#0A8CD5',
|
|
|
+ cursor:
|
|
|
+ key != titleList.length - 1
|
|
|
+ ? 'pointer'
|
|
|
+ : 'default',
|
|
|
+ }"
|
|
|
+ ></i>
|
|
|
+ <i
|
|
|
+ @click="deleTitle(key)"
|
|
|
+ class="el-icon-circle-close marleft5"
|
|
|
+ :style="{
|
|
|
+ 'font-size': '20px',
|
|
|
+ color: '#ee7049',
|
|
|
+ cursor: 'pointer',
|
|
|
+ }"
|
|
|
+ ></i>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </draggable>
|
|
|
+ </div>
|
|
|
+ <div style="margin-top: 50px">
|
|
|
+ <div class="flex jc-sb mg-b-10">
|
|
|
+ <div class="flex jc-al-c">
|
|
|
+ <span style="margin-right: 10px">数据类型</span>
|
|
|
+ <el-select
|
|
|
+ v-model="titleForm.textElementType"
|
|
|
+ placeholder="请选择"
|
|
|
+ style="width: 130px"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in dataType"
|
|
|
+ :key="item.dictKey"
|
|
|
+ :label="item.dictValue"
|
|
|
+ :value="item.dictKey"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <span style="margin: 0 10px">允许偏差值</span>
|
|
|
+ <el-input
|
|
|
+ v-model="titleForm.textDeviation"
|
|
|
+ placeholder="请输入内容"
|
|
|
+ style="width: 150px"
|
|
|
+ ></el-input>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <el-button
|
|
|
+ size="medium"
|
|
|
+ type="primary"
|
|
|
+ @click="setTitleText"
|
|
|
+ >合成文本</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-input
|
|
|
+ type="textarea"
|
|
|
+ rows="5"
|
|
|
+ v-model="titleForm.textInfo"
|
|
|
+ ></el-input>
|
|
|
+ </div>
|
|
|
+ <el-alert
|
|
|
+ title="该输入框没有匹配到对应元素字段，确定修改将会新增一个元素字段"
|
|
|
+ v-if="titleIndex < 0"
|
|
|
+ type="warning"
|
|
|
+ :closable="false"
|
|
|
+ effect="dark"
|
|
|
+ style="margin-top: 10px"
|
|
|
+ >
|
|
|
+ </el-alert>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="editTitleDialog = false"
|
|
|
+ >取 消</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ v-throttle="2000"
|
|
|
+ @click="editTitle()"
|
|
|
+ >确定修改</el-button
|
|
|
+ >
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <el-dialog
|
|
|
+ title="添加新元素字段"
|
|
|
+ :visible.sync="addNewElementDialog"
|
|
|
+ :before-close="handleClose"
|
|
|
+ width="80%"
|
|
|
+ :modal-append-to-body="false"
|
|
|
+ :append-to-body="false"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <!-- <i
|
|
|
+ @click="addNewElement"
|
|
|
+ class="el-icon-circle-plus marbottom10"
|
|
|
+ style="color:red; font-size:24px; float: right;cursor: pointer;"
|
|
|
+ ></i> -->
|
|
|
+ <div>
|
|
|
+ <draggable v-model="titleList">
|
|
|
+ <div
|
|
|
+ v-for="(item, key) in titleList"
|
|
|
+ :key="key"
|
|
|
+ class="flexBetween flexItemsC title-item"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <span>{{ item }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="flexItemsC">
|
|
|
+ <i
|
|
|
+ @click="listUp(key)"
|
|
|
+ class="el-icon-top"
|
|
|
+ :style="{
|
|
|
+ 'font-size': '20px',
|
|
|
+ color: key == 0 ? '#aaa' : '#0A8CD5',
|
|
|
+ cursor: key != 0 ? 'pointer' : 'default',
|
|
|
+ }"
|
|
|
+ ></i>
|
|
|
+ <i
|
|
|
+ @click="listDown(key)"
|
|
|
+ class="el-icon-bottom marleft5"
|
|
|
+ :style="{
|
|
|
+ 'font-size': '20px',
|
|
|
+ color:
|
|
|
+ key == titleList.length - 1
|
|
|
+ ? '#aaa'
|
|
|
+ : '#0A8CD5',
|
|
|
+ cursor:
|
|
|
+ key != titleList.length - 1
|
|
|
+ ? 'pointer'
|
|
|
+ : 'default',
|
|
|
+ }"
|
|
|
+ ></i>
|
|
|
+ <i
|
|
|
+ @click="deleTitle(key)"
|
|
|
+ class="el-icon-circle-close marleft5"
|
|
|
+ :style="{
|
|
|
+ 'font-size': '20px',
|
|
|
+ color: '#ee7049',
|
|
|
+ cursor: 'pointer',
|
|
|
+ }"
|
|
|
+ ></i>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </draggable>
|
|
|
+ <div class="flex jc-sb mg-b-10">
|
|
|
+ <div class="flex jc-al-c"></div>
|
|
|
+ <div>
|
|
|
+ <el-button
|
|
|
+ size="medium"
|
|
|
+ type="primary"
|
|
|
+ @click="setTitleText"
|
|
|
+ >合成文本</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-table
|
|
|
+ :data="newElements"
|
|
|
+ height="250"
|
|
|
+ border
|
|
|
+ style="width: 100%"
|
|
|
+ >
|
|
|
+ <el-table-column label="元素名称">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-input
|
|
|
+ v-model="scope.row.textInfo"
|
|
|
+ placeholder="请输入内容"
|
|
|
+ ></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="textElementType"
|
|
|
+ label="数据类型"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-select
|
|
|
+ v-model="scope.row.textElementType"
|
|
|
+ placeholder="请选择"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in dataType"
|
|
|
+ :key="item.dictKey"
|
|
|
+ :label="item.dictValue"
|
|
|
+ :value="item.dictKey"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="textDeviation"
|
|
|
+ label="允许偏差值"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-input
|
|
|
+ v-model="scope.row.textDeviation"
|
|
|
+ placeholder="请输入内容"
|
|
|
+ ></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="date"
|
|
|
+ align="center"
|
|
|
+ width="120"
|
|
|
+ label="操作"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button
|
|
|
+ type="danger"
|
|
|
+ size="mini"
|
|
|
+ @click="deleteNewElement(scope.$index)"
|
|
|
+ >删除</el-button
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="handleClose()">取 消</el-button>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ v-throttle="2000"
|
|
|
+ :disabled="newElements.length === 0"
|
|
|
+ @click="addNewElementHandle()"
|
|
|
+ >确 定</el-button
|
|
|
+ >
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <!-- 关联公共WBS模板 -->
|
|
|
+ <el-dialog
|
|
|
+ title="关联公共WBS模板"
|
|
|
+ class="excelBox"
|
|
|
+ :visible.sync="AssociatedPublicTap"
|
|
|
+ modal-append-to-body
|
|
|
+ append-to-body
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ >
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-select
|
|
|
+ style="width: 100%"
|
|
|
+ v-model="GLExcelFrom.name"
|
|
|
+ placeholder="请选择"
|
|
|
+ @change="changetherr()"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(item, key) in GLExcelData"
|
|
|
+ :key="key"
|
|
|
+ :label="item.wbsName"
|
|
|
+ :value="item.id"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-scrollbar style="height: 50vh">
|
|
|
+ <div class="flex" style="margin-top: 10px" v-if="isShowInput">
|
|
|
+ <el-input
|
|
|
+ size="small"
|
|
|
+ placeholder="输入关键字搜索"
|
|
|
+ clearable
|
|
|
+ @clear="clearInput"
|
|
|
+ v-model="filterText1"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ <el-button size="small" class="mg-l-10" @click="treeFilter1"
|
|
|
+ >搜索</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <el-tree
|
|
|
+ v-if="GLExcelFromtag"
|
|
|
+ @node-click="handleNodeClickExcel"
|
|
|
+ ref="tree"
|
|
|
+ class="filter-tree"
|
|
|
+ style="margin-top: 10px"
|
|
|
+ :props="GLExcelProps"
|
|
|
+ :data="exceldata"
|
|
|
+ :load="loadNodeTan"
|
|
|
+ lazy
|
|
|
+ node-key="id"
|
|
|
+ accordion
|
|
|
+ :show-checkbox="activeName == 'add'"
|
|
|
+ :check-strictly="true"
|
|
|
+ :default--checked-keys="selectNodeIds"
|
|
|
+ >
|
|
|
+ </el-tree>
|
|
|
+
|
|
|
+ <el-tree
|
|
|
+ style="width: 100%"
|
|
|
+ ref="treeall1"
|
|
|
+ v-loading="treeloading1"
|
|
|
+ :data="allTreeData1"
|
|
|
+ :props="treeProps1"
|
|
|
+ @node-click="handleNodeClickExcel"
|
|
|
+ node-key="id"
|
|
|
+ :expand-on-click-node="false"
|
|
|
+ :filter-node-method="filterNode1"
|
|
|
+ v-show="GLExcelFromtag1"
|
|
|
+ :show-checkbox="activeName == 'add'"
|
|
|
+ :default--checked-keys="selectNodeIds"
|
|
|
+ >
|
|
|
+ </el-tree>
|
|
|
+ </el-scrollbar>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12" v-if="addElementForm.wbsId">
|
|
|
+ <el-tabs v-model="activeName" type="card">
|
|
|
+ <el-tab-pane label="关联元素表" name="link">
|
|
|
+ <el-table
|
|
|
+ :data="addTableData"
|
|
|
+ border
|
|
|
+ style="width: 100%"
|
|
|
+ class="martop20"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ prop="tableName"
|
|
|
+ label="已有元素表名称"
|
|
|
+ align="center"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="name" label="操作" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ size="mini"
|
|
|
+ style="margin: 0px"
|
|
|
+ @click="relationMD(scope.row, '关联')"
|
|
|
+ v-show="!scope.row.checknd"
|
|
|
+ :loading="scope.row.loading"
|
|
|
+ >选择关联</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ type="danger"
|
|
|
+ size="mini"
|
|
|
+ style="margin: 0px"
|
|
|
+ @click="relationMD(scope.row, '取消关联')"
|
|
|
+ v-show="scope.row.checknd"
|
|
|
+ :loading="scope.row.loading"
|
|
|
+ >取消关联</el-button
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="新增元素表" name="add">
|
|
|
+ <div>
|
|
|
+ <div class="flexBetween martop20">
|
|
|
+ <el-input
|
|
|
+ v-model="addElementForm.nodeName"
|
|
|
+ placeholder="请输入表名"
|
|
|
+ ></el-input>
|
|
|
+ <el-select
|
|
|
+ class="marleft10"
|
|
|
+ v-model="addElementForm.tableType"
|
|
|
+ placeholder="请选择表类型"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in exceltypeData"
|
|
|
+ :key="index"
|
|
|
+ :label="item.dictValue"
|
|
|
+ :value="item.dictKey"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <el-select
|
|
|
+ style="width: 100%"
|
|
|
+ class="martop20"
|
|
|
+ v-model="addElementForm.tableOwner"
|
|
|
+ placeholder="请选择所属方"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in ownerTypeList"
|
|
|
+ :key="index"
|
|
|
+ :label="item.dictValue"
|
|
|
+ :value="item.dictKey"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <span
|
|
|
+ slot="footer"
|
|
|
+ class="dialog-footer"
|
|
|
+ style="display: flex; justify-content: center; align-items: center"
|
|
|
+ >
|
|
|
+ <el-button @click="AssociatedPublicClose()">取 消</el-button>
|
|
|
+ <el-button
|
|
|
+ style="margin-left: 30px"
|
|
|
+ type="primary"
|
|
|
+ @click="saveElementMD()"
|
|
|
+ >确 定</el-button
|
|
|
+ >
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ <!-- 添加到元素库 -->
|
|
|
+ <el-dialog
|
|
|
+
|
|
|
+ title="保存元素表"
|
|
|
+ class="excelBox"
|
|
|
+ :visible.sync="eleDialog"
|
|
|
+ modal-append-to-body
|
|
|
+ append-to-body
|
|
|
+ :close-on-click-modal="false">
|
|
|
+ <div>
|
|
|
+ <div class="flexBetween martop20">
|
|
|
+ <el-input
|
|
|
+ v-model="eleForm.nodeName"
|
|
|
+ placeholder="请输入表名"
|
|
|
+ ></el-input>
|
|
|
+ <el-select
|
|
|
+ class="marleft10"
|
|
|
+ v-model="eleForm.tableType"
|
|
|
+ placeholder="请选择表类型"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in exceltypeData"
|
|
|
+ :key="index"
|
|
|
+ :label="item.dictValue"
|
|
|
+ :value="item.dictKey"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <el-select
|
|
|
+ style="width: 100%"
|
|
|
+ class="martop20"
|
|
|
+ v-model="eleForm.tableOwner"
|
|
|
+ placeholder="请选择所属方"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in ownerTypeList"
|
|
|
+ :key="index"
|
|
|
+ :label="item.dictValue"
|
|
|
+ :value="item.dictKey"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="eleDialog = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="submitEleDialog"
|
|
|
+ v-preventClick v-loading="elloading"
|
|
|
+ >确 定</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import {
|
|
|
+ tabLazytree,
|
|
|
+ getExcelHtmlCol,
|
|
|
+ excelType,
|
|
|
+ excelType1,
|
|
|
+ submitExcelRelationWbsTreeAndElement,
|
|
|
+ getWbsTypeList,
|
|
|
+ getLazytree,
|
|
|
+ cancelRelation,
|
|
|
+ saveRelation,
|
|
|
+ searchNodeTables,
|
|
|
+ tabLazytreeAll,
|
|
|
+ exctabcellSave,
|
|
|
+ exctabcellRemove,
|
|
|
+ exctabcellUpdate,
|
|
|
+} from "@/api/exctab/excelmodel";
|
|
|
+import { dictionarydataType } from "@/api/exctab/editelement";
|
|
|
+import { getColByTabId } from "@/api/manager/AdjustForm";
|
|
|
+import { selectByNodeTable, getAlltree } from "@/api/manager/wbstree";
|
|
|
+import { getDictionary } from "@/api/system/dict";
|
|
|
+import {tabTypeLazyTreeAll} from "@/api/manager/wbsprivate";
|
|
|
+import { getElementInfoByTabId,} from '@/api/exctab/editelement';
|
|
|
+import setInputTPT from './template/setInputTPT.vue'
|
|
|
+import electronicSignature from './template/electronicSignature.vue'
|
|
|
+import setFormula from './template/setFormula.vue'
|
|
|
+import editDefault from './template/editDefault.vue'
|
|
|
+import promptSettings from './template/promptSettings.vue'
|
|
|
+import Vue from "vue";
|
|
|
+import draggable from "vuedraggable";
|
|
|
+import { getExcelHtml } from '@/api/exctab/excelmodel'
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ //#region 左侧树节点
|
|
|
+ treeData: [],
|
|
|
+ expandedKeys:[],//默认展开的节点
|
|
|
+ defaultcheckedkeys:[],//默认选中
|
|
|
+ curNode:{},//当前选中的节点
|
|
|
+ elloading:false,//保存元素表按钮
|
|
|
+ excelId:'',
|
|
|
+ treeProps: {
|
|
|
+ label: "name",
|
|
|
+ children: "children",
|
|
|
+ isLeaf: "hasChildren",
|
|
|
+ },
|
|
|
+ treeProps1: {
|
|
|
+ label: "title",
|
|
|
+ children: "children",
|
|
|
+ isLeaf: "hasChildren",
|
|
|
+ },
|
|
|
+ //#endregion
|
|
|
+ excelSrc: "",
|
|
|
+ from: {
|
|
|
+ id: "",
|
|
|
+ },
|
|
|
+ tableData: [], //外层table
|
|
|
+ dataType: [],
|
|
|
+ filterText: "", //搜索关键字
|
|
|
+ filterText1: "",
|
|
|
+ allTreeShow: false, //是否显示整棵树
|
|
|
+ treeloading: false,
|
|
|
+ treeloading1: false,
|
|
|
+ AssociatedPublicTap: false,
|
|
|
+ //#region 弹框属性
|
|
|
+ GLExcelFrom: {
|
|
|
+ id: "",
|
|
|
+ name: "",
|
|
|
+ search: "", //搜素框舒服的值
|
|
|
+ },
|
|
|
+ GLExcelData: [], //
|
|
|
+ allTreeData: [],
|
|
|
+ allTreeData1: [],
|
|
|
+ GLExcelProps: {
|
|
|
+ label: "title",
|
|
|
+ children: "children",
|
|
|
+ isLeaf: function (data) {
|
|
|
+ if (data.hasChildren && data.isExistForm != 1) {
|
|
|
+ return false;
|
|
|
+ } else if (data.hasChildren && data.isExistForm == 1) {
|
|
|
+ return true;
|
|
|
+ } else {
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ isShowInput: false,
|
|
|
+ exceldata: [], //清表模板树数据
|
|
|
+ addTableData: [], //新增元素信息表
|
|
|
+ exceltypeData: [], //清表类型
|
|
|
+ addElement: false,
|
|
|
+ GLExcelFromtag: false,
|
|
|
+ GLExcelFromtag1: false,
|
|
|
+ addElementForm: {
|
|
|
+ id: "",
|
|
|
+ initTableName: "",
|
|
|
+ nodeName: "",
|
|
|
+ tableType: "",
|
|
|
+ tableOwner: "",
|
|
|
+ wbsId: "",
|
|
|
+ parentId: "",
|
|
|
+ },
|
|
|
+ //#endregion
|
|
|
+
|
|
|
+ ownerTypeList: [],
|
|
|
+
|
|
|
+ activeName: "link",
|
|
|
+
|
|
|
+ showLeft: true, //左侧树是否显示
|
|
|
+
|
|
|
+ addNewElementDialog: false, //新增元素弹窗
|
|
|
+ newElements: [],
|
|
|
+
|
|
|
+ editTitleDialog: false, //编辑标题弹窗
|
|
|
+ titleList: [], //标题拆分的列表
|
|
|
+ titleForm: {
|
|
|
+ exctabId: "",
|
|
|
+ id: "",
|
|
|
+ textInfo: "",
|
|
|
+ textElementType: "",
|
|
|
+ textDeviation: "",
|
|
|
+ },
|
|
|
+ titleIndex: -1,
|
|
|
+ selectedId: "",
|
|
|
+ nodeIds:[],
|
|
|
+ nodeIds1:[],
|
|
|
+ selectNodeIds:[],
|
|
|
+ eleDialog:false,//保存到元素库弹窗
|
|
|
+ eleForm:{
|
|
|
+ nodeName:'',
|
|
|
+ tableType:'',
|
|
|
+ tableOwner:""
|
|
|
+ },
|
|
|
+ excelopmodel:'',
|
|
|
+ excelopmodelloading:false,
|
|
|
+ editableTabsValue:'创建新的元素表',
|
|
|
+ optionList:[
|
|
|
+ ],
|
|
|
+ exceloptions:[],
|
|
|
+
|
|
|
+ htmlactiveName:'first',
|
|
|
+ eleData:[],
|
|
|
+ options:[],
|
|
|
+ htmlData: {
|
|
|
+ name: '',
|
|
|
+ tr: '',
|
|
|
+ td: ''
|
|
|
+ },
|
|
|
+ pkeyId:''
|
|
|
+
|
|
|
+ };
|
|
|
+ },
|
|
|
+ components: {
|
|
|
+ draggable,
|
|
|
+ setInputTPT,
|
|
|
+ electronicSignature,
|
|
|
+ setFormula,
|
|
|
+ editDefault,
|
|
|
+ promptSettings
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ watch: {
|
|
|
+ //设置保存后默认展开节点
|
|
|
+ // treeData: {
|
|
|
+ // handler () {
|
|
|
+ // this.expandedKeys.push(this.curNode.id);
|
|
|
+ // this.defaultcheckedkeys.push(this.curNode.id)
|
|
|
+ // this.getExcelHtmlCol(this.curNode.id);
|
|
|
+ // },
|
|
|
+ // deep: true
|
|
|
+ // },
|
|
|
+
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ //数组去重
|
|
|
+ uniqueArr(arr1, arr2) {
|
|
|
+ //合并两个数组
|
|
|
+ arr1.push(...arr2)//或者arr1 = [...arr1,...arr2]
|
|
|
+ //去重
|
|
|
+ let arr3 = Array.from(new Set(arr1))//let arr3 = [...new Set(arr1)]
|
|
|
+ return arr3
|
|
|
+ },
|
|
|
+ //搜索树
|
|
|
+ treeFilter() {
|
|
|
+ if (this.filterText) {
|
|
|
+ this.allTreeShow = true;
|
|
|
+ if (!this.allTreeData.length) {
|
|
|
+ this.treeloading = true;
|
|
|
+ tabLazytreeAll({
|
|
|
+ modeId: this.$route.params.id,
|
|
|
+ name: "",
|
|
|
+ }).then((res) => {
|
|
|
+ this.treeloading = false;
|
|
|
+ this.allTreeData = res.data.data;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ console.log("过滤");
|
|
|
+ this.$refs.treeall.filter(this.filterText);
|
|
|
+ });
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$refs.treeall.filter(this.filterText);
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.allTreeShow = false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ treeFilterAgin() {
|
|
|
+ this.allTreeShow = true;
|
|
|
+ if (!this.allTreeData.length) {
|
|
|
+ this.treeloading = true;
|
|
|
+ tabLazytreeAll({
|
|
|
+ modeId: this.$route.params.id,
|
|
|
+ name: "",
|
|
|
+ }).then((res) => {
|
|
|
+ this.treeloading = false;
|
|
|
+ this.allTreeData = res.data.data;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ console.log("过滤");
|
|
|
+ this.$refs.treeall.filter(this.filterText);
|
|
|
+ });
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$refs.treeall.filter(this.filterText);
|
|
|
+ }
|
|
|
+ } ,
|
|
|
+
|
|
|
+
|
|
|
+ clearInput() {
|
|
|
+
|
|
|
+ (this.selectedId = ""),
|
|
|
+ (this.GLExcelFromtag1 = false),
|
|
|
+ (this.GLExcelFromtag = true);
|
|
|
+ if( this.$refs.tree){
|
|
|
+ this.nodeIds = this.$refs.tree.getCheckedKeys();
|
|
|
+ }
|
|
|
+ if(this.$refs.treeall1){
|
|
|
+ this.nodeIds1 = this.$refs.treeall1.getCheckedKeys();
|
|
|
+ }
|
|
|
+ this.selectNodeIds=this.uniqueArr(this.nodeIds,this.nodeIds1 )
|
|
|
+ console.log(this.selectNodeIds,'this.selectNodeIds111111');
|
|
|
+ // this.$refs.tree.setCheckedKeys(this.selectNodeIds)
|
|
|
+
|
|
|
+ this.$nextTick(()=>{
|
|
|
+ this.$refs.tree.setCheckedKeys(this.selectNodeIds)
|
|
|
+ })
|
|
|
+
|
|
|
+ },
|
|
|
+ //搜索树1
|
|
|
+ treeFilter1() {
|
|
|
+ if (this.filterText1) {
|
|
|
+ if( this.$refs.tree){
|
|
|
+ this.nodeIds = this.$refs.tree.getCheckedKeys();
|
|
|
+ }
|
|
|
+ if(this.$refs.treeall1){
|
|
|
+ this.nodeIds1 = this.$refs.treeall1.getCheckedKeys();
|
|
|
+ }
|
|
|
+
|
|
|
+ this.selectNodeIds=this.uniqueArr(this.nodeIds,this.nodeIds1 )
|
|
|
+ this.$refs.treeall1.setCheckedKeys(this.selectNodeIds)
|
|
|
+ console.log(this.selectNodeIds,'this.selectNodeIds');
|
|
|
+ this.GLExcelFromtag1 = true;
|
|
|
+ this.GLExcelFromtag = false;
|
|
|
+ this.treeloading1 = true;
|
|
|
+ console.log(this.selectedId, "selectedId");
|
|
|
+ console.log(this.GLExcelFrom.name, "this.GLExcelFrom.name");
|
|
|
+ // tabLazytreeAll({
|
|
|
+ // modeId: this.GLExcelFrom.name,
|
|
|
+ // name: "",
|
|
|
+ // })
|
|
|
+ getAlltree("000000", 1, this.GLExcelFrom.name).then((res) => {
|
|
|
+ this.treeloading1 = false;
|
|
|
+ this.allTreeData1 = res.data.data;
|
|
|
+ console.log(this.exceldata, "this.exceldata");
|
|
|
+ console.log(this.GLExcelFromtag, "this.GLExcelFromtag");
|
|
|
+
|
|
|
+ this.$nextTick(() => {
|
|
|
+ console.log("过滤2", this.filterText1);
|
|
|
+ this.$refs.treeall1.filter(this.filterText1);
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ filterNode(value, data) {
|
|
|
+ if (!value) return true;
|
|
|
+ return data.name.indexOf(value) !== -1;
|
|
|
+ },
|
|
|
+ // filterNode1(value, data) {
|
|
|
+ // if (!value) return true;
|
|
|
+ // return data.title.indexOf(value) !== -1;
|
|
|
+ // },
|
|
|
+ getReturnNode(node,_array,value){
|
|
|
+ let isPass = node.data && node.data.title && node.data.title.indexOf(value) !== -1;
|
|
|
+ isPass?_array.push(isPass):'';
|
|
|
+ if(!isPass && node.level!=1 && node.parent){
|
|
|
+ this.getReturnNode(node.parent,_array,value);
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ filterNode1(value,data,node) {
|
|
|
+ if(!value){
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ let level = node.level;
|
|
|
+ let _array = [];//这里使用数组存储 只是为了存储值。
|
|
|
+ this.getReturnNode(node,_array,value);
|
|
|
+ let result = false;
|
|
|
+ _array.forEach((item)=>{
|
|
|
+ result = result || item;
|
|
|
+ });
|
|
|
+ return result;
|
|
|
+ },
|
|
|
+ //#region
|
|
|
+ handleNodeClick(data,node) {
|
|
|
+ //树节点点击事件
|
|
|
+ console.log(data,'树节点点击事件');
|
|
|
+ if (data.fileType == 3) {
|
|
|
+ this.getExcelHtmlCol(data.id); //获取excel模板
|
|
|
+ this.excelId=data.id//表格id
|
|
|
+ if (this.dataType.length == 0) {
|
|
|
+ this.dictionarydataType(); //数据类型字典
|
|
|
+ }
|
|
|
+ this.addElement = false;
|
|
|
+ this.addElementForm.nodeName = data.name;
|
|
|
+ this.eleForm.nodeName=data.name
|
|
|
+ if (data.tabType > 0 && data.tabType < 100) {
|
|
|
+ this.addElementForm.tableType = data.tabType + "";
|
|
|
+ this.eleForm.tableType= data.tabType + ""
|
|
|
+ } else {
|
|
|
+ this.addElementForm.tableType = "";
|
|
|
+ this.eleForm.tableType = "";
|
|
|
+ }
|
|
|
+ if (data.tableOwner > 0 && data.tableOwner < 100) {
|
|
|
+ this.eleForm.tableOwner= data.tableOwner + ""
|
|
|
+ } else {
|
|
|
+ this.eleForm.tableOwner = "";
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ this.from.id = data.id;
|
|
|
+ this.pkeyId=data.id;
|
|
|
+ this.curNode=node
|
|
|
+
|
|
|
+ this.tableData = [];
|
|
|
+
|
|
|
+ //触发自动识别按钮
|
|
|
+ this.automaticRecognition();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async loadNode(node, resolve) {
|
|
|
+ //懒加载获取节点
|
|
|
+ if (node.level === 0) {
|
|
|
+ return resolve(await this.tabLazytree(this.$route.params.id, 0));
|
|
|
+ }
|
|
|
+ if (node.level > 0) {
|
|
|
+ return resolve(
|
|
|
+ await this.tabLazytree(this.$route.params.id, node.data.id)
|
|
|
+ );
|
|
|
+ }
|
|
|
+ },
|
|
|
+ automaticRecognition() {
|
|
|
+ //自动识别按钮
|
|
|
+ this.getColByTabId();
|
|
|
+ },
|
|
|
+ pushTableData(isadd) {
|
|
|
+ //
|
|
|
+ // if (this.from.id) {
|
|
|
+ // this.tableData.unshift({
|
|
|
+ // eName: '',
|
|
|
+ // eType: 1,
|
|
|
+ // eAllowDeviation: ''
|
|
|
+ // })
|
|
|
+ // }
|
|
|
+
|
|
|
+ if (this.from.id) {
|
|
|
+ this.showLeft = false;
|
|
|
+ this.addNewElementDialog = true;
|
|
|
+ this.titleList = [];
|
|
|
+ }
|
|
|
+ if(isadd===1){
|
|
|
+ this.editableTabsValue='创建新的元素表'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //确认修改
|
|
|
+ confirmEdit(){
|
|
|
+ console.log('确认修改');
|
|
|
+ },
|
|
|
+ deleteTableData(key) {
|
|
|
+ //删除
|
|
|
+ exctabcellRemove(this.tableData[key].id).then(() => {
|
|
|
+ this.tableData.splice(key, 1);
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "删除成功!",
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ async getColByTabId() {
|
|
|
+ //获取字段信息
|
|
|
+ const { data: res } = await getColByTabId({ tabId: this.from.id });
|
|
|
+ console.log(res);
|
|
|
+ if (res.code === 200) {
|
|
|
+ res.data.forEach((element) => {
|
|
|
+ //element.eName = element.textInfo;
|
|
|
+ if (element.textElementType < 1) {
|
|
|
+ element.textElementType = 1;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.tableData = res.data;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getInformation (name, tr, td) {//鼠标点击事件
|
|
|
+ console.log('getInformation');
|
|
|
+ let tdEle = null;
|
|
|
+ //获取TD元素
|
|
|
+ if(event.target.nodeName == "TD"){
|
|
|
+ tdEle = event.target
|
|
|
+ }else{
|
|
|
+ tdEle = this.getParentTD(event.target);
|
|
|
+ }
|
|
|
+ let moreObj = {};
|
|
|
+ if(tdEle){
|
|
|
+ moreObj = this.getWidget(tdEle);
|
|
|
+ }
|
|
|
+
|
|
|
+ this.htmlData = Object.assign({
|
|
|
+ name,
|
|
|
+ tr,
|
|
|
+ td
|
|
|
+ },moreObj)
|
|
|
+ },
|
|
|
+
|
|
|
+ async getExcelHtmlCol(id) {
|
|
|
+ //获取excel模板
|
|
|
+ const { data: res } = await getExcelHtmlCol({ id });
|
|
|
+ console.log(res);
|
|
|
+
|
|
|
+ if (res.code == 200) {
|
|
|
+ let _that = this
|
|
|
+ localStorage.setItem('excelHtml', res.data)
|
|
|
+ var MyComponent = await Vue.extend({
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ formData: {},
|
|
|
+ };
|
|
|
+ },
|
|
|
+
|
|
|
+ template: res.data,
|
|
|
+ methods: {
|
|
|
+ getInformation (name, tr, td) {//鼠标右键事件
|
|
|
+ _that.getInformation(name, tr, td)
|
|
|
+ },
|
|
|
+ formUploadSuccess(){},
|
|
|
+ formUploadExceed(){},
|
|
|
+ formUploadLoading(){},
|
|
|
+ delTableFormFile(){},
|
|
|
+ formUploadError(){},
|
|
|
+ uploadprogress(){},
|
|
|
+ getRegularExpression(){},
|
|
|
+ formRemoteMethod(){},
|
|
|
+ checkboxGroupChange(){},
|
|
|
+ formRemoteChange(){}
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ });
|
|
|
+ var component = new MyComponent().$mount();
|
|
|
+ let na = document.getElementById("parent");
|
|
|
+ na.innerHTML = `<div
|
|
|
+ class='parent'
|
|
|
+ id='parent'"
|
|
|
+ ></div>`;
|
|
|
+ document.getElementById("parent").appendChild(component.$el);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //#endregion
|
|
|
+ async copss () {
|
|
|
+ let _that = this
|
|
|
+ var MyComponent = await Vue.extend({
|
|
|
+ template: localStorage.getItem('excelHtml'),
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ formData: {},
|
|
|
+ getTokenHeader: {},
|
|
|
+ dap_site_data:{}
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getInformation (name, tr, td) {//鼠标右键事件
|
|
|
+ _that.getInformation(name, tr, td)
|
|
|
+ },
|
|
|
+ formUploadSuccess(){},
|
|
|
+ formUploadExceed(){},
|
|
|
+ formUploadLoading(){},
|
|
|
+ delTableFormFile(){},
|
|
|
+ formUploadError(){},
|
|
|
+ uploadprogress(){},
|
|
|
+ getRegularExpression(){},
|
|
|
+ formRemoteMethod(){},
|
|
|
+ checkboxGroupChange(){},
|
|
|
+ formRemoteChange(){}
|
|
|
+ }
|
|
|
+ })
|
|
|
+ var component = new MyComponent().$mount()
|
|
|
+ let na = document.getElementById('parent')
|
|
|
+ na.innerHTML = `<div
|
|
|
+ class='parent'
|
|
|
+ id='parent'
|
|
|
+ ></div>`
|
|
|
+ document.getElementById('parent').appendChild(component.$el);
|
|
|
+ },
|
|
|
+ domss () {
|
|
|
+ this.copss()
|
|
|
+ },
|
|
|
+ //#region 关联公共WBS模板弹框
|
|
|
+ establish() {
|
|
|
+ //关联WBS并创建元素
|
|
|
+ if (this.tableData.length == 0) {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: "至少有一条元素才能创建元素表",
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ let arr = [];
|
|
|
+ this.tableData.forEach((element, index) => {
|
|
|
+ if (element.eName == "") {
|
|
|
+ arr.push(index + 1);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ if (arr.length > 0) {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: arr.join(",") + "条的元素名称未填写",
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ this.getWbsTypeList();
|
|
|
+
|
|
|
+ this.AssociatedPublicTap = true;
|
|
|
+ //清除数据
|
|
|
+ this.filterText1 = "";
|
|
|
+ this.exceldata = [];
|
|
|
+ this.allTreeData1 = [];
|
|
|
+ this.selectedId = "";
|
|
|
+ this.GLExcelFrom.name = "";
|
|
|
+ this.isShowInput = false;
|
|
|
+
|
|
|
+ //清理之前填写的数据
|
|
|
+ this.addElementForm.wbsId = "";
|
|
|
+ this.addElementForm.tableOwner = "";
|
|
|
+
|
|
|
+ if (this.$refs.tree) {
|
|
|
+ this.$refs.tree.setCheckedKeys([]);
|
|
|
+ this.$refs.tree.setCurrentKey(null);
|
|
|
+ }
|
|
|
+
|
|
|
+ this.addTableData = [];
|
|
|
+ },
|
|
|
+ addtoElement(){
|
|
|
+ this.eleDialog=true;
|
|
|
+ this.eleForm.tableOwner=''
|
|
|
+ this.elloading=false
|
|
|
+
|
|
|
+ },
|
|
|
+ submitEleDialog(){
|
|
|
+ console.log('确定');
|
|
|
+ if (
|
|
|
+ this.eleForm.nodeName &&
|
|
|
+ this.eleForm.tableType &&
|
|
|
+ this.eleForm.tableOwner
|
|
|
+ ) {
|
|
|
+ this.elloading=true
|
|
|
+ this.submitExcelRelationWbsTreeAndElement({
|
|
|
+ nodeName: this.eleForm.nodeName,
|
|
|
+ tableType: this.eleForm.tableType,
|
|
|
+ tableOwner: this.eleForm.tableOwner,
|
|
|
+ elementList: this.tableData,
|
|
|
+ excelTabId: this.from.id,
|
|
|
+ submitStatus: 3,
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: "请填写和选择新增的表名，表类型，表所属方",
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ // this.allTreeData=[]//清空搜索树数据
|
|
|
+
|
|
|
+
|
|
|
+ // this.eleForm={}
|
|
|
+ },
|
|
|
+ AssociatedPublicClose() {
|
|
|
+ console.log("AssociatedPublicClose");
|
|
|
+ //清理之前填写的数据
|
|
|
+ this.addElementForm.wbsId = "";
|
|
|
+ // this.addElementForm.tableType = '';
|
|
|
+ this.addElementForm.tableOwner = "";
|
|
|
+
|
|
|
+ if (this.$refs.tree) {
|
|
|
+ this.$refs.tree.setCheckedKeys([]);
|
|
|
+ this.$refs.tree.setCurrentKey(null);
|
|
|
+ }
|
|
|
+
|
|
|
+ this.addTableData = [];
|
|
|
+ this.AssociatedPublicTap = false;
|
|
|
+ },
|
|
|
+ async loadNodeTan(node, resolve) {
|
|
|
+ //懒加载
|
|
|
+ console.log(node);
|
|
|
+ this.selectedId = node.data.id;
|
|
|
+ if (node.level === 0) {
|
|
|
+ return resolve(await this.getLazytree(0));
|
|
|
+ } else {
|
|
|
+ return resolve(await this.getLazytree(node.data.id));
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ changetherr(item) {
|
|
|
+ console.log(item, "item");
|
|
|
+ console.log(this.GLExcelFrom.name, "name");
|
|
|
+ //下拉框change事件
|
|
|
+ this.GLExcelFromtag = false;
|
|
|
+ this.GLExcelFromtag1 = false;
|
|
|
+ this.filterText1 = "";
|
|
|
+ if (this.GLExcelFrom.name != "") {
|
|
|
+ this.GLExcelFrom.search = "";
|
|
|
+ this.exceldata = [];
|
|
|
+ this.addTableData = [];
|
|
|
+ this.isShowInput = false;
|
|
|
+ this.addElementForm.wbsId = "";
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.GLExcelFromtag = true;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ addElementMD() {
|
|
|
+ //新增元素信息表按钮
|
|
|
+ this.excelType();
|
|
|
+ this.addElement = true;
|
|
|
+ },
|
|
|
+ async getWbsTypeList() {
|
|
|
+ //获取清表模板信息
|
|
|
+ const { data: res } = await getWbsTypeList({ wbstype: 1 });
|
|
|
+
|
|
|
+ if (res.code === 200 && res.msg === "操作成功") {
|
|
|
+ this.GLExcelData = res.data;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async getLazytree(parentId) {
|
|
|
+ //清表树信息
|
|
|
+ const { data: res } = await getLazytree({
|
|
|
+ parentId: parentId,
|
|
|
+ wbsId: this.GLExcelFrom.name,
|
|
|
+ wbsType: "1",
|
|
|
+ });
|
|
|
+ console.log(res);
|
|
|
+ if (res.code === 200 && res.msg === "操作成功") {
|
|
|
+ this.isShowInput = true;
|
|
|
+ console.log(this.isShowInput, " this.isShowInput");
|
|
|
+ res.data.forEach((val) => {
|
|
|
+ val.isExistForm = !!val.isExistForm;
|
|
|
+ });
|
|
|
+ return res.data;
|
|
|
+ } else {
|
|
|
+ return [];
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleNodeClickExcel(data) {
|
|
|
+ //点击节点事件
|
|
|
+ this.addElementForm.wbsId = this.GLExcelFrom.name;
|
|
|
+ this.addElementForm.parentId = data.id;
|
|
|
+ //this.selectByNodeTable(data.id)
|
|
|
+ this.searchNodeTables(data.id);
|
|
|
+ },
|
|
|
+ async selectByNodeTable(id) {
|
|
|
+ //获取清表信息
|
|
|
+ const { data: res } = await selectByNodeTable(id);
|
|
|
+ console.log(res);
|
|
|
+ if (res.code == 200) {
|
|
|
+ if (res.data.length > 0) {
|
|
|
+ res.data.forEach((val) => {
|
|
|
+ if (val.isLinkTable == 2) {
|
|
|
+ val.checknd = true;
|
|
|
+ } else {
|
|
|
+ val.checknd = false;
|
|
|
+ }
|
|
|
+ val.loading = false;
|
|
|
+ });
|
|
|
+ this.addTableData = res.data;
|
|
|
+ } else {
|
|
|
+ this.addTableData = [];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ //查看节点下已关联的元素表信息
|
|
|
+ searchNodeTables(id) {
|
|
|
+ searchNodeTables(id, this.from.id).then((res) => {
|
|
|
+ if (res.data.data.length > 0) {
|
|
|
+ res.data.data.forEach((val) => {
|
|
|
+ if (val.isLinkTable == 2) {
|
|
|
+ val.checknd = true;
|
|
|
+ } else {
|
|
|
+ val.checknd = false;
|
|
|
+ }
|
|
|
+ val.loading = false;
|
|
|
+ });
|
|
|
+ this.addTableData = res.data.data;
|
|
|
+ } else {
|
|
|
+ this.addTableData = [];
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ async excelType() {
|
|
|
+ //清表类型
|
|
|
+ // const { data: res } = await excelType({ code: "sys_excltab_type" });
|
|
|
+ const { data: res } = await excelType1({ code: "table_type" });
|
|
|
+ console.log(res,'清表类型');
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.exceltypeData = res.data;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ relationMD(row, type) {
|
|
|
+ //关联取消关联
|
|
|
+ row.loading = true;
|
|
|
+ if (type == "关联") {
|
|
|
+ saveRelation(row.id, this.from.id, this.tableData)
|
|
|
+ .then(() => {
|
|
|
+ row.checknd = true;
|
|
|
+ row.isLinkTable = 2;
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ row.loading = false;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ cancelRelation({
|
|
|
+ id: row.id,
|
|
|
+ excelTabId: this.from.id,
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ row.checknd = false;
|
|
|
+ row.isLinkTable = 1;
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ row.loading = false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ saveElementMD() {
|
|
|
+ //保存按钮
|
|
|
+ if (this.addElementForm.wbsId) {
|
|
|
+ if (this.activeName == "link") {
|
|
|
+ this.submitExcelRelationWbsTreeAndElement({
|
|
|
+ excelTabId: this.from.id,
|
|
|
+ elementList: this.tableData,
|
|
|
+ submitStatus: 1,
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ if (
|
|
|
+ this.addElementForm.nodeName &&
|
|
|
+ this.addElementForm.tableType &&
|
|
|
+ this.addElementForm.tableOwner
|
|
|
+ ) {
|
|
|
+ // let nodeIds = this.$refs.tree.getCheckedKeys();
|
|
|
+ // let nodeIds1 = this.$refs.treeall1.getCheckedKeys();
|
|
|
+ // console.log(nodeIds,'nodeIds');
|
|
|
+ // console.log(nodeIds1,'nodeIds1');
|
|
|
+ if( this.$refs.tree){
|
|
|
+ this.nodeIds = this.$refs.tree.getCheckedKeys();
|
|
|
+ }
|
|
|
+ if(this.$refs.treeall1){
|
|
|
+ this.nodeIds1 = this.$refs.treeall1.getCheckedKeys();
|
|
|
+ }
|
|
|
+
|
|
|
+ this.selectNodeIds=this.uniqueArr(this.nodeIds,this.nodeIds1 )
|
|
|
+ console.log(this.selectNodeIds,'去重的数组');
|
|
|
+
|
|
|
+ if (this.selectNodeIds.length < 1) {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: "至少勾选一个节点",
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ this.submitExcelRelationWbsTreeAndElement({
|
|
|
+ nodeName: this.addElementForm.nodeName,
|
|
|
+ tableType: this.addElementForm.tableType,
|
|
|
+ tableOwner: this.addElementForm.tableOwner,
|
|
|
+ wbsId: this.addElementForm.wbsId,
|
|
|
+ elementList: this.tableData,
|
|
|
+ nodeIds: this.selectNodeIds,
|
|
|
+ excelTabId: this.from.id,
|
|
|
+ submitStatus: 2,
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: "请填写和选择新增的表名，表类型，表所属方",
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: "请先选择WBS树节点表单",
|
|
|
+ });
|
|
|
+ }
|
|
|
+ this.activeName="link"
|
|
|
+ },
|
|
|
+ async submitExcelRelationWbsTreeAndElement(da) {
|
|
|
+ //保存接口
|
|
|
+ da.elementList.forEach((ele) => {
|
|
|
+ ele.eName = ele.textInfo;
|
|
|
+ ele.eType = ele.textElementType;
|
|
|
+ ele.eAllowDeviation = ele.textDeviation;
|
|
|
+ });
|
|
|
+ const { data: res } = await submitExcelRelationWbsTreeAndElement(da);
|
|
|
+ console.log(res);
|
|
|
+ this.elloading=false
|
|
|
+ if (res.code == 200) {
|
|
|
+ // this.refreshNodeBy()//刷新树形控件数据
|
|
|
+
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "设置成功",
|
|
|
+ });
|
|
|
+ this.AssociatedPublicTap = false;
|
|
|
+ this.AssociatedPublicClose();
|
|
|
+ this.eleDialog=false;
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //#endregion
|
|
|
+ // tree局部刷新
|
|
|
+ refreshNodeBy(){
|
|
|
+ console.log('刷新');
|
|
|
+ console.log(this.curNode,'this.curNode.id');
|
|
|
+ this.curNode.loaded = false;
|
|
|
+ // this.curNode.expand(); // 主动调用展开节点方法，重新查询该节点下的所有子节点
|
|
|
+ if(this.allTreeShow){
|
|
|
+ console.log('搜索树');
|
|
|
+ this.treeFilterAgin()
|
|
|
+ }else{
|
|
|
+ if (this.curNode.level === 0) {
|
|
|
+ tabLazytree({modeId:this.$route.params.id,parentId:0}).then((res)=>{
|
|
|
+ if(res.code==200){
|
|
|
+ if (res.data.length > 0) {
|
|
|
+ res.data.forEach((val) => {
|
|
|
+ val.hasChildren = !val.hasChildren;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ this.treeData=res.data
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ if (this.curNode.level > 0) {
|
|
|
+ tabLazytree({modeId:this.$route.params.id,parentId:this.curNode.data.parentId}).then((res)=>{
|
|
|
+ if(res.code==200){
|
|
|
+ if (res.data.length > 0) {
|
|
|
+ res.data.forEach((val) => {
|
|
|
+ val.hasChildren = !val.hasChildren;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ this.treeData=res.data
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+ //#region 接口
|
|
|
+ async tabLazytree(modeId, parentId) {
|
|
|
+ const { data: res } = await tabLazytree({ modeId, parentId });
|
|
|
+ console.log(res);
|
|
|
+ if (res.code == 200) {
|
|
|
+ if (res.data.length > 0) {
|
|
|
+ res.data.forEach((val) => {
|
|
|
+ val.hasChildren = !val.hasChildren;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ return res.data;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async dictionarydataType() {
|
|
|
+ //数据类型字典
|
|
|
+ const { data: res } = await dictionarydataType();
|
|
|
+ console.log(res);
|
|
|
+ if (res.code == 200) {
|
|
|
+ res.data.forEach((element) => {
|
|
|
+ element.dictKey = Number(element.dictKey);
|
|
|
+ });
|
|
|
+ this.dataType = res.data;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //#endregion
|
|
|
+
|
|
|
+ getOwnerTypelist() {
|
|
|
+ if (this.ownerTypeList.length > 1) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ getDictionary({
|
|
|
+ code: "owner_type",
|
|
|
+ }).then((res) => {
|
|
|
+ res.data.data.forEach((element) => {
|
|
|
+ element.dictKey = Number(element.dictKey);
|
|
|
+ });
|
|
|
+ this.ownerTypeList = res.data.data;
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ //修改树显示状态
|
|
|
+ showLeftChange() {
|
|
|
+ this.showLeft = !this.showLeft;
|
|
|
+ },
|
|
|
+
|
|
|
+ handleClose() {
|
|
|
+ this.newElements = [];
|
|
|
+ this.addNewElementDialog = false;
|
|
|
+ this.activeName='link'
|
|
|
+ },
|
|
|
+
|
|
|
+ addNewElement() {
|
|
|
+ this.newElements.push({
|
|
|
+ exctabId: this.from.id,
|
|
|
+ textInfo: "",
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ deleteNewElement(index) {
|
|
|
+ this.newElements.splice(index, 1);
|
|
|
+ },
|
|
|
+
|
|
|
+ addNewElementHandle() {
|
|
|
+ exctabcellSave(this.newElements).then(() => {
|
|
|
+ this.handleClose();
|
|
|
+ //触发自动识别按钮
|
|
|
+ this.automaticRecognition();
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "保存成功!",
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ listUp(index) {
|
|
|
+ if (index != 0) {
|
|
|
+ this.titleList[index] = this.titleList.splice(
|
|
|
+ index - 1,
|
|
|
+ 1,
|
|
|
+ this.titleList[index]
|
|
|
+ )[0];
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ listDown(index) {
|
|
|
+ if (index != this.titleList.length - 1) {
|
|
|
+ this.titleList[index] = this.titleList.splice(
|
|
|
+ index + 1,
|
|
|
+ 1,
|
|
|
+ this.titleList[index]
|
|
|
+ )[0];
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ deleTitle(index) {
|
|
|
+ this.titleList.splice(index, 1);
|
|
|
+ },
|
|
|
+
|
|
|
+ setTitleText() {
|
|
|
+ if (this.addNewElementDialog) {
|
|
|
+ this.newElements.push({
|
|
|
+ exctabId: this.from.id,
|
|
|
+ textInfo: this.titleList.join("_"),
|
|
|
+ });
|
|
|
+ this.titleList = [];
|
|
|
+ } else {
|
|
|
+ this.titleForm.textInfo = this.titleList.join("_");
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ editTitle() {
|
|
|
+ if (this.titleIndex < 0) {
|
|
|
+ //新增
|
|
|
+ exctabcellSave([
|
|
|
+ {
|
|
|
+ exctabId: this.from.id,
|
|
|
+ textInfo: this.titleForm.textInfo,
|
|
|
+ textElementType: this.titleForm.textElementType,
|
|
|
+ textDeviation: this.titleForm.textDeviation,
|
|
|
+ },
|
|
|
+ ]).then(() => {
|
|
|
+ this.editTitleDialog = false;
|
|
|
+ //触发自动识别按钮
|
|
|
+ this.automaticRecognition();
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "新增成功!",
|
|
|
+ });
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ //修改
|
|
|
+ exctabcellUpdate(this.titleForm).then(() => {
|
|
|
+ this.tableData[this.titleIndex].textInfo = this.titleForm.textInfo;
|
|
|
+ //this.tableData[this.titleIndex].eName = this.titleForm.textInfo;
|
|
|
+ this.tableData[this.titleIndex].textElementType =
|
|
|
+ this.titleForm.textElementType;
|
|
|
+ this.tableData[this.titleIndex].textDeviation =
|
|
|
+ this.titleForm.textDeviation;
|
|
|
+
|
|
|
+ //console.log(this.$refs.tablescroll)
|
|
|
+ this.$refs.tablescroll.$el.scrollTop = 120 + this.titleIndex * 65;
|
|
|
+ this.editTitleDialog = false;
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "保存成功!",
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ dblBtnClick(e) {
|
|
|
+ //console.log(e)
|
|
|
+ let target = e.target;
|
|
|
+ //console.log(target.getAttribute('trindex'))
|
|
|
+ if (
|
|
|
+ target.getAttribute("trindex") !== null &&
|
|
|
+ target.getAttribute("tdindex")
|
|
|
+ ) {
|
|
|
+ this.titleIndex = -1;
|
|
|
+ this.titleList = [];
|
|
|
+ this.$refs.tablescroll.$el.scrollTop = 0;
|
|
|
+ this.editTitleDialog = true;
|
|
|
+ this.showLeft = false;
|
|
|
+ let trtd =
|
|
|
+ target.getAttribute("trindex") + "_" + target.getAttribute("tdindex");
|
|
|
+ for (let i = 0; i < this.tableData.length; i++) {
|
|
|
+ let arr = this.tableData[i].xys.split(",");
|
|
|
+ if (arr.indexOf(trtd) > -1) {
|
|
|
+ this.titleIndex = i;
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (this.titleIndex > -1) {
|
|
|
+ this.titleForm.textInfo = this.tableData[this.titleIndex].textInfo;
|
|
|
+ this.titleForm.textElementType =
|
|
|
+ this.tableData[this.titleIndex].textElementType;
|
|
|
+ this.titleForm.textDeviation =
|
|
|
+ this.tableData[this.titleIndex].textDeviation;
|
|
|
+ this.titleForm.exctabId = this.tableData[this.titleIndex].exctabId;
|
|
|
+ this.titleForm.id = this.tableData[this.titleIndex].id;
|
|
|
+ }
|
|
|
+
|
|
|
+ // let tdEle = this.getParentTD(target);
|
|
|
+ // if(tdEle){
|
|
|
+ // this.$refs.tablescroll.$el.scrollTop = 0;
|
|
|
+ // this.editTitleDialog = true;
|
|
|
+ // this.titleForm.textInfo = tdEle.getAttribute('title');
|
|
|
+ // //console.log(title)
|
|
|
+ // this.titleList = this.titleForm.textInfo.split('_');
|
|
|
+ // let trtd = target.getAttribute('trindex')+"_"+target.getAttribute('tdindex');
|
|
|
+ // for (let i = 0; i < this.tableData.length; i++) {
|
|
|
+ // if(this.tableData[i].xys.indexOf(trtd) > -1){
|
|
|
+ // this.titleIndex = i;
|
|
|
+ // break;
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ } else if (target.innerHTML && target.nodeName === "TD") {
|
|
|
+ this.titleList.push(target.innerHTML);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //获取控件信息
|
|
|
+ getWidget(tdEle){
|
|
|
+ let checkLabels = tdEle.querySelectorAll('.el-checkbox-group span.el-checkbox__label');
|
|
|
+ //console.log(checkLabels)
|
|
|
+ if(checkLabels.length > 0){
|
|
|
+ let checkLabelDatas = [];
|
|
|
+ for (let i = 0; i < checkLabels.length; i++) {
|
|
|
+ //console.dir(checkLabels[i])
|
|
|
+ checkLabelDatas.push({
|
|
|
+ dictValue:checkLabels[i].innerText
|
|
|
+ });
|
|
|
+ }
|
|
|
+ return {
|
|
|
+ type:'checkbox',
|
|
|
+ checkLabelDatas
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ let radioLabels = tdEle.querySelectorAll('.el-radio .el-radio__label');
|
|
|
+ if(radioLabels.length > 0){
|
|
|
+ let radioDatas = [];
|
|
|
+ for (let i = 0; i < radioLabels.length; i++) {
|
|
|
+ radioDatas.push({
|
|
|
+ dictValue:radioLabels[i].innerText
|
|
|
+ });
|
|
|
+ }
|
|
|
+ return {
|
|
|
+ type:'radio',
|
|
|
+ radioDatas
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ let elSelect = tdEle.querySelectorAll('.el-select');
|
|
|
+ //console.dir(elSelect[0])
|
|
|
+ if(elSelect.length){
|
|
|
+ let options = elSelect[0].__vue__.options;
|
|
|
+ let selectDatas = [];
|
|
|
+ for (let i = 0; i < options.length; i++) {
|
|
|
+ selectDatas.push({
|
|
|
+ dictValue:options[i].label
|
|
|
+ });
|
|
|
+ }
|
|
|
+ return {
|
|
|
+ type:'select',
|
|
|
+ selectDatas
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ return {};
|
|
|
+ },
|
|
|
+ //excel父节点点击检测
|
|
|
+ parentClick(e) {
|
|
|
+ console.log('父节点检测',e);
|
|
|
+ let target = e.target;
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ let bgs = document.querySelectorAll("#parent .oldlace-bg");
|
|
|
+ //console.log(bgs)
|
|
|
+ for (let i = 0; i < bgs.length; i++) {
|
|
|
+ bgs[i].classList.remove("oldlace-bg");
|
|
|
+ }
|
|
|
+ //console.log(target.getAttribute('trindex'))
|
|
|
+ if (
|
|
|
+ target.getAttribute("trindex") !== null &&
|
|
|
+ target.getAttribute("tdindex")
|
|
|
+ ) {
|
|
|
+ let tdEle = this.getParentTD(target);
|
|
|
+ if (tdEle) {
|
|
|
+ target.classList.add("oldlace-bg");
|
|
|
+
|
|
|
+ let trtd =
|
|
|
+ target.getAttribute("trindex") +
|
|
|
+ "_" +
|
|
|
+ target.getAttribute("tdindex");
|
|
|
+ console.log(trtd,'trtd');
|
|
|
+ for (let i = 0; i < this.tableData.length; i++) {
|
|
|
+ let arr = this.tableData[i].xys.split(",");
|
|
|
+ if (arr.indexOf(trtd) > -1) {
|
|
|
+ this.titleIndex = i;
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ //this.$refs.tablescroll.$el.scrollTop = 120+this.titleIndex*65;
|
|
|
+ //console.log(this.$refs.tablescroll.$el.scrollTop)
|
|
|
+ this.$nextTick(() => {
|
|
|
+ let row = document.querySelectorAll(".warning-row");
|
|
|
+ if (row.length) {
|
|
|
+ this.$refs.tablescroll.$el.scrollTop = row[0].offsetTop;
|
|
|
+ }
|
|
|
+ //console.dir(row[0])
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ getParentTD(ele) {
|
|
|
+ let targetParent = ele.parentNode;
|
|
|
+ while (targetParent.nodeName !== "TD") {
|
|
|
+ if (targetParent.id == "parent") {
|
|
|
+ return null;
|
|
|
+ }
|
|
|
+ targetParent = targetParent.parentNode;
|
|
|
+ }
|
|
|
+ return targetParent;
|
|
|
+ },
|
|
|
+
|
|
|
+ tableRowClassName({ rowIndex }) {
|
|
|
+ if (rowIndex === this.titleIndex) {
|
|
|
+ return "warning-row";
|
|
|
+ }
|
|
|
+ return "";
|
|
|
+ },
|
|
|
+
|
|
|
+ //保存单条元素
|
|
|
+ saveELe(row) {
|
|
|
+ if (row.textInfo) {
|
|
|
+ exctabcellUpdate(row).then(() => {
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "保存成功!",
|
|
|
+ });
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: "请填写元素名称",
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async tabTypeLazyTreeAll (titleName ) {//清表树
|
|
|
+ const { data: res } = await tabTypeLazyTreeAll({parentId: '',current:1,size:10000,titleName} )
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.optionList=res.data['records']
|
|
|
+ this.exceloptions=res.data['records']
|
|
|
+ console.log( this.optionList,' this.optionList');
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ remoteMethod(query) {
|
|
|
+ if (query !== '') {
|
|
|
+ this.loading = true;
|
|
|
+ setTimeout(() => {
|
|
|
+ this.loading = false;
|
|
|
+ this.exceloptions = this.optionList.filter(item => {
|
|
|
+ return item.title.toLowerCase()
|
|
|
+ .indexOf(query.toLowerCase()) > -1;
|
|
|
+ });
|
|
|
+ }, 200);
|
|
|
+ } else {
|
|
|
+ this.options = [];
|
|
|
+ }
|
|
|
+ },
|
|
|
+ htmlhandleClick(){
|
|
|
+ console.log('编辑元素表单');
|
|
|
+ },
|
|
|
+ async getElementInfoByTabId () {//获取字段信息
|
|
|
+ const { data: res } = await getElementInfoByTabId({ tabId: this.from.id })
|
|
|
+ console.log(res);
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.options = res.data
|
|
|
+ }
|
|
|
+ },
|
|
|
+ editableTabhandleClick(tab, event){
|
|
|
+
|
|
|
+ if(tab.name==='编辑HTML表单'){
|
|
|
+ this.getElementInfoByTabId()
|
|
|
+ }else if(tab.name==='关联已有元素表'){
|
|
|
+ this.tabTypeLazyTreeAll()
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getOwnerTypelist();
|
|
|
+ this.excelType();
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+ mounted(){
|
|
|
+
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.boxswai {
|
|
|
+ padding: 0px 14px 10px 14px !important;
|
|
|
+}
|
|
|
+.dingwei {
|
|
|
+ position: fixed;
|
|
|
+ bottom: 40px;
|
|
|
+ right: 40px;
|
|
|
+}
|
|
|
+//树结构超长后产生滚动条
|
|
|
+.el-tree > .el-tree-node {
|
|
|
+ min-width: 100%;
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+
|
|
|
+.boxswai {
|
|
|
+ height: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.title-item {
|
|
|
+ box-sizing: border-box;
|
|
|
+ width: 100%;
|
|
|
+ font-size: 16px;
|
|
|
+ height: 30px;
|
|
|
+ padding: 3px 20px;
|
|
|
+ background-color: #f3f3f3;
|
|
|
+ color: #ee7049;
|
|
|
+ margin-bottom: 6px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-table .warning-row {
|
|
|
+ background: oldlace;
|
|
|
+}
|
|
|
+
|
|
|
+.region {
|
|
|
+ position: relative;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.region /deep/ .el-dialog__wrapper {
|
|
|
+ position: absolute !important;
|
|
|
+}
|
|
|
+.region /deep/ .v-modal {
|
|
|
+ position: absolute !important;
|
|
|
+}
|
|
|
+
|
|
|
+#parent /deep/ .oldlace-bg {
|
|
|
+ background-color: oldlace;
|
|
|
+}
|
|
|
+</style>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+.parent .el-input .el-input__inner {
|
|
|
+ -webkit-appearance: none;
|
|
|
+ background-color: #fff;
|
|
|
+ background-image: none;
|
|
|
+ border-radius: 4px;
|
|
|
+ border: 1px solid #dcdfe6;
|
|
|
+ -webkit-box-sizing: border-box;
|
|
|
+ box-sizing: border-box;
|
|
|
+ color: #606266;
|
|
|
+ display: inline-block;
|
|
|
+ font-size: inherit;
|
|
|
+ height: inherit;
|
|
|
+ line-height: 40px;
|
|
|
+ outline: 0;
|
|
|
+ padding: 0 15px;
|
|
|
+ -webkit-transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
|
+ transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+.title-box{
|
|
|
+ background-color: #F5F7FA;
|
|
|
+ border-bottom: 1px solid #E4E7ED;
|
|
|
+ margin: 0;
|
|
|
+ height: 35px;
|
|
|
+ line-height: 35px;
|
|
|
+ font-size: 14px;
|
|
|
+ padding: 0 10px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+</style>
|
duy