Commit c0623cee authored by 仇晓婷's avatar 仇晓婷

样式修改

parent b7759b27
<template> <template>
<Form ref="form" :model="entity" :rules="rules" :label-width="90" > <Form ref="form" :model="entity" :rules="rules" :label-width="90">
<Row> <Row>
<Col :span="24"> <Col :span="24">
<FormItem :label="l('title')" prop="title"> <FormItem :label="l('title')" prop="title">
...@@ -14,13 +14,12 @@ ...@@ -14,13 +14,12 @@
</Col> </Col>
<Col :span="24"> <Col :span="24">
<FormItem :label="l('menuIds')" style="margin-bottom:0px"></FormItem> <FormItem :label="l('menuIds')" style="margin-bottom:0px"></FormItem>
</Col> </Col>
<Col :span="24"> <Col :span="24">
<div style="overflow:auto;height:320px;margin-left: 60px;margin-bottom:16px"> <div style="overflow:auto;height:320px;margin-left: 60px;margin-bottom:16px">
<Tree ref="tree" :data="menuData" show-checkbox multiple ></Tree> <Tree ref="tree" :data="menuData" show-checkbox multiple></Tree>
</div> </div>
</Col> </Col>
</Row> </Row>
<FormItem> <FormItem>
...@@ -31,43 +30,43 @@ ...@@ -31,43 +30,43 @@
</template> </template>
<script> <script>
import Api from "./api"; import Api from "./api";
import api1 from '../menu/api' import api1 from "../menu/api";
export default { export default {
name: "Add", name: "Add",
data() { data() {
return { return {
disabled: false, disabled: false,
entity: {status:1}, entity: { status: 1 },
menuData:[],//菜单树数据 menuData: [], //菜单树数据
menuIds:[],//勾选的菜单数组 menuIds: [], //勾选的菜单数组
rules: { rules: {
title: [{ required: true, message: "必填"}], title: [{ required: true, message: "必填" }],
status:[{ required: true, message: "必填" }] status: [{ required: true, message: "必填" }],
} },
}; };
}, },
props: { props: {
v: Object v: Object,
}, },
mounted(){ mounted() {
api1.getTree().then((v)=>{ api1.getTree().then((v) => {
this.menuData=v.result this.menuData = v.result;
}) });
}, },
methods: { methods: {
handleSubmit() { handleSubmit() {
this.$refs.form.validate(v => { this.$refs.form.validate((v) => {
if (v) { if (v) {
this.disabled = true; this.disabled = true;
//获取选中和半选的节点 //获取选中和半选的节点
let node=this.$refs.tree.getCheckedAndIndeterminateNodes(); let node = this.$refs.tree.getCheckedAndIndeterminateNodes();
let menuId=node.map(item=>{ let menuId = node.map((item) => {
return item.id return item.id;
}) });
this.entity.menuIds=this.menuIds=menuId this.entity.menuIds = this.menuIds = menuId;
//console.log(menuId) //console.log(menuId)
Api.create(this.entity) Api.create(this.entity)
.then(r => { .then((r) => {
this.disabled = false; this.disabled = false;
if (r.success) { if (r.success) {
this.$Message.success("保存成功"); this.$Message.success("保存成功");
...@@ -76,7 +75,7 @@ export default { ...@@ -76,7 +75,7 @@ export default {
this.$Message.error("保存失败"); this.$Message.error("保存失败");
} }
}) })
.catch(err => { .catch((err) => {
this.disabled = false; this.disabled = false;
this.$Message.error("保存失败"); this.$Message.error("保存失败");
console.warn(err); console.warn(err);
...@@ -90,12 +89,12 @@ export default { ...@@ -90,12 +89,12 @@ export default {
l(key) { l(key) {
key = "set_menu" + "." + key; key = "set_menu" + "." + key;
return this.$t(key); return this.$t(key);
} },
}, },
watch: { watch: {
v() { v() {
this.entity = this.$u.clone(this.v); this.entity = this.$u.clone(this.v);
} },
} },
}; };
</script> </script>
\ No newline at end of file
<template> <template>
<Form ref="form" :model="entity" :rules="rules" :label-width="90" > <Form ref="form" :model="entity" :rules="rules" :label-width="90">
<Row> <Row>
<Col :span="24"> <Col :span="24">
<FormItem :label="l('title')" prop="title"> <FormItem :label="l('title')" prop="title">
...@@ -14,83 +14,78 @@ ...@@ -14,83 +14,78 @@
</Col> </Col>
<Col :span="24"> <Col :span="24">
<FormItem :label="l('menuIds')" style="margin-bottom:0px"></FormItem> <FormItem :label="l('menuIds')" style="margin-bottom:0px"></FormItem>
</Col> </Col>
<Col :span="24"> <Col :span="24">
<div style="overflow:auto;height:320px;margin-left: 60px;margin-bottom:16px"> <div style="overflow:auto;height:320px;margin-left: 60px;margin-bottom:16px">
<Tree ref="tree" :data="menuData" show-checkbox multiple ></Tree> <Tree ref="tree" :data="menuData" show-checkbox multiple></Tree>
</div> </div>
</Col> </Col>
</Row> </Row>
</Form> </Form>
</template> </template>
<script> <script>
import Api from './api' import Api from "./api";
import api1 from '../menu/api' import api1 from "../menu/api";
export default { export default {
name: 'Add', name: "Add",
data() { data() {
return { return {
entity: {}, entity: {},
menuData:[], menuData: [],
menuIds:[], menuIds: [],
rules: { rules: {
name: [{ required: true, message: '必填', trigger: 'blur' }], name: [{ required: true, message: "必填", trigger: "blur" }],
code: [{ required: true, message: '必填', trigger: 'blur' }] code: [{ required: true, message: "必填", trigger: "blur" }],
} },
} };
}, },
mounted(){ mounted() {
api1.getTree().then((v)=>{ api1.getTree().then((v) => {
this.menuData=v.result this.menuData = v.result;
}) });
}, },
props: { props: {
eid: Number eid: Number,
}, },
methods: { methods: {
load(v) { load(v) {
Api.get({ id: v }).then(r => { Api.get({ id: v }).then((r) => {
this.entity = r.result; this.entity = r.result;
this.menuIds=this.entity.menuIds; this.menuIds = this.entity.menuIds;
this.setChecked(this.menuData,this.menuIds) this.setChecked(this.menuData, this.menuIds);
this.$emit('on-load') this.$emit("on-load");
}) });
}, },
setChecked(data,ids){ setChecked(data, ids) {
if(ids.length==0){ if (ids.length == 0) {
return data; return data;
}
data.forEach(item=>{
if(!item.children || item.children.length == 0){
if(ids.indexOf(item.id)>-1){
this.$set(item,"checked",true);
}
}else if (item.children && item.children.length > 0) {
this.setChecked(item.children, ids)
}
})
},
handleClose() {
this.$emit('on-close')
},
l(key) {
key = "set_menu" + "." + key;
return this.$t(key)
} }
},
watch: { data.forEach((item) => {
eid(v) { if (!item.children || item.children.length == 0) {
if (v != 0) { if (ids.indexOf(item.id) > -1) {
this.load(v); this.$set(item, "checked", true);
} }
} } else if (item.children && item.children.length > 0) {
this.setChecked(item.children, ids);
} }
} });
},
handleClose() {
this.$emit("on-close");
},
l(key) {
key = "set_menu" + "." + key;
return this.$t(key);
},
},
watch: {
eid(v) {
if (v != 0) {
this.load(v);
}
},
},
};
</script> </script>
\ No newline at end of file
<template> <template>
<div> <div>
<DataGrid :columns="columns" ref="grid" :action="action"><template slot="easySearch"><Form ref="formInline" :model="easySearch" inline><FormItem prop="keys"><Input placeholder="请输入关键字套餐名称/备注" v-model="easySearch.keys.value" /> </FormItem> <DataGrid :columns="columns" ref="grid" :action="action">
<FormItem><Button type="primary" @click="search">查询</Button></FormItem> <template slot="easySearch">
</Form></template> <Form ref="formInline" :model="easySearch" inline>
<template slot="searchForm"> <FormItem prop="keys">
<Search /> <Input placeholder="请输入关键字套餐名称/备注" v-model="easySearch.keys.value" />
</template> </FormItem>
<template slot="buttons"> <FormItem>
<Button type="primary" @click="addModal=true">新增</Button> <Button type="primary" @click="search">查询</Button>
</template> </FormItem>
</DataGrid> </Form>
<Modal v-model="addModal" title="新增" footer-hide> </template>
<Add @on-close="cancel" @on-ok="addOk" /> <template slot="searchForm">
</Modal> <Search />
<Modal v-model="editModal" title="编辑" footer-hide> </template>
<Edit :eid="curId" @on-close="cancel" @on-ok="addOk" /> <template slot="buttons">
</Modal> <Button type="primary" @click="addModal=true">新增</Button>
<Modal v-model="detailModal" title="详情"> </template>
<Detail :eid="curId" /> </DataGrid>
</Modal> <Modal v-model="addModal" title="新增" footer-hide>
<Modal v-model="deletelModal" title="删除" @on-ok="removeOk" <Add @on-close="cancel" @on-ok="addOk" />
@on-cancel="cancel"> </Modal>
<p>确定删除?</p> <Modal v-model="editModal" title="编辑" footer-hide>
</Modal> <Edit :eid="curId" @on-close="cancel" @on-ok="addOk" />
</div> </Modal>
<Modal v-model="detailModal" title="详情">
<Detail :eid="curId" />
</Modal>
<Modal v-model="deletelModal" title="删除" @on-ok="removeOk" @on-cancel="cancel">
<p>确定删除?</p>
</Modal>
</div>
</template> </template>
<script> <script>
import Api from './api' import Api from "./api";
import Add from './add' import Add from "./add";
import Edit from './edit' import Edit from "./edit";
import Detail from './detail' import Detail from "./detail";
import Search from './search' import Search from "./search";
import api from '../account/api' import api from "../account/api";
import api1 from '../menu/api' import api1 from "../menu/api";
export default { export default {
name: 'list', name: "list",
components:{ components: {
Add,Edit,Detail,Search Add,
Edit,
Detail,
Search,
}, },
data() { data() {
return { return {
action: Api.index, action: Api.index,
easySearch: { easySearch: {
keys:{op:"title,remark",value:null} keys: { op: "title,remark", value: null },
}, },
addModal: false, addModal: false,
editModal: false, editModal: false,
detailModal: false, detailModal: false,
deletelModal: false, deletelModal: false,
curId: 0, curId: 0,
columns: [ columns: [
//{ key:"id",title:this.l("id") ,hide:true ,align:"left" }, //{ key:"id",title:this.l("id") ,hide:true ,align:"left" },
{ key:"creationTime",title:this.l("creationTime") ,align:"center" ,width:200 },
{ key:"creatorUserId",title:this.l("creatorUserId") ,hide:true ,align:"left" }, {
{ key:"lastModificationTime",title:this.l("lastModificationTime") ,hide:true ,align:"left" }, key: "creatorUserId",
{ key:"lastModifierUserId",title:this.l("lastModifierUserId") ,hide:true ,align:"left" }, title: this.l("creatorUserId"),
{ key:"isDeleted",title:this.l("isDeleted") ,hide:true ,align:"left" }, hide: true,
{ key:"deletionTime",title:this.l("deletionTime") ,hide:true ,align:"left" }, align: "left",
{ key:"deleterUserId",title:this.l("deleterUserId") ,hide:true ,align:"left" }, },
{ key:"title",title:this.l("title") ,align:"center" ,easy:true ,high:true ,width:240 }, {
// { key:"remark",title:this.l("remark") ,align:"left" ,easy:true ,high:true }, key: "lastModificationTime",
{ key:"status",title:this.l("status") ,align:"center" ,high:true ,width:140,code:'crm.customer.status' }, title: this.l("lastModificationTime"),
{ hide: true,
title: '操作', align: "left",
key: 'id', },
width: 140, {
align: 'center', key: "lastModifierUserId",
render: (h, params) => { title: this.l("lastModifierUserId"),
return h('div', { class: "action" }, [ hide: true,
h('op', { attrs: { oprate: 'detail' }, on: { click: () => this.detail(params.row.id) } }, '查看'), align: "left",
h('op', { attrs: { oprate: 'edit'}, on: { click: () => this.edit(params.row.id) } }, '编辑'), },
h('op', { attrs: { oprate: 'remove' }, on: { click: () => this.remove(params.row.id) } }, '删除') {
]) key: "isDeleted",
} title: this.l("isDeleted"),
hide: true,
align: "left",
},
{
key: "deletionTime",
title: this.l("deletionTime"),
hide: true,
align: "left",
},
{
key: "deleterUserId",
title: this.l("deleterUserId"),
hide: true,
align: "left",
},
{
key: "title",
title: this.l("title"),
align: "left",
easy: true,
high: true,
},
// { key:"remark",title:this.l("remark") ,align:"left" ,easy:true ,high:true },
{
key: "status",
title: this.l("status"),
align: "center",
high: true,
width: 160,
code: "crm.customer.status",
},
{
key: "creationTime",
title: this.l("creationTime"),
align: "center",
width: 200,
},
{
title: "操作",
key: "id",
width: 200,
align: "center",
render: (h, params) => {
return h("div", { class: "action" }, [
h(
"op",
{
attrs: { oprate: "detail" },
on: { click: () => this.detail(params.row.id) },
},
"查看"
),
h(
"op",
{
attrs: { oprate: "edit" },
on: { click: () => this.edit(params.row.id) },
},
"编辑"
),
h(
"op",
{
attrs: { oprate: "remove" },
on: { click: () => this.remove(params.row.id) },
},
"删除"
),
]);
}, },
] },
} ],
};
}, },
mounted(){ mounted() {
console.log(this); console.log(this);
}, },
async fetch({ store, params }) {
await store.dispatch('loadDictionary') // 加载数据字典
},
methods:{
addOk() {
this.$refs.grid.load()
this.addModal = false
this.detailModal = false
this.editModal = false;
this.curId = 0;
},
search() {
this.$refs.grid.reload(this.easySearch)
},
detail(id) {
this.detailModal = true;
this.curId = id;
},
edit(id) {
this.editModal = true;
this.curId = id;
},
remove(id) { async fetch({ store, params }) {
this.deletelModal = true; await store.dispatch("loadDictionary"); // 加载数据字典
this.curId = id; },
}, methods: {
removeOk() { addOk() {
Api.delete({ id: this.curId }).then((r) => { this.$refs.grid.load();
if (r.success) { this.addModal = false;
this.$refs.grid.load(); this.detailModal = false;
this.deletelModal = false; this.editModal = false;
this.$Message.success('删除成功') this.curId = 0;
} },
}) search() {
}, this.$refs.grid.reload(this.easySearch);
removeCancel() { },
detail(id) {
this.detailModal = true;
this.curId = id;
},
edit(id) {
this.editModal = true;
this.curId = id;
},
remove(id) {
this.deletelModal = true;
this.curId = id;
},
removeOk() {
Api.delete({ id: this.curId }).then((r) => {
if (r.success) {
this.$refs.grid.load();
this.deletelModal = false; this.deletelModal = false;
}, this.$Message.success("删除成功");
cancel() { }
this.curId = 0; });
this.addModal = false },
this.detailModal = false removeCancel() {
this.editModal = false; this.deletelModal = false;
this.deletedlModal = false; },
}, cancel() {
l(key) { this.curId = 0;
/* this.addModal = false;
this.detailModal = false;
this.editModal = false;
this.deletedlModal = false;
},
l(key) {
/*
set_menu:{ set_menu:{
id:'', id:'',
creationTime:'创建时间', creationTime:'创建时间',
...@@ -144,11 +223,11 @@ keys:{op:"title,remark",value:null} ...@@ -144,11 +223,11 @@ keys:{op:"title,remark",value:null}
status:'状态', status:'状态',
} }
*/ */
let vkey = "set_menu" + "." + key; let vkey = "set_menu" + "." + key;
return this.$t(vkey)||key return this.$t(vkey) || key;
} },
} },
} };
</script> </script>
<style lang="less"> <style lang="less">
</style> </style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment