From a47e724d0d6ba3222e82b6a9ef955aa9b069d159 Mon Sep 17 00:00:00 2001
From: ludc
Date: 星期二, 05 十二月 2023 21:18:52 +0800
Subject: [PATCH] 代码提交
---
Source/UBCS-WEB/src/views/integration/integrationIndex.vue | 303 ++++++++++++++++++++++++++++++++------------------
1 files changed, 192 insertions(+), 111 deletions(-)
diff --git a/Source/UBCS-WEB/src/views/integration/integrationIndex.vue b/Source/UBCS-WEB/src/views/integration/integrationIndex.vue
index 9e65713..c7cff47 100644
--- a/Source/UBCS-WEB/src/views/integration/integrationIndex.vue
+++ b/Source/UBCS-WEB/src/views/integration/integrationIndex.vue
@@ -16,7 +16,7 @@
<el-card>
<el-form :model="form">
<el-form-item label="闆嗗洟鍒嗙被" label-width="70px" size="small">
- <el-select clearable ref="selectTree" v-model="form.groupValue" placeholder="璇烽�夋嫨"
+ <el-select clearable ref="selectTree" v-model="groupVal" placeholder="璇烽�夋嫨"
popper-class="popperTreeSelect">
<el-option :value="groupVal" :label="groupVal">
<el-tree ref="groupTree" :data="groupTreeData" empty-text="鏆傛棤鏁版嵁" :props="defaultProps"
@@ -29,65 +29,46 @@
</el-form>
<el-card>
<avue-crud :table-loading="loading" :data="mappingData" :option="optionMapping" ref="crudMapping"
- @row-update="handleUpdate" @row-click="handleMapingRowClick">
+ @row-update="handleMapingUpdate" @row-click="handleMapingClick"
+ @row-dblclick="handleMapingRowClick" @selection-change="selectionChange" @select="setCurrentRow"
+ @select-all="handleSelectAll">
<template slot="menuLeft">
- <el-button icon="el-icon-plus" size="small" type="primary" @click="dialogPush = true">鏂� 澧�
+ <el-button icon="el-icon-plus" size="small" type="primary" :disabled="disabledPush"
+ @click="dialogPush = true">鏂� 澧�
</el-button>
<el-button icon="el-icon-check" size="small" type="primary" @click="handleSave">淇� 瀛�
</el-button>
- <el-button icon="el-icon-connection" size="small" type="primary" @click="handleSync">鍚屾妯″瀷
+ <el-button icon="el-icon-connection" size="small" type="primary"
+ @click="handleSync('all')">鍚屾涓绘ā鍨�
+ </el-button>
+ <el-button icon="el-icon-connection" size="small" type="primary"
+ @click="handleSync('one')">鍚屾璇︾粏妯″瀷
</el-button>
</template>
</avue-crud>
</el-card>
- <el-card :style="{ marginTop: '20px' }">
- <avue-crud :data="rangeData" :option="optinoRange" ref="crudRange" @row-update="handleUpdate"
+ <el-card :style="{ marginTop: '20px'}">
+ <avue-crud :style="{ marginTop: '-20px'}" :data="rangeData" :option="optinoRange" ref="crudRange" @row-update="handleUpdate"
@row-dblclick="handleRowClick">
</avue-crud>
</el-card>
</el-card>
</el-main>
</el-container>
- <el-dialog title="缂栫爜灞炴��" :visible.sync="dialogPush" append-to-body="true" destroy-on-close width="30%"
- :before-close="handleClose">
- <el-form :model="form">
- <el-form-item label="鏌ヨ鏉′欢" label-width="70px" size="small">
- <el-input v-model="form.name" autocomplete="off" @change="handleQuery"></el-input>
- </el-form-item>
- </el-form>
- <p class="text_tip">*閫夋嫨鍒嗙被杩涜灞炴�ц繃婊�, 鎴栬�呰緭鍏ュ睘鎬х殑鍏ㄦ嫾鎴栬�呯畝鎷艰繘琛屾煡璇�! 濡�: 濮撳悕 (鍙緭鍏m鎴杧inming )</p>
- <transfer v-model="transferValue" :data="transferData" :filter-method="filterMethod"
- filter-placeholder="璇疯緭鍏ユ嫾闊冲叏鎷兼垨鑰呮嫾闊崇缉鍐�" @left-check-change="handelLeftCheck"></transfer>
- <span slot="footer" class="dialog-footer">
- <el-button @click="dialogPush = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="dialogPush = false">淇� 瀛�</el-button>
- </span>
- </el-dialog>
+ <integration-transfer :visible.sync="dialogPush" :data="transferData" :disabledData="filtermapping"
+ :props="transferProps" @save="handelTransferSave"></integration-transfer>
</div>
</template>
<script>
-import transfer from '@/components/transfer/index'
+import integrationTransfer from './integrationTransfer.vue'
import pinyin from 'js-pinyin'
import { referCodeClassifyTree, referTree, gridAttrMapping, gridAttrRanges, batchAddSave, listCodeAttributeByClassId, syncClassifyModel } from '@/api/integration/integration.js'
export default {
components: {
- transfer
+ integrationTransfer
},
+ name: 'Integration',
data() {
- const generateData = () => {
- pinyin.setOptions({ checkPolyphone: false, charCase: 1 });
- const data = [];
- const cities = ['涓婃捣', '鍖椾含', '骞垮窞', '娣卞湷', '鍗椾含', '瑗垮畨', '鎴愰兘'];
- cities.forEach((city, index) => {
- data.push({
- label: city,
- key: index,
- pinyin: pinyin.getFullChars(city),
- pinyins: pinyin.getCamelChars(city),
- });
- });
- return data;
- };
const options = {
menu: false,
delBtn: false,
@@ -101,25 +82,31 @@
cellBtn: true,
border: true,
searchMenuSpan: 8,
+ highlightCurrentRow: true,
}
return {
+ // 琛ㄥ崟鍊�
form: {
- name: '',
+ // 闆嗗洟鏍戞樉绀哄��
groupValue: ''
},
+ // 妫�娴嬫柊澧炴寜閽姸鎬�
+ disabledPush: true,
+ // 琛ㄦ牸鍔犺浇涓�
loading: false,
- ishowTree: false,
- search: '',
- transferData: generateData(),
- transferValue: [],
+ // 绌挎妗嗘暟鎹�
+ transferData: [],
+ // dialog寮圭獥寮�鍏�
dialogPush: false,
+ // 灞炴�ф槧灏勮〃鏁版嵁
mappingData: [],
+ // 灞炴�ф槧灏勫彇鍊艰〃鏁版嵁
rangeData: [],
+ // 涓绘暟鎹爲鎼滅储杩囨护
filterText: '',
- tableRowIndex: null,
- tableColumnIndex: null,
+ // 灞炴�ф槧灏勫彇鍊艰〃閰嶇疆
optinoRange: {
- title: '闆嗗洟灞炴��',
+ title: '灞炴�ф槧灏勫彇鍊艰寖鍥�',
maxHeight: '300px',
header: false,
rowKey: 'oid',
@@ -131,37 +118,62 @@
],
...options
},
+ // 灞炴�ф槧灏勮〃閰嶇疆
optionMapping: {
maxHeight: '500px',
header: true,
rowKey: 'oid',
+ selection: false,
column: [
{ label: '闆嗗洟鍒嗙被', prop: 'sourceClassifyName', minWidth: 80 },
{ label: '鎵�灞炶鍥�', prop: 'viewName', minWidth: 80 },
{ label: '闆嗗洟灞炴��', prop: 'sourceAttrName', minWidth: 80 },
{ label: '鍒嗙被鍚嶇О', prop: 'targetClassifyName', minWidth: 80 },
- { label: '灞炴�у悕绉�', prop: 'targetAttrName', minWidth: 80 },
- { label: '榛樿鍊�', prop: 'defaultValue', minWidth: 140, cell: true, blur: (value) => window.handleBlur(value, 'mapping') },
+ {
+ label: '灞炴�у悕绉�',
+ prop: 'targetAttrName',
+ minWidth: 80,
+ },
+ {
+ label: '榛樿鍊�',
+ prop: 'defaultValue',
+ minWidth: 140,
+ cell: true,
+ blur: (value) => window.handleBlur(value, 'mapping')
+ },
],
...options
},
+ // 涓绘暟鎹垎绫绘爲
treeData: [],
+ // 闆嗗洟鍒嗙被鏍�
groupTreeData: [],
+ // 鏍憄opos鏇挎崲鍊�
defaultProps: {
children: 'children',
label: 'name',
id: 'oid',
isLeaf: ''
},
+ transferProps: {
+ key: 'oid',
+ label: 'name'
+
+ },
+ // 闆嗗洟鍒嗙被鏍戝��
groupVal: '',
+ // 宸︿晶鏍戦�夋嫨鐨刬d鍊�
treeParam: {},
+ // 琛ㄦ牸閫夋嫨鐨勮
rangeForm: {},
mappingForm: {},
+ // 瀹氭椂鍣�
+ times: null,
+
}
},
watch: {
filterText(val) {
- console.log(this.$refs.tree)
this.$refs.tree.filter(val);
}
},
@@ -170,11 +182,25 @@
pinyin.setOptions({ checkPolyphone: false, charCase: 1 });
},
mounted() {
- window.handleBlur = this.handleBlur
+ let that = this
+ window.handleBlur = that.handleBlur
+
+ },
+ computed: {
+ filtermapping() {
+ const data = this.mappingData.filter(item => {
+ return !(Object.prototype.hasOwnProperty.call(item, 'targetAttrName') && (item.targetAttrName === null || item.targetAttrName === undefined || item.targetAttrName === ""))
+ })
+ const transfer = data.map(obj => {
+ return obj.targetAttrName
+ })
+ return transfer
+ }
},
methods: {
// 鎺ュ彛宸︿晶鏍�
async getReferCodeClassifyTree() {
+ this.treeData = []
const param = {
parentBtmName: "jclass",
valueField: "oid",
@@ -182,7 +208,6 @@
parentFieldName: "id"
}
const response = await referCodeClassifyTree(param)
- console.log(response)
if (response.status === 200) {
let data = response.data;
this.treeData = data.map(item => item.children ? { ...item, ...{ isLeaf: false } } : { ...item, ...{ isLeaf: true } })
@@ -190,35 +215,38 @@
},
// 鎺ュ彛鑾峰彇灞炴�ф槧灏�
async getGridAttrMapping(oid) {
+ this.mappingData = []
this.loading = true
- console.log(this.treeParam)
const response = await gridAttrMapping({ sourceClassifyId: oid, ...this.treeParam })
- console.log(response)
if (response.status === 200) {
this.loading = false
this.mappingData = response.data.data
+ console.log(this.filtermapping)
}
},
// 鎺ュ彛鑾峰彇灞炴�ф槧灏勫彇鍊艰寖鍥�
async getGridAttrRanges(oid) {
- this.tablesData = []
+ this.rangeData = []
const response = await gridAttrRanges({ meatId: oid })
- console.log(response)
if (response.status === 200) {
- this.rangeData = response.data
+ console.log(response.data)
+ this.rangeData = response.data.data
}
},
// 鎺ュ彛鑾峰彇涓绘暟鎹垎绫诲睘鎬т俊鎭�
async getListCodeByClassId(oid) {
- // this.tablesData = []
+ this.transferData = []
+ pinyin.setOptions({ checkPolyphone: false, charCase: 1 });
const response = await listCodeAttributeByClassId({ codeClassifyId: oid })
- console.log(response)
+ if (response.status === 200) {
+ const data = response.data.data
+ this.transferData = data
+ }
},
// 鎺ュ彛鑾峰彇闆嗗洟鍒嗙被鏍�
async referTree(oid, checked) {
this.groupTreeData = []
const response = await referTree({ 'conditionMap[codeclsfid]': oid, parentOid: null })
- console.log(response)
if (response.status === 200) {
if (checked) {
let items = response.data.map(item => {
@@ -242,24 +270,50 @@
// 淇濆瓨鎸夐挳
async handleSave() {
console.log(this.mappingData)
- // const response = await batchAddSave({ dockingPreAttrMappingVOList: this.tableData })
- // console.log(response)
+ const response = await batchAddSave({ dockingPreAttrMappingVOList: this.mappingData })
+ console.log(response)
+ if (response.status === 200) {
+ this.$message({
+ type: "success",
+ message: "淇濆瓨鎴愬姛!"
+ });
+ }
},
// 鍚屾鏁版嵁
- async handleSync() {
- const response = await syncClassifyModel({ dockingPreAttrMappingVOList: this.tableData })
- console.log(response)
+ async handleSync(type = 'all') {
+ let param = { operationType: type }
+ if (type === 'one') {
+ param.classifyId = this.form.groupValue
+ }
+ if (this.form.groupValue === '' && type === 'one') {
+ this.$message({
+ type: "error",
+ message: "璇烽�夋嫨涓�鏉¢泦鍥㈠垎绫�"
+ });
+ } else {
+ console.log(param)
+ const response = await syncClassifyModel(param)
+ if (response.status === 200) {
+ console.log(response)
+ }
+ }
},
- handelLeftCheck(event) {
+ handelTransferSave(event) {
+ let that = this
console.log(event)
- },
- // 鏂板寮圭獥鏌ヨ鎸夐挳
- handleQuery(event) {
- console.log(event)
- this.form.name = event
- },
- filterMethod(item) {
- return item.pinyins.indexOf(this.form.name) > -1;
+ const transferValue = event.value
+ if (Object.keys(that.mappingForm).length == 0) {
+ this.$message({
+ type: "error",
+ message: "璇烽�夋嫨涓�鏉℃暟鎹�!"
+ });
+ } else {
+ const findRow = that.mappingData.findIndex(item => item.metaListId === that.mappingForm.metaListId)
+ that.mappingData[findRow].targetAttrName = transferValue[0].name
+ that.mappingData[findRow].targetAttrId = transferValue[0].oid
+ this.dialogPush = false
+ }
+
},
// 宸︿晶鏍戠偣鍑�
handelTreeCell(event) {
@@ -274,46 +328,48 @@
},
// 闆嗗洟鍒嗙被鏍戠偣鍑�
handleNodeClick(data) {
- console.log(data)
- this.form.groupValue = data.name
+ this.form.groupValue = data.oid
this.groupVal = data.name
this.$refs.selectTree.blur()
this.getGridAttrMapping(data.oid)
},
+ // 闆嗗洟鍒嗙被澶卞幓鐒︾偣
inputBlur() {
this.tableColumnIndex = ''
this.tableRowIndex = null
},
- // 灞炴�ф槧灏勭偣鍑绘瘡琛�
- handleCellClick(event) {
- console.log('鍗曞嚮', event)
- // this.tableRowIndex = row.index
- // this.tableColumnIndex = column.index
- // this.getGridAttrRanges(event.metaListId)
- },
+ // 澶卞幓鐒︾偣
handleBlur(value, event) {
- console.log(value)
if (event === 'range') this.$refs.crudRange.rowCell(this.rangeForm, this.rangeForm.$index)
if (event === 'mapping') this.$refs.crudMapping.rowCell(this.mappingForm, this.mappingForm.$index)
},
- // 灞炴�у彇鍊艰寖鍥村崟鍏冩牸缂栬緫
- handleMapingRowClick(row, column, cell, event) {
+ // 闆嗗洟鏄犲皠灞炴�ц閫夋嫨鍗曞厓鏍肩紪杈戯紙鍙屽嚮锛�
+ handleMapingRowClick(row, column) {
+ clearTimeout(this.times)
this.mappingForm = row
- if (column.label === '榛樿鍊�') this.$refs.crudMapping.rowCell(row, row.$index)
- else this.getGridAttrRanges(row.metaListId)
-
+ if (column.label === '榛樿鍊�' || column.label === '灞炴�у悕绉�') this.$refs.crudMapping.rowCell(row, row.$index)
},
- // 灞炴�у彇鍊艰寖鍥村崟鍏冩牸缂栬緫
- handleRowClick(row, column, cell, event) {
+ // 闆嗗洟鏄犲皠灞炴�ц閫夋嫨锛堝崟鍑伙級
+ handleMapingClick(row) {
+ clearTimeout(this.times)
+ this.mappingForm = row
+ this.times = setTimeout(() => {
+ this.$refs.crudMapping.toggleSelection([row]);
+ }, 300)
+ },
+ // 灞炴�у彇鍊艰寖鍥村崟鍏冩牸缂栬緫锛堝弻鍑伙級
+ handleRowClick(row) {
this.rangeForm = row
- console.log('鍗曞嚮', row)
this.$refs.crudRange.rowCell(row, row.$index)
},
- // 灞炴�у彇鍊艰寖鍥村崟鍏冩牸缂栬緫
- handleUpdate(row, index, done, loading) {
+ // 灞炴�у彇鍊艰寖鍥村崟鍏冩牸缂栬緫鍚�
+ handleUpdate(row, index, done) {
+ console.log(row)
+ console.log(index)
const findRow = this.mappingData.findIndex(item => item.metaListId === row.metaListId)
- console.log(findRow)
- this.mappingData[0].dockingPreAttrRangeVoList = [row]
+ this.rangeData[index] = row
+ console.log(this.rangeData)
+ this.mappingData[findRow].dockingPreAttrRangeVoList = (this.rangeData)
console.log('淇敼鍚�', row)
this.$message({
showClose: true,
@@ -321,16 +377,44 @@
type: "success",
});
done();
+ },
+ // 灞炴�у彇鍊艰寖鍥村崟鍏冩牸缂栬緫鍚�
+ handleMapingUpdate(row, index, done) {
+ console.log(row)
+ console.log('淇敼鍚�', row)
+ this.$message({
+ showClose: true,
+ message: "淇敼鎴愬姛",
+ type: "success",
+ });
+ done();
+ },
+ // 闆嗗洟鏄犲皠灞炴�ч�夋嫨锛堝崟閫夛級
+ selectionChange(selection) {
+ console.log(selection)
+ console.log(this.mappingForm)
+ if (selection.length > 1) {
+ const nowVal = selection.shift();
+ this.$refs.crudMapping.toggleRowSelection(nowVal, false);
+ } else if (selection.length === 1) {
+ // 瀵瑰崟閫夋暟鎹殑鎿嶄綔鍐欏湪杩欓噷
+ this.disabledPush = false
+ this.getGridAttrRanges(this.mappingForm.metaListId)
+ }
+ },
+ setCurrentRow(selection, row) {
+ console.log(row)
+ this.mappingForm = row
+ this.disabledPush = false
+ },
+ handleSelectAll(selection) {
+ console.log(selection)
+ this.$refs.crudMapping.toggleSelection()
}
}
}
</script>
<style lang="scss" scoped>
-.text_tip {
- padding: 10px 0;
- color: #F56C6C;
-}
-
.setstyle {
min-height: 200px;
padding: 0 !important;
@@ -339,23 +423,20 @@
cursor: default !important;
}
-/deep/ .el-transfer-panel__list {
+::v-deep(.el-transfer-panel__list) {
width: 100%;
+ height: 370px;
}
-/deep/ .el-input {
+::v-deep(.el-transfer-panel__body) {
+ height: 370px;
+}
+
+::v-deep(.el-input) {
width: auto;
}
-/deep/ .el-transfer-panel {
+::v-deep(.el-transfer-panel) {
width: 270px;
}
-
-/deep/ .el-transfer-panel__list {
- height: 370px;
-}
-
-/deep/ .el-transfer-panel__body {
- height: 370px;
-}
-</style>
\ No newline at end of file
+</style>
--
Gitblit v1.9.3