Commit d1f295bf authored by Gakki's avatar Gakki

so far

parent d006e02a
...@@ -4,16 +4,20 @@ ...@@ -4,16 +4,20 @@
<!-- {{checkedKeys}} --> <!-- {{checkedKeys}} -->
<div class="layoutMargin layoutPadding"> <div class="layoutMargin layoutPadding">
<a-row> <a-row>
<a-col :span="4" style="height:100%; position:relative"> <a-col :span="4" style="height:100%; position:relative;" v-if="leftPanelShow">
<span style="display: block; width: 90%; color:#1890ff; font-size: 16px; font-weight: 500; padding-bottom:5px; border-bottom:1px solid #1890ff;">标签筛选条件</span> <span style="display: block; width: 90%; color:#1890ff; font-size: 16px; font-weight: 500; padding-bottom:5px; border-bottom:1px solid #1890ff;">标签筛选条件</span>
<a-tree <a-tree
@check='onCheck' @check='onCheck'
checkable checkable
:tree-data="treeData" :tree-data="treeData"
:replace-fields="replaceFields" :replace-fields="replaceFields"
/> />
</a-col> </a-col>
<a-col :span="20" style="padding-left: 10px; border-left:1px solid #ccc;">
<a-button v-if="!leftPanelShow" @click="showNHide" type='link' icon='right' style="position: absolute; left: -2%; top: 14%; color: grey"/>
<a-button v-else @click="showNHide" type='link' icon='left' style="position: absolute; left: 14.5%; top: 14%; color: grey"/>
<a-col :span="!!leftPanelShow ? 20 : 24" :style="!!leftPanelShow? `padding-left: 10px; border-left:1px solid #ccc;`:`padding-left: 10px;`">
<!-- <div v-if="$route.path == '/houseData/basicInfoByLabel'" class="layoutMargin layoutPadding"> --> <!-- <div v-if="$route.path == '/houseData/basicInfoByLabel'" class="layoutMargin layoutPadding"> -->
<a-form :form="form" class="protalForm" > <a-form :form="form" class="protalForm" >
<a-row class="formItem" type="flex" :justify="simpleSearchForm ? 'end' : ''" align="top" :gutter="simpleSearchForm ? 16 : 0"> <a-row class="formItem" type="flex" :justify="simpleSearchForm ? 'end' : ''" align="top" :gutter="simpleSearchForm ? 16 : 0">
...@@ -204,6 +208,7 @@ export default { ...@@ -204,6 +208,7 @@ export default {
key: '3' key: '3'
}, },
], ],
leftPanelShow: true,
finishDate: [ finishDate: [
{ {
name: '2000年以前', name: '2000年以前',
...@@ -486,6 +491,9 @@ export default { ...@@ -486,6 +491,9 @@ export default {
} }
}) })
}, },
showNHide() {
this.leftPanelShow = !this.leftPanelShow
},
onSelect(selectedKeys, node) { onSelect(selectedKeys, node) {
console.log(selectedKeys, node.node.$children.length) console.log(selectedKeys, node.node.$children.length)
}, },
......
...@@ -3,6 +3,7 @@ ...@@ -3,6 +3,7 @@
<div> <div>
<!-- {{triggerType}} - {{labelId}} - {{finish}} - {{jsonData}} - {{initKey}} --> <!-- {{triggerType}} - {{labelId}} - {{finish}} - {{jsonData}} - {{initKey}} -->
<!-- {{loopContent.data}} --> <!-- {{loopContent.data}} -->
{{loopContent}}
<a-row> <a-row>
<!-- <a-col :span='1' v-if="triggerType == 'create'"> --> <!-- <a-col :span='1' v-if="triggerType == 'create'"> -->
<a-col :span='1'> <a-col :span='1'>
...@@ -54,59 +55,78 @@ ...@@ -54,59 +55,78 @@
</a-form-item> </a-form-item>
</a-form> </a-form>
<a-divider type='horizontal' /> <a-divider type='horizontal' />
<a-row style="font-weight: bold; font-size: 16px;">信息筛选配置</a-row> <a-row style="font-weight: bold; font-size: 16px; margin-bottom: 20px">信息筛选配置<span style="font-weight: normal">(已有{{Object.keys(loopContent).length}}组配置)</span></a-row>
<a-form :form='infoSettingForm' layout='inline'> <a-form :form='infoSettingForm' layout='inline'>
<div v-for="(item, index) in loopContent.data" :key='index'> <div v-for="(item66, index66) in loopContent" :key="index66">
<a-form-item v-if="!!item.relation"> <div v-if="JSON.stringify(loopContent[index66]) !== '[]'" style="border: 1px solid lightgrey; padding: 20px; margin-bottom: 5px">
<a-select style="width: 120px" placeholder='请选择条件' v-decorator="['relation' + index,{initialValue: item.relation, validateTrigger:'blur',rules: []}]"> <!-- <span v-if="index66 !== 'data'"></span> -->
<a-select-option value='and'></a-select-option> <!-- {{item66}} -->
<a-select-option value='or'></a-select-option> <div v-for="(item, index) in item66" :key='index'>
<a-select-option value='ne'></a-select-option> <a-form-item v-if="!!item.relation">
</a-select> <a-select style="width: 100px" placeholder='请选择条件' v-decorator="['relation-' + index66 +'-' + index,{initialValue: item.relation, validateTrigger:'blur',rules: []}]">
</a-form-item> <a-select-option value='and'></a-select-option>
<a-select-option value='or'></a-select-option>
<a-select-option value='ne'></a-select-option>
</a-select>
</a-form-item>
<a-form-item v-else style="margin-left: 120px"></a-form-item> <a-form-item v-else style="margin-left: 100px"></a-form-item>
<a-form-item> <a-form-item>
<a-select style="width: 120px" placeholder='请选择业务属性' v-decorator="['key' + index,{initialValue: item.key, validateTrigger:'blur',rules: [{required: true, message: '请至少选择一项!'}]}]"> <a-select style="width: 100px" placeholder='请选择业务属性' v-decorator="['key-' + index66 +'-' + index,{initialValue: item.key, validateTrigger:'blur',rules: [{required: true, message: '请至少选择一项!'}]}]">
<a-select-option v-for="(item1, index1) in availableKeyList" :key='index1' :value='item1.tblKey'>{{item1.tblKeyName}}</a-select-option> <a-select-option v-for="(item1, index1) in availableKeyList" :key='index1' :value='item1.tblKey'>{{item1.tblKeyName}}</a-select-option>
</a-select> </a-select>
</a-form-item> </a-form-item>
<a-form-item> <a-form-item>
<a-select style="width: 120px" placeholder='区间' v-decorator="['codition' + index,{initialValue: item.codition, validateTrigger:'blur',rules: [{required: true, message: '请至少选择一项!'}]}]"> <a-select style="width: 100px" placeholder='区间' v-decorator="['codition-' + index66 +'-' + index,{initialValue: item.codition, validateTrigger:'blur',rules: [{required: true, message: '请至少选择一项!'}]}]">
<a-select-option value='eq'>等于</a-select-option> <a-select-option value='eq'>等于</a-select-option>
<a-select-option value='gt'>大于</a-select-option> <a-select-option value='gt'>大于</a-select-option>
<a-select-option value='gte'>大于等于</a-select-option> <a-select-option value='gte'>大于等于</a-select-option>
<a-select-option value='lt'>小于</a-select-option> <a-select-option value='lt'>小于</a-select-option>
<a-select-option value='lte'>小于等于</a-select-option> <a-select-option value='lte'>小于等于</a-select-option>
<a-select-option value='btw'>区间</a-select-option> <a-select-option value='btw'>区间</a-select-option>
</a-select> </a-select>
</a-form-item> </a-form-item>
<a-form-item> <a-form-item>
<a-input style="width: 120px" placeholder='请输入' v-decorator="['inputOne' + index,{initialValue: getInitialValueOne(item.val), validateTrigger:'blur',rules: [],}]"></a-input> <a-input style="width: 100px" placeholder='请输入' v-decorator="['inputOne-' + index66 +'-' + index,{initialValue: getInitialValueOne(item.val), validateTrigger:'blur',rules: [],}]"></a-input>
</a-form-item> </a-form-item>
<a-form-item v-if="infoSettingForm.getFieldValue('codition'+index) == 'btw'"> <a-form-item v-if="infoSettingForm.getFieldValue('codition'+index) == 'btw'">
<a-input style="width: 120px" placeholder='请输入' v-decorator="['inputTwo' + index,{initialValue: getInitialValueTwo(item.val), validateTrigger:'blur',rules: []}]"></a-input> <a-input style="width: 100px" placeholder='请输入' v-decorator="['inputTwo-' + index66 +'-' + index,{initialValue: getInitialValueTwo(item.val), validateTrigger:'blur',rules: []}]"></a-input>
</a-form-item> </a-form-item>
<a-form-item> <a-form-item>
<a-select style="width: 120px" placeholder='查询方式' v-decorator="['selMet' + index,{initialValue: item.selMet, validateTrigger:'blur',rules: [{required: true, message: '请至少选择一项!'}]}]"> <a-select style="width: 100px" placeholder='查询方式' v-decorator="['selMet-' + index66 +'-' + index,{initialValue: item.selMet, validateTrigger:'blur',rules: [{required: true, message: '请至少选择一项!'}]}]">
<a-select-option value='equels'>精确</a-select-option> <a-select-option value='equels'>精确</a-select-option>
<a-select-option value='like'>模糊</a-select-option> <a-select-option value='like'>模糊</a-select-option>
</a-select> </a-select>
</a-form-item> </a-form-item>
<a-form-item> <!-- <a-form-item>
<a-icon v-if="index+1 == loopContent.data.length" theme='filled' style="color:lightgreen;" type="plus-circle" @click="addRow()" /> <a-icon v-if="index+1 == loopContent.data.length" theme='filled' style="color:lightgreen;" type="plus-circle" @click="addRow(index66)" />
<a-icon v-if="index+1 == loopContent.data.length" theme='filled' style="color:red; margin-left: 5px" type="minus-circle" @click="deleteRow(index)" /> <a-icon v-if="index+1 == loopContent.data.length" theme='filled' style="color:red; margin-left: 5px" type="minus-circle" @click="deleteRow(index66, index)" />
</a-form-item> </a-form-item> -->
<a-divider type='horizontal' dashed /> <a-form-item>
<a-icon theme='filled' style="color:lightgreen;" type="plus-circle" @click="addRow(index66)" />
<a-icon theme='filled' style="color:red; margin-left: 5px" type="minus-circle" @click="deleteRow(index66, index)" />
</a-form-item>
<a-divider type='horizontal' dashed />
</div>
<a-row style="text-align: center">
<a-button-group>
<a-button type="primary" @click="addGroup"> <a-icon type="plus" />新增分组 </a-button>
<a-button type="danger" @click="delGroup(index66)"> 删除分组<a-icon type="delete" /> </a-button>
</a-button-group>
</a-row>
</div>
</div> </div>
</a-form> </a-form>
<!-- <a-button type='link' v-if="loopContent.data.length == 0" @click="addInitRow()"><a-icon type="plus" />新增配置</a-button> --> <!-- <a-button type='link' v-if="loopContent.data.length == 0" @click="addInitRow()"><a-icon type="plus" />新增配置</a-button> -->
<a-row v-if="loopContent.data.length == 0">请选择业务对象后填写筛选配置</a-row> <a-row v-if="Object.keys(this.loopContent).length == 0" style="border: 1px solid pink; padding: 20px">
<a-icon type="info-circle" />
<span>请选择业务对象后填写筛选配置</span>
</a-row>
</div> </div>
<!-- <div v-if="resultList.length > 0"> <!-- <div v-if="resultList.length > 0">
<a-divider type='horizontal' /> <a-divider type='horizontal' />
...@@ -124,6 +144,7 @@ ...@@ -124,6 +144,7 @@
</template> </template>
<script> <script>
import Vue from 'vue'
export default { export default {
data() { data() {
return { return {
...@@ -135,7 +156,7 @@ export default { ...@@ -135,7 +156,7 @@ export default {
codition: 'eq', codition: 'eq',
val: '', val: '',
selMet: '' selMet: ''
}] }],
}, },
verifySelect: false, verifySelect: false,
verifyInput: false, verifyInput: false,
...@@ -211,9 +232,29 @@ export default { ...@@ -211,9 +232,29 @@ export default {
this.getLabelDetail() this.getLabelDetail()
}, },
immediate: true immediate: true
} },
}, },
methods: { methods: {
addGroup() {
// 添加分组前,先查询当前有几个分组
const groupTotal = Object.keys(this.loopContent).length
Vue.set(this.loopContent, 'data'+(groupTotal+1), [
{
key: '',
codition: 'eq',
val: '',
selMet: '',
relation: 'and'
}
])
console.log(JSON.stringify(this.loopContent))
},
delGroup(key) {
console.log(key)
Vue.delete(this.loopContent, key)
},
initKeyList() { initKeyList() {
// 获取当前的对象 // 获取当前的对象
this.initKey = this.labelForm.getFieldValue('tableName') this.initKey = this.labelForm.getFieldValue('tableName')
...@@ -222,18 +263,17 @@ export default { ...@@ -222,18 +263,17 @@ export default {
handleObjChange(val) { handleObjChange(val) {
this.getKeyList(val) this.getKeyList(val)
this.loopContent.data = [{ this.loopContent = {data: [{
key: '', key: '',
codition: 'eq', codition: 'eq',
val: '', val: '',
selMet: '' selMet: ''
}] }]}
this.infoSettingForm.resetFields() this.infoSettingForm.resetFields()
// 重置key表项的值为空 或 业务对象干脆disable掉 // 重置key表项的值为空 或 业务对象干脆disable掉
}, },
getKeyList(val) { getKeyList(val) {
console.log('111')
this.availableKeyList = [] this.availableKeyList = []
this.$ajax.get({ this.$ajax.get({
url: this.$api.GET_AVAILABLE_KEY_LIST, url: this.$api.GET_AVAILABLE_KEY_LIST,
...@@ -306,16 +346,17 @@ export default { ...@@ -306,16 +346,17 @@ export default {
this.finish = true this.finish = true
this.$emit('finish', this.finish) this.$emit('finish', this.finish)
}, },
addInitRow() { // addInitRow() {
this.loopContent.data.push({ // this.loopContent.data.push({
key: '', // key: '',
codition: 'eq', // codition: 'eq',
val: '', // val: '',
selMet: '' // selMet: ''
}) // })
}, // },
addRow() { addRow(whichGroup) {
this.loopContent.data.push({ console.log(whichGroup)
this.loopContent[whichGroup].push({
key: '', key: '',
codition: 'eq', codition: 'eq',
val: '', val: '',
...@@ -324,11 +365,13 @@ export default { ...@@ -324,11 +365,13 @@ export default {
}) })
console.log(this.loopContent) console.log(this.loopContent)
}, },
deleteRow(index) { deleteRow(whichGroup, whichRow) {
console.log(JSON.stringify(this.loopContent.data)) console.log(whichGroup, whichRow)
console.log(index) this.loopContent[whichGroup].splice(whichRow, 1)
this.loopContent.data.splice(index, 1) // console.log(JSON.stringify(this.loopContent.data))
console.log(JSON.stringify(this.loopContent.data)) // console.log(index)
// this.loopContent.data.splice(index, 1)
// console.log(JSON.stringify(this.loopContent.data))
}, },
deleteLabel(id) { deleteLabel(id) {
// 查询该标签是否是一级标签,是一级标签直接删除。 // 查询该标签是否是一级标签,是一级标签直接删除。
...@@ -350,7 +393,12 @@ export default { ...@@ -350,7 +393,12 @@ export default {
this.deleteVisible = !this.deleteVisible this.deleteVisible = !this.deleteVisible
}, },
resetFormFields() { resetFormFields() {
this.loopContent.data = [] this.loopContent = {data: [{
key: '',
codition: 'eq',
val: '',
selMet: ''
}]}
this.resultList = [] this.resultList = []
this.labelForm.resetFields() this.labelForm.resetFields()
this.jsonData = {selParams: []} this.jsonData = {selParams: []}
...@@ -388,8 +436,9 @@ export default { ...@@ -388,8 +436,9 @@ export default {
this.confirmVisible = !this.confirmVisible this.confirmVisible = !this.confirmVisible
}, },
save() { save() {
if(this.loopContent.data.length == 0) { // if(this.loopContent.data.length == 0) {
this.$message.error('请至少添加一项配置') if(Object.keys(this.loopContent).length == 0) {
this.$message.error('请至少添加一组配置!')
} else { } else {
// 判断是否选择分组或填写分组 // 判断是否选择分组或填写分组
console.log(!!this.labelForm.getFieldValue('parentId')) console.log(!!this.labelForm.getFieldValue('parentId'))
...@@ -407,6 +456,7 @@ export default { ...@@ -407,6 +456,7 @@ export default {
const labelFormData = this.labelForm.getFieldsValue() const labelFormData = this.labelForm.getFieldsValue()
this.jsonData = Object.assign(this.jsonData, labelFormData) this.jsonData = Object.assign(this.jsonData, labelFormData)
this.infoSettingForm.validateFields((err1, values) => { this.infoSettingForm.validateFields((err1, values) => {
console.log(values)
if(!err1) { if(!err1) {
let loopCounts = this.loopContent.data.length let loopCounts = this.loopContent.data.length
let formData = this.infoSettingForm.getFieldsValue() let formData = this.infoSettingForm.getFieldsValue()
......
<template> <template>
<div> <div style="position: relative">
请先在左侧选择一个标签或添加标签。 <div style="border: 1px dotted lightgrey; padding: 150px;">
<a-row style="text-align: center; margin-bottom: 50px;">
<img src="@/assets/icon/labelNone.png" />
</a-row>
<a-row style="text-align: center; font-weight: bold; font-size: 16px">
<span>请先在左侧选择一个标签或添加标签。</span>
</a-row>
</div>
</div> </div>
</template> </template>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment