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

能力标签相关更改

This commit is contained in:
guoyue 2022-11-01 18:06:00 +08:00
parent abd89f6eeb
commit 14813c1f4d
4 changed files with 356 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

144
back/src/views/modules/ability/components/tag-directory.vue Normal file
View File

@ -0,0 +1,144 @@
<template>
<div class="tag-directory-box">
<div class="left-tree-box">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item>
<el-input v-model="dataForm.dictName" placeholder="标签名称" clearable></el-input>
</el-form-item>
<el-form-item>
<el-button @click="getDataList()">{{ $t('query') }}</el-button>
</el-form-item>
<div class="tree-box">
<el-tree class="filter-tree" :data="dataListCopy" :props="defaultProps" default-expand-all
@node-click="handleNodeClick" :filter-node-method="filterNode" ref="tree">
</el-tree>
</div>
</el-form>
</div>
<div class="right-detail">
<div class="title">标签详情</div>
<el-form :model="dataForm" label-width="120px">
<el-form-item prop="dictName" label="标签名称">
<el-input v-model="dataForm.dictName" :placeholder="$t('dict.dictName')"></el-input>
</el-form-item>
<el-form-item prop="dictType" label="标签编号">
<el-input v-model="dataForm.dictType" placeholder="标签编号"></el-input>
</el-form-item>
<el-form-item prop="dictType" label="标签分类" style="width:100%">
<el-input v-model="dataForm.dictType" placeholder="标签分类"></el-input>
</el-form-item>
<el-form-item prop="remark" :label="$t('dict.remark')" style="width:100%">
<el-input type="textarea" :rows="4" v-model="dataForm.remark" :placeholder="$t('dict.remark')">
</el-input>
</el-form-item>
</el-form>
</div>
</div>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
import AddOrUpdate from '../tag-type-add-or-update'
import TagSysBuildLife from './tag-sys-build-life'
import { addDynamicRoute } from '@/router'
export default {
mixins: [mixinViewModule],
data() {
return {
mixinViewModuleOptions: {
getDataListURL: '/sys/dict/type/page',
getDataListIsPage: true,
deleteURL: '/sys/dict/type',
deleteIsBatch: true
},
dataForm: {
id: '0',
dictName: '',
dictType: '',
dictLabel: '',
},
filterText: '',
dataList: [],
dataListCopy: [],
defaultProps: {
children: 'sysDictDataDTOList',
label: 'dictName'
}
}
},
watch: {
filterText(val) {
this.$refs.tree.filter(val);
},
dataList: {
handler(newVal) {
this.dataListCopy = []
newVal.map(v => {
if (v.sysDictDataDTOList && v.sysDictDataDTOList.length && v.sysDictDataDTOList.length > 0) {
v.sysDictDataDTOList.map(x => {
x.dictName = x.dictLabel;
return x
})
}
this.dataListCopy.push(v)
})
}
}
},
methods: {
filterNode(value, data) {
if (!value) return true;
return data.label.indexOf(value) !== -1;
},
handleNodeClick(data) {
console.log('data------------>', data);
this.dataForm = data
}
},
}
</script>
<style scoped lang="scss">
.tag-directory-box {
display: flex;
align-items: flex-start;
width: 100%;
}
.left-tree-box {
width: 350px;
background: #fff;
padding: 20px 0;
}
.right-detail {
flex: 1;
margin-left: 20px;
background: #fff;
padding: 20px;
}
.right-detail {
.el-form {
display: flex;
width: 100%;
align-items: center;
flex-wrap: wrap;
}
.el-form-item {
width: 50%;
}
}
.title {
line-height: 24px;
font-size: 20px;
color: #303133;
padding-bottom: 25px;
}
</style>

62
back/src/views/modules/ability/components/tag-sys-build-life.vue Normal file
View File

@ -0,0 +1,62 @@
<template>
<el-dialog :visible.sync="visible" title="生命周期管理" :close-on-click-modal="false" :close-on-press-escape="false">
<div class="title">{{ rowData.dictName }}</div>
<el-table v-loading="dataListLoading" :data="dataList" border style="width: 100%;">
<el-table-column prop="status" label="状态" header-align="center" align="center"></el-table-column>
<el-table-column prop="time" label="时间" header-align="center" align="center"></el-table-column>
<el-table-column prop="remark" label="备注" header-align="center" align="center"></el-table-column>
<el-table-column prop="operator" label="操作者" header-align="center" align="center"></el-table-column>
</el-table>
<template slot="footer">
<el-button @click="visible = false">{{ $t('cancel') }}</el-button>
</template>
</el-dialog>
</template>
<script>
export default {
data() {
return {
visible: false,
dataList: [
{
status: '创建',
time: '2022-10-11',
remark: '创建',
operator: '管理员'
},
{
status: '修改',
time: '2022-09-24',
remark: '修改标签描述',
operator: '管理员'
},
{
status: '修改',
time: '2022-09-19',
remark: '补充城市管理标签页',
operator: '城管账号'
},
{
status: '删除',
time: '2022-08-11',
remark: '停止使用',
operator: '管理员'
},
],
rowData: {}
}
},
methods: {
}
}
</script>
<style scoped>
.title {
line-height: 24px;
font-size: 20px;
color: #303133;
padding-bottom: 25px;
}
</style>

103
back/src/views/modules/ability/components/tag-sys-build.vue Normal file
View File

@ -0,0 +1,103 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-sys__dict">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item>
<el-input v-model="dataForm.dictName" placeholder="标签名称" clearable></el-input>
</el-form-item>
<el-form-item>
<el-button @click="getDataList()">{{ $t('query') }}</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="addOrUpdateHandle()">新增分类</el-button>
</el-form-item>
</el-form>
<el-table v-loading="dataListLoading" :data="dataList" border
@selection-change="dataListSelectionChangeHandle" @sort-change="dataListSortChangeHandle"
style="width: 100%;">
<el-table-column prop="dictName" label="分类名称" header-align="center" align="center"></el-table-column>
<el-table-column prop="remark" label="描述" header-align="center" align="center"></el-table-column>
<el-table-column prop="dictType" label="编号" header-align="center" align="center"></el-table-column>
<el-table-column label="状态" header-align="center" align="center">
<template slot-scope="scope">
<span>{{ scope.row.status == 1 ? '启用' : '禁用' }}</span>
</template>
</el-table-column>
<el-table-column prop="createDate" label="创建时间" header-align="center" align="center"></el-table-column>
<el-table-column label="操作" fixed="right" header-align="center" align="center" width="280">
<template slot-scope="scope">
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
<el-button type="text" size="small" @click="handleClick()">{{ scope.row.status
== 1 ? '禁用' : '启用'
}}</el-button>
<el-button type="text" @click="childHandle(scope.row)">新建标签</el-button>
<el-button type="text" size="small" @click="showLife(scope.row)">生命周期管理</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination :current-page="page" :page-sizes="[10, 20, 50, 100]" :page-size="limit" :total="total"
layout="total, sizes, prev, pager, next, jumper" @size-change="pageSizeChangeHandle"
@current-change="pageCurrentChangeHandle">
</el-pagination>
<!-- 弹窗, 新增 / 修改 -->
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
<!-- 生命周期管理 -->
<TagSysBuildLife ref="lifeModal" @refreshDataList="getDataList"></TagSysBuildLife>
</div>
</el-card>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
import AddOrUpdate from '../tag-type-add-or-update'
import TagSysBuildLife from './tag-sys-build-life'
import { addDynamicRoute } from '@/router'
export default {
mixins: [mixinViewModule],
data() {
return {
mixinViewModuleOptions: {
getDataListURL: '/sys/dict/type/page',
getDataListIsPage: true,
deleteURL: '/sys/dict/type',
deleteIsBatch: true
},
dataForm: {
id: '0',
dictName: '',
dictType: '',
dictLabel: '',
},
rowClickData: {},
}
},
components: {
AddOrUpdate, TagSysBuildLife
},
methods: {
// 子级
childHandle(row) {
// 路由参数
const routeParams = {
routeName: `${this.$route.name}__${row.id}`,
title: `${this.$route.meta.title} - ${row.dictType}`,
path: 'ability/tag-data',
params: {
dictTypeId: row.id
}
}
// 动态路由
addDynamicRoute(routeParams, this.$router)
},
// 生命周期管理
showLife(row) {
this.$refs.lifeModal.visible = true;
this.$refs.lifeModal.rowData = row;
},
handleClick() {
}
}
}
</script>

103
back/src/views/modules/ability/tag.vue
View File

@ -1,75 +1,40 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-sys__dict">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item>
<el-input v-model="dataForm.dictName" placeholder="标签名称" clearable></el-input>
</el-form-item>
<!-- <el-form-item>
<el-input v-model="dataForm.dictLabel" placeholder="资源名称" clearable></el-input>
</el-form-item> -->
<el-form-item>
<el-button @click="getDataList()">{{ $t('query') }}</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="addOrUpdateHandle()">新增分类</el-button>
</el-form-item>
</el-form>
<el-table v-loading="dataListLoading" :data="dataList" border
@selection-change="dataListSelectionChangeHandle" @sort-change="dataListSortChangeHandle"
style="width: 100%;">
<el-table-column prop="dictName" label="标签名称" header-align="center" align="center"></el-table-column>
<el-table-column prop="dictType" label="英文名称" header-align="center" align="center">
<template slot-scope="scope">
<el-button type="text" @click="childHandle(scope.row)">{{ scope.row.dictType }}</el-button>
</template>
</el-table-column>
<el-table-column prop="remark" label="描述" header-align="center" align="center"></el-table-column>
<el-table-column prop="createDate" label="创建时间" header-align="center" align="center"></el-table-column>
<el-table-column label="操作" fixed="right" header-align="center" align="center" width="280">
<template slot-scope="scope">
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">新增</el-button>
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">删除</el-button>
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">详情</el-button>
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">{{scope.row.status == 1 ? '禁用' : '启用'}}</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination :current-page="page" :page-sizes="[10, 20, 50, 100]" :page-size="limit" :total="total"
layout="total, sizes, prev, pager, next, jumper" @size-change="pageSizeChangeHandle"
@current-change="pageCurrentChangeHandle">
</el-pagination>
<!-- 弹窗, 新增 / 修改 -->
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
<div style="height:100%">
<div class="tab-box">
<div class="tab-item" v-for="(tab, i) in tabList" :key="i" @click="selectTab = tab.key"
:class="[selectTab == tab.key ? 'tab-active' : '', i == 0 ? 'no-border-right' : '']">
{{ tab.name }}
</div>
</div>
<TagSysBuild v-if="selectTab == 'build'"></TagSysBuild>
<TagDirectory v-if="selectTab == 'directory'"></TagDirectory>
</div>
</el-card>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
import AddOrUpdate from './tag-type-add-or-update'
import TagSysBuild from './components/tag-sys-build'
import TagDirectory from './components/tag-directory'
import { addDynamicRoute } from '@/router'
export default {
mixins: [mixinViewModule],
data() {
return {
mixinViewModuleOptions: {
getDataListURL: '/sys/dict/type/page',
getDataListIsPage: true,
deleteURL: '/sys/dict/type',
deleteIsBatch: true
tabList: [
{
name: '标签体系构建',
key: 'build'
}, {
name: '标签目录管理',
key: 'directory'
},
dataForm: {
id: '0',
dictName: '',
dictType: '',
dictLabel: '',
}
],
selectTab: 'build'
}
},
components: {
AddOrUpdate
TagSysBuild,
TagDirectory
},
methods: {
// 子级
@ -89,4 +54,28 @@ export default {
}
}
</script>
<style scoped>
.tab-box {
display: flex;
align-items: center;
margin-bottom: 20px;
}
.tab-item {
display: inline-block;
padding: 10px 20px;
cursor: pointer;
border: 1px solid #e0e0e0;
box-sizing: border-box;
}
.no-border-right {
border-right: 0;
}
.tab-active {
background: #0058e1;
color: #fff;
}
</style>