Skip to content

Z
zhichan
Commit daa16013 by 蒋勇
Options

d

parent c385a695
Showing with 290 additions and 7 deletions
iview-admin/src/router/routers.js
...@@ -127,6 +127,15 @@ export default [ ...@@ -127,6 +127,15 @@ export default [
component: Main, component: Main,
children: [ children: [
{ {
path: 'org_info',
name: 'org_info',
meta: {
icon: 'ios-man',
title: '组织结构'
},
component: () => import('@/view/userinfo/orginfo_page.vue')
},
{
path: 'user_info', path: 'user_info',
name: 'user_info', name: 'user_info',
meta: { meta: {
......
iview-admin/src/view/components/tables/forms/forms.vue
...@@ -10,7 +10,14 @@ ...@@ -10,7 +10,14 @@
<Tabs value="main" @on-click="tabselected"> <Tabs value="main" @on-click="tabselected">
<TabPane label="表单信息" name="main"> <TabPane label="表单信息" name="main">
<template v-for="group in forminfo.main"> <template v-for="group in forminfo.main">
<Divider orientation="left" :key="group.title">{{group.title}}</Divider> <div style="margin-bottom:20px" :key="group.title+'d'">
<Divider
style="height:20px;width:3px;background-color:blue"
type="vertical"
:key="group.title"
/>
{{group.title}}
</div>
<Row type="flex" justify="start" :key="'r'+group.title"> <Row type="flex" justify="start" :key="'r'+group.title">
<Col <Col
:xs="getCols(group.cols)" :xs="getCols(group.cols)"
...@@ -48,6 +55,7 @@ ...@@ -48,6 +55,7 @@
:isMulti="ctl.isMulti" :isMulti="ctl.isMulti"
:labelField="ctl.labelField" :labelField="ctl.labelField"
:valueField="ctl.valueField" :valueField="ctl.valueField"
:style="ctl.style"
></ModelSelect> ></ModelSelect>
</template> </template>
<template v-if="ctl.type=='remote-select'"> <template v-if="ctl.type=='remote-select'">
...@@ -131,7 +139,14 @@ ...@@ -131,7 +139,14 @@
</Tabs> </Tabs>
</template> </template>
<template v-else v-for="group in forminfo.main"> <template v-else v-for="group in forminfo.main">
<Divider orientation="left" :key="group.title">{{group.title}}</Divider> <div style="margin-bottom:20px" :key="group.title+'d'">
<Divider
style="height:20px;width:3px;background-color:blue"
type="vertical"
:key="group.title"
/>
{{group.title}}
</div>
<Row type="flex" justify="start" align="top" :key="'r'+group.title"> <Row type="flex" justify="start" align="top" :key="'r'+group.title">
<Col <Col
:xs="getCols(group.cols)" :xs="getCols(group.cols)"
...@@ -169,6 +184,7 @@ ...@@ -169,6 +184,7 @@
:isMulti="ctl.isMulti" :isMulti="ctl.isMulti"
:labelField="ctl.labelField" :labelField="ctl.labelField"
:valueField="ctl.valueField" :valueField="ctl.valueField"
:style="ctl.style"
></ModelSelect> ></ModelSelect>
</template> </template>
<template v-if="ctl.type=='remote-select'"> <template v-if="ctl.type=='remote-select'">
...@@ -293,9 +309,15 @@ export default { ...@@ -293,9 +309,15 @@ export default {
}, },
computed: {}, computed: {},
methods: { methods: {
setHeight(){
let domel= this.$refs.formcard.$el
let h = window.innerHeight - domel.offsetTop ;
console.log("=======================",h)
$(domel).css("height", h + "px");
},
getInitWhere(initWhereObj) { getInitWhere(initWhereObj) {
let refwhere = {}; let refwhere = {};
if(initWhereObj){ if (initWhereObj) {
refwhere[initWhereObj.fieldName] = this.formModel[ refwhere[initWhereObj.fieldName] = this.formModel[
initWhereObj.valueField initWhereObj.valueField
]; ];
...@@ -339,6 +361,10 @@ export default { ...@@ -339,6 +361,10 @@ export default {
testclick() { testclick() {
console.log(JSON.stringify(this.formModel)); console.log(JSON.stringify(this.formModel));
}, },
getNewModel() {
let s = JSON.stringify(this.formModel);
return JSON.parse(s);
},
initFormModel() { initFormModel() {
if (this.forminfo.lists && this.forminfo.lists.length > 0) { if (this.forminfo.lists && this.forminfo.lists.length > 0) {
this.forminfo.lists.forEach(item => { this.forminfo.lists.forEach(item => {
...@@ -353,12 +379,16 @@ export default { ...@@ -353,12 +379,16 @@ export default {
m.ctls.forEach(ctl => { m.ctls.forEach(ctl => {
this.$set(this.ctlVisable, ctl.prop, true); this.$set(this.ctlVisable, ctl.prop, true);
if (ctl.rules && ctl.rules.length>=0) { if (ctl.rules && ctl.rules.length >= 0) {
console.log("ctl.rules========================",ctl.prop,ctl.rules) console.log(
"ctl.rules========================",
ctl.prop,
ctl.rules
);
ctl.rules.forEach(r => { ctl.rules.forEach(r => {
if (r.iscustom) { if (r.iscustom) {
console.log("validate................"); console.log("validate................");
r.validator = this['validatex']; r.validator = this["validatex"];
} }
}); });
this.metaRules[ctl.prop] = ctl.rules; this.metaRules[ctl.prop] = ctl.rules;
...@@ -389,7 +419,7 @@ export default { ...@@ -389,7 +419,7 @@ export default {
this.initFormModel(); this.initFormModel();
}, },
mounted() { mounted() {
this.setHeight()
} }
}; };
</script> </script>
......
iview-admin/src/view/userinfo/orginfo_page.vue 0 → 100644
<template>
<div id="orgcard">
<Card style="height:100%">
<Tree :data="treedata" :render="renderContent" class="ptree" show-checkbox></Tree>
<Drawer
ref="eddrawer"
placement="right"
:closable="false"
:mask-closable="false"
v-model="showedform"
width="70"
@on-visible-change="ondrawvisable">
<NodeForm ref="nodeform" :fminfo="nodeinfo">
<template v-slot:default="slotProps">
<Button
type="text"
@click="doexec('ok',slotProps.fm)"
>确定</Button>
<Button
type="text"
@click="doexec('cancel',slotProps.fm)"
>取消</Button>
</template>
</NodeForm>
</Drawer>
</Card>
</div>
</template>
<script>
import { getApp, saveAuths, findAuthsByRoles } from "@/api/meta";
import NodeForm from "@/view/components/tables/forms/forms.vue";
import config from "@/config";
export default {
name: "treeinfo_page",
components: {
NodeForm
},
data() {
return {
treedata: [],
showedform:false,
buttonProps: {
type: "default",
size: "small"
},
nodeinfo: {
name: "节点编辑",
main: [
{
title: "基本信息",
key: "baseinfo",
cols:1,
ctls: [
{type: "input", label: "标题", prop: "title", placeHolder: "请输入节点标题", style: "", rules: [{ required: true, message: " ", trigger: "blur" }]},
{type: "input", label: "编码", prop: "code",placeHolder: "请输入编码", style: "", rules: [{ required: true, message: " ", trigger: "blur" }]},
{"type":"model-select","refModel":"auth.role","isMulti":true,"label":"角色","prop":"roles","labelField":"name","valueField":"id","style":{"margin-left":"10px",width:"165px"}},
]
}
],
lists: null
}
};
},
mounted() {
this.setHeight();
$(window).resize(() => {
this.setHeight();
});
this.initTree();
},
methods: {
ondrawvisable(){
},
doexec(k,fm){
console.log(fm)
if(k=="ok"){
this.showedform=false
}else{
this.showedform=false
}
},
buildNodeData(){
},
onselnode(ns,n){
this.showedform=true
},
initTree() {
this.treedata = [
{
title: "自定义结构树",
expand: true,
render: (h, { root, node, data }) => {
return h(
"span",
{
style: {
display: "inline-block",
width: "100%"
},
on:{
click:()=>{
this.onselnode(node,data)
}
}
},
[
h("span", [
h("Icon", {
props: {
type: "ios-folder-outline"
},
style: {
marginRight: "8px"
}
}),
h("span", data.title)
]),
h(
"span",
{
style: {
display: "inline-block",
float: "right",
marginRight: "32px"
}
},
[
h("Button", {
props: Object.assign({}, this.buttonProps, {
icon: "ios-add",
type: "primary"
}),
style: {
width: "64px"
},
on: {
click: () => {
this.append(data);
}
}
})
]
)
]
);
},
children: []
}
];
},
setHeight() {
let $orgcard = $("#orgcard");
let el = $orgcard.get()[0];
let h = window.innerHeight - el.offsetTop - 30;
$orgcard.css("height", h + "px");
},
renderContent(h, { root, node, data }) {
return h(
"span",
{
style: {
display: "inline-block",
width: "100%"
}
},
[
h("span", [
h("Icon", {
props: {
type: "ios-paper-outline"
},
style: {
marginRight: "8px"
}
}),
h("span", data.title)
]),
h(
"span",
{
style: {
display: "inline-block",
float: "right",
marginRight: "32px"
}
},
[
h("Button", {
props: Object.assign({}, this.buttonProps, {
icon: "ios-add"
}),
style: {
marginRight: "8px"
},
on: {
click: () => {
this.append(data);
}
}
}),
h("Button", {
props: Object.assign({}, this.buttonProps, {
icon: "ios-remove"
}),
on: {
click: () => {
this.remove(root, node, data);
}
}
})
]
)
]
);
},
append(data) {
const children = data.children || [];
children.push({
title: "appended node",
expand: true
});
this.$set(data, "children", children);
},
remove(root, node, data) {
const parentKey = root.find(el => el === node).parent;
const parent = root.find(el => el.nodeKey === parentKey).node;
const index = parent.children.indexOf(data);
parent.children.splice(index, 1);
}
}
};
</script>
<style>
.ptree span:hover {
background-color: lightgray;
}
.spansel {
background-color: lightgray;
}
</style>
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