标签编辑
This commit is contained in:
@@ -1,90 +1,101 @@
|
|||||||
<template>
|
<template>
|
||||||
<a-spin :spinning="confirmLoading">
|
<!-- <a-spin :spinning="confirmLoading">-->
|
||||||
<j-form-container :disabled="formDisabled">
|
<!-- <j-form-container :disabled="formDisabled">-->
|
||||||
<a-form :form="form" slot="detail">
|
<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>
|
<a-row>
|
||||||
<p class="tag-info">基本信息</p>
|
<p class="tag-info">基本信息</p>
|
||||||
<a-divider dashed />
|
<a-divider dashed />
|
||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<a-form-item label="所属模块" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-form-model-item label="所属模块" prop="isModel">
|
||||||
<j-dict-select-tag type="list" v-decorator="['isModel', validatorRules.isModel]" :trigger-change="true" dictCode="module" placeholder="请选择所属模块" />
|
<j-dict-select-tag type="list" v-model="form.isModel" dictCode="module" placeholder="请选择所属模块" />
|
||||||
</a-form-item>
|
</a-form-model-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<a-form-item label="属性名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-form-model-item label="属性名称" prop="dbFieldTxt">
|
||||||
<a-input v-decorator="['dbFieldTxt', validatorRules.dbFieldTxt]" placeholder="请输入属性名称" :maxLength="120" ></a-input>
|
<a-input v-model="form.dbFieldTxt" placeholder="请输入属性名称" :maxLength="120" ></a-input>
|
||||||
</a-form-item>
|
</a-form-model-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<a-form-item label="英文名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-form-model-item label="英文名称" prop="dbFieldName">
|
||||||
<a-input v-decorator="['dbFieldName', validatorRules.dbFieldName]" placeholder="请输入英文名称" :maxLength="120" ></a-input>
|
<a-input v-model="form.dbFieldName" placeholder="请输入英文名称" :maxLength="120" ></a-input>
|
||||||
</a-form-item>
|
</a-form-model-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<a-form-item label="属性类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-form-model-item label="属性类型" prop="fieldShowType">
|
||||||
<j-dict-select-tag type="list" v-decorator="['fieldShowType', validatorRules.fieldShowType]" :trigger-change="true" dictCode="attribute_type" placeholder="请选择属性类型" />
|
<j-dict-select-tag type="list" v-model="form.fieldShowType" dictCode="attribute_type" placeholder="请选择属性类型" />
|
||||||
</a-form-item>
|
</a-form-model-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :span="24" v-if="isTagContent">
|
<a-col :span="24" v-if="isTagContent">
|
||||||
<a-form-item label="选项内容" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-form-model-item label="选项内容" prop="dictName">
|
||||||
<j-dict-select-tag type="list" v-decorator="['dictName', validatorRules.dictName]" :trigger-change="true" dictCode="sys_dict,选项内容,dict_name" placeholder="请选择选项内容" />
|
<j-dict-select-tag type="list" v-model="form.dictName" dictCode="" placeholder="请选择选项内容" />
|
||||||
</a-form-item>
|
</a-form-model-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<a-form-item label="字段长度" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-form-model-item label="字段长度" prop="dbLength">
|
||||||
<a-input-number v-decorator="['dbLength', validatorRules.dbLength]" :min="1" :max="200" placeholder="请输入字段长度" style="width: 100%" :formatter="limitNumber" :parser="limitNumber" />
|
<a-input-number v-model="form.dbLength" :min="1" :max="200" placeholder="请输入字段长度" style="width: 100%" :formatter="limitNumber" :parser="limitNumber" />
|
||||||
</a-form-item>
|
</a-form-model-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<a-form-item label="展示顺序" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-form-model-item label="展示顺序" prop="orderNum">
|
||||||
<a-input-number v-decorator="['orderNum', validatorRules.orderNum]" placeholder="请输入展示顺序" style="width: 100%" :min="1" :formatter="limitNumber" :parser="limitNumber" />
|
<a-input-number v-model="form.orderNum" placeholder="请输入展示顺序" style="width: 100%" :min="1" :formatter="limitNumber" :parser="limitNumber" />
|
||||||
</a-form-item>
|
</a-form-model-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<a-form-item label="是否必填" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-form-model-item label="是否必填" prop="fieldMustInput">
|
||||||
<j-dict-select-tag type="list" v-decorator="['fieldMustInput', validatorRules.fieldMustInput]" :trigger-change="true" dictCode="yn" placeholder="请选择是否必填" />
|
<j-dict-select-tag type="list" v-model="form.fieldMustInput" dictCode="yn" placeholder="请选择是否必填" />
|
||||||
</a-form-item>
|
</a-form-model-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
|
|
||||||
|
|
||||||
<p class="tag-info">文档库模块展示</p>
|
<p class="tag-info">文档库模块展示</p>
|
||||||
<a-divider dashed />
|
<a-divider dashed />
|
||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<a-form-item label="文档库列表展示" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-form-model-item label="文档库列表展示" prop="isShowForm">
|
||||||
<j-dict-select-tag type="list" v-decorator="['isShowForm', validatorRules.isShowForm]" :trigger-change="true" dictCode="yn" placeholder="请选择是否文档库列表展示" />
|
<j-dict-select-tag type="list" v-model="form.isShowForm" dictCode="yn" placeholder="请选择是否文档库列表展示" />
|
||||||
</a-form-item>
|
</a-form-model-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<a-form-item label="展示区域" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-form-model-item label="展示区域" prop="showArea">
|
||||||
<j-dict-select-tag type="list" v-decorator="['showArea', validatorRules.showArea]" :trigger-change="true" dictCode="onl_cgform_area,展示区域,show_area" placeholder="请选择展示区域" />
|
<j-dict-select-tag type="list" v-model="form.showArea" dictCode="" placeholder="请选择展示区域" />
|
||||||
</a-form-item>
|
</a-form-model-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<a-form-item label="是否搜索" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-form-model-item label="是否搜索" prop="isQuery">
|
||||||
<j-dict-select-tag type="list" v-decorator="['isQuery', validatorRules.isQuery]" :trigger-change="true" dictCode="yn" placeholder="请选择是否搜索" />
|
<j-dict-select-tag type="list" v-model="form.isQuery" dictCode="yn" placeholder="请选择是否搜索" />
|
||||||
</a-form-item>
|
</a-form-model-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
|
|
||||||
|
|
||||||
<p class="tag-info">其它模块展示</p>
|
<p class="tag-info">其它模块展示</p>
|
||||||
<a-divider dashed />
|
<a-divider dashed />
|
||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<a-form-item label="法规清单展示" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-form-model-item label="法规清单展示" prop="isShowLawsList">
|
||||||
<j-dict-select-tag type="list" v-decorator="['isShowLawsList', validatorRules.isShowLawsList]" :trigger-change="true" dictCode="yn" placeholder="请选择法规清单是否展示" />
|
<j-dict-select-tag type="list" v-model="form.isShowLawsList" dictCode="yn" placeholder="请选择法规清单是否展示" />
|
||||||
</a-form-item>
|
</a-form-model-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<a-form-item label="搜索中心展示" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-form-model-item label="搜索中心展示" prop="isShowSearch">
|
||||||
<j-dict-select-tag type="list" v-decorator="['isShowSearch', validatorRules.isShowSearch]" :trigger-change="true" dictCode="yn" placeholder="请选择搜索中心是否展示" />
|
<j-dict-select-tag type="list" v-model="form.isShowSearch" dictCode="yn" placeholder="请选择搜索中心是否展示" />
|
||||||
</a-form-item>
|
</a-form-model-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<!-- <a-col v-if="showFlowSubmitButton" :span="24" style="text-align: center">-->
|
<!-- <a-col v-if="showFlowSubmitButton" :span="24" style="text-align: center">-->
|
||||||
<!-- <a-button @click="submitForm">提 交</a-button>-->
|
<!-- <a-button @click="submitForm">提 交</a-button>-->
|
||||||
<!-- </a-col>-->
|
<!-- </a-col>-->
|
||||||
</a-row>
|
</a-row>
|
||||||
|
</a-form-model>
|
||||||
</a-form>
|
</a-form>
|
||||||
</j-form-container>
|
</div>
|
||||||
</a-spin>
|
<!-- </j-form-container>-->
|
||||||
|
<!-- </a-spin>-->
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
@@ -119,11 +130,24 @@
|
|||||||
isTagContent:{
|
isTagContent:{
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false,
|
||||||
|
},
|
||||||
|
drawerVisible:{
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
editData:{
|
||||||
|
type: Object,
|
||||||
|
},
|
||||||
|
editId:{
|
||||||
|
type:String
|
||||||
|
},
|
||||||
|
submitEdit:{
|
||||||
|
type:String
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
form: this.$form.createForm(this),
|
form: {},
|
||||||
model: {},
|
model: {},
|
||||||
labelCol: {
|
labelCol: {
|
||||||
xs: { span: 24 },
|
xs: { span: 24 },
|
||||||
@@ -135,72 +159,47 @@
|
|||||||
},
|
},
|
||||||
confirmLoading: false,
|
confirmLoading: false,
|
||||||
validatorRules: {
|
validatorRules: {
|
||||||
isModel: {
|
isModel: [
|
||||||
rules: [
|
{ required: true, message: '请输入所属模块!',trigger: 'change'},
|
||||||
{ required: true, message: '请输入所属模块!'},
|
],
|
||||||
]
|
dbFieldTxt: [
|
||||||
},
|
{ required: true, message: '请输入属性名称!',trigger: 'blur'},
|
||||||
dbFieldTxt: {
|
],
|
||||||
rules: [
|
dbFieldName: [
|
||||||
{ required: true, message: '请输入属性名称!'},
|
{ required: true, message: '请输入英文名称!',trigger: 'blur'},
|
||||||
]
|
],
|
||||||
},
|
fieldShowType: [
|
||||||
dbFieldName: {
|
{ required: true, message: '请输入属性类型!',trigger: 'change'},
|
||||||
rules: [
|
],
|
||||||
{ required: true, message: '请输入英文名称!'},
|
dictName: [
|
||||||
]
|
// { required: true, message: '请输入选项内容!',trigger: 'change'},
|
||||||
},
|
],
|
||||||
fieldShowType: {
|
dbLength: [
|
||||||
rules: [
|
{ required: true, message: '请输入字段长度!',trigger: 'blur'},
|
||||||
{ required: true, message: '请输入属性类型!'},
|
],
|
||||||
]
|
orderNum: [
|
||||||
},
|
{ required: true, message: '请输入展示顺序!',trigger: 'blur'},
|
||||||
dictName: {
|
],
|
||||||
rules: [
|
fieldMustInput: [
|
||||||
// { required: true, message: '请输入选项内容!'},
|
{ required: true, message: '请输入字段是否必填!',trigger: 'change'},
|
||||||
]
|
],
|
||||||
},
|
isShowForm: [
|
||||||
dbLength: {
|
{ required: true, message: '请选择是否显示文档库列表',trigger: 'change'},
|
||||||
rules: [
|
],
|
||||||
{ required: true, message: '请输入字段长度!'},
|
showArea: [
|
||||||
]
|
// { required: true, message: '请输入展示区域!',trigger: 'change'},
|
||||||
},
|
],
|
||||||
orderNum: {
|
isQuery: [
|
||||||
rules: [
|
{ required: true, message: '请输入是否查询条件',trigger: 'change'},
|
||||||
{ required: true, message: '请输入展示顺序!'},
|
],
|
||||||
]
|
isShowLawsList: [
|
||||||
},
|
{ required: true, message: '请选择法规清单是否展示!',trigger: 'change'},
|
||||||
fieldMustInput: {
|
],
|
||||||
rules: [
|
isShowSearch: [
|
||||||
{ required: true, message: '请输入字段是否必填!'},
|
{ required: true, message: '请选择搜索中心是否展示!',trigger: 'change'},
|
||||||
]
|
],
|
||||||
},
|
|
||||||
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: '请选择搜索中心是否展示!'},
|
|
||||||
]
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
|
addVisible:false,
|
||||||
url: {
|
url: {
|
||||||
add: "tag/onlCgformTag/add",
|
add: "tag/onlCgformTag/add",
|
||||||
edit: "tag/onlCgformTag/edit",
|
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: {
|
computed: {
|
||||||
|
changeType(val){
|
||||||
|
console.log('changtType',val)
|
||||||
|
},
|
||||||
formDisabled(){
|
formDisabled(){
|
||||||
if(this.formBpm===true){
|
if(this.formBpm===true){
|
||||||
if(this.formData.disabled===false){
|
if(this.formData.disabled===false){
|
||||||
@@ -231,16 +251,22 @@
|
|||||||
//如果是流程中表单,则需要加载流程表单data
|
//如果是流程中表单,则需要加载流程表单data
|
||||||
this.showFlowData();
|
this.showFlowData();
|
||||||
},
|
},
|
||||||
|
mounted() {
|
||||||
|
console.log('edit3333',this.editData)
|
||||||
|
this.form={...this.editData}
|
||||||
|
// console.log('drawerVisible',this.drawerVisible)
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
add () {
|
add () {
|
||||||
this.edit({});
|
this.edit({});
|
||||||
|
|
||||||
},
|
},
|
||||||
edit (record) {
|
edit (record) {
|
||||||
this.form.resetFields();
|
this.form.resetFields();
|
||||||
this.model = Object.assign({}, record);
|
this.model = Object.assign({}, record);
|
||||||
this.visible = true;
|
this.visible = true;
|
||||||
this.$nextTick(() => {
|
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 () {
|
submitForm () {
|
||||||
const that = this;
|
// const that = this;
|
||||||
// 触发表单验证
|
// 触发表单验证
|
||||||
this.form.validateFields((err, values) => {
|
// console.log(this.$refs.tagform)
|
||||||
if (!err) {
|
this.$refs.tagEditForm.validate((valid)=>{
|
||||||
that.confirmLoading = true;
|
// console.log('valid',valid)
|
||||||
|
if (valid) {
|
||||||
|
this.confirmLoading = true;
|
||||||
let httpurl = '';
|
let httpurl = '';
|
||||||
let method = '';
|
let method = '';
|
||||||
if(!this.model.id){
|
console.log('this.editId',this.editId)
|
||||||
|
if(this.submitEdit=='add'){
|
||||||
httpurl+=this.url.add;
|
httpurl+=this.url.add;
|
||||||
method = 'post';
|
method = 'post';
|
||||||
}else{
|
this.form.id=''
|
||||||
|
}else if(this.submitEdit=='edit'){
|
||||||
httpurl+=this.url.edit;
|
httpurl+=this.url.edit;
|
||||||
method = 'put';
|
method = 'put';
|
||||||
|
this.form.id=this.editId
|
||||||
}
|
}
|
||||||
let formData = Object.assign(this.model, values);
|
|
||||||
console.log("表单提交数据",formData)
|
// let formData = Object.assign(this.editId, this.form);
|
||||||
httpAction(httpurl,formData,method).then((res)=>{
|
// console.log("表单提交数据",this.form)
|
||||||
|
httpAction(httpurl,this.form,method).then((res)=>{
|
||||||
if(res.success){
|
if(res.success){
|
||||||
that.$message.success(res.message);
|
this.$message.success(res.message);
|
||||||
that.$emit('ok',false);
|
this.$emit('ok',false);
|
||||||
|
|
||||||
}else{
|
}else{
|
||||||
that.$message.warning(res.message);
|
this.$message.warning(res.message);
|
||||||
}
|
}
|
||||||
}).finally(() => {
|
}).finally(() => {
|
||||||
that.confirmLoading = false;
|
this.confirmLoading = false;
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -303,6 +335,11 @@
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
|
.form-tag{
|
||||||
|
.tag-content{
|
||||||
|
margin-bottom: 30px;
|
||||||
|
}
|
||||||
|
}
|
||||||
.tag-info{
|
.tag-info{
|
||||||
margin-left: 30px;
|
margin-left: 30px;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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>
|
||||||
@@ -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>
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="new-tag-drawer">
|
<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">
|
<div class="drawer-footer">
|
||||||
<a-button v-if="!disableSubmit" @click="handleOk" type="primary" style="margin-bottom: 0;">保存</a-button>
|
<a-button v-if="!disableSubmit" @click="handleOk" type="primary" style="margin-bottom: 0;">保存</a-button>
|
||||||
@@ -28,7 +28,10 @@
|
|||||||
},
|
},
|
||||||
props:{
|
props:{
|
||||||
drawerVisible:Boolean,
|
drawerVisible:Boolean,
|
||||||
isTagContent:Boolean
|
isTagContent:Boolean,
|
||||||
|
editData:Object,
|
||||||
|
editId:String,
|
||||||
|
submitEdit:String
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.visible=this.drawerVisible
|
this.visible=this.drawerVisible
|
||||||
|
|||||||
@@ -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>
|
||||||
@@ -16,7 +16,14 @@
|
|||||||
<span slot="action" slot-scope="text, record">
|
<span slot="action" slot-scope="text, record">
|
||||||
<a @click="editVisible(record.id)">编辑</a>
|
<a @click="editVisible(record.id)">编辑</a>
|
||||||
<a-divider type="vertical" />
|
<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>
|
</span>
|
||||||
</a-table>
|
</a-table>
|
||||||
</div>
|
</div>
|
||||||
@@ -49,7 +56,10 @@
|
|||||||
|
|
||||||
},
|
},
|
||||||
editVisible(id){
|
editVisible(id){
|
||||||
this.$emit('visibleEd',true,id)
|
this.$emit('visibleEd',true,id,'编辑标签项')
|
||||||
|
},
|
||||||
|
deleteVisible(id){
|
||||||
|
this.$emit('visibleDelete',id)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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-modal class="show-content" v-model="contentVisible" title="新增" ok-text="保存" cancel-text="取消" @ok="hideModal" @cancel="cancelModel" v-if="contentVisible">
|
||||||
<a-form-model
|
<a-form-model
|
||||||
class="tag-content"
|
class="tag-content"
|
||||||
|
|
||||||
ref="ruleForm"
|
ref="ruleForm"
|
||||||
:model="form"
|
:model="form"
|
||||||
:rules="rules"
|
:rules="rules"
|
||||||
@@ -57,20 +56,40 @@
|
|||||||
</a-form-model>
|
</a-form-model>
|
||||||
</a-modal>
|
</a-modal>
|
||||||
|
|
||||||
<a-table bordered :data-source="tableData" :columns="columns" :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }">
|
<a-table bordered :data-source="tableData" :columns="columns" :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }" class="tag-con-table">
|
||||||
<template slot="name" slot-scope="text, record">
|
|
||||||
<editable-cell :text="text" @change="onCellChange(record.key, 'name', $event)" />
|
<template slot="action" slot-scope="text, record">
|
||||||
</template>
|
<a-popover placement="right" v-model="typeVisible[record.key]" trigger="click">
|
||||||
<template slot="operation" slot-scope="text, record">
|
<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
|
<a-popconfirm
|
||||||
v-if="dataSource.length"
|
v-if="tableData.length"
|
||||||
title="Sure to delete?"
|
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>
|
</a-popconfirm>
|
||||||
</template>
|
</template>
|
||||||
</a-table>
|
</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>-->
|
<!-- <tab-table :tableData="tableData" :columns="columns"></tab-table>-->
|
||||||
</div>
|
</div>
|
||||||
@@ -78,10 +97,12 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
import tabTable from './tabTable'
|
import tabTable from './tabTable'
|
||||||
|
import dicList from '../dialog/dicList'
|
||||||
export default {
|
export default {
|
||||||
name: 'tagContent',
|
name: 'tagContent',
|
||||||
components:{
|
components:{
|
||||||
tabTable
|
tabTable,
|
||||||
|
dicList
|
||||||
},
|
},
|
||||||
data(){
|
data(){
|
||||||
return{
|
return{
|
||||||
@@ -132,8 +153,8 @@
|
|||||||
width: 170
|
width: 170
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
labelCol: { span: 4 },
|
labelCol: { span:4 },
|
||||||
wrapperCol: { span: 14 },
|
wrapperCol: { span: 18 },
|
||||||
form:{},
|
form:{},
|
||||||
rules:{
|
rules:{
|
||||||
tagName:[{ required: true, message: '请输入标签名称', trigger: 'change' },
|
tagName:[{ required: true, message: '请输入标签名称', trigger: 'change' },
|
||||||
@@ -142,7 +163,11 @@
|
|||||||
{ required: true, message: '请选择标签类型', trigger: 'blur' },
|
{ required: true, message: '请选择标签类型', trigger: 'blur' },
|
||||||
|
|
||||||
],
|
],
|
||||||
}
|
},
|
||||||
|
typeVisible:{},
|
||||||
|
dicVisible:false,
|
||||||
|
dictVal:'',
|
||||||
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed:{
|
computed:{
|
||||||
@@ -162,10 +187,10 @@
|
|||||||
this.contentVisible=true
|
this.contentVisible=true
|
||||||
},
|
},
|
||||||
hideModal(){
|
hideModal(){
|
||||||
console.log('form',this.form)
|
// console.log('form',this.form)
|
||||||
this.$refs.ruleForm.validate((valide)=>{
|
this.$refs.ruleForm.validate((valid)=>{
|
||||||
// console.log('valide',valide)
|
// console.log('valide',valide)
|
||||||
if(valide){
|
if(valid){
|
||||||
this.contentVisible=false
|
this.contentVisible=false
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -178,17 +203,75 @@
|
|||||||
onCellChange(){
|
onCellChange(){
|
||||||
|
|
||||||
},
|
},
|
||||||
onDelete(){
|
//删除
|
||||||
|
onDelete(val){
|
||||||
|
console.log('delval',val)
|
||||||
},
|
},
|
||||||
onSelectChange(selectedRowKeys) {
|
onSelectChange(selectedRowKeys) {
|
||||||
console.log('selectedRowKeys changed: ', selectedRowKeys);
|
console.log('selectedRowKeys changed: ', selectedRowKeys);
|
||||||
this.selectedRowKeys = 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>
|
</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>
|
</style>
|
||||||
@@ -38,7 +38,7 @@
|
|||||||
<a-button type="primary" @click="handleShow">展示区域管理</a-button>
|
<a-button type="primary" @click="handleShow">展示区域管理</a-button>
|
||||||
</div>
|
</div>
|
||||||
<a-drawer class="show-drawer" :title="titleTag" placement="right" width="1000px" @close="close" :visible="drawerVisible" :after-visible-change="afterVisibleChange" >
|
<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-drawer>
|
||||||
<a-modal class="show-area" v-model="areaVisible" title="展示区域管理" :footer="null" @cancel="hideModal">
|
<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>
|
<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">
|
<div class="tag-doc-tab">
|
||||||
<a-tabs default-active-key="1" @change="callbackTab">
|
<a-tabs default-active-key="1" @change="callbackTab">
|
||||||
<a-tab-pane key="1" tab="文档库">
|
<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>
|
||||||
<a-tab-pane key="2" tab="文档拆分" force-render>
|
<a-tab-pane key="2" tab="文档拆分" force-render>
|
||||||
<tabTable :tableData="tableData" :columns="tagSplit"></tabTable>
|
<tabTable :tableData="tableData" :columns="tagSplit"></tabTable>
|
||||||
@@ -57,7 +57,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { putAction,postAction,getAction } from '@/api/manage'
|
import { putAction,postAction,getAction,deleteAction } from '@/api/manage'
|
||||||
import JInput from '@/components/jero/JInput'
|
import JInput from '@/components/jero/JInput'
|
||||||
import tabTable from './tabTable'
|
import tabTable from './tabTable'
|
||||||
import areaManage from '../dialog/areaManage'
|
import areaManage from '../dialog/areaManage'
|
||||||
@@ -81,7 +81,8 @@
|
|||||||
titleTag:'新增标签项',
|
titleTag:'新增标签项',
|
||||||
typeVisible:false,
|
typeVisible:false,
|
||||||
isTagContent:false,
|
isTagContent:false,
|
||||||
editData:[], //编辑的数据
|
editData:{}, //编辑的数据
|
||||||
|
editFlag:true,
|
||||||
areas:[
|
areas:[
|
||||||
{
|
{
|
||||||
value: 1,
|
value: 1,
|
||||||
@@ -115,18 +116,16 @@
|
|||||||
],
|
],
|
||||||
taglabColumns: [
|
taglabColumns: [
|
||||||
{
|
{
|
||||||
dataIndex: 'dbFieldName',
|
title: '中文名称',
|
||||||
key: 'dbFieldName',
|
|
||||||
slots: { title: 'customTitle' },
|
|
||||||
scopedSlots: { customRender: 'dbFieldName' },
|
|
||||||
align: "center",
|
align: "center",
|
||||||
width: 100,
|
width: 100,
|
||||||
|
dataIndex: 'dbFieldTxt',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '英文名称',
|
title: '英文名称',
|
||||||
align: "center",
|
align: "center",
|
||||||
width: 100,
|
width: 100,
|
||||||
dataIndex: 'dbFieldEnName',
|
dataIndex: 'dbFieldName',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '属性类型',
|
title: '属性类型',
|
||||||
@@ -138,7 +137,7 @@
|
|||||||
title: '字段长度',
|
title: '字段长度',
|
||||||
align: "center",
|
align: "center",
|
||||||
width: 80,
|
width: 80,
|
||||||
dataIndex: 'fieldLength'
|
dataIndex: 'dbLength'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '展示顺序',
|
title: '展示顺序',
|
||||||
@@ -198,7 +197,9 @@
|
|||||||
areaVisible:false,
|
areaVisible:false,
|
||||||
areaTable:[],
|
areaTable:[],
|
||||||
drawerVisible:false,
|
drawerVisible:false,
|
||||||
value:1
|
value:1,
|
||||||
|
editId:'',
|
||||||
|
submitEdit:'add'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
@@ -213,6 +214,7 @@
|
|||||||
},
|
},
|
||||||
handleAdd(){
|
handleAdd(){
|
||||||
this.drawerVisible=true
|
this.drawerVisible=true
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
//区域管理列表数据
|
//区域管理列表数据
|
||||||
@@ -270,33 +272,66 @@
|
|||||||
this.handleShow()
|
this.handleShow()
|
||||||
},
|
},
|
||||||
//编辑
|
//编辑
|
||||||
visibleEd(val,id){
|
visibleEd(val,id,title){
|
||||||
|
this.editFlag=false
|
||||||
this.drawerVisible=val
|
this.drawerVisible=val
|
||||||
|
this.titleTag=title
|
||||||
|
this.editId=id
|
||||||
|
this.submitEdit='edit'
|
||||||
let params={
|
let params={
|
||||||
id:id
|
id:id
|
||||||
}
|
}
|
||||||
getAction(`Field/onlCgformField/queryById`,params).then(res=>{
|
getAction(`tag/onlCgformTag/queryById`,params).then(res=>{
|
||||||
if(res.success){
|
if(res.success){
|
||||||
this.editData=res.result
|
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){
|
closeTag(val){
|
||||||
this.drawerVisible=val
|
this.drawerVisible=val
|
||||||
|
this.loadData(1)
|
||||||
},
|
},
|
||||||
afterVisibleChange(val){
|
afterVisibleChange(val){
|
||||||
// console.log('val',val)
|
// console.log('val',val)
|
||||||
},
|
},
|
||||||
handleAddPop(val){
|
handleAddPop(val){
|
||||||
this.drawerVisible=true
|
this.drawerVisible=true
|
||||||
|
this.titleTag='新增标签项'
|
||||||
|
this.submitEdit='add'
|
||||||
if(val=='input'){
|
if(val=='input'){
|
||||||
this.typeVisible=false
|
this.typeVisible=false
|
||||||
this.isTagContent=false
|
this.isTagContent=false
|
||||||
|
// this.getFormCon()
|
||||||
} else if(val='select'){
|
} else if(val='select'){
|
||||||
this.typeVisible=false
|
this.typeVisible=false
|
||||||
this.isTagContent=true
|
this.isTagContent=true
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
//获取表单内容
|
||||||
|
getFormCon(){
|
||||||
|
getAction(`tag/onlCgformTag/list`, { }).then(res=>{
|
||||||
|
if(res.success){
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user