后台编目bug
This commit is contained in:
851673013@qq.com
parent
de9e38e5bf
commit
08bb99011b
|
|
@ -6,130 +6,206 @@
|
|||
* @Description: 编目弹窗
|
||||
-->
|
||||
<template>
|
||||
<div class="management-pop">
|
||||
<div class="top">
|
||||
<a-button series="primary" @click="showAdd()">
|
||||
新增
|
||||
</a-button>
|
||||
<div class="management-pop">
|
||||
<div class="top">
|
||||
<a-button series="primary" @click="showAdd()"> 新增 </a-button>
|
||||
<a-popconfirm
|
||||
title="是否删除选中字段?"
|
||||
okText="是"
|
||||
cancelText="否"
|
||||
@confirm="confirmDel"
|
||||
@cancel="cancelDel"
|
||||
>
|
||||
<!-- <a-button series="primary">批量删除</a-button> -->
|
||||
</a-popconfirm>
|
||||
</div>
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:data-source="data"
|
||||
:expanded-row-keys.sync="expandedRowKeys"
|
||||
:pagination="false"
|
||||
ref="aTable"
|
||||
:key="showKey"
|
||||
:scroll="{ x: 1200, y: 500 }"
|
||||
>
|
||||
<template
|
||||
v-for="col in [
|
||||
'name',
|
||||
'isAttr',
|
||||
'isLinkToDic',
|
||||
'linkValue',
|
||||
'isFilterCriteria',
|
||||
'type',
|
||||
'xh',
|
||||
'operation'
|
||||
]"
|
||||
:slot="col"
|
||||
slot-scope="text, record, index"
|
||||
class="text"
|
||||
>
|
||||
<div :key="col" style="display: inline-block" v-if="col === 'name'">
|
||||
<a-input
|
||||
v-if="record.editable"
|
||||
style="margin: -5px 0"
|
||||
:value="text"
|
||||
@change="(e) => handleChange(e.target.value, record.key, col)"
|
||||
/>
|
||||
<template v-else>
|
||||
{{ text }}
|
||||
</template>
|
||||
</div>
|
||||
<div
|
||||
:key="col"
|
||||
style="display: inline-block"
|
||||
v-else-if="col === 'isAttr'"
|
||||
>
|
||||
<a-switch
|
||||
v-if="record.editable && !record.children"
|
||||
default-checked
|
||||
@change="isAttrOnChange"
|
||||
:checked="text"
|
||||
/>
|
||||
<template v-else>
|
||||
<a-switch default-checked :disabled="disabled" :checked="text" />
|
||||
</template>
|
||||
</div>
|
||||
<div
|
||||
:key="col"
|
||||
style="display: inline-block"
|
||||
v-else-if="col === 'isLinkToDic'"
|
||||
>
|
||||
<a-switch
|
||||
v-if="record.editable && record.isAttr"
|
||||
default-checked
|
||||
@change="isLinkToDicOnChange"
|
||||
:checked="text"
|
||||
/>
|
||||
<template v-else>
|
||||
<a-switch default-checked :disabled="disabled" :checked="text" />
|
||||
</template>
|
||||
</div>
|
||||
<div
|
||||
:key="col"
|
||||
style="display: inline-block"
|
||||
v-else-if="col === 'linkValue'"
|
||||
>
|
||||
<a-select
|
||||
:defaultValue="text"
|
||||
style="width: 150px"
|
||||
@change="linkValueHandleChange"
|
||||
:disabled="
|
||||
record.editable && record.isLinkToDic ? !disabled : disabled
|
||||
"
|
||||
>
|
||||
<a-select-option :value="val.id" v-for="val in zdList" :key="val">
|
||||
{{ val.dictName }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
<div
|
||||
:key="col"
|
||||
style="display: inline-block"
|
||||
v-else-if="col === 'isFilterCriteria'"
|
||||
>
|
||||
<a-switch
|
||||
v-if="record.editable && record.linkValue"
|
||||
default-checked
|
||||
@change="isFilterCriteriaOnChange"
|
||||
:checked="text"
|
||||
/>
|
||||
<template v-else>
|
||||
<a-switch default-checked :disabled="disabled" :checked="text" />
|
||||
</template>
|
||||
</div>
|
||||
<div
|
||||
:key="col"
|
||||
style="display: inline-block"
|
||||
v-else-if="col === 'type'"
|
||||
>
|
||||
<a-select
|
||||
:defaultValue="text"
|
||||
style="width: 150px"
|
||||
@change="typeHandleChange"
|
||||
:disabled="
|
||||
record.editable && !record.children ? !disabled : disabled
|
||||
"
|
||||
>
|
||||
<a-select-option
|
||||
:value="val.dictValue"
|
||||
v-for="val in fieldTypeList"
|
||||
:key="val"
|
||||
>
|
||||
{{ val.dictLabel }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
<div :key="col" style="display: inline-block" v-else-if="col === 'xh'">
|
||||
<a-input
|
||||
v-if="record.editable"
|
||||
style="margin: -5px 0"
|
||||
:value="text"
|
||||
@change="(e) => handleChange(e.target.value, record.key, col)"
|
||||
/>
|
||||
<template v-else>
|
||||
{{ text }}
|
||||
</template>
|
||||
</div>
|
||||
<div
|
||||
:key="col"
|
||||
class="editable-row-operations"
|
||||
v-else-if="col === 'operation'"
|
||||
>
|
||||
<span v-if="record.editable">
|
||||
<a @click="() => save(record.key)">保存</a>
|
||||
<a-popconfirm
|
||||
title="是否删除选中字段?"
|
||||
title="是否取消修改?"
|
||||
@confirm="() => cancel(record.key)"
|
||||
okText="是"
|
||||
cancelText="否"
|
||||
@confirm="confirmDel"
|
||||
>
|
||||
<a>取消</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
<span v-else>
|
||||
<a
|
||||
:disabled="editingKey !== ''"
|
||||
@click="() => add(record.id, record.children)"
|
||||
v-if="!record.isAttr && record.cengji <= 3"
|
||||
>新增</a
|
||||
>
|
||||
<a :disabled="editingKey !== ''" @click="() => edit(record.key)"
|
||||
>修改</a
|
||||
>
|
||||
<a-popconfirm
|
||||
title="是否确定删除?"
|
||||
okText="是"
|
||||
cancelText="否"
|
||||
@confirm="del(record)"
|
||||
@cancel="cancelDel"
|
||||
>
|
||||
<!-- <a-button series="primary">批量删除</a-button> -->
|
||||
</a-popconfirm>
|
||||
<a :disabled="editingKey !== ''">删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</div>
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:data-source="data"
|
||||
:expanded-row-keys.sync="expandedRowKeys"
|
||||
:pagination='false'
|
||||
ref="aTable"
|
||||
:key="showKey"
|
||||
:scroll="{ x: 1200, y: 500 }"
|
||||
>
|
||||
<template
|
||||
v-for="col in ['name', 'isAttr', 'isLinkToDic', 'linkValue', 'isFilterCriteria', 'type', 'xh', 'operation']"
|
||||
:slot="col"
|
||||
slot-scope="text, record, index"
|
||||
class="text"
|
||||
>
|
||||
<div :key="col" style="display: inline-block;" v-if="col==='name'">
|
||||
<a-input
|
||||
v-if="record.editable"
|
||||
style="margin: -5px 0"
|
||||
:value="text"
|
||||
@change="e => handleChange(e.target.value, record.key, col)"
|
||||
/>
|
||||
<template v-else>
|
||||
{{ text }}
|
||||
</template>
|
||||
</div>
|
||||
<div :key="col" style="display: inline-block;" v-else-if="col==='isAttr'">
|
||||
<a-switch v-if="record.editable && !record.children" default-checked @change="isAttrOnChange" :checked="text" />
|
||||
<template v-else>
|
||||
<a-switch default-checked :disabled='disabled' :checked="text" />
|
||||
</template>
|
||||
</div>
|
||||
<div :key="col" style="display: inline-block;" v-else-if="col==='isLinkToDic'">
|
||||
<a-switch v-if="record.editable && record.isAttr" default-checked @change="isLinkToDicOnChange" :checked="text" />
|
||||
<template v-else>
|
||||
<a-switch default-checked :disabled='disabled' :checked="text" />
|
||||
</template>
|
||||
</div>
|
||||
<div :key="col" style="display: inline-block;" v-else-if="col==='linkValue'">
|
||||
<a-select :defaultValue="text" style="width: 150px" @change="linkValueHandleChange" :disabled='(record.editable && record.isLinkToDic)?!disabled:disabled'>
|
||||
<a-select-option :value="val.id" v-for="val in zdList" :key="val">
|
||||
{{val.dictName}}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
<div :key="col" style="display: inline-block;" v-else-if="col==='isFilterCriteria'">
|
||||
<a-switch v-if="record.editable && record.linkValue" default-checked @change="isFilterCriteriaOnChange" :checked="text" />
|
||||
<template v-else>
|
||||
<a-switch default-checked :disabled='disabled' :checked="text" />
|
||||
</template>
|
||||
</div>
|
||||
<div :key="col" style="display: inline-block;" v-else-if="col==='type'">
|
||||
<a-select :defaultValue="text" style="width: 150px" @change="typeHandleChange" :disabled='(record.editable && !record.children)?!disabled:disabled'>
|
||||
<a-select-option :value="val.dictValue" v-for="val in fieldTypeList" :key="val">
|
||||
{{val.dictLabel}}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
<div :key="col" style="display: inline-block;" v-else-if="col==='xh'">
|
||||
<a-input
|
||||
v-if="record.editable"
|
||||
style="margin: -5px 0"
|
||||
:value="text"
|
||||
@change="e => handleChange(e.target.value, record.key, col)"
|
||||
/>
|
||||
<template v-else>
|
||||
{{ text }}
|
||||
</template>
|
||||
</div>
|
||||
<div :key="col" class="editable-row-operations" v-else-if="col==='operation'">
|
||||
<span v-if="record.editable">
|
||||
<a @click="() => save(record.key)">保存</a>
|
||||
<a-popconfirm title="是否取消修改?" @confirm="() => cancel(record.key)" okText='是' cancelText='否'>
|
||||
<a>取消</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
<span v-else>
|
||||
<a :disabled="editingKey !== ''" @click="() => add(record.id,record.children)" v-if="!record.isAttr&&record.cengji<=3">新增</a>
|
||||
<a :disabled="editingKey !== ''" @click="() => edit(record.key)">修改</a>
|
||||
<a-popconfirm
|
||||
title="是否确定删除?"
|
||||
okText="是"
|
||||
cancelText="否"
|
||||
@confirm="del(record)"
|
||||
@cancel="cancelDel"
|
||||
>
|
||||
<a :disabled="editingKey !== ''">删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
</a-table>
|
||||
<a-modal
|
||||
:visible="visible"
|
||||
style="margin-top: 200px"
|
||||
title="新增编目"
|
||||
okText="新增"
|
||||
cancelText="取消"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
>
|
||||
字段名：
|
||||
<a-input
|
||||
style="width: 80%"
|
||||
placeholder="请输入字段名"
|
||||
v-model="nameTxt"
|
||||
/>
|
||||
</a-modal>
|
||||
</div>
|
||||
</template>
|
||||
</a-table>
|
||||
<a-modal
|
||||
:visible="visible"
|
||||
style="margin-top: 200px"
|
||||
title="新增编目"
|
||||
okText="新增"
|
||||
cancelText="取消"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
>
|
||||
字段名：
|
||||
<a-input
|
||||
style="width: 80%"
|
||||
placeholder="请输入字段名"
|
||||
v-model="nameTxt"
|
||||
/>
|
||||
</a-modal>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Vue from 'vue'
|
||||
|
|
@ -184,9 +260,7 @@ const columns = [
|
|||
]
|
||||
const data = []
|
||||
export default {
|
||||
components: {
|
||||
|
||||
},
|
||||
components: {},
|
||||
props: {
|
||||
showItem: {
|
||||
type: Object,
|
||||
|
|
@ -198,7 +272,7 @@ export default {
|
|||
}
|
||||
},
|
||||
data () {
|
||||
this.cacheData = data.map(item => ({ ...item }))
|
||||
this.cacheData = data.map((item) => ({ ...item }))
|
||||
return {
|
||||
time: true,
|
||||
showKey: 0,
|
||||
|
|
@ -217,19 +291,27 @@ export default {
|
|||
editingKey: '',
|
||||
rowSelection: {
|
||||
onChange: (selectedRowKeys, selectedRows) => {
|
||||
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows)
|
||||
console.log(
|
||||
`selectedRowKeys: ${selectedRowKeys}`,
|
||||
'selectedRows: ',
|
||||
selectedRows
|
||||
)
|
||||
this.delList = []
|
||||
if (selectedRows) {
|
||||
selectedRows.forEach((val) => {
|
||||
this.delList.push(val.key)
|
||||
})
|
||||
}
|
||||
console.log('delList================>', this.expandedRowKeys, this.delList)
|
||||
console.log(
|
||||
'delList================>',
|
||||
this.expandedRowKeys,
|
||||
this.delList
|
||||
)
|
||||
},
|
||||
onSelect: (record, selected, selectedRows) => {
|
||||
console.log(record, selected, selectedRows)
|
||||
if (record.children) {
|
||||
record.children.forEach(item => {
|
||||
record.children.forEach((item) => {
|
||||
this.delList.push(item.key)
|
||||
})
|
||||
}
|
||||
|
|
@ -258,83 +340,13 @@ export default {
|
|||
},
|
||||
// 查询所有编目
|
||||
getCategoryTree () {
|
||||
this.$http.get('/category/getCategoryTree').then(res => {
|
||||
console.log(res.data.data, this.index)
|
||||
this.$http.get('/category/getCategoryTree').then((res) => {
|
||||
this.data = []
|
||||
if (res.data.data[this.index].children) {
|
||||
res.data.data[this.index].children.forEach(val => {
|
||||
if (this.showItem.children) {
|
||||
this.showItem.children.forEach((val) => {
|
||||
this.initData(val, this.cengji)
|
||||
// if (val.children) {
|
||||
// if (val.children.length === 0) {
|
||||
// delete val.children
|
||||
// } else {
|
||||
// val.children.forEach(item => {
|
||||
// item.key = item.id
|
||||
// item.cengji = '2'
|
||||
// console.log(item)
|
||||
// if (item.children && item.children.length === 0) {
|
||||
// delete item.children
|
||||
// } else if (item.children) {
|
||||
// item.children.forEach(child => {
|
||||
// child.key = child.id
|
||||
// child.cengji = '3'
|
||||
// if (child.children && child.children.length === 0) {
|
||||
// delete child.children
|
||||
// }
|
||||
// if (child.isAttr === 'true') {
|
||||
// child.isAttr = true
|
||||
// } else if (child.isAttr === 'false') {
|
||||
// child.isAttr = false
|
||||
// }
|
||||
// if (child.isFilterCriteria === 'true') {
|
||||
// child.isFilterCriteria = true
|
||||
// } else if (child.isFilterCriteria === 'false') {
|
||||
// child.isFilterCriteria = false
|
||||
// }
|
||||
// if (child.isLinkToDic === 'true') {
|
||||
// child.isLinkToDic = true
|
||||
// } else if (child.isLinkToDic === 'false') {
|
||||
// child.isLinkToDic = false
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
// if (item.isAttr === 'true') {
|
||||
// item.isAttr = true
|
||||
// } else if (item.isAttr === 'false') {
|
||||
// item.isAttr = false
|
||||
// }
|
||||
// if (item.isFilterCriteria === 'true') {
|
||||
// item.isFilterCriteria = true
|
||||
// } else if (item.isFilterCriteria === 'false') {
|
||||
// item.isFilterCriteria = false
|
||||
// }
|
||||
// if (item.isLinkToDic === 'true') {
|
||||
// item.isLinkToDic = true
|
||||
// } else if (item.isLinkToDic === 'false') {
|
||||
// item.isLinkToDic = false
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
// }
|
||||
// val.key = val.id
|
||||
// val.cengji = '1'
|
||||
// if (val.isAttr === 'true') {
|
||||
// val.isAttr = true
|
||||
// } else if (val.isAttr === 'false') {
|
||||
// val.isAttr = false
|
||||
// }
|
||||
// if (val.isFilterCriteria === 'true') {
|
||||
// val.isFilterCriteria = true
|
||||
// } else if (val.isFilterCriteria === 'false') {
|
||||
// val.isFilterCriteria = false
|
||||
// }
|
||||
// if (val.isLinkToDic === 'true') {
|
||||
// val.isLinkToDic = true
|
||||
// } else if (val.isLinkToDic === 'false') {
|
||||
// val.isLinkToDic = false
|
||||
// }
|
||||
})
|
||||
this.data = res.data.data[this.index].children
|
||||
this.data = this.showItem.children
|
||||
console.log('data======================>', this.data)
|
||||
this.flag = true
|
||||
this.showKey++
|
||||
|
|
@ -365,7 +377,7 @@ export default {
|
|||
delete data.children
|
||||
} else {
|
||||
cengji++
|
||||
data.children.forEach(item => {
|
||||
data.children.forEach((item) => {
|
||||
this.initData(item, cengji)
|
||||
})
|
||||
}
|
||||
|
|
@ -373,17 +385,21 @@ export default {
|
|||
},
|
||||
// 查询所有字典
|
||||
selectZd () {
|
||||
this.$http.get('/sys/dict/type/page?limit=10000&page=1').then(res => {
|
||||
this.$http.get('/sys/dict/type/page?limit=10000&page=1').then((res) => {
|
||||
this.zdList = res.data.data.list
|
||||
console.log(this.zdList)
|
||||
})
|
||||
},
|
||||
// 查询表单类型字典
|
||||
selectFieldType () {
|
||||
this.$http.get('/sys/dict/data/page?limit=10000&page=1&dictTypeId=1531163741457014785').then(res => {
|
||||
this.fieldTypeList = res.data.data.list
|
||||
console.log(this.fieldTypeList)
|
||||
})
|
||||
this.$http
|
||||
.get(
|
||||
'/sys/dict/data/page?limit=10000&page=1&dictTypeId=1531163741457014785'
|
||||
)
|
||||
.then((res) => {
|
||||
this.fieldTypeList = res.data.data.list
|
||||
console.log(this.fieldTypeList)
|
||||
})
|
||||
},
|
||||
// 新增弹窗显示
|
||||
showAdd () {
|
||||
|
|
@ -408,39 +424,42 @@ export default {
|
|||
// 新增编目
|
||||
handleOk () {
|
||||
if (this.nameTxt) {
|
||||
this.$http.post('/category/insert', {
|
||||
isAttr: true,
|
||||
isFilterCriteria: false,
|
||||
isLinkToDic: false,
|
||||
linkValue: '',
|
||||
name: this.nameTxt,
|
||||
pid: this.pid,
|
||||
rootCategory: this.rootCategory,
|
||||
type: 'input',
|
||||
xh: this.px || this.data.length + 1
|
||||
}).then(res => {
|
||||
console.log(res)
|
||||
this.visible = false
|
||||
this.nameTxt = ''
|
||||
this.pid = this.showItem.id
|
||||
this.init()
|
||||
})
|
||||
this.$http
|
||||
.post('/category/insert', {
|
||||
isAttr: true,
|
||||
isFilterCriteria: false,
|
||||
isLinkToDic: false,
|
||||
linkValue: '',
|
||||
name: this.nameTxt,
|
||||
pid: this.pid,
|
||||
rootCategory: this.rootCategory,
|
||||
type: 'input',
|
||||
xh: this.px || this.data.length + 1
|
||||
})
|
||||
.then((res) => {
|
||||
console.log(res)
|
||||
this.visible = false
|
||||
this.nameTxt = ''
|
||||
this.pid = this.showItem.id
|
||||
this.init()
|
||||
})
|
||||
}
|
||||
},
|
||||
// 批量删除
|
||||
confirmDel () {
|
||||
this.$http.post('/category/deleteById', { ids: this.delList }).then(res => {
|
||||
console.log(res)
|
||||
this.init()
|
||||
})
|
||||
this.$http
|
||||
.post('/category/deleteById', { ids: this.delList })
|
||||
.then((res) => {
|
||||
console.log(res)
|
||||
this.init()
|
||||
})
|
||||
},
|
||||
// 取消修改
|
||||
cancelDel () {
|
||||
},
|
||||
cancelDel () {},
|
||||
handleChange (value, key, column) {
|
||||
const newData = [...this.data]
|
||||
this.editData = {}
|
||||
newData.forEach(val => {
|
||||
newData.forEach((val) => {
|
||||
this.handleChangeFor(val, key)
|
||||
})
|
||||
if (this.editData) {
|
||||
|
|
@ -454,7 +473,7 @@ export default {
|
|||
this.editData = val
|
||||
} else {
|
||||
if (val.children) {
|
||||
val.children.forEach(item => {
|
||||
val.children.forEach((item) => {
|
||||
this.handleChangeFor(item, key)
|
||||
})
|
||||
}
|
||||
|
|
@ -495,7 +514,7 @@ export default {
|
|||
}
|
||||
},
|
||||
editFor (data, key) {
|
||||
data.forEach(val => {
|
||||
data.forEach((val) => {
|
||||
if (val.key === key) {
|
||||
this.editData = val
|
||||
} else {
|
||||
|
|
@ -515,7 +534,7 @@ export default {
|
|||
})
|
||||
} else {
|
||||
this.flag = false
|
||||
this.$http.post('/category/update', this.editData).then(res => {
|
||||
this.$http.post('/category/update', this.editData).then((res) => {
|
||||
console.log(res)
|
||||
this.editingKey = ''
|
||||
this.init()
|
||||
|
|
@ -586,12 +605,12 @@ export default {
|
|||
// }
|
||||
// })
|
||||
}
|
||||
this.$http.post('/category/deleteById', { ids: arr }).then(res => {
|
||||
this.$http.post('/category/deleteById', { ids: arr }).then((res) => {
|
||||
this.init()
|
||||
})
|
||||
},
|
||||
delFor (data, arr) {
|
||||
data.forEach(val => {
|
||||
data.forEach((val) => {
|
||||
arr.push(val.id)
|
||||
if (val.children) {
|
||||
this.delFor(val.children, arr)
|
||||
|
|
@ -601,7 +620,7 @@ export default {
|
|||
}
|
||||
}
|
||||
</script>
|
||||
<style lang='scss' scoped>
|
||||
<style lang="scss" scoped>
|
||||
.top {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,9 @@
|
|||
<div
|
||||
class="resource-detail-wrap"
|
||||
:style="{
|
||||
backgroundImage: `url(${topicCardBgImg(slotProps.item.positionNum)})`,
|
||||
backgroundImage: `url(${topicCardBgImg(
|
||||
slotProps.item.positionNum
|
||||
)})`
|
||||
}"
|
||||
>
|
||||
<!-- 企业标题 -->
|
||||
|
|
@ -36,11 +38,17 @@
|
|||
<input
|
||||
v-model="slotProps.item.name"
|
||||
class="edit-enterprise-input"
|
||||
>
|
||||
/>
|
||||
</div>
|
||||
<!-- 专题资源列表 -->
|
||||
<div class="resource-detail-resource">
|
||||
<div class="num" v-for="item2 in slotProps.item.children" :key="item2.id">{{ item2.name }}</div>
|
||||
<div
|
||||
class="num"
|
||||
v-for="item2 in slotProps.item.children"
|
||||
:key="item2.id"
|
||||
>
|
||||
{{ item2.name }}
|
||||
</div>
|
||||
<!-- <span class="unit">个</span> -->
|
||||
</div>
|
||||
<!-- 删除资源按钮 -->
|
||||
|
|
@ -48,7 +56,9 @@
|
|||
<i
|
||||
v-if="isRemoveCard"
|
||||
class="resource-detail-remove"
|
||||
@click.stop="removeEnterpriseCard(slotProps.item,slotProps.index)"
|
||||
@click.stop="
|
||||
removeEnterpriseCard(slotProps.item, slotProps.index)
|
||||
"
|
||||
/>
|
||||
</transition>
|
||||
</div>
|
||||
|
|
@ -61,7 +71,7 @@
|
|||
</div>
|
||||
<div>
|
||||
<span @click.stop="editTopicCard">{{
|
||||
isRemoveCard ? "完成" : "编辑"
|
||||
isRemoveCard ? '完成' : '编辑'
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -75,7 +85,7 @@
|
|||
:style="{
|
||||
top: cardAddTop,
|
||||
left: cardAddLeft,
|
||||
backgroundImage: `url(${addCardBgImg})`,
|
||||
backgroundImage: `url(${addCardBgImg})`
|
||||
}"
|
||||
>
|
||||
<div v-if="!isAddCard">
|
||||
|
|
@ -88,7 +98,7 @@
|
|||
v-model="addEnterpriseName"
|
||||
class="add-enterprise-input"
|
||||
placeholder="请输入目录名称"
|
||||
>
|
||||
/>
|
||||
</div>
|
||||
<div class="add-enterprise-button-wrap">
|
||||
<el-button
|
||||
|
|
@ -109,24 +119,26 @@
|
|||
</div>
|
||||
</transition>
|
||||
<!-- 卡片覆盖层-->
|
||||
<div class="enterprise-card-cover" :style="{ zIndex: topicCoverZIndex||1000 }">
|
||||
<div
|
||||
class="enterprise-card-cover"
|
||||
:style="{ zIndex: topicCoverZIndex || 1000 }"
|
||||
>
|
||||
<div
|
||||
v-for="(item, index) in topicList"
|
||||
:key="index"
|
||||
@click="test(item,index)"
|
||||
>
|
||||
</div>
|
||||
@click="test(item, index)"
|
||||
></div>
|
||||
</div>
|
||||
<a-modal
|
||||
:visible="show"
|
||||
title="编目配置"
|
||||
@ok.stop="handleOk"
|
||||
@cancel.stop="handleCancel"
|
||||
:footer='null'
|
||||
:footer="null"
|
||||
:key="showKey"
|
||||
width="1200px"
|
||||
>
|
||||
<ManagementPop :showItem="showItem" :index='index'></ManagementPop>
|
||||
<ManagementPop :showItem="showItem" :index="index"></ManagementPop>
|
||||
</a-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -147,7 +159,8 @@ export default {
|
|||
ManagementPop
|
||||
},
|
||||
props: {
|
||||
enterpriseTypeOption: { // 企业类型字典值
|
||||
enterpriseTypeOption: {
|
||||
// 企业类型字典值
|
||||
type: Array,
|
||||
default: () => {
|
||||
return []
|
||||
|
|
@ -169,8 +182,7 @@ export default {
|
|||
cardInsideWidth: 360, // 卡片的宽度
|
||||
cardOutsideHeight: 198, // 卡片组件的高度
|
||||
cardInsideHeight: 176, // 卡片的高度
|
||||
topicList: [
|
||||
],
|
||||
topicList: [],
|
||||
newGroupName: {
|
||||
// 修改后的企业新名称
|
||||
cur: []
|
||||
|
|
@ -271,44 +283,47 @@ export default {
|
|||
},
|
||||
// 初始化卡片列表
|
||||
async initTopicCardList () {
|
||||
this.$http.get('/category/getCategoryTree').then(({ data: res }) => {
|
||||
// 首先对后端返回的数据进行排序，这是为了方便进行卡片排序
|
||||
this.oldIdList = res.data
|
||||
res.data.sort((a, b) => a.sortIndex - b.sortIndex)
|
||||
this.topicList = res.data
|
||||
res.data.map((resource, index) => {
|
||||
this.topicList[index].id = `card_${this.topicList[index].id}`
|
||||
const indexson = index
|
||||
this.$set(this.topicList[index], 'positionNum', indexson + 1)
|
||||
})
|
||||
console.log('this.topicList', res.data)
|
||||
if (this.selectIndex !== -1) {
|
||||
console.log('showItem=============>', res.data[this.selectIndex])
|
||||
if (res.data[this.selectIndex].children) {
|
||||
res.data[this.selectIndex].children.forEach(val => {
|
||||
val.key = val.id
|
||||
if (val.isAttr === 'true') {
|
||||
val.isAttr = true
|
||||
} else if (val.isAttr === 'false') {
|
||||
val.isAttr = false
|
||||
}
|
||||
if (val.isFilterCriteria === 'true') {
|
||||
val.isFilterCriteria = true
|
||||
} else if (val.isFilterCriteria === 'false') {
|
||||
val.isFilterCriteria = false
|
||||
}
|
||||
if (val.isLinkToDic === 'true') {
|
||||
val.isLinkToDic = true
|
||||
} else if (val.isLinkToDic === 'false') {
|
||||
val.isLinkToDic = false
|
||||
}
|
||||
})
|
||||
this.$http
|
||||
.get('/category/getCategoryTree')
|
||||
.then(({ data: res }) => {
|
||||
// 首先对后端返回的数据进行排序，这是为了方便进行卡片排序
|
||||
this.oldIdList = res.data
|
||||
res.data.sort((a, b) => a.sortIndex - b.sortIndex)
|
||||
this.topicList = res.data
|
||||
res.data.map((resource, index) => {
|
||||
this.topicList[index].id = `card_${this.topicList[index].id}`
|
||||
const indexson = index
|
||||
this.$set(this.topicList[index], 'positionNum', indexson + 1)
|
||||
})
|
||||
console.log('this.topicList', res.data)
|
||||
if (this.selectIndex !== -1) {
|
||||
console.log('showItem=============>', res.data[this.selectIndex])
|
||||
if (res.data[this.selectIndex].children) {
|
||||
res.data[this.selectIndex].children.forEach((val) => {
|
||||
val.key = val.id
|
||||
if (val.isAttr === 'true') {
|
||||
val.isAttr = true
|
||||
} else if (val.isAttr === 'false') {
|
||||
val.isAttr = false
|
||||
}
|
||||
if (val.isFilterCriteria === 'true') {
|
||||
val.isFilterCriteria = true
|
||||
} else if (val.isFilterCriteria === 'false') {
|
||||
val.isFilterCriteria = false
|
||||
}
|
||||
if (val.isLinkToDic === 'true') {
|
||||
val.isLinkToDic = true
|
||||
} else if (val.isLinkToDic === 'false') {
|
||||
val.isLinkToDic = false
|
||||
}
|
||||
})
|
||||
}
|
||||
console.log('showItem=============>', res.data[this.selectIndex])
|
||||
this.showItem = res.data[this.selectIndex]
|
||||
}
|
||||
console.log('showItem=============>', res.data[this.selectIndex])
|
||||
this.showItem = res.data[this.selectIndex]
|
||||
}
|
||||
this.cardNum = this.topicList.length
|
||||
}).catch(() => {})
|
||||
this.cardNum = this.topicList.length
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
// 卡片开始拖拽前的方法
|
||||
startDrag () {},
|
||||
|
|
@ -348,40 +363,42 @@ export default {
|
|||
const params = {
|
||||
ids: letid
|
||||
}
|
||||
this.$http.post('/category/deleteById', params).then(({ data: res }) => {
|
||||
let removeIndex = 0
|
||||
this.topicList.forEach((enterprise, index) => {
|
||||
if (
|
||||
enterprise.positionNum &&
|
||||
this.$http
|
||||
.post('/category/deleteById', params)
|
||||
.then(({ data: res }) => {
|
||||
let removeIndex = 0
|
||||
this.topicList.forEach((enterprise, index) => {
|
||||
if (
|
||||
enterprise.positionNum &&
|
||||
enterprise.positionNum > item.positionNum
|
||||
) {
|
||||
enterprise.positionNum = enterprise.positionNum - 1
|
||||
}
|
||||
if (item.resourceGroupId === enterprise.resourceGroupId) {
|
||||
enterprise.position = this.topicList.length
|
||||
removeIndex = index
|
||||
}
|
||||
) {
|
||||
enterprise.positionNum = enterprise.positionNum - 1
|
||||
}
|
||||
if (item.resourceGroupId === enterprise.resourceGroupId) {
|
||||
enterprise.position = this.topicList.length
|
||||
removeIndex = index
|
||||
}
|
||||
})
|
||||
this.topicList.splice(removeIndex, 1)
|
||||
// 此处需要把删除的对象的id添加回来，否则缺失的id将导致卡片不能再拖动
|
||||
this.topicList.push({ id: item.id })
|
||||
this.cardNum -= 1
|
||||
// 调整编辑框的企业名称顺序
|
||||
this.resortEditGroupName()
|
||||
// 隐藏已经删除的卡片 -> 变更为移除已经删除的卡片
|
||||
this.$refs.cardDragger.$vnode.elm.childNodes.forEach((node) => {
|
||||
if (node.id === item.id) {
|
||||
node.style.display = 'none'
|
||||
this.oldId = item.id
|
||||
}
|
||||
})
|
||||
this.$message.success('删除企业成功！')
|
||||
// 删除完退出编辑模式
|
||||
this.initTopicCardList()
|
||||
this.isRemoveCard = !this.isRemoveCard
|
||||
this.isEditGroupName = !this.isEditGroupName
|
||||
this.topicCoverZIndex = this.isEditGroupName ? -999 : 1000
|
||||
})
|
||||
this.topicList.splice(removeIndex, 1)
|
||||
// 此处需要把删除的对象的id添加回来，否则缺失的id将导致卡片不能再拖动
|
||||
this.topicList.push({ id: item.id })
|
||||
this.cardNum -= 1
|
||||
// 调整编辑框的企业名称顺序
|
||||
this.resortEditGroupName()
|
||||
// 隐藏已经删除的卡片 -> 变更为移除已经删除的卡片
|
||||
this.$refs.cardDragger.$vnode.elm.childNodes.forEach((node) => {
|
||||
if (node.id === item.id) {
|
||||
node.style.display = 'none'
|
||||
this.oldId = item.id
|
||||
}
|
||||
})
|
||||
this.$message.success('删除企业成功！')
|
||||
// 删除完退出编辑模式
|
||||
this.initTopicCardList()
|
||||
this.isRemoveCard = !this.isRemoveCard
|
||||
this.isEditGroupName = !this.isEditGroupName
|
||||
this.topicCoverZIndex = this.isEditGroupName ? -999 : 1000
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log('删除企业失败！%o', e)
|
||||
this.$message.error('删除企业失败！')
|
||||
|
|
@ -395,9 +412,11 @@ export default {
|
|||
id: item.id.slice(5),
|
||||
name: item.name
|
||||
}
|
||||
this.$http.post('/category/update', params).then(({ data: res }) => {
|
||||
item.name = newGroupName
|
||||
})
|
||||
this.$http
|
||||
.post('/category/update', params)
|
||||
.then(({ data: res }) => {
|
||||
item.name = newGroupName
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log('更新企业名称失败！%o', e)
|
||||
this.$message.warning('更新企业名称失败！')
|
||||
|
|
@ -437,35 +456,37 @@ export default {
|
|||
linkValue: '',
|
||||
xh: this.topicList.length + 1
|
||||
}
|
||||
const response = this.$http.post('/category/insert', params).then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
console.log('response.code', res)
|
||||
this.$message.error('新增目录失败，请联系管理员！')
|
||||
} else {
|
||||
this.$message.success('新增目录成功！')
|
||||
const enterprise = {
|
||||
// id: `id${this.topicList.length + 1}`,
|
||||
name: this.addEnterpriseName,
|
||||
positionNum: this.cardNum + 1
|
||||
const response = this.$http
|
||||
.post('/category/insert', params)
|
||||
.then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
console.log('response.code', res)
|
||||
this.$message.error('新增目录失败，请联系管理员！')
|
||||
} else {
|
||||
this.$message.success('新增目录成功！')
|
||||
const enterprise = {
|
||||
// id: `id${this.topicList.length + 1}`,
|
||||
name: this.addEnterpriseName,
|
||||
positionNum: this.cardNum + 1
|
||||
}
|
||||
this.topicList.push(enterprise)
|
||||
this.cardNum += 1
|
||||
this.newGroupName.cur.push(enterprise.name)
|
||||
this.addEnterpriseName = ''
|
||||
if (this.oldId !== -1) {
|
||||
this.$refs.cardDragger.$vnode.elm.childNodes.forEach((node) => {
|
||||
if (node.id === this.oldId) {
|
||||
node.style.display = 'flex'
|
||||
}
|
||||
})
|
||||
}
|
||||
// 创建完退出编辑模式
|
||||
this.isRemoveCard = !this.isRemoveCard
|
||||
this.isEditGroupName = !this.isEditGroupName
|
||||
this.topicCoverZIndex = this.isEditGroupName ? -999 : 1000
|
||||
this.initTopicCardList()
|
||||
}
|
||||
this.topicList.push(enterprise)
|
||||
this.cardNum += 1
|
||||
this.newGroupName.cur.push(enterprise.name)
|
||||
this.addEnterpriseName = ''
|
||||
if (this.oldId !== -1) {
|
||||
this.$refs.cardDragger.$vnode.elm.childNodes.forEach((node) => {
|
||||
if (node.id === this.oldId) {
|
||||
node.style.display = 'flex'
|
||||
}
|
||||
})
|
||||
}
|
||||
// 创建完退出编辑模式
|
||||
this.isRemoveCard = !this.isRemoveCard
|
||||
this.isEditGroupName = !this.isEditGroupName
|
||||
this.topicCoverZIndex = this.isEditGroupName ? -999 : 1000
|
||||
this.initTopicCardList()
|
||||
}
|
||||
})
|
||||
})
|
||||
// const response = await resourceGroup({
|
||||
// method: 'post',
|
||||
// data: {
|
||||
|
|
@ -548,7 +569,7 @@ export default {
|
|||
height: 28px;
|
||||
margin-left: 14px;
|
||||
margin-top: 9px;
|
||||
background-image: url("~@/assets/img/capabilityCatalogingManagement/edit-card.png");
|
||||
background-image: url('~@/assets/img/capabilityCatalogingManagement/edit-card.png');
|
||||
}
|
||||
}
|
||||
div:nth-child(2) {
|
||||
|
|
@ -587,7 +608,7 @@ export default {
|
|||
left: 50%;
|
||||
margin-left: -45.5px;
|
||||
margin-top: -45.5px;
|
||||
background-image: url("~@/assets/img/capabilityCatalogingManagement/add.png");
|
||||
background-image: url('~@/assets/img/capabilityCatalogingManagement/add.png');
|
||||
cursor: pointer;
|
||||
}
|
||||
> span {
|
||||
|
|
@ -596,7 +617,7 @@ export default {
|
|||
padding-top: 5px;
|
||||
padding-left: 20px;
|
||||
font-size: 26px;
|
||||
font-family: "Microsoft YaHei";
|
||||
font-family: 'Microsoft YaHei';
|
||||
}
|
||||
.add-enterprise-input-wrap {
|
||||
// height: 50px;
|
||||
|
|
@ -634,7 +655,7 @@ export default {
|
|||
background: #0fa7f6;
|
||||
span {
|
||||
color: #ffffff;
|
||||
font-family: "Microsoft YaHei";
|
||||
font-family: 'Microsoft YaHei';
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
|
@ -682,7 +703,7 @@ export default {
|
|||
text-align: center;
|
||||
color: #ffffff;
|
||||
font-size: 14px;
|
||||
font-family: "Microsoft YaHei";
|
||||
font-family: 'Microsoft YaHei';
|
||||
}
|
||||
span:nth-child(2) {
|
||||
display: inline-block;
|
||||
|
|
@ -691,7 +712,7 @@ export default {
|
|||
text-align: center;
|
||||
color: #ffffff;
|
||||
font-size: 14px;
|
||||
font-family: "Microsoft YaHei";
|
||||
font-family: 'Microsoft YaHei';
|
||||
border: 1px solid rgba(255, 255, 255, 0.5);
|
||||
padding-top: 4px;
|
||||
margin-top: 15px;
|
||||
|
|
@ -702,7 +723,7 @@ export default {
|
|||
.enterprise-card-tip-first:before,
|
||||
.enterprise-card-tip-first:after {
|
||||
position: absolute;
|
||||
content: " ";
|
||||
content: ' ';
|
||||
top: 32px;
|
||||
left: -16px;
|
||||
display: block;
|
||||
|
|
@ -730,7 +751,7 @@ export default {
|
|||
text-align: center;
|
||||
color: #ffffff;
|
||||
font-size: 14px;
|
||||
font-family: "Microsoft YaHei";
|
||||
font-family: 'Microsoft YaHei';
|
||||
}
|
||||
span:nth-child(2) {
|
||||
display: inline-block;
|
||||
|
|
@ -739,7 +760,7 @@ export default {
|
|||
text-align: center;
|
||||
color: #ffffff;
|
||||
font-size: 14px;
|
||||
font-family: "Microsoft YaHei";
|
||||
font-family: 'Microsoft YaHei';
|
||||
border: 1px solid rgba(255, 255, 255, 0.5);
|
||||
padding-top: 4px;
|
||||
margin-top: 15px;
|
||||
|
|
@ -750,7 +771,7 @@ export default {
|
|||
.enterprise-card-tip-third:before,
|
||||
.enterprise-card-tip-third:after {
|
||||
position: absolute;
|
||||
content: " ";
|
||||
content: ' ';
|
||||
top: 32px;
|
||||
left: 180px;
|
||||
display: block;
|
||||
|
|
@ -779,7 +800,7 @@ export default {
|
|||
text-align: center;
|
||||
color: #ffffff;
|
||||
font-size: 14px;
|
||||
font-family: "Microsoft YaHei";
|
||||
font-family: 'Microsoft YaHei';
|
||||
}
|
||||
span:nth-child(2) {
|
||||
display: inline-block;
|
||||
|
|
@ -788,7 +809,7 @@ export default {
|
|||
text-align: center;
|
||||
color: #ffffff;
|
||||
font-size: 14px;
|
||||
font-family: "Microsoft YaHei";
|
||||
font-family: 'Microsoft YaHei';
|
||||
border: 1px solid rgba(255, 255, 255, 0.5);
|
||||
padding-top: 4px;
|
||||
margin-top: 15px;
|
||||
|
|
@ -799,7 +820,7 @@ export default {
|
|||
.enterprise-card-tip-second:before,
|
||||
.enterprise-card-tip-second:after {
|
||||
position: absolute;
|
||||
content: " ";
|
||||
content: ' ';
|
||||
top: -15px;
|
||||
left: 78px;
|
||||
display: block;
|
||||
|
|
@ -814,7 +835,7 @@ export default {
|
|||
width: 100%;
|
||||
// height: 373px;
|
||||
height: 176px;
|
||||
background-image: url("~@/assets/img/capabilityCatalogingManagement/small-card-orange.png");
|
||||
background-image: url('~@/assets/img/capabilityCatalogingManagement/small-card-orange.png');
|
||||
.resource-detail-title {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
|
|
@ -826,7 +847,7 @@ export default {
|
|||
span {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-family: "Microsoft YaHei";
|
||||
font-family: 'Microsoft YaHei';
|
||||
font-size: 20px;
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
|
|
@ -845,7 +866,7 @@ export default {
|
|||
width: 100%;
|
||||
height: 30px;
|
||||
padding-left: 19px;
|
||||
font-family: "Microsoft YaHei";
|
||||
font-family: 'Microsoft YaHei';
|
||||
font-size: 20px;
|
||||
color: white;
|
||||
vertical-align: middle;
|
||||
|
|
@ -877,7 +898,7 @@ export default {
|
|||
position: absolute;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
background-image: url("~@/assets/img/capabilityCatalogingManagement/remove.png");
|
||||
background-image: url('~@/assets/img/capabilityCatalogingManagement/remove.png');
|
||||
top: 0;
|
||||
right: 0;
|
||||
cursor: pointer;
|
||||
|
|
@ -886,7 +907,7 @@ export default {
|
|||
}
|
||||
input::-webkit-input-placeholder {
|
||||
font-size: 14px;
|
||||
font-family: "Microsoft YaHei";
|
||||
font-family: 'Microsoft YaHei';
|
||||
color: #999999;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue