wuhongjian
/
hi-ucs
1
0
Fork 0
Code Issues Pull Requests Projects Releases 10 Wiki Activity

后台编目bug

This commit is contained in:
851673013@qq.com 2022-07-08 10:42:00 +08:00
parent de9e38e5bf
commit 08bb99011b
2 changed files with 409 additions and 369 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

489
back/src/views/modules/bscatalogue/ManagementPop.vue
View File

@ -6,130 +6,206 @@
* @Description: 编目弹窗 * @Description: 编目弹窗
--> -->
<template> <template>
<div class="management-pop"> <div class="management-pop">
<div class="top"> <div class="top">
<a-button series="primary" @click="showAdd()"> <a-button series="primary" @click="showAdd()"> 新增 </a-button>
新增 <a-popconfirm
</a-button> 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 <a-popconfirm
title="是否删除选中字段?" title="是否取消修改?"
@confirm="() => cancel(record.key)"
okText="是" okText="是"
cancelText="否" 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" @cancel="cancelDel"
> >
<!-- <a-button series="primary">批量删除</a-button> --> <a :disabled="editingKey !== ''">删除</a>
</a-popconfirm> </a-popconfirm>
</span>
</div> </div>
<a-table </template>
:columns="columns" </a-table>
:data-source="data" <a-modal
:expanded-row-keys.sync="expandedRowKeys" :visible="visible"
:pagination='false' style="margin-top: 200px"
ref="aTable" title="新增编目"
:key="showKey" okText="新增"
:scroll="{ x: 1200, y: 500 }" cancelText="取消"
> @ok="handleOk"
<template @cancel="handleCancel"
v-for="col in ['name', 'isAttr', 'isLinkToDic', 'linkValue', 'isFilterCriteria', 'type', 'xh', 'operation']" >
:slot="col" 字段名：
slot-scope="text, record, index" <a-input
class="text" style="width: 80%"
> placeholder="请输入字段名"
<div :key="col" style="display: inline-block;" v-if="col==='name'"> v-model="nameTxt"
<a-input />
v-if="record.editable" </a-modal>
style="margin: -5px 0" </div>
: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> </template>
<script> <script>
import Vue from 'vue' import Vue from 'vue'
@ -184,9 +260,7 @@ const columns = [
] ]
const data = [] const data = []
export default { export default {
components: { components: {},
},
props: { props: {
showItem: { showItem: {
type: Object, type: Object,
@ -198,7 +272,7 @@ export default {
} }
}, },
data () { data () {
this.cacheData = data.map(item => ({ ...item })) this.cacheData = data.map((item) => ({ ...item }))
return { return {
time: true, time: true,
showKey: 0, showKey: 0,
@ -217,19 +291,27 @@ export default {
editingKey: '', editingKey: '',
rowSelection: { rowSelection: {
onChange: (selectedRowKeys, selectedRows) => { onChange: (selectedRowKeys, selectedRows) => {
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows) console.log(
`selectedRowKeys: ${selectedRowKeys}`,
'selectedRows: ',
selectedRows
)
this.delList = [] this.delList = []
if (selectedRows) { if (selectedRows) {
selectedRows.forEach((val) => { selectedRows.forEach((val) => {
this.delList.push(val.key) this.delList.push(val.key)
}) })
} }
console.log('delList================>', this.expandedRowKeys, this.delList) console.log(
'delList================>',
this.expandedRowKeys,
this.delList
)
}, },
onSelect: (record, selected, selectedRows) => { onSelect: (record, selected, selectedRows) => {
console.log(record, selected, selectedRows) console.log(record, selected, selectedRows)
if (record.children) { if (record.children) {
record.children.forEach(item => { record.children.forEach((item) => {
this.delList.push(item.key) this.delList.push(item.key)
}) })
} }
@ -258,83 +340,13 @@ export default {
}, },
// 查询所有编目 // 查询所有编目
getCategoryTree () { getCategoryTree () {
this.$http.get('/category/getCategoryTree').then(res => { this.$http.get('/category/getCategoryTree').then((res) => {
console.log(res.data.data, this.index)
this.data = [] this.data = []
if (res.data.data[this.index].children) { if (this.showItem.children) {
res.data.data[this.index].children.forEach(val => { this.showItem.children.forEach((val) => {
this.initData(val, this.cengji) 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) console.log('data======================>', this.data)
this.flag = true this.flag = true
this.showKey++ this.showKey++
@ -365,7 +377,7 @@ export default {
delete data.children delete data.children
} else { } else {
cengji++ cengji++
data.children.forEach(item => { data.children.forEach((item) => {
this.initData(item, cengji) this.initData(item, cengji)
}) })
} }
@ -373,17 +385,21 @@ export default {
}, },
// 查询所有字典 // 查询所有字典
selectZd () { 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 this.zdList = res.data.data.list
console.log(this.zdList) console.log(this.zdList)
}) })
}, },
// 查询表单类型字典 // 查询表单类型字典
selectFieldType () { selectFieldType () {
this.$http.get('/sys/dict/data/page?limit=10000&page=1&dictTypeId=1531163741457014785').then(res => { this.$http
this.fieldTypeList = res.data.data.list .get(
console.log(this.fieldTypeList) '/sys/dict/data/page?limit=10000&page=1&dictTypeId=1531163741457014785'
}) )
.then((res) => {
this.fieldTypeList = res.data.data.list
console.log(this.fieldTypeList)
})
}, },
// 新增弹窗显示 // 新增弹窗显示
showAdd () { showAdd () {
@ -408,39 +424,42 @@ export default {
// 新增编目 // 新增编目
handleOk () { handleOk () {
if (this.nameTxt) { if (this.nameTxt) {
this.$http.post('/category/insert', { this.$http
isAttr: true, .post('/category/insert', {
isFilterCriteria: false, isAttr: true,
isLinkToDic: false, isFilterCriteria: false,
linkValue: '', isLinkToDic: false,
name: this.nameTxt, linkValue: '',
pid: this.pid, name: this.nameTxt,
rootCategory: this.rootCategory, pid: this.pid,
type: 'input', rootCategory: this.rootCategory,
xh: this.px || this.data.length + 1 type: 'input',
}).then(res => { xh: this.px || this.data.length + 1
console.log(res) })
this.visible = false .then((res) => {
this.nameTxt = '' console.log(res)
this.pid = this.showItem.id this.visible = false
this.init() this.nameTxt = ''
}) this.pid = this.showItem.id
this.init()
})
} }
}, },
// 批量删除 // 批量删除
confirmDel () { confirmDel () {
this.$http.post('/category/deleteById', { ids: this.delList }).then(res => { this.$http
console.log(res) .post('/category/deleteById', { ids: this.delList })
this.init() .then((res) => {
}) console.log(res)
this.init()
})
}, },
// 取消修改 // 取消修改
cancelDel () { cancelDel () {},
},
handleChange (value, key, column) { handleChange (value, key, column) {
const newData = [...this.data] const newData = [...this.data]
this.editData = {} this.editData = {}
newData.forEach(val => { newData.forEach((val) => {
this.handleChangeFor(val, key) this.handleChangeFor(val, key)
}) })
if (this.editData) { if (this.editData) {
@ -454,7 +473,7 @@ export default {
this.editData = val this.editData = val
} else { } else {
if (val.children) { if (val.children) {
val.children.forEach(item => { val.children.forEach((item) => {
this.handleChangeFor(item, key) this.handleChangeFor(item, key)
}) })
} }
@ -495,7 +514,7 @@ export default {
} }
}, },
editFor (data, key) { editFor (data, key) {
data.forEach(val => { data.forEach((val) => {
if (val.key === key) { if (val.key === key) {
this.editData = val this.editData = val
} else { } else {
@ -515,7 +534,7 @@ export default {
}) })
} else { } else {
this.flag = false this.flag = false
this.$http.post('/category/update', this.editData).then(res => { this.$http.post('/category/update', this.editData).then((res) => {
console.log(res) console.log(res)
this.editingKey = '' this.editingKey = ''
this.init() 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() this.init()
}) })
}, },
delFor (data, arr) { delFor (data, arr) {
data.forEach(val => { data.forEach((val) => {
arr.push(val.id) arr.push(val.id)
if (val.children) { if (val.children) {
this.delFor(val.children, arr) this.delFor(val.children, arr)
@ -601,7 +620,7 @@ export default {
} }
} }
</script> </script>
<style lang='scss' scoped> <style lang="scss" scoped>
.top { .top {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;

289
back/src/views/modules/bscatalogue/bscatalogue.vue
View File

@ -24,7 +24,9 @@
<div <div
class="resource-detail-wrap" class="resource-detail-wrap"
:style="{ :style="{
backgroundImage: `url(${topicCardBgImg(slotProps.item.positionNum)})`, backgroundImage: `url(${topicCardBgImg(
slotProps.item.positionNum
)})`
}" }"
> >
<!-- 企业标题 --> <!-- 企业标题 -->
@ -36,11 +38,17 @@
<input <input
v-model="slotProps.item.name" v-model="slotProps.item.name"
class="edit-enterprise-input" class="edit-enterprise-input"
> />
</div> </div>
<!-- 专题资源列表 --> <!-- 专题资源列表 -->
<div class="resource-detail-resource"> <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> --> <!-- <span class="unit">个</span> -->
</div> </div>
<!-- 删除资源按钮 --> <!-- 删除资源按钮 -->
@ -48,7 +56,9 @@
<i <i
v-if="isRemoveCard" v-if="isRemoveCard"
class="resource-detail-remove" class="resource-detail-remove"
@click.stop="removeEnterpriseCard(slotProps.item,slotProps.index)" @click.stop="
removeEnterpriseCard(slotProps.item, slotProps.index)
"
/> />
</transition> </transition>
</div> </div>
@ -61,7 +71,7 @@
</div> </div>
<div> <div>
<span @click.stop="editTopicCard">{{ <span @click.stop="editTopicCard">{{
isRemoveCard ? "完成" : "编辑" isRemoveCard ? '完成' : '编辑'
}}</span> }}</span>
</div> </div>
</div> </div>
@ -75,7 +85,7 @@
:style="{ :style="{
top: cardAddTop, top: cardAddTop,
left: cardAddLeft, left: cardAddLeft,
backgroundImage: `url(${addCardBgImg})`, backgroundImage: `url(${addCardBgImg})`
}" }"
> >
<div v-if="!isAddCard"> <div v-if="!isAddCard">
@ -88,7 +98,7 @@
v-model="addEnterpriseName" v-model="addEnterpriseName"
class="add-enterprise-input" class="add-enterprise-input"
placeholder="请输入目录名称" placeholder="请输入目录名称"
> />
</div> </div>
<div class="add-enterprise-button-wrap"> <div class="add-enterprise-button-wrap">
<el-button <el-button
@ -109,24 +119,26 @@
</div> </div>
</transition> </transition>
<!-- 卡片覆盖层--> <!-- 卡片覆盖层-->
<div class="enterprise-card-cover" :style="{ zIndex: topicCoverZIndex||1000 }"> <div
class="enterprise-card-cover"
:style="{ zIndex: topicCoverZIndex || 1000 }"
>
<div <div
v-for="(item, index) in topicList" v-for="(item, index) in topicList"
:key="index" :key="index"
@click="test(item,index)" @click="test(item, index)"
> ></div>
</div>
</div> </div>
<a-modal <a-modal
:visible="show" :visible="show"
title="编目配置" title="编目配置"
@ok.stop="handleOk" @ok.stop="handleOk"
@cancel.stop="handleCancel" @cancel.stop="handleCancel"
:footer='null' :footer="null"
:key="showKey" :key="showKey"
width="1200px" width="1200px"
> >
<ManagementPop :showItem="showItem" :index='index'></ManagementPop> <ManagementPop :showItem="showItem" :index="index"></ManagementPop>
</a-modal> </a-modal>
</div> </div>
</template> </template>
@ -147,7 +159,8 @@ export default {
ManagementPop ManagementPop
}, },
props: { props: {
enterpriseTypeOption: { // 企业类型字典值 enterpriseTypeOption: {
// 企业类型字典值
type: Array, type: Array,
default: () => { default: () => {
return [] return []
@ -169,8 +182,7 @@ export default {
cardInsideWidth: 360, // 卡片的宽度 cardInsideWidth: 360, // 卡片的宽度
cardOutsideHeight: 198, // 卡片组件的高度 cardOutsideHeight: 198, // 卡片组件的高度
cardInsideHeight: 176, // 卡片的高度 cardInsideHeight: 176, // 卡片的高度
topicList: [ topicList: [],
],
newGroupName: { newGroupName: {
// 修改后的企业新名称 // 修改后的企业新名称
cur: [] cur: []
@ -271,44 +283,47 @@ export default {
}, },
// 初始化卡片列表 // 初始化卡片列表
async initTopicCardList () { async initTopicCardList () {
this.$http.get('/category/getCategoryTree').then(({ data: res }) => { this.$http
// 首先对后端返回的数据进行排序，这是为了方便进行卡片排序 .get('/category/getCategoryTree')
this.oldIdList = res.data .then(({ data: res }) => {
res.data.sort((a, b) => a.sortIndex - b.sortIndex) // 首先对后端返回的数据进行排序，这是为了方便进行卡片排序
this.topicList = res.data this.oldIdList = res.data
res.data.map((resource, index) => { res.data.sort((a, b) => a.sortIndex - b.sortIndex)
this.topicList[index].id = `card_${this.topicList[index].id}` this.topicList = res.data
const indexson = index res.data.map((resource, index) => {
this.$set(this.topicList[index], 'positionNum', indexson + 1) this.topicList[index].id = `card_${this.topicList[index].id}`
}) const indexson = index
console.log('this.topicList', res.data) this.$set(this.topicList[index], 'positionNum', indexson + 1)
if (this.selectIndex !== -1) { })
console.log('showItem=============>', res.data[this.selectIndex]) console.log('this.topicList', res.data)
if (res.data[this.selectIndex].children) { if (this.selectIndex !== -1) {
res.data[this.selectIndex].children.forEach(val => { console.log('showItem=============>', res.data[this.selectIndex])
val.key = val.id if (res.data[this.selectIndex].children) {
if (val.isAttr === 'true') { res.data[this.selectIndex].children.forEach((val) => {
val.isAttr = true val.key = val.id
} else if (val.isAttr === 'false') { if (val.isAttr === 'true') {
val.isAttr = false val.isAttr = true
} } else if (val.isAttr === 'false') {
if (val.isFilterCriteria === 'true') { val.isAttr = false
val.isFilterCriteria = true }
} else if (val.isFilterCriteria === 'false') { if (val.isFilterCriteria === 'true') {
val.isFilterCriteria = false val.isFilterCriteria = true
} } else if (val.isFilterCriteria === 'false') {
if (val.isLinkToDic === 'true') { val.isFilterCriteria = false
val.isLinkToDic = true }
} else if (val.isLinkToDic === 'false') { if (val.isLinkToDic === 'true') {
val.isLinkToDic = false 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.cardNum = this.topicList.length
this.showItem = res.data[this.selectIndex] })
} .catch(() => {})
this.cardNum = this.topicList.length
}).catch(() => {})
}, },
// 卡片开始拖拽前的方法 // 卡片开始拖拽前的方法
startDrag () {}, startDrag () {},
@ -348,40 +363,42 @@ export default {
const params = { const params = {
ids: letid ids: letid
} }
this.$http.post('/category/deleteById', params).then(({ data: res }) => { this.$http
let removeIndex = 0 .post('/category/deleteById', params)
this.topicList.forEach((enterprise, index) => { .then(({ data: res }) => {
if ( let removeIndex = 0
enterprise.positionNum && this.topicList.forEach((enterprise, index) => {
if (
enterprise.positionNum &&
enterprise.positionNum > item.positionNum enterprise.positionNum > item.positionNum
) { ) {
enterprise.positionNum = enterprise.positionNum - 1 enterprise.positionNum = enterprise.positionNum - 1
} }
if (item.resourceGroupId === enterprise.resourceGroupId) { if (item.resourceGroupId === enterprise.resourceGroupId) {
enterprise.position = this.topicList.length enterprise.position = this.topicList.length
removeIndex = index 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) => { .catch((e) => {
console.log('删除企业失败！%o', e) console.log('删除企业失败！%o', e)
this.$message.error('删除企业失败！') this.$message.error('删除企业失败！')
@ -395,9 +412,11 @@ export default {
id: item.id.slice(5), id: item.id.slice(5),
name: item.name name: item.name
} }
this.$http.post('/category/update', params).then(({ data: res }) => { this.$http
item.name = newGroupName .post('/category/update', params)
}) .then(({ data: res }) => {
item.name = newGroupName
})
.catch((e) => { .catch((e) => {
console.log('更新企业名称失败！%o', e) console.log('更新企业名称失败！%o', e)
this.$message.warning('更新企业名称失败！') this.$message.warning('更新企业名称失败！')
@ -437,35 +456,37 @@ export default {
linkValue: '', linkValue: '',
xh: this.topicList.length + 1 xh: this.topicList.length + 1
} }
const response = this.$http.post('/category/insert', params).then(({ data: res }) => { const response = this.$http
if (res.code !== 0) { .post('/category/insert', params)
console.log('response.code', res) .then(({ data: res }) => {
this.$message.error('新增目录失败，请联系管理员！') if (res.code !== 0) {
} else { console.log('response.code', res)
this.$message.success('新增目录成功！') this.$message.error('新增目录失败，请联系管理员！')
const enterprise = { } else {
// id: `id${this.topicList.length + 1}`, this.$message.success('新增目录成功！')
name: this.addEnterpriseName, const enterprise = {
positionNum: this.cardNum + 1 // 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({ // const response = await resourceGroup({
// method: 'post', // method: 'post',
// data: { // data: {
@ -548,7 +569,7 @@ export default {
height: 28px; height: 28px;
margin-left: 14px; margin-left: 14px;
margin-top: 9px; 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) { div:nth-child(2) {
@ -587,7 +608,7 @@ export default {
left: 50%; left: 50%;
margin-left: -45.5px; margin-left: -45.5px;
margin-top: -45.5px; margin-top: -45.5px;
background-image: url("~@/assets/img/capabilityCatalogingManagement/add.png"); background-image: url('~@/assets/img/capabilityCatalogingManagement/add.png');
cursor: pointer; cursor: pointer;
} }
> span { > span {
@ -596,7 +617,7 @@ export default {
padding-top: 5px; padding-top: 5px;
padding-left: 20px; padding-left: 20px;
font-size: 26px; font-size: 26px;
font-family: "Microsoft YaHei"; font-family: 'Microsoft YaHei';
} }
.add-enterprise-input-wrap { .add-enterprise-input-wrap {
// height: 50px; // height: 50px;
@ -634,7 +655,7 @@ export default {
background: #0fa7f6; background: #0fa7f6;
span { span {
color: #ffffff; color: #ffffff;
font-family: "Microsoft YaHei"; font-family: 'Microsoft YaHei';
font-size: 16px; font-size: 16px;
} }
} }
@ -682,7 +703,7 @@ export default {
text-align: center; text-align: center;
color: #ffffff; color: #ffffff;
font-size: 14px; font-size: 14px;
font-family: "Microsoft YaHei"; font-family: 'Microsoft YaHei';
} }
span:nth-child(2) { span:nth-child(2) {
display: inline-block; display: inline-block;
@ -691,7 +712,7 @@ export default {
text-align: center; text-align: center;
color: #ffffff; color: #ffffff;
font-size: 14px; font-size: 14px;
font-family: "Microsoft YaHei"; font-family: 'Microsoft YaHei';
border: 1px solid rgba(255, 255, 255, 0.5); border: 1px solid rgba(255, 255, 255, 0.5);
padding-top: 4px; padding-top: 4px;
margin-top: 15px; margin-top: 15px;
@ -702,7 +723,7 @@ export default {
.enterprise-card-tip-first:before, .enterprise-card-tip-first:before,
.enterprise-card-tip-first:after { .enterprise-card-tip-first:after {
position: absolute; position: absolute;
content: " "; content: ' ';
top: 32px; top: 32px;
left: -16px; left: -16px;
display: block; display: block;
@ -730,7 +751,7 @@ export default {
text-align: center; text-align: center;
color: #ffffff; color: #ffffff;
font-size: 14px; font-size: 14px;
font-family: "Microsoft YaHei"; font-family: 'Microsoft YaHei';
} }
span:nth-child(2) { span:nth-child(2) {
display: inline-block; display: inline-block;
@ -739,7 +760,7 @@ export default {
text-align: center; text-align: center;
color: #ffffff; color: #ffffff;
font-size: 14px; font-size: 14px;
font-family: "Microsoft YaHei"; font-family: 'Microsoft YaHei';
border: 1px solid rgba(255, 255, 255, 0.5); border: 1px solid rgba(255, 255, 255, 0.5);
padding-top: 4px; padding-top: 4px;
margin-top: 15px; margin-top: 15px;
@ -750,7 +771,7 @@ export default {
.enterprise-card-tip-third:before, .enterprise-card-tip-third:before,
.enterprise-card-tip-third:after { .enterprise-card-tip-third:after {
position: absolute; position: absolute;
content: " "; content: ' ';
top: 32px; top: 32px;
left: 180px; left: 180px;
display: block; display: block;
@ -779,7 +800,7 @@ export default {
text-align: center; text-align: center;
color: #ffffff; color: #ffffff;
font-size: 14px; font-size: 14px;
font-family: "Microsoft YaHei"; font-family: 'Microsoft YaHei';
} }
span:nth-child(2) { span:nth-child(2) {
display: inline-block; display: inline-block;
@ -788,7 +809,7 @@ export default {
text-align: center; text-align: center;
color: #ffffff; color: #ffffff;
font-size: 14px; font-size: 14px;
font-family: "Microsoft YaHei"; font-family: 'Microsoft YaHei';
border: 1px solid rgba(255, 255, 255, 0.5); border: 1px solid rgba(255, 255, 255, 0.5);
padding-top: 4px; padding-top: 4px;
margin-top: 15px; margin-top: 15px;
@ -799,7 +820,7 @@ export default {
.enterprise-card-tip-second:before, .enterprise-card-tip-second:before,
.enterprise-card-tip-second:after { .enterprise-card-tip-second:after {
position: absolute; position: absolute;
content: " "; content: ' ';
top: -15px; top: -15px;
left: 78px; left: 78px;
display: block; display: block;
@ -814,7 +835,7 @@ export default {
width: 100%; width: 100%;
// height: 373px; // height: 373px;
height: 176px; 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 { .resource-detail-title {
width: 100%; width: 100%;
height: 40px; height: 40px;
@ -826,7 +847,7 @@ export default {
span { span {
width: 100%; width: 100%;
height: 100%; height: 100%;
font-family: "Microsoft YaHei"; font-family: 'Microsoft YaHei';
font-size: 20px; font-size: 20px;
display: inline-block; display: inline-block;
overflow: hidden; overflow: hidden;
@ -845,7 +866,7 @@ export default {
width: 100%; width: 100%;
height: 30px; height: 30px;
padding-left: 19px; padding-left: 19px;
font-family: "Microsoft YaHei"; font-family: 'Microsoft YaHei';
font-size: 20px; font-size: 20px;
color: white; color: white;
vertical-align: middle; vertical-align: middle;
@ -877,7 +898,7 @@ export default {
position: absolute; position: absolute;
width: 28px; width: 28px;
height: 28px; height: 28px;
background-image: url("~@/assets/img/capabilityCatalogingManagement/remove.png"); background-image: url('~@/assets/img/capabilityCatalogingManagement/remove.png');
top: 0; top: 0;
right: 0; right: 0;
cursor: pointer; cursor: pointer;
@ -886,7 +907,7 @@ export default {
} }
input::-webkit-input-placeholder { input::-webkit-input-placeholder {
font-size: 14px; font-size: 14px;
font-family: "Microsoft YaHei"; font-family: 'Microsoft YaHei';
color: #999999; color: #999999;
} }
</style> </style>