WL/laws_weilai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

标签编辑

Browse Source
This commit is contained in:
caoyang
2022-02-15 18:00:18 +08:00
parent 12ac3223e1
commit 875c7d0ead
8 changed files with 893 additions and 160 deletions
Download Patch File Download Diff File Expand all files Collapse all files
jero-web/src/views/documentManage/tags/dialog/OnlCgformTagForm.vue
+161 -124
View File
@@ -1,90 +1,101 @@
<template>
<a-spin :spinning="confirmLoading">
<j-form-container :disabled="formDisabled">
<a-form :form="form" slot="detail">
<!-- <a-spin :spinning="confirmLoading">-->
<!-- <j-form-container :disabled="formDisabled">-->
<div class="form-tag">
<a-form>
<a-form-model
class="tag-content"
:model="form"
:rules="validatorRules"
ref="tagEditForm"
:label-col="labelCol"
:wrapper-col="wrapperCol"
>
<a-row>
<p class="tag-info">基本信息</p>
<a-divider dashed />
<a-col :span="24">
<a-form-item label="所属模块" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag type="list" v-decorator="['isModel', validatorRules.isModel]" :trigger-change="true" dictCode="module" placeholder="请选择所属模块" />
</a-form-item>
<a-form-model-item label="所属模块" prop="isModel">
<j-dict-select-tag type="list" v-model="form.isModel" dictCode="module" placeholder="请选择所属模块" />
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-item label="属性名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input v-decorator="['dbFieldTxt', validatorRules.dbFieldTxt]" placeholder="请输入属性名称" :maxLength="120" ></a-input>
</a-form-item>
<a-form-model-item label="属性名称" prop="dbFieldTxt">
<a-input v-model="form.dbFieldTxt" placeholder="请输入属性名称" :maxLength="120" ></a-input>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-item label="英文名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input v-decorator="['dbFieldName', validatorRules.dbFieldName]" placeholder="请输入英文名称" :maxLength="120" ></a-input>
</a-form-item>
<a-form-model-item label="英文名称" prop="dbFieldName">
<a-input v-model="form.dbFieldName" placeholder="请输入英文名称" :maxLength="120" ></a-input>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-item label="属性类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag type="list" v-decorator="['fieldShowType', validatorRules.fieldShowType]" :trigger-change="true" dictCode="attribute_type" placeholder="请选择属性类型" />
</a-form-item>
<a-form-model-item label="属性类型" prop="fieldShowType">
<j-dict-select-tag type="list" v-model="form.fieldShowType" dictCode="attribute_type" placeholder="请选择属性类型" />
</a-form-model-item>
</a-col>
<a-col :span="24" v-if="isTagContent">
<a-form-item label="选项内容" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag type="list" v-decorator="['dictName', validatorRules.dictName]" :trigger-change="true" dictCode="sys_dict,选项内容,dict_name" placeholder="请选择选项内容" />
</a-form-item>
<a-form-model-item label="选项内容" prop="dictName">
<j-dict-select-tag type="list" v-model="form.dictName" dictCode="" placeholder="请选择选项内容" />
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-item label="字段长度" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input-number v-decorator="['dbLength', validatorRules.dbLength]" :min="1" :max="200" placeholder="请输入字段长度" style="width: 100%" :formatter="limitNumber" :parser="limitNumber" />
</a-form-item>
<a-form-model-item label="字段长度" prop="dbLength">
<a-input-number v-model="form.dbLength" :min="1" :max="200" placeholder="请输入字段长度" style="width: 100%" :formatter="limitNumber" :parser="limitNumber" />
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-item label="展示顺序" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input-number v-decorator="['orderNum', validatorRules.orderNum]" placeholder="请输入展示顺序" style="width: 100%" :min="1" :formatter="limitNumber" :parser="limitNumber" />
</a-form-item>
<a-form-model-item label="展示顺序" prop="orderNum">
<a-input-number v-model="form.orderNum" placeholder="请输入展示顺序" style="width: 100%" :min="1" :formatter="limitNumber" :parser="limitNumber" />
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-item label="是否必填" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag type="list" v-decorator="['fieldMustInput', validatorRules.fieldMustInput]" :trigger-change="true" dictCode="yn" placeholder="请选择是否必填" />
</a-form-item>
<a-form-model-item label="是否必填" prop="fieldMustInput">
<j-dict-select-tag type="list" v-model="form.fieldMustInput" dictCode="yn" placeholder="请选择是否必填" />
</a-form-model-item>
</a-col>
<p class="tag-info">文档库模块展示</p>
<a-divider dashed />
<a-col :span="24">
<a-form-item label="文档库列表展示" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag type="list" v-decorator="['isShowForm', validatorRules.isShowForm]" :trigger-change="true" dictCode="yn" placeholder="请选择是否文档库列表展示" />
</a-form-item>
<a-form-model-item label="文档库列表展示" prop="isShowForm">
<j-dict-select-tag type="list" v-model="form.isShowForm" dictCode="yn" placeholder="请选择是否文档库列表展示" />
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-item label="展示区域" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag type="list" v-decorator="['showArea', validatorRules.showArea]" :trigger-change="true" dictCode="onl_cgform_area,展示区域,show_area" placeholder="请选择展示区域" />
</a-form-item>
<a-form-model-item label="展示区域" prop="showArea">
<j-dict-select-tag type="list" v-model="form.showArea" dictCode="" placeholder="请选择展示区域" />
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-item label="是否搜索" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag type="list" v-decorator="['isQuery', validatorRules.isQuery]" :trigger-change="true" dictCode="yn" placeholder="请选择是否搜索" />
</a-form-item>
<a-form-model-item label="是否搜索" prop="isQuery">
<j-dict-select-tag type="list" v-model="form.isQuery" dictCode="yn" placeholder="请选择是否搜索" />
</a-form-model-item>
</a-col>
<p class="tag-info">其它模块展示</p>
<a-divider dashed />
<a-col :span="24">
<a-form-item label="法规清单展示" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag type="list" v-decorator="['isShowLawsList', validatorRules.isShowLawsList]" :trigger-change="true" dictCode="yn" placeholder="请选择法规清单是否展示" />
</a-form-item>
<a-form-model-item label="法规清单展示" prop="isShowLawsList">
<j-dict-select-tag type="list" v-model="form.isShowLawsList" dictCode="yn" placeholder="请选择法规清单是否展示" />
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-item label="搜索中心展示" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag type="list" v-decorator="['isShowSearch', validatorRules.isShowSearch]" :trigger-change="true" dictCode="yn" placeholder="请选择搜索中心是否展示" />
</a-form-item>
<a-form-model-item label="搜索中心展示" prop="isShowSearch">
<j-dict-select-tag type="list" v-model="form.isShowSearch" dictCode="yn" placeholder="请选择搜索中心是否展示" />
</a-form-model-item>
</a-col>
<!-- <a-col v-if="showFlowSubmitButton" :span="24" style="text-align: center">-->
<!-- <a-button @click="submitForm">提 交</a-button>-->
<!-- </a-col>-->
</a-row>
</a-form-model>
</a-form>
</j-form-container>
</a-spin>
</div>
<!-- </j-form-container>-->
<!-- </a-spin>-->
</template>
<script>
@@ -119,11 +130,24 @@
isTagContent:{
type: Boolean,
default: false,
},
drawerVisible:{
type: Boolean,
default: false,
},
editData:{
type: Object,
},
editId:{
type:String
},
submitEdit:{
type:String
}
},
data () {
return {
form: this.$form.createForm(this),
form: {},
model: {},
labelCol: {
xs: { span: 24 },
@@ -135,72 +159,47 @@
},
confirmLoading: false,
validatorRules: {
isModel: {
rules: [
{ required: true, message: '请输入所属模块!'},
]
},
dbFieldTxt: {
rules: [
{ required: true, message: '请输入属性名称!'},
]
},
dbFieldName: {
rules: [
{ required: true, message: '请输入英文名称!'},
]
},
fieldShowType: {
rules: [
{ required: true, message: '请输入属性类型!'},
]
},
dictName: {
rules: [
// { required: true, message: '请输入选项内容!'},
]
},
dbLength: {
rules: [
{ required: true, message: '请输入字段长度!'},
]
},
orderNum: {
rules: [
{ required: true, message: '请输入展示顺序!'},
]
},
fieldMustInput: {
rules: [
{ required: true, message: '请输入字段是否必填!'},
]
},
isShowForm: {
rules: [
{ required: true, message: '请选择是否显示文档库列表'},
]
},
showArea: {
rules: [
// { required: true, message: '请输入展示区域!'},
]
},
isQuery: {
rules: [
{ required: true, message: '请输入是否查询条件0否 1是!'},
]
},
isShowLawsList: {
rules: [
{ required: true, message: '请选择法规清单是否展示!'},
]
},
isShowSearch: {
rules: [
{ required: true, message: '请选择搜索中心是否展示!'},
]
},
isModel: [
{ required: true, message: '请输入所属模块!',trigger: 'change'},
],
dbFieldTxt: [
{ required: true, message: '请输入属性名称!',trigger: 'blur'},
],
dbFieldName: [
{ required: true, message: '请输入英文名称!',trigger: 'blur'},
],
fieldShowType: [
{ required: true, message: '请输入属性类型!',trigger: 'change'},
],
dictName: [
// { required: true, message: '请输入选项内容!',trigger: 'change'},
],
dbLength: [
{ required: true, message: '请输入字段长度!',trigger: 'blur'},
],
orderNum: [
{ required: true, message: '请输入展示顺序!',trigger: 'blur'},
],
fieldMustInput: [
{ required: true, message: '请输入字段是否必填!',trigger: 'change'},
],
isShowForm: [
{ required: true, message: '请选择是否显示文档库列表',trigger: 'change'},
],
showArea: [
// { required: true, message: '请输入展示区域!',trigger: 'change'},
],
isQuery: [
{ required: true, message: '请输入是否查询条件',trigger: 'change'},
],
isShowLawsList: [
{ required: true, message: '请选择法规清单是否展示!',trigger: 'change'},
],
isShowSearch: [
{ required: true, message: '请选择搜索中心是否展示!',trigger: 'change'},
],
},
addVisible:false,
url: {
add: "tag/onlCgformTag/add",
edit: "tag/onlCgformTag/edit",
@@ -208,7 +207,28 @@
}
}
},
watch:{
// 'form.fieldShowType'(val){
// console.log('valDb',val)
// console.log(val==3)
// if(val==3||val==4||val==9||val==10){
// this.isTagContent=true
// console.log('isTag',this.isTagContent)
// }else{
// this.isTagContent=false
// console.log('isTag',this.isTagContent)
//
// }
//
// },
// 'form.dbLength'(val){
// console.log('val')
// }
},
computed: {
changeType(val){
console.log('changtType',val)
},
formDisabled(){
if(this.formBpm===true){
if(this.formData.disabled===false){
@@ -231,16 +251,22 @@
//如果是流程中表单，则需要加载流程表单data
this.showFlowData();
},
mounted() {
console.log('edit3333',this.editData)
this.form={...this.editData}
// console.log('drawerVisible',this.drawerVisible)
},
methods: {
add () {
this.edit({});
},
edit (record) {
this.form.resetFields();
this.model = Object.assign({}, record);
this.visible = true;
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.model,'isModel','dbFieldTxt','dbFieldName','fieldShowType','dictName','dbLength','orderNum','fieldMustInput','isShowForm','showArea','isQuery','isShowLawsList','isShowSearch'))
// this.form.setFieldsValue(pick(this.model,'isModel','dbFieldTxt','dbFieldName','fieldShowType','dictName','dbLength','orderNum','fieldMustInput','isShowForm','showArea','isQuery','isShowLawsList','isShowSearch'))
})
},
//渲染流程表单数据
@@ -255,32 +281,38 @@
}
},
submitForm () {
const that = this;
// const that = this;
// 触发表单验证
this.form.validateFields((err, values) => {
if (!err) {
that.confirmLoading = true;
// console.log(this.$refs.tagform)
this.$refs.tagEditForm.validate((valid)=>{
// console.log('valid',valid)
if (valid) {
this.confirmLoading = true;
let httpurl = '';
let method = '';
if(!this.model.id){
console.log('this.editId',this.editId)
if(this.submitEdit=='add'){
httpurl+=this.url.add;
method = 'post';
}else{
this.form.id=''
}else if(this.submitEdit=='edit'){
httpurl+=this.url.edit;
method = 'put';
this.form.id=this.editId
}
let formData = Object.assign(this.model, values);
console.log("表单提交数据",formData)
httpAction(httpurl,formData,method).then((res)=>{
// let formData = Object.assign(this.editId, this.form);
// console.log("表单提交数据",this.form)
httpAction(httpurl,this.form,method).then((res)=>{
if(res.success){
that.$message.success(res.message);
that.$emit('ok',false);
this.$message.success(res.message);
this.$emit('ok',false);
}else{
that.$message.warning(res.message);
this.$message.warning(res.message);
}
}).finally(() => {
that.confirmLoading = false;
this.confirmLoading = false;
})
}
@@ -303,6 +335,11 @@
}
</script>
<style lang="less" scoped>
.form-tag{
.tag-content{
margin-bottom: 30px;
}
}
.tag-info{
margin-left: 30px;
}
jero-web/src/views/documentManage/tags/dialog/dicList.vue
+220
View File
@@ -0,0 +1,220 @@
<template>
<div class="dic-list">
<div class="dic-list-content">
<div class="dic-list-header">
<a-form-model :model="form" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-form-model-item label="名称">
<a-input v-model="form.tagName" placeholder="请输入名称" />
</a-form-model-item>
</a-form-model>
<div class="form-btn">
<a-button class="form-btn-search" type="primary" @click="search">查询</a-button>
<a-button class="form-btn-reset" @click="reset">重置</a-button>
</div>
</div>
<div class="dic-list-module">
<a-button type="primary" class="dic-list-add" @click="dicAdd">{{$t('add')}}</a-button>
</div>
<div class="dic-list-table">
<list-table v-if="dictVal=='list'" :tableData="tableData" @editDict="editDict"></list-table>
<tree-table v-if="dictVal=='tree'" :tabletreeData="tabletreeData" @editDict="editTreeDict"></tree-table>
</div>
<a-modal class="dict-module" v-model="newVisible" title="新增" ok-text="保存" cancel-text="取消" @ok="hideModal" @cancel="cancelModel" v-if="newVisible">
<a-form-model
v-if="newVisible"
class="dic-form-module"
ref="ruleForm"
:model="form"
:rules="rules"
:label-col="labelCol"
:wrapper-col="wrapperCol"
>
<a-form-model-item label="名称" prop="name">
<a-input v-model="form.name" placeholder="请输入名称" />
</a-form-model-item>
<a-form-model-item label="英文名称" prop="enName">
<a-input v-model="form.enName" placeholder="请输入英文名称" />
</a-form-model-item>
<a-form-model-item label="父级名称" prop="parentName" v-if="parentVisible">
<a-tree-select
v-model="parentName"
style="width: 100%"
:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
:tree-data="treeData"
placeholder="请选择父级名称"
tree-default-expand-all
>
<span v-if="key === '0-0-1'" slot="title" slot-scope="{ key, value }">
Child Node1 {{ value }}
</span>
</a-tree-select>
</a-form-model-item>
<a-form-model-item label="描述" prop="describe">
<a-input v-model="form.describe" placeholder="请输入描述" />
</a-form-model-item>
</a-form-model>
</a-modal>
</div>
</div>
</template>
<script>
import listTable from './listTable'
import treeTable from './treeTable'
export default {
name: 'dicList',
components:{
listTable,
treeTable
},
props:{
dictVal:String,
},
data(){
return{
labelCol: { span: 4 },
wrapperCol: { span: 18 },
form:{},
newVisible:false,
rules:{
name:[
{ required: true, message: '请输入展示区域', trigger: 'blur' },
{ min:1, max: 30, message: '长度在 1 - 30字符', trigger: 'blur' },
],
enName:[
{ min:1, max: 100, message: '长度在 1 - 100字符', trigger: 'blur' },
],
describe:[
{ min:1, max: 300, message: '长度在 1 - 300字符', trigger: 'blur' },
]
},
tableData:[
{
key: '1',
name: '适用地区',
enName:'aaaaa',
describe:'单选',
},
{
key: '2',
name: '类别',
enName:'bbbb',
describe:'单选',
},
],
tabletreeData:[],
parentName:undefined,
treeData:[
{
title: 'Node1',
value: '0-0',
key: '0-0',
children: [
{
value: '0-0-1',
key: '0-0-1',
scopedSlots: {
// custom title
title: 'title',
},
},
{
title: 'Child Node2',
value: '0-0-2',
key: '0-0-2',
},
],
},
{
title: 'Node2',
value: '0-1',
key: '0-1',
},
],
parentVisible:false,
}
},
watch: {
parentName(value) {
console.log(value);
},
},
mounted() {
console.log(this.dictVal)
},
methods:{
//搜索
search(){
},
//重置
reset(){
},
//新增
dicAdd(){
this.newVisible=true;
if(this.dictVal=='list'){
this.parentVisible=false
}else if(this.dictVal='tree'){
this.parentVisible=true
}
},
//保存
hideModal(){
},
//取消
cancelModel(){
this.newVisible=false;
},
//列表编辑
editDict(val){
this.newVisible=val
this.parentVisible=false
},
//树状编辑
editTreeDict(val){
this.newVisible=val
this.parentVisible=true
}
}
}
</script>
<style lang="less" scoped>
.dic-list{
.dic-list-content{
.dic-list-header{
display: flex;
justify-content: space-between;
.form-btn{
.form-btn-search{
margin-right: 10px;
}
}
}
.dic-list-module{
margin-bottom: 20px;
}
}
}
.dict-module{
.ant-modal-footer{
align:center;
}
}
</style>
<style lang="less">
.dict-module{
.ant-modal-footer{
text-align:center;
}
}
</style>
jero-web/src/views/documentManage/tags/dialog/listTable.vue
+90
View File
@@ -0,0 +1,90 @@
<template>
<div class="list-table">
<a-table bordered :data-source="tableData" :columns="columns" :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }" class="tag-con-table">
<template slot="action" slot-scope="text, record">
<a class="action-edit" href="javascript:;" @click="actionEdit(record)">编辑</a>
<a-popconfirm
v-if="tableData.length"
title="Sure to delete?"
@confirm="() => onDelete(record)"
>
<a class="action-delete" href="javascript:;">删除</a>
</a-popconfirm>
</template>
</a-table>
</div>
</template>
<script>
export default {
name: 'listTable',
props:{
tableData:Array,
},
data(){
return{
selectedRowKeys:[],
columns: [
{
title: '名称',
dataIndex: 'name',
key: 'name',
align: "center",
width: 100,
},
{
title: '英文名称',
align: "center",
width: 100,
dataIndex: 'enName',
},
{
title: '描述',
align: "center",
width: 100,
dataIndex: 'describe',
},
{
title: this.$t('operation'),
dataIndex: 'action',
scopedSlots: {customRender: 'action'},
align: "center",
width: 170
}
],
}
},
mounted() {
},
methods:{
//编辑
actionEdit(val){
this.$emit('editDict',true)
},
//删除
onDelete(val){
},
onSelectChange(selectedRowKeys) {
console.log('selectedRowKeys changed: ', selectedRowKeys);
this.selectedRowKeys = selectedRowKeys;
},
}
}
</script>
<style lang="less" scoped>
.list-table{
.tag-con-table{
.action-edit{
margin-right: 5px;
}
.action-delete{
color:red;
}
}
}
</style>
jero-web/src/views/documentManage/tags/dialog/newDrawer.vue
+5 -2
View File
@@ -1,6 +1,6 @@
<template>
<div class="new-tag-drawer">
<onl-cgform-tag-form ref="realForm" @ok="submitCallback" :isTagContent="isTagContent" :disabled="disableSubmit" normal> </onl-cgform-tag-form>
<onl-cgform-tag-form ref="realForm" @ok="submitCallback" :isTagContent="isTagContent" :editData="editData" :editId=editId :submitEdit="submitEdit" :disabled="disableSubmit" normal> </onl-cgform-tag-form>
<div class="drawer-footer">
<a-button v-if="!disableSubmit" @click="handleOk" type="primary" style="margin-bottom: 0;">保存</a-button>
@@ -28,7 +28,10 @@
},
props:{
drawerVisible:Boolean,
isTagContent:Boolean
isTagContent:Boolean,
editData:Object,
editId:String,
submitEdit:String
},
mounted() {
this.visible=this.drawerVisible
jero-web/src/views/documentManage/tags/dialog/treeTable.vue
+255
View File
@@ -0,0 +1,255 @@
<template>
<div class="tree-table">
<div class="tree-table-content">
<a-table
bordered
class="tree-table-con"
:columns="columns"
:data-source="tabData"
:row-selection="{selectedRowKeys: selectedRowKeys, onSelectAll: onSelectAll, onSelect: onSelect}"
>
<template slot="action" slot-scope="text, record">
<a class="action-edit" href="javascript:;" @click="actionEdit(record)">编辑</a>
<a-popconfirm
v-if="tabData.length"
title="Sure to delete?"
@confirm="() => onDelete(record)"
>
<a class="action-delete" href="javascript:;">删除</a>
</a-popconfirm>
</template>
</a-table>
</div>
</div>
</template>
<script>
export default {
name: 'treeTable',
props:{
},
data(){
return{
columns: [
{
title: '名称',
dataIndex: 'name',
key: 'name',
align: "center",
},
{
title: '英文名称',
dataIndex: 'enName',
key: 'enName',
width: '12%',
align: "center",
},
{
title: '描述',
dataIndex: 'describe',
width: '30%',
key: 'describe',
align: "center",
},
{
title: this.$t('operation'),
dataIndex: 'action',
scopedSlots: {customRender: 'action'},
align: "center",
width: 170
}
],
tabData:[
{
key: 1,
name: 'John Brown sr.',
enName: 'ddddd',
describe: 'New York No. 1 Lake Park',
children: [
{
key: 11,
name: 'John Brown',
enName: 'oouuu',
describe: 'New York No. 2 Lake Park',
},
{
key: 12,
name: 'John Brown jr.',
enName: 'John Brown',
describe: 'New York No. 3 Lake Park',
children: [
{
key: 121,
name: 'Jimmy Brown',
enName: 'mmmmm',
describe: 'New York No. 3 Lake Park',
},
],
},
{
key: 13,
name: 'Jim Green sr.',
enName: 'lllll',
describe: 'London No. 1 Lake Park',
children: [
{
key: 131,
name: 'Jim Green',
enName: 'yyjjg',
describe: 'London No. 2 Lake Park',
children: [
{
key: 1311,
name: 'Jim Green jr.',
enName: 'uioo',
describe: 'London No. 3 Lake Park',
},
{
key: 1312,
name: 'Jimmy Green sr.',
enName: 'jhkj',
describe: 'London No. 4 Lake Park',
},
],
},
],
},
],
},
{
key: 2,
name: 'Joe Black',
enName: 'trttt',
describe: 'Sidney No. 1 Lake Park',
},
],
selectedRowKeys:[]
}
},
mounted() {
},
methods:{
//删除
onDelete(val){
},
//编辑
actionEdit(val){
this.$emit('editDict',true)
},
onSelectAll(selected) {
if (selected) {
const tabData = this.tabData;
const arr = [];
setVal(tabData, arr);
this.selectedRowKeys = arr;
} else {
this.selectedRowKeys = [];
}
function setVal(list, arr) {
list.forEach(v => {
arr.push(v.key);
if (v.children) {
setVal(v.children, arr);
}
});
}
},
onSelect(record, selected) {
const set = new Set(this.selectedRowKeys);
const tabData = this.tabData;
const key = record.key;
if (selected) {
set.add(key);
record.children && setChildCheck(record.children);
setParentCheck(key);
} else {
set.delete(key);
record.children && setChildUncheck(record.children);
setParentUncheck(key);
}
this.selectedRowKeys = Array.from(set);
// 设置父级选择
function setParentCheck(key) {
let parent = getParent(key);
if (parent) {
set.add(parent.key);
setParentCheck(parent.key);
}
}
// 设置父级取消，如果父级的子集有选择，则不取消
function setParentUncheck(key) {
let childHasCheck = false,
parent = getParent(key);
if (parent) {
let childlist = parent.children;
childlist.forEach(function(v) {
if (set.has(v.key)) childHasCheck = true;
});
if (!childHasCheck) {
set.delete(parent.key);
setParentUncheck(parent.key);
}
}
}
// 获取当前对象的父级
function getParent(key) {
for (let i = 0; i < tabData.length; i++) {
if (tabData[i].key === key) {
return null;
}
}
return _getParent(tabData);
function _getParent(list) {
let childlist,
isExist = false;
for (let i = 0; i < list.length; i++) {
if ((childlist = list[i].children)) {
childlist.forEach(function(v) {
if (v.key === key) isExist = true;
});
if (isExist) {
return list[i];
}
if (_getParent(childlist)) {
return _getParent(childlist);
}
}
}
}
}
// 设置child全选
function setChildCheck(list) {
list.forEach(function(v) {
set.add(v.key);
v.children && setChildCheck(v.children);
});
}
// 设置child取消
function setChildUncheck(list) {
list.forEach(function(v) {
set.delete(v.key);
v.children && setChildUncheck(v.children);
});
}
}
}
}
</script>
<style lang="less" scoped>
.tree-table{
.tree-table-content{
.tree-table-con{
.action-edit{
margin-right: 10px;
}
.action-delete{
color: red;
}
}
}
}
</style>
jero-web/src/views/documentManage/tags/tabs/tabTable.vue
+12 -2
View File
@@ -16,7 +16,14 @@
<span slot="action" slot-scope="text, record">
<a @click="editVisible(record.id)">编辑</a>
<a-divider type="vertical" />
<a class="table-del">删除</a>
<a-popconfirm
v-if="tableData.length"
title="Sure to delete?"
@confirm="() => deleteVisible(record.id)"
>
<a class="table-del" href="javascript:;">删除</a>
</a-popconfirm>
<!-- <a class="table-del" @click="deleteVisible(record.id)">删除</a>-->
</span>
</a-table>
</div>
@@ -49,7 +56,10 @@
},
editVisible(id){
this.$emit('visibleEd',true,id)
this.$emit('visibleEd',true,id,'编辑标签项')
},
deleteVisible(id){
this.$emit('visibleDelete',id)
}
}
}
jero-web/src/views/documentManage/tags/tabs/tagContent.vue
+102 -19
View File
@@ -23,7 +23,6 @@
<a-modal class="show-content" v-model="contentVisible" title="新增" ok-text="保存" cancel-text="取消" @ok="hideModal" @cancel="cancelModel" v-if="contentVisible">
<a-form-model
class="tag-content"
ref="ruleForm"
:model="form"
:rules="rules"
@@ -57,20 +56,40 @@
</a-form-model>
</a-modal>
<a-table bordered :data-source="tableData" :columns="columns" :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }">
<template slot="name" slot-scope="text, record">
<editable-cell :text="text" @change="onCellChange(record.key, 'name', $event)" />
</template>
<template slot="operation" slot-scope="text, record">
<a-table bordered :data-source="tableData" :columns="columns" :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }" class="tag-con-table">
<template slot="action" slot-scope="text, record">
<a-popover placement="right" v-model="typeVisible[record.key]" trigger="click">
<template slot="content" class="type-popover-content">
<div class="type-popover">
<p class="type type-input" @click="handleDicPop(record,'list')">下拉选择</p>
<p class="type type-select" @click="handleDicPop(record,'tree')">树状结构</p>
</div>
</template>
<a class="action-dict" href="javascript:;">字典配置</a>
</a-popover>
<a class="action-edit" href="javascript:;" @click="actionEdit(record)">编辑</a>
<a-popconfirm
v-if="dataSource.length"
v-if="tableData.length"
title="Sure to delete?"
@confirm="() => onDelete(record.key)"
@confirm="() => onDelete(record)"
>
<a href="javascript:;">Delete</a>
<a class="action-delete" href="javascript:;">删除</a>
</a-popconfirm>
</template>
</a-table>
<a-drawer
class="dict-drawer"
title="字典列表"
placement="right"
:closable="true"
:visible="dicVisible"
:after-visible-change="afterDicVisibleChange"
@close="onDicClose"
width="1000px"
>
<dic-list :dictVal="dictVal" v-if="dicVisible"></dic-list>
</a-drawer>
<!-- <tab-table :tableData="tableData" :columns="columns"></tab-table>-->
</div>
@@ -78,10 +97,12 @@
<script>
import tabTable from './tabTable'
import dicList from '../dialog/dicList'
export default {
name: 'tagContent',
components:{
tabTable
tabTable,
dicList
},
data(){
return{
@@ -132,8 +153,8 @@
width: 170
}
],
labelCol: { span: 4 },
wrapperCol: { span: 14 },
labelCol: { span:4 },
wrapperCol: { span: 18 },
form:{},
rules:{
tagName:[{ required: true, message: '请输入标签名称', trigger: 'change' },
@@ -142,7 +163,11 @@
{ required: true, message: '请选择标签类型', trigger: 'blur' },
],
}
},
typeVisible:{},
dicVisible:false,
dictVal:'',
}
},
computed:{
@@ -162,10 +187,10 @@
this.contentVisible=true
},
hideModal(){
console.log('form',this.form)
this.$refs.ruleForm.validate((valide)=>{
// console.log('form',this.form)
this.$refs.ruleForm.validate((valid)=>{
// console.log('valide',valide)
if(valide){
if(valid){
this.contentVisible=false
}
@@ -178,17 +203,75 @@
onCellChange(){
},
onDelete(){
//删除
onDelete(val){
console.log('delval',val)
},
onSelectChange(selectedRowKeys) {
console.log('selectedRowKeys changed: ', selectedRowKeys);
this.selectedRowKeys = selectedRowKeys;
},
//编辑
actionEdit(val){
this.contentVisible=true
},
//字典配置
handleDicPop(record,val){
this.dictVal=val
if(val=='list'){
this.typeVisible[record.key]=false
this.dicVisible=true
}else if(val == 'tree'){
this.typeVisible[record.key]=false
this.dicVisible=true
}
},
afterDicVisibleChange(val) {
console.log('visible', val);
},
//字典列表关闭
onDicClose() {
this.dicVisible = false;
},
}
}
</script>
<style scoped>
<style lang="less" scoped>
.tag-content{
.tag-con-table{
.action-dict,.action-edit{
margin-right: 10px;
}
.action-delete{
color:red;
}
}
}
.type-popover{
p{
margin:5px 0;
}
p:hover{
cursor: pointer;
color:#0c8fcf;
}
}
.dict-drawer{
.ant-drawer-content-wrapper{
width: 100%;
}
}
</style>
<style lang="less">
.show-content{
.ant-modal-footer{
text-align: center;
}
}
</style>
jero-web/src/views/documentManage/tags/tabs/tagItem.vue
+48 -13
View File
@@ -38,7 +38,7 @@
<a-button type="primary" @click="handleShow">展示区域管理</a-button>
</div>
<a-drawer class="show-drawer" :title="titleTag" placement="right" width="1000px" @close="close" :visible="drawerVisible" :after-visible-change="afterVisibleChange" >
<new-drawer v-if="drawerVisible" :isTagContent="isTagContent" :editData="editData" @closeTag="closeTag"></new-drawer>
<new-drawer v-if="drawerVisible&&editFlag" :drawerVisible="drawerVisible" :isTagContent="isTagContent" :editData="editData" :editId="editId" :submitEdit="submitEdit" @closeTag="closeTag" ></new-drawer>
</a-drawer>
<a-modal class="show-area" v-model="areaVisible" title="展示区域管理" :footer="null" @cancel="hideModal">
<area-manage v-if="areaVisible" @diaHide="diaHide" :areaTable="areaTable" @submitOk="submitOk" @deleteOk="deleteOk" @updateOk="updateOk"></area-manage>
@@ -46,7 +46,7 @@
<div class="tag-doc-tab">
<a-tabs default-active-key="1" @change="callbackTab">
<a-tab-pane key="1" tab="文档库">
<tabTable :tableData="tableData" :columns="taglabColumns" @visibleEd="visibleEd"></tabTable>
<tabTable :tableData="tableData" :columns="taglabColumns" @visibleEd="visibleEd" @visibleDelete="visibleDelete"></tabTable>
</a-tab-pane>
<a-tab-pane key="2" tab="文档拆分" force-render>
<tabTable :tableData="tableData" :columns="tagSplit"></tabTable>
@@ -57,7 +57,7 @@
</template>
<script>
import { putAction,postAction,getAction } from '@/api/manage'
import { putAction,postAction,getAction,deleteAction } from '@/api/manage'
import JInput from '@/components/jero/JInput'
import tabTable from './tabTable'
import areaManage from '../dialog/areaManage'
@@ -81,7 +81,8 @@
titleTag:'新增标签项',
typeVisible:false,
isTagContent:false,
editData:[], //编辑的数据
editData:{}, //编辑的数据
editFlag:true,
areas:[
{
value: 1,
@@ -115,18 +116,16 @@
],
taglabColumns: [
{
dataIndex: 'dbFieldName',
key: 'dbFieldName',
slots: { title: 'customTitle' },
scopedSlots: { customRender: 'dbFieldName' },
title: '中文名称',
align: "center",
width: 100,
dataIndex: 'dbFieldTxt',
},
{
title: '英文名称',
align: "center",
width: 100,
dataIndex: 'dbFieldEnName',
dataIndex: 'dbFieldName',
},
{
title: '属性类型',
@@ -138,7 +137,7 @@
title: '字段长度',
align: "center",
width: 80,
dataIndex: 'fieldLength'
dataIndex: 'dbLength'
},
{
title: '展示顺序',
@@ -198,7 +197,9 @@
areaVisible:false,
areaTable:[],
drawerVisible:false,
value:1
value:1,
editId:'',
submitEdit:'add'
}
},
mounted() {
@@ -213,6 +214,7 @@
},
handleAdd(){
this.drawerVisible=true
},
//区域管理列表数据
@@ -270,33 +272,66 @@
this.handleShow()
},
//编辑
visibleEd(val,id){
visibleEd(val,id,title){
this.editFlag=false
this.drawerVisible=val
this.titleTag=title
this.editId=id
this.submitEdit='edit'
let params={
id:id
}
getAction(`Field/onlCgformField/queryById`,params).then(res=>{
getAction(`tag/onlCgformTag/queryById`,params).then(res=>{
if(res.success){
this.editData=res.result
this.editFlag=true
}
})
},
//删除
visibleDelete(id){
let params={
id:id
}
// deleteAction(that.url.delete, {depId: this.currentDeptId, userId: id}).then((res) => {
// if (res.success) {
//
// }
// })
deleteAction(`tag/onlCgformTag/delete`,params).then(res=>{
if(res.success){
this.$message('删除成功')
}
})
},
//新增关闭
closeTag(val){
this.drawerVisible=val
this.loadData(1)
},
afterVisibleChange(val){
// console.log('val',val)
},
handleAddPop(val){
this.drawerVisible=true
this.titleTag='新增标签项'
this.submitEdit='add'
if(val=='input'){
this.typeVisible=false
this.isTagContent=false
// this.getFormCon()
} else if(val='select'){
this.typeVisible=false
this.isTagContent=true
}
},
//获取表单内容
getFormCon(){
getAction(`tag/onlCgformTag/list`, { }).then(res=>{
if(res.success){
}
})
}
}
}