|
@@ -1,140 +1,145 @@
|
|
|
<template>
|
|
|
- <basic-container class="editElement">
|
|
|
- <div class="header">
|
|
|
- 提示:鼠标右键功能:更换匹配元素字段、新增元素字段、删除匹配元素字段、公式配置       红色:代表匹配不成功、蓝色代表推荐匹配元素字段、绿色代表匹配成功
|
|
|
- </div>
|
|
|
- <el-row
|
|
|
- :gutter="20"
|
|
|
- class="martop20"
|
|
|
- >
|
|
|
- <el-col :span="16">
|
|
|
- <div
|
|
|
- class='parent'
|
|
|
- id='parent'
|
|
|
- >
|
|
|
- </div>
|
|
|
-
|
|
|
- </el-col>
|
|
|
- <el-col
|
|
|
- :span="8"
|
|
|
- v-show="AddNewElementField == '替换元素'"
|
|
|
+ <div
|
|
|
+ style="height:100%;"
|
|
|
+ ref="heights"
|
|
|
+ >
|
|
|
+ <basic-container class="editElement">
|
|
|
+ <div
|
|
|
+ class="header"
|
|
|
+ style="padding-bottom:20px;"
|
|
|
>
|
|
|
- <el-select
|
|
|
- style="width:400px;"
|
|
|
- v-model="value"
|
|
|
- filterable
|
|
|
- placeholder="请选择"
|
|
|
+ 提示:鼠标右键功能:更换匹配元素字段、新增元素字段、删除匹配元素字段、公式配置       红色:代表匹配不成功、蓝色代表推荐匹配元素字段、绿色代表匹配成功
|
|
|
+ </div>
|
|
|
+ <el-row
|
|
|
+ :gutter="20"
|
|
|
+ :style="{height:heights-150+'px',}"
|
|
|
+ >
|
|
|
+ <el-col :span="16">
|
|
|
+ <div
|
|
|
+ class='parent'
|
|
|
+ id='parent'
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </el-col>
|
|
|
+ <el-col
|
|
|
+ :span="8"
|
|
|
+ v-show="AddNewElementField == '替换元素'"
|
|
|
>
|
|
|
- <el-option
|
|
|
- v-for="item in options"
|
|
|
- :key="item.id"
|
|
|
- :label="item.eName"
|
|
|
- :value="item.id"
|
|
|
+ <el-select
|
|
|
+ style="width:400px;"
|
|
|
+ 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
|
|
|
+ :disabled="true"
|
|
|
+ type="textarea"
|
|
|
+ :rows="4"
|
|
|
+ placeholder="请输入内容"
|
|
|
+ v-model="value"
|
|
|
>
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- <div class="tihuan">替换为:</div>
|
|
|
- <el-input
|
|
|
- :disabled="true"
|
|
|
- type="textarea"
|
|
|
- :rows="4"
|
|
|
- placeholder="请输入内容"
|
|
|
- v-model="value"
|
|
|
+ </el-input>
|
|
|
+ <div class="martop20">
|
|
|
+ <el-button
|
|
|
+ type="info"
|
|
|
+ @click="cancelReplace()"
|
|
|
+ >取消</el-button>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ :disabled="tag"
|
|
|
+ @click="saveReplace()"
|
|
|
+ >保存</el-button>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col
|
|
|
+ :span="8"
|
|
|
+ v-show="AddNewElementField == ''"
|
|
|
>
|
|
|
- </el-input>
|
|
|
- <div class="martop20">
|
|
|
- <el-button
|
|
|
- type="info"
|
|
|
- @click="cancelReplace()"
|
|
|
- >取消</el-button>
|
|
|
- <el-button
|
|
|
- type="primary"
|
|
|
- :disabled="tag"
|
|
|
- @click="saveReplace()"
|
|
|
- >保存</el-button>
|
|
|
- </div>
|
|
|
- </el-col>
|
|
|
- <el-col
|
|
|
- :span="8"
|
|
|
- v-show="AddNewElementField == ''"
|
|
|
+ <div style="position: absolute;bottom: 0px;right:0px;">
|
|
|
+ <el-button
|
|
|
+ type="info"
|
|
|
+ @click="returns()"
|
|
|
+ >返回</el-button>
|
|
|
+ <el-button type="primary">保存</el-button>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <!-- 弹框 -->
|
|
|
+ <div
|
|
|
+ @mouseout="mouseout22"
|
|
|
+ @mousemove="mousemove22"
|
|
|
+ v-if="cascaderPanel"
|
|
|
>
|
|
|
- <div
|
|
|
- class="flexEnd"
|
|
|
- style="margin-top:120%;"
|
|
|
- >
|
|
|
- <el-button
|
|
|
- type="info"
|
|
|
- @click="returns()"
|
|
|
- >返回</el-button>
|
|
|
- <el-button type="primary">保存</el-button>
|
|
|
- </div>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- <!-- 弹框 -->
|
|
|
- <div
|
|
|
- @mouseout="mouseout22"
|
|
|
- @mousemove="mousemove22"
|
|
|
- v-if="cascaderPanel"
|
|
|
- >
|
|
|
- <el-cascader-panel
|
|
|
- :style="{width:'360px',position: 'absolute',top:top+'px',left:left+'px','background-color':'#fff',margin:'40px',}"
|
|
|
- :props="{ expandTrigger: 'hover' }"
|
|
|
- :options="options2"
|
|
|
- @change="takuangchangge"
|
|
|
- ></el-cascader-panel>
|
|
|
- </div>
|
|
|
+ <el-cascader-panel
|
|
|
+ :style="{width:'360px',position: 'absolute',top:top+'px',left:left+'px','background-color':'#fff',margin:'40px',}"
|
|
|
+ :props="{ expandTrigger: 'hover' }"
|
|
|
+ :options="options2"
|
|
|
+ @change="takuangchangge"
|
|
|
+ ></el-cascader-panel>
|
|
|
+ </div>
|
|
|
|
|
|
- <el-dialog
|
|
|
- title="添加新元素字段"
|
|
|
- :visible="AddNewElementField=='新增元素'"
|
|
|
- width="60%"
|
|
|
- :before-close="handleClose"
|
|
|
- :modal-append-to-body="false"
|
|
|
- style="z-index: 999999;"
|
|
|
- >
|
|
|
- <div>
|
|
|
- <i
|
|
|
- @click="addyuansu"
|
|
|
- class="el-icon-circle-plus marbottom10"
|
|
|
- style="color:red; font-size:24px; float: right;cursor: pointer;"
|
|
|
- ></i>
|
|
|
- <el-table
|
|
|
- :data="tableData"
|
|
|
- height="250"
|
|
|
- border
|
|
|
- style="width: 100%"
|
|
|
- >
|
|
|
- <el-table-column
|
|
|
- prop="date"
|
|
|
- label="清表元素名称"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-input
|
|
|
- v-model="scope.row.eName"
|
|
|
- placeholder="请输入内容"
|
|
|
- ></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="date"
|
|
|
- label="元素数据类型"
|
|
|
+ <el-dialog
|
|
|
+ title="添加新元素字段"
|
|
|
+ :visible="AddNewElementField=='新增元素'"
|
|
|
+ width="60%"
|
|
|
+ :before-close="handleClose"
|
|
|
+ :modal-append-to-body="false"
|
|
|
+ style="z-index: 999999;"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <i
|
|
|
+ @click="addyuansu"
|
|
|
+ class="el-icon-circle-plus marbottom10"
|
|
|
+ style="color:red; font-size:24px; float: right;cursor: pointer;"
|
|
|
+ ></i>
|
|
|
+ <el-table
|
|
|
+ :data="tableData"
|
|
|
+ height="250"
|
|
|
+ border
|
|
|
+ style="width: 100%"
|
|
|
>
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-select
|
|
|
- v-model="scope.row.eType"
|
|
|
- placeholder="请选择"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="item in dataType"
|
|
|
- :key="item.dictKey"
|
|
|
- :label="item.dictValue"
|
|
|
- :value="item.dictKey"
|
|
|
+ <el-table-column
|
|
|
+ prop="date"
|
|
|
+ label="清表元素名称"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-input
|
|
|
+ v-model="scope.row.eName"
|
|
|
+ placeholder="请输入内容"
|
|
|
+ ></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="date"
|
|
|
+ label="元素数据类型"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-select
|
|
|
+ v-model="scope.row.eType"
|
|
|
+ placeholder="请选择"
|
|
|
>
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <!-- <el-table-column
|
|
|
+ <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="date"
|
|
|
label="长度"
|
|
|
align="center"
|
|
@@ -146,35 +151,36 @@
|
|
|
></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="deleteziduan(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"
|
|
|
- :disabled="tableData.length===0"
|
|
|
- @click="pushNewElementField()"
|
|
|
- >确 定</el-button>
|
|
|
- </span>
|
|
|
- </el-dialog>
|
|
|
- </basic-container>
|
|
|
+ <el-table-column
|
|
|
+ prop="date"
|
|
|
+ align="center"
|
|
|
+ width="120"
|
|
|
+ label="操作"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button
|
|
|
+ type="danger"
|
|
|
+ size="mini"
|
|
|
+ @click="deleteziduan(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"
|
|
|
+ :disabled="tableData.length===0"
|
|
|
+ @click="pushNewElementField()"
|
|
|
+ >确 定</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </basic-container>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
@@ -184,9 +190,7 @@ import Vue from 'vue'
|
|
|
export default {
|
|
|
data () {
|
|
|
return {
|
|
|
- formData: {
|
|
|
-
|
|
|
- },
|
|
|
+ heights: '',
|
|
|
dataType: [],//数据类型
|
|
|
tag: false,
|
|
|
table: {
|
|
@@ -221,6 +225,7 @@ export default {
|
|
|
},
|
|
|
mounted () {
|
|
|
this.cop()
|
|
|
+ this.heights = this.$refs.heights.clientHeight
|
|
|
},
|
|
|
created () {
|
|
|
this.getElementInfoByTabId()
|
|
@@ -311,7 +316,7 @@ export default {
|
|
|
}
|
|
|
})
|
|
|
var component = new MyComponent().$mount()
|
|
|
- console.log(component.$el);
|
|
|
+
|
|
|
document.getElementById('parent').appendChild(component.$el);
|
|
|
},
|
|
|
async copss () {
|
|
@@ -480,7 +485,7 @@ export default {
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
.editElement {
|
|
|
- padding-bottom: 40px !important;
|
|
|
+ // padding-bottom: 40px !important;
|
|
|
.header {
|
|
|
color: rgb(240, 114, 10);
|
|
|
}
|