Compare commits

..

No commits in common. "f264d03008bdf814e0b7bc884f3a04cf4fa4f4c2" and "cf2d0c8d00bf61cf730f55c092932580bf4b5e5e" have entirely different histories.

6 changed files with 606 additions and 840 deletions

View File

@ -11,9 +11,9 @@
ref="formRef" ref="formRef"
:model="formState" :model="formState"
:rules="formRules" :rules="formRules"
layout="vertical" :label-col="labelCol"
:wrapper-col="wrapperCol"
> >
<a-col :span="24">
<a-form-item ref="jobName" label="名称" name="jobName"> <a-form-item ref="jobName" label="名称" name="jobName">
<a-input v-model:value="formState.jobName" /> <a-input v-model:value="formState.jobName" />
</a-form-item> </a-form-item>
@ -29,7 +29,6 @@
<a-form-item label="状态" name="state"> <a-form-item label="状态" name="state">
<a-switch v-model:checked="formState.state" /> <a-switch v-model:checked="formState.state" />
</a-form-item> </a-form-item>
</a-col>
</a-form> </a-form>
</a-modal> </a-modal>
</template> </template>

View File

@ -8,107 +8,64 @@
@cancel="cancel" @cancel="cancel"
> >
<a-form <a-form
ref="formRef" ref="formRef"
:model="formState" :model="formState"
:rules="formRules" :rules="formRules"
layout="vertical" :label-col="labelCol"
:wrapper-col="wrapperCol"
> >
<a-row :gutter="[16, 0]"> <a-form-item label="上级" name="parent">
<a-col :span="12"> <a-tree-select
<a-form-item label="上级" name="parent"> v-model:value="formState.parent"
<a-tree-select style="width: 100%;"
v-model:value="formState.parent" :dropdown-style="{ maxHeight: '360px', overflow: 'auto' }"
style="width: 100%" :tree-data="state.powers"
:dropdown-style="{ maxHeight: '360px', overflow: 'auto' }" placeholder="上级权限"
:tree-data="state.powers" replace
placeholder="上级权限" tree-default-expand-all
replace :replaceFields="replaceFields"
tree-default-expand-all
:replaceFields="replaceFields"
>
</a-tree-select>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="title" label="名称" name="title">
<a-input v-model:value="formState.title" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item
v-if="state.showComponent"
ref="component"
label="组件"
name="component"
> >
<a-input v-model:value="formState.component" /> </a-tree-select>
</a-form-item> </a-form-item>
</a-col> <a-form-item ref="title" label="名称" name="title">
<a-col :span="12"> <a-input v-model:value="formState.title" />
<a-form-item </a-form-item>
v-if="state.showPath" <a-form-item v-if="state.showComponent" ref="component" label="组件" name="component">
ref="path" <a-input v-model:value="formState.component" />
label="路径" </a-form-item>
name="path" <a-form-item v-if="state.showPath" ref="path" label="路径" name="path">
> <a-input v-model:value="formState.path" />
<a-input v-model:value="formState.path" /> </a-form-item>
</a-form-item> <a-form-item v-if="state.showCode" ref="code" label="标识" name="code">
</a-col> <a-input v-model:value="formState.code" />
<a-col :span="12"> </a-form-item>
<a-form-item <a-form-item label="图标" name="icon">
v-if="state.showCode" <pro-icon-picker v-model:modelValue="formState.icon"></pro-icon-picker>
ref="code" </a-form-item>
label="标识" <a-form-item ref="i18n" label="i18n" name="i18n">
name="code" <a-input v-model:value="formState.i18n" />
> </a-form-item>
<a-input v-model:value="formState.code" /> <a-form-item ref="type" label="类型" name="type">
</a-form-item> <a-select v-model:value="formState.type" @change="change">
</a-col> <a-select-option value="0"> 目录 </a-select-option>
<a-col :span="12"> <a-select-option value="1"> 菜单 </a-select-option>
<a-form-item label="图标" name="icon"> <a-select-option value="2"> 按钮 </a-select-option>
<pro-icon-picker </a-select>
v-model:modelValue="formState.icon" </a-form-item>
></pro-icon-picker> <a-form-item ref="sort" label="排序" name="sort">
</a-form-item> <a-input-number v-model:value="formState.sort" />
</a-col> </a-form-item>
<a-col :span="12"> <a-form-item label="状态" name="enable">
<a-form-item ref="i18n" label="i18n" name="i18n"> <a-switch v-model:checked="formState.enable" />
<a-input v-model:value="formState.i18n" /> </a-form-item>
</a-form-item> <a-form-item label="备注" name="remark">
</a-col> <a-textarea v-model:value="formState.remark" />
<a-col :span="12"> </a-form-item>
<a-form-item ref="type" label="类型" name="type">
<a-select v-model:value="formState.type" @change="change">
<a-select-option value="0"> 目录 </a-select-option>
<a-select-option value="1"> 菜单 </a-select-option>
<a-select-option value="2"> 按钮 </a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="sort" label="排序" name="sort">
<a-input-number
style="width: 100%"
v-model:value="formState.sort"
/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="状态" name="enable">
<a-switch v-model:checked="formState.enable" />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="备注" name="remark">
<a-textarea v-model:value="formState.remark" />
</a-form-item>
</a-col>
</a-row>
</a-form> </a-form>
</a-modal> </a-modal>
</template> </template>
<script> <script>
import { message } from "@hwork/ant-design-vue"; import { message } from '@hwork/ant-design-vue';
import { edit, tree } from "@/api/module/power"; import { edit, tree } from "@/api/module/power";
import { defineComponent, reactive, ref, toRaw, watch } from "vue"; import { defineComponent, reactive, ref, toRaw, watch } from "vue";
export default defineComponent({ export default defineComponent({
@ -117,16 +74,17 @@ export default defineComponent({
type: Boolean, type: Boolean,
}, },
record: { record: {
type: Object, type: Object
}, }
}, },
emit: ["close"], emit: ["close"],
setup(props, context) { setup(props, context) {
const state = reactive({ const state = reactive({
depts: [], depts: [],
showComponent: true, showComponent: true,
showPath: true, showPath: true,
showCode: false, showCode: false
}); });
const formRef = ref(); const formRef = ref();
@ -136,7 +94,7 @@ export default defineComponent({
enable: true, enable: true,
}); });
watch(props, (props) => { watch(props,(props) => {
formState.id = props.record.id; formState.id = props.record.id;
formState.title = props.record.title; formState.title = props.record.title;
formState.component = props.record.component; formState.component = props.record.component;
@ -149,7 +107,7 @@ export default defineComponent({
formState.sort = props.record.sort; formState.sort = props.record.sort;
formState.remark = props.record.remark; formState.remark = props.record.remark;
formState.parent = props.record.parent; formState.parent = props.record.parent;
if (formState.type === "2") { if(formState.type === '2') {
state.showComponent = false; state.showComponent = false;
state.showPath = false; state.showPath = false;
state.showCode = true; state.showCode = true;
@ -158,19 +116,17 @@ export default defineComponent({
state.showPath = true; state.showPath = true;
state.showCode = false; state.showCode = false;
} }
}); })
const formRules = { const formRules = {
title: [{ required: true, message: "请输入权限名称", trigger: "blur" }], title: [{ required: true, message: '请输入权限名称', trigger: 'blur'}],
i18n: [{ required: true, message: "请输入 i18n", trigger: "blur" }], i18n: [{ required: true, message: '请输入 i18n', trigger: 'blur'}],
type: [{ required: true, message: "请输入权限类型", trigger: "blur" }], type: [{ required: true, message: '请输入权限类型', trigger: 'blur'}],
parent: [ parent: [{ required: true, message: '请选择上级权限', trigger: 'change'}]
{ required: true, message: "请选择上级权限", trigger: "change" },
],
}; };
const change = function (val) { const change = function(val) {
if (val === "2") { if(val === '2') {
state.showComponent = false; state.showComponent = false;
state.showPath = false; state.showPath = false;
state.showCode = true; state.showCode = true;
@ -179,26 +135,26 @@ export default defineComponent({
state.showPath = true; state.showPath = true;
state.showCode = false; state.showCode = false;
} }
}; }
const submit = (e) => { const submit = (e) => {
formRef.value formRef.value
.validate() .validate()
.then(() => { .then(() => {
edit(toRaw(formState)).then((response) => { edit(toRaw(formState)).then((response)=>{
if (response.success) { if(response.success){
message.success({ content: "保存成功", duration: 1 }).then(() => { message.success({ content: '保存成功', duration: 1 }).then(()=>{
cancel(); cancel();
}); });
} else { }else{
message.success({ content: "保存失败", duration: 1 }).then(() => { message.success({ content: '保存失败', duration: 1 }).then(()=>{
cancel(); cancel();
}); });
} }
}); });
}) })
.catch((error) => { .catch(error => {
console.log("error", error); console.log('error', error);
}); });
}; };
@ -208,17 +164,15 @@ export default defineComponent({
}; };
const loadPower = () => { const loadPower = () => {
tree({}).then((response) => { tree({}).then((response)=>{
response.data = [ response.data = [{
{ id:"0",
id: "0", title: "顶级菜单",
title: "顶级菜单", children: response.data
children: response.data, }]
},
];
state.powers = response.data; state.powers = response.data;
}); })
}; }
loadPower(); loadPower();
@ -234,12 +188,7 @@ export default defineComponent({
labelCol: { span: 6 }, labelCol: { span: 6 },
wrapperCol: { span: 18 }, wrapperCol: { span: 18 },
replaceFields: { replaceFields: {children:'children', title:'title', key:'id', value: 'id' }
children: "children",
title: "title",
key: "id",
value: "id",
},
}; };
}, },
}); });

View File

@ -8,76 +8,57 @@
@cancel="cancel" @cancel="cancel"
> >
<a-form <a-form
ref="formRef" ref="formRef"
:model="formState" :model="formState"
:rules="formRules" :rules="formRules"
layout="vertical" :label-col="labelCol"
:wrapper-col="wrapperCol"
> >
<a-row :gutter="[16, 0]"> <a-form-item label="上级" name="parent">
<a-col :span="12"> <a-tree-select
<a-form-item label="上级" name="parent"> v-model:value="formState.parent"
<a-tree-select style="width: 100%"
v-model:value="formState.parent" :tree-data="state.powers"
style="width: 100%" placeholder="上级权限"
:tree-data="state.powers" replace
placeholder="上级权限" tree-default-expand-all
replace :replaceFields="replaceFields"
tree-default-expand-all >
:replaceFields="replaceFields" </a-tree-select>
> </a-form-item>
</a-tree-select> <a-form-item ref="title" label="名称" name="title">
</a-form-item> <a-input v-model:value="formState.title" />
</a-col> </a-form-item>
<a-col :span="12"> <a-form-item ref="component" label="组件" name="component">
<a-form-item ref="title" label="名称" name="title"> <a-input v-model:value="formState.component" />
<a-input v-model:value="formState.title" /> </a-form-item>
</a-form-item> <a-form-item ref="path" label="路径" name="path">
</a-col> <a-input v-model:value="formState.path" />
<a-col :span="12"> </a-form-item>
<a-form-item ref="component" label="组件" name="component"> <a-form-item ref="i18n" label="i18n" name="i18n">
<a-input v-model:value="formState.component" /> <a-input v-model:value="formState.i18n" />
</a-form-item> </a-form-item>
</a-col> <a-form-item ref="type" label="类型" name="type">
<a-col :span="12"> <a-select v-model:value="formState.type">
<a-form-item ref="path" label="路径" name="path"> <a-select-option value="0"> 目录 </a-select-option>
<a-input v-model:value="formState.path" /> <a-select-option value="1"> 菜单 </a-select-option>
</a-form-item> <a-select-option value="2"> 按钮 </a-select-option>
</a-col> </a-select>
<a-col :span="12"> </a-form-item>
<a-form-item ref="i18n" label="i18n" name="i18n"> <a-form-item ref="sort" label="排序" name="sort">
<a-input v-model:value="formState.i18n" /> <a-input-number v-model:value="formState.sort" />
</a-form-item> </a-form-item>
</a-col> <a-form-item label="状态" name="enable">
<a-col :span="12"> <a-switch v-model:checked="formState.enable" />
<a-form-item ref="type" label="类型" name="type"> </a-form-item>
<a-select v-model:value="formState.type"> <a-form-item label="备注" name="remark">
<a-select-option value="0"> 目录 </a-select-option> <a-textarea v-model:value="formState.remark" />
<a-select-option value="1"> 菜单 </a-select-option> </a-form-item>
<a-select-option value="2"> 按钮 </a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="sort" label="排序" name="sort">
<a-input-number style="width: 100%" v-model:value="formState.sort" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="状态" name="enable">
<a-switch v-model:checked="formState.enable" />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="备注" name="remark">
<a-textarea v-model:value="formState.remark" />
</a-form-item>
</a-col>
</a-row>
</a-form> </a-form>
</a-modal> </a-modal>
</template> </template>
<script> <script>
import { message } from "@hwork/ant-design-vue"; import { message } from '@hwork/ant-design-vue';
import { save, tree } from "@/api/module/power"; import { save, tree } from "@/api/module/power";
import { defineComponent, reactive, ref, toRaw, watch } from "vue"; import { defineComponent, reactive, ref, toRaw, watch } from "vue";
export default defineComponent({ export default defineComponent({
@ -86,14 +67,15 @@ export default defineComponent({
type: Boolean, type: Boolean,
}, },
record: { record: {
type: Object, type: Object
}, }
}, },
emit: ["close"], emit: ["close"],
setup(props, context) { setup(props, context) {
const state = reactive({ const state = reactive({
depts: [], depts: [],
}); })
const formRef = ref(); const formRef = ref();
@ -102,7 +84,7 @@ export default defineComponent({
enable: true, enable: true,
}); });
watch(props, (props) => { watch(props,(props) => {
formState.id = props.record.id; formState.id = props.record.id;
formState.title = props.record.title; formState.title = props.record.title;
formState.component = props.record.component; formState.component = props.record.component;
@ -112,19 +94,15 @@ export default defineComponent({
formState.i18n = props.record.i18n; formState.i18n = props.record.i18n;
formState.remark = props.record.remark; formState.remark = props.record.remark;
formState.parent = props.record.parent; formState.parent = props.record.parent;
}); })
const formRules = { const formRules = {
title: [{ required: true, message: "请输入权限名称", trigger: "blur" }], title: [{ required: true, message: '请输入权限名称', trigger: 'blur'}],
component: [ component: [{ required: true, message: '请输入路由组件', trigger: 'blur'}],
{ required: true, message: "请输入路由组件", trigger: "blur" }, path: [{ required: true, message: '请输入路由地址', trigger: 'blur'}],
], i18n: [{ required: true, message: '请输入 i18n', trigger: 'blur'}],
path: [{ required: true, message: "请输入路由地址", trigger: "blur" }], type: [{ required: true, message: '请输入权限类型', trigger: 'blur'}],
i18n: [{ required: true, message: "请输入 i18n", trigger: "blur" }], parent: [{ required: true, message: '请选择上级权限', trigger: 'change'}]
type: [{ required: true, message: "请输入权限类型", trigger: "blur" }],
parent: [
{ required: true, message: "请选择上级权限", trigger: "change" },
],
}; };
const submit = (e) => { const submit = (e) => {
@ -138,10 +116,10 @@ export default defineComponent({
}; };
const loadPower = () => { const loadPower = () => {
tree({}).then((response) => { tree({}).then((response)=>{
state.powers = response.data; state.powers = response.data;
}); })
}; }
loadPower(); loadPower();
@ -156,12 +134,7 @@ export default defineComponent({
labelCol: { span: 6 }, labelCol: { span: 6 },
wrapperCol: { span: 18 }, wrapperCol: { span: 18 },
replaceFields: { replaceFields: {children:'children', title:'title', key:'id', value: 'id' }
children: "children",
title: "title",
key: "id",
value: "id",
},
}; };
}, },
}); });

View File

@ -1,20 +1,8 @@
<template> <template>
<a-modal <a-modal :open="visible" title="新增权限" cancelText="取消" okText="提交" @ok="submit" @cancel="cancel">
:open="visible" <a-form ref="formRef" :model="formState" :rules="formRules" :label-col="labelCol" :wrapper-col="wrapperCol">
title="新增权限" <a-row :gutter='[1,1]'>
cancelText="取消" <a-col :span ="12">
okText="提交"
@ok="submit"
@cancel="cancel"
>
<a-form
ref="formRef"
:model="formState"
:rules="formRules"
layout="vertical"
>
<a-row :gutter="[16, 0]">
<a-col :span="12">
<a-form-item ref="type" label="类型" name="type"> <a-form-item ref="type" label="类型" name="type">
<a-select v-model:value="formState.type" @change="change"> <a-select v-model:value="formState.type" @change="change">
<a-select-option value="0"> 目录 </a-select-option> <a-select-option value="0"> 目录 </a-select-option>
@ -23,7 +11,7 @@
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="12"> <a-col :span ="12">
<a-form-item ref="clientType" label="终端" name="clientType"> <a-form-item ref="clientType" label="终端" name="clientType">
<a-select v-model:value="formState.clientType" @change="change"> <a-select v-model:value="formState.clientType" @change="change">
<a-select-option value="PC"> PC端 </a-select-option> <a-select-option value="PC"> PC端 </a-select-option>
@ -32,224 +20,191 @@
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="12">
<a-form-item label="上级" name="parent">
<a-tree-select
v-model:value="formState.parent"
style="width: 100%"
:dropdown-style="{ maxHeight: '360px', overflow: 'auto' }"
:tree-data="state.powers"
placeholder="上级权限"
replace
tree-default-expand-all
:replaceFields="replaceFields"
>
</a-tree-select>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="title" label="名称" name="title">
<a-input v-model:value="formState.title" />
</a-form-item>
</a-col>
<a-col :span="12" v-if="state.showComponent">
<a-form-item ref="component" label="组件" name="component">
<a-input v-model:value="formState.component" />
</a-form-item>
</a-col>
<a-col :span="12" v-if="state.showPath">
<a-form-item ref="path" label="路径" name="path">
<a-input v-model:value="formState.path" />
</a-form-item>
</a-col>
<a-col :span="12" v-if="state.showCode">
<a-form-item ref="code" label="标识" name="code">
<a-input v-model:value="formState.code" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="图标" name="icon">
<pro-icon-picker
v-model:modelValue="formState.icon"
></pro-icon-picker>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="i18n" label="i18n" name="i18n">
<a-input v-model:value="formState.i18n" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="sort" label="排序" name="sort">
<a-input-number style="width: 100%" v-model:value="formState.sort" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="状态" name="enable">
<a-switch v-model:checked="formState.enable" />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="备注" name="remark">
<a-textarea v-model:value="formState.remark" />
</a-form-item>
</a-col>
</a-row> </a-row>
<a-form-item label="上级" name="parent">
<a-tree-select v-model:value="formState.parent" style="width: 100%;"
:dropdown-style="{ maxHeight: '360px', overflow: 'auto' }" :tree-data="state.powers" placeholder="上级权限"
replace tree-default-expand-all :replaceFields="replaceFields">
</a-tree-select>
</a-form-item>
<a-form-item ref="title" label="名称" name="title">
<a-input v-model:value="formState.title" />
</a-form-item>
<a-form-item v-if="state.showComponent" ref="component" label="组件" name="component">
<a-input v-model:value="formState.component" />
</a-form-item>
<a-form-item v-if="state.showPath" ref="path" label="路径" name="path">
<a-input v-model:value="formState.path" />
</a-form-item>
<a-form-item v-if="state.showCode" ref="code" label="标识" name="code">
<a-input v-model:value="formState.code" />
</a-form-item>
<a-form-item label="图标" name="icon">
<pro-icon-picker v-model:modelValue="formState.icon"></pro-icon-picker>
</a-form-item>
<a-form-item ref="i18n" label="i18n" name="i18n">
<a-input v-model:value="formState.i18n" />
</a-form-item>
<a-form-item ref="sort" label="排序" name="sort">
<a-input-number v-model:value="formState.sort" />
</a-form-item>
<a-form-item label="状态" name="enable">
<a-switch v-model:checked="formState.enable" />
</a-form-item>
<a-form-item label="备注" name="remark">
<a-textarea v-model:value="formState.remark" />
</a-form-item>
</a-form> </a-form>
</a-modal> </a-modal>
</template> </template>
<script> <script>
import { message } from "@hwork/ant-design-vue"; import {
import { save, tree } from "@/api/module/power"; message
import { defineComponent, reactive, ref, toRaw, watch } from "vue"; } from "@hwork/ant-design-vue";
export default defineComponent({ import {
props: { save,
visible: { tree
type: Boolean, } from "@/api/module/power";
import {
defineComponent,
reactive,
ref,
toRaw,
watch
} from "vue";
export default defineComponent({
props: {
visible: {
type: Boolean,
},
}, },
}, emit: ["close"],
emit: ["close"], setup(props, context) {
setup(props, context) {
const state = reactive({
depts: [],
showComponent: true,
showPath: true,
showCode: false,
});
const formRef = ref(); const state = reactive({
depts: [],
showComponent: true,
showPath: true,
showCode: false
});
const formState = reactive({ const formRef = ref();
type: "0",
sort: 0,
parent: "0",
enable: true,
});
const formRules = { const formState = reactive({
title: [ type: "0",
{ sort: 0,
parent: "0",
enable: true,
});
const formRules = {
title: [{
required: true, required: true,
message: "请输入权限名称", message: "请输入权限名称",
trigger: "blur", trigger: "blur"
}, }],
], i18n: [{
i18n: [
{
required: true, required: true,
message: "请输入 i18n", message: "请输入 i18n",
trigger: "blur", trigger: "blur"
}, }],
], type: [{
type: [
{
required: true, required: true,
message: "请输入权限类型", message: "请输入权限类型",
trigger: "blur", trigger: "blur"
}, }],
], clientType: [{
clientType: [
{
required: true, required: true,
message: "请选择权限终端类型", message: "请选择权限终端类型",
trigger: "blur", trigger: "blur"
}, }],
], parent: [{
parent: [
{
required: true, required: true,
message: "请选择上级权限", message: "请选择上级权限",
trigger: "change", trigger: "change"
}, }],
], };
};
const submit = (e) => { const submit = (e) => {
formRef.value formRef.value
.validate() .validate()
.then(() => { .then(() => {
save(toRaw(formState)).then((response) => { save(toRaw(formState)).then((response) => {
if (response.success) { if (response.success) {
message message.success({
.success({
content: "保存成功", content: "保存成功",
duration: 1, duration: 1
}) }).then(() => {
.then(() => {
cancel(); cancel();
}); });
} else { } else {
message message.success({
.success({
content: "保存失败", content: "保存失败",
duration: 1, duration: 1
}) }).then(() => {
.then(() => {
cancel(); cancel();
}); });
} }
});
})
.catch((error) => {
console.log("error", error);
}); });
}) };
.catch((error) => {
console.log("error", error);
});
};
const cancel = (e) => { const cancel = (e) => {
formRef.value.resetFields(); formRef.value.resetFields();
context.emit("close", false); context.emit("close", false);
}; };
const loadPower = () => { const loadPower = () => {
tree({}).then((response) => { tree({}).then((response) => {
response.data = [ response.data = [{
{
id: "0", id: "0",
title: "顶级菜单", title: "顶级菜单",
children: response.data, children: response.data
}, }]
]; state.powers = response.data;
state.powers = response.data; });
}); };
};
const change = function (val) { const change = function(val) {
if (val === "2") { if (val === '2') {
state.showComponent = false; state.showComponent = false;
state.showPath = false; state.showPath = false;
state.showCode = true; state.showCode = true;
} else { } else {
state.showComponent = true; state.showComponent = true;
state.showPath = true; state.showPath = true;
state.showCode = false; state.showCode = false;
}
} }
};
loadPower(); loadPower();
return { return {
state, state,
submit, submit,
change, change,
cancel, cancel,
formRef, formRef,
formState, formState,
formRules, formRules,
labelCol: { labelCol: {
span: 6, span: 6
}, },
wrapperCol: { wrapperCol: {
span: 18, span: 18
}, },
replaceFields: { replaceFields: {
children: "children", children: "children",
title: "title", title: "title",
key: "id", key: "id",
value: "id", value: "id",
}, },
}; };
}, },
}); });
</script> </script>

View File

@ -1,241 +1,184 @@
<template> <template>
<a-modal <a-modal :open="visible" title="编辑" cancelText="取消" okText="提交" @ok="submit" @cancel="cancel">
:open="visible" <a-form ref="formRef" :model="formState" :rules="formRules" :label-col="labelCol" :wrapper-col="wrapperCol">
title="编辑" <a-form-item ref="seqCode" label="值编号" name="seqCode">
cancelText="取消" <a-input v-model:value="formState.seqCode" placeholder="请输入值编号" />
okText="提交" </a-form-item>
@ok="submit" <a-form-item ref="seqName" label="名称" name="seqName">
@cancel="cancel" <a-input v-model:value="formState.seqName" placeholder="请输入名称" />
> </a-form-item>
<a-form <a-form-item ref="minValue" label="起始值" name="minValue">
ref="formRef" <a-input-number v-model:value="formState.minValue" placeholder="请输入起始值" style="width: 100%;"/>
:model="formState" </a-form-item>
:rules="formRules" <a-form-item ref="incValue" label="自增值" name="incValue">
layout="vertical" <a-input-number v-model:value="formState.incValue" placeholder="请输入自增值" style="width: 100%;"/>
> </a-form-item>
<a-row :gutter="[16, 0]"> <a-form-item ref="maxValue" label="最大值" name="maxValue">
<a-col :span="12"> <a-input-number v-model:value="formState.maxValue" placeholder="请输入最大值" style="width: 100%;"/>
<a-form-item ref="seqCode" label="值编号" name="seqCode"> </a-form-item>
<a-input <a-form-item ref="currValue" label="当前值" name="currValue">
v-model:value="formState.seqCode" <a-input-number v-model:value="formState.currValue" placeholder="请输入当前值" style="width: 100%;"/>
placeholder="请输入值编号" </a-form-item>
/> <!-- <a-form-item ref="deleted" label="删除" name="deleted">
</a-form-item> <a-select v-model:value="formState.deleted" :options="seqDeleted" placeholder="请选择是或者否" />
</a-col> </a-form-item>
<a-col :span="12"> <a-form-item ref="createBy" label="录入人" name="createBy">
<a-form-item ref="seqName" label="名称" name="seqName"> <a-input v-model:value="formState.createBy" placeholder="请输入录入人" />
<a-input </a-form-item>
v-model:value="formState.seqName" <a-form-item ref="createTime" label="录入时间" name="createTime">
placeholder="请输入名称" <a-input v-model:value="formState.createTime" placeholder="请输入录入时间" />
/> </a-form-item>
</a-form-item> <a-form-item ref="updateBy" label="修改人" name="updateBy">
</a-col> <a-input v-model:value="formState.updateBy" placeholder="请输入修改人" />
<a-col :span="12"> </a-form-item>
<a-form-item ref="minValue" label="起始值" name="minValue"> <a-form-item ref="updateTime" label="修改时间" name="updateTime">
<a-input-number <a-input v-model:value="formState.updateTime" placeholder="请输入修改时间" />
v-model:value="formState.minValue" </a-form-item> -->
placeholder="请输入起始值" <a-form-item label="备注" name="remark">
style="width: 100%" <a-textarea v-model:value="formState.remark" />
/> </a-form-item>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="incValue" label="自增值" name="incValue">
<a-input-number
v-model:value="formState.incValue"
placeholder="请输入自增值"
style="width: 100%"
/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="maxValue" label="最大值" name="maxValue">
<a-input-number
v-model:value="formState.maxValue"
placeholder="请输入最大值"
style="width: 100%"
/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="currValue" label="当前值" name="currValue">
<a-input-number
v-model:value="formState.currValue"
placeholder="请输入当前值"
style="width: 100%"
/>
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="备注" name="remark">
<a-textarea v-model:value="formState.remark" />
</a-form-item>
</a-col>
<!-- <a-form-item ref="deleted" label="删除" name="deleted">
<a-select v-model:value="formState.deleted" :options="seqDeleted" placeholder="请选择是或者否" />
</a-form-item>
<a-form-item ref="createBy" label="录入人" name="createBy">
<a-input v-model:value="formState.createBy" placeholder="请输入录入人" />
</a-form-item>
<a-form-item ref="createTime" label="录入时间" name="createTime">
<a-input v-model:value="formState.createTime" placeholder="请输入录入时间" />
</a-form-item>
<a-form-item ref="updateBy" label="修改人" name="updateBy">
<a-input v-model:value="formState.updateBy" placeholder="请输入修改人" />
</a-form-item>
<a-form-item ref="updateTime" label="修改时间" name="updateTime">
<a-input v-model:value="formState.updateTime" placeholder="请输入修改时间" />
</a-form-item> -->
</a-row>
</a-form> </a-form>
</a-modal> </a-modal>
</template> </template>
<script> <script>
import { message } from "@hwork/ant-design-vue"; import {
import { edit } from "@/api/wms/seqNum"; message
import { defineComponent, reactive, ref, toRaw, watch } from "vue"; } from '@hwork/ant-design-vue';
export default defineComponent({ import {
props: { edit
visible: { } from "@/api/wms/seqNum";
type: Boolean, import {
}, defineComponent,
record: { reactive,
type: Object, ref,
}, toRaw,
}, watch
emit: ["close"], } from "vue";
setup(props, context) { export default defineComponent({
const formRef = ref(); props: {
visible: {
const formState = reactive({}); type: Boolean,
const seqDeleted = ref([
{
value: "false",
label: "否",
}, },
{ record: {
value: "true", type: Object,
label: "是", }
}, },
]); emit: ["close"],
watch(props, (props) => { setup(props, context) {
formState.id = props.record.id;
formState.seqCode = props.record.seqCode;
formState.sqeName = props.record.seqName;
formState.minValue = props.record.minValue;
formState.incValue = props.record.incValue;
formState.maxValue = props.record.maxValue;
formState.currValue = props.record.currValue;
});
const formRules = { const formRef = ref();
seqCode: [
{
required: true,
message: "请输入值编号(必填)",
trigger: "blur",
},
],
sqeName: [
{
required: true,
message: "请输入名称(必填)",
trigger: "blur",
},
],
minValue: [
{
required: true,
message: "请输入起始值(必填)",
trigger: "blur",
type: "number",
},
],
incValue: [
{
required: true,
message: "请输入自增值(必填)",
trigger: "blur",
type: "number",
},
],
maxValue: [
{
required: true,
message: "请输入最大值(必填)",
trigger: "blur",
type: "number",
},
],
currValue: [
{
required: true,
message: "请输入当前值(必填)",
trigger: "blur",
type: "number",
},
],
};
const editKey = "add"; const formState = reactive({});
const submit = (e) => { const seqDeleted = ref([{
message.loading({ value: 'false',
content: "提交中...", label: '否',
key: editKey, }, {
}); value: 'true',
formRef.value label: '是',
.validate() }]);
.then(() => { watch(props, (props) => {
edit(toRaw(formState)).then((response) => { formState.id = props.record.id
if (response.success) { formState.seqCode = props.record.seqCode;
message formState.sqeName = props.record.seqName;
.success({ formState.minValue = props.record.minValue;
content: "保存成功", formState.incValue = props.record.incValue;
formState.maxValue = props.record.maxValue;
formState.currValue = props.record.currValue;
})
const formRules = {
seqCode: [{
required: true,
message: '请输入值编号(必填)',
trigger: 'blur'
}],
sqeName: [{
required: true,
message: '请输入名称(必填)',
trigger: 'blur'
}],
minValue: [{
required: true,
message: '请输入起始值(必填)',
trigger: 'blur',
type:'number'
}],
incValue: [{
required: true,
message: '请输入自增值(必填)',
trigger: 'blur',
type:'number'
}],
maxValue: [{
required: true,
message: '请输入最大值(必填)',
trigger: 'blur',
type:'number'
}],
currValue: [{
required: true,
message: '请输入当前值(必填)',
trigger: 'blur',
type:'number'
}],
};
const editKey = "add";
const submit = (e) => {
message.loading({
content: '提交中...',
key: editKey
});
formRef.value
.validate()
.then(() => {
edit(toRaw(formState)).then((response) => {
if (response.success) {
message.success({
content: '保存成功',
key: editKey, key: editKey,
duration: 1, duration: 1
}) }).then(() => {
.then(() => {
cancel(); cancel();
}); });
} else { } else {
message message.error({
.error({
content: response.msg, content: response.msg,
key: editKey, key: editKey,
duration: 1, duration: 1
}) }).then(() => {
.then(() => {}); });
} }
});
})
.catch(error => {
console.log('error', error);
}); });
}) };
.catch((error) => {
console.log("error", error);
});
};
const cancel = (e) => { const cancel = (e) => {
formRef.value.resetFields(); formRef.value.resetFields();
context.emit("close", false); context.emit("close", false);
}; };
return { return {
submit,
cancel,
formRef,
formState,
formRules,
seqDeleted,
labelCol: { submit,
span: 8, cancel,
}, formRef,
wrapperCol: { formState,
span: 12, formRules,
}, seqDeleted,
};
}, labelCol: {
}); span: 8
},
wrapperCol: {
span: 12
},
};
},
});
</script> </script>

View File

@ -1,74 +1,24 @@
<template> <template>
<a-modal <a-modal :open="visible" title="新增" cancelText="取消" okText="提交" @ok="submit" @cancel="cancel">
:open="visible" <a-form ref="formRef" :model="formState" :rules="formRules" :label-col="labelCol" :wrapper-col="wrapperCol">
title="新增" <a-form-item ref="seqCode" label="值编号" name="seqCode">
cancelText="取消" <a-input v-model:value="formState.seqCode" placeholder="请输入值编号" />
okText="提交" </a-form-item>
@ok="submit" <a-form-item ref="seqName" label="名称" name="seqName">
@cancel="cancel" <a-input v-model:value="formState.seqName" placeholder="请输入名称" />
> </a-form-item>
<a-form <a-form-item ref="minValue" label="起始值" name="minValue">
ref="formRef" <a-input v-model:value="formState.minValue" placeholder="请输入起始值" />
:model="formState" </a-form-item>
:rules="formRules" <a-form-item ref="incValue" label="自增值" name="incValue">
layout="vertical" <a-input v-model:value="formState.incValue" placeholder="请输入自增值" />
> </a-form-item>
<a-row :gutter="[16, 0]"> <a-form-item ref="maxValue" label="最大值" name="maxValue">
<a-col :span="12"> <a-input v-model:value="formState.maxValue" placeholder="请输入最大值" />
<a-form-item ref="seqCode" label="值编号" name="seqCode"> </a-form-item>
<a-input <a-form-item ref="currValue" label="当前值" name="currValue">
v-model:value="formState.seqCode" <a-input v-model:value="formState.currValue" placeholder="请输入当前值" />
placeholder="请输入值编号" </a-form-item>
/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="seqName" label="名称" name="seqName">
<a-input
v-model:value="formState.seqName"
placeholder="请输入名称"
/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="minValue" label="起始值" name="minValue">
<a-input
v-model:value="formState.minValue"
placeholder="请输入起始值"
/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="incValue" label="自增值" name="incValue">
<a-input
v-model:value="formState.incValue"
placeholder="请输入自增值"
/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="maxValue" label="最大值" name="maxValue">
<a-input
v-model:value="formState.maxValue"
placeholder="请输入最大值"
/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="currValue" label="当前值" name="currValue">
<a-input
v-model:value="formState.currValue"
placeholder="请输入当前值"
/>
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="备注" name="remark">
<a-textarea v-model:value="formState.remark" />
</a-form-item>
</a-col>
</a-row>
<!-- <a-form-item ref="deleted" label="删除" name="deleted"> <!-- <a-form-item ref="deleted" label="删除" name="deleted">
<a-select v-model:value="formState.deleted" :options="seqDeleted" placeholder="请选择是或否" /> <a-select v-model:value="formState.deleted" :options="seqDeleted" placeholder="请选择是或否" />
</a-form-item> </a-form-item>
@ -84,141 +34,138 @@
<a-form-item ref="updateTime" label="修改时间" name="updateTime"> <a-form-item ref="updateTime" label="修改时间" name="updateTime">
<a-input v-model:value="formState.updateTime" placeholder="请输入修改时间" /> <a-input v-model:value="formState.updateTime" placeholder="请输入修改时间" />
</a-form-item> --> </a-form-item> -->
<a-form-item label="备注" name="remark">
<a-textarea v-model:value="formState.remark" />
</a-form-item>
</a-form> </a-form>
</a-modal> </a-modal>
</template> </template>
<script> <script>
import { message } from "@hwork/ant-design-vue"; import {
import { save } from "@/api/wms/seqNum"; message
import { defineComponent, reactive, ref, toRaw } from "vue"; } from '@hwork/ant-design-vue';
export default defineComponent({ import {
props: { save
visible: { } from "@/api/wms/seqNum";
type: Boolean, import {
defineComponent,
reactive,
ref,
toRaw
} from "vue";
export default defineComponent({
props: {
visible: {
type: Boolean,
},
}, },
}, emit: ["close"],
emit: ["close"], setup(props, context) {
setup(props, context) {
const formRef = ref();
const state = reactive({}); const formRef = ref();
const formState = reactive({}); const state = reactive({});
const seqDeleted = ref([ const formState = reactive({});
{
value: "false",
label: "否",
},
{
value: "true",
label: "是",
},
]);
const formRules = { const seqDeleted = ref([{
seqCode: [ value: 'false',
{ label: '否',
required: true, }, {
message: "请输入值编号(必填)", value: 'true',
trigger: "blur", label: '是',
}, }]);
],
sqeName: [
{
required: true,
message: "请输入名称(必填)",
trigger: "blur",
},
],
minValue: [
{
required: true,
message: "请输入起始值(必填)",
trigger: "blur",
},
],
incValue: [
{
required: true,
message: "请输入自增值(必填)",
trigger: "blur",
},
],
maxValue: [
{
required: true,
message: "请输入最大值(必填)",
trigger: "blur",
},
],
currValue: [
{
required: true,
message: "请输入当前值(必填)",
trigger: "blur",
},
],
};
const saveKey = "save"; const formRules = {
seqCode: [{
required: true,
message: '请输入值编号(必填)',
trigger: 'blur'
}],
sqeName: [{
required: true,
message: '请输入名称(必填)',
trigger: 'blur'
}],
minValue: [{
required: true,
message: '请输入起始值(必填)',
trigger: 'blur'
}],
incValue: [{
required: true,
message: '请输入自增值(必填)',
trigger: 'blur'
}],
maxValue: [{
required: true,
message: '请输入最大值(必填)',
trigger: 'blur'
}],
currValue: [{
required: true,
message: '请输入当前值(必填)',
trigger: 'blur'
}],
};
const submit = (e) => { const saveKey = "save";
message.loading({
content: "提交中...",
key: saveKey, const submit = (e) => {
}); message.loading({
formRef.value content: '提交中...',
.validate() key: saveKey
.then(() => { });
save(toRaw(formState)).then((response) => { formRef.value
if (response.success) { .validate()
message .then(() => {
.success({ save(toRaw(formState)).then((response) => {
content: "保存成功", if (response.success) {
message.success({
content: '保存成功',
key: saveKey, key: saveKey,
duration: 1, duration: 1
}) }).then(() => {
.then(() => {
cancel(); cancel();
}); });
} else { } else {
message message.error({
.error({
content: response.msg, content: response.msg,
key: saveKey, key: saveKey,
duration: 1, duration: 1
}) }).then(() => {
.then(() => {}); });
} }
});
})
.catch(error => {
console.log('error', error);
}); });
}) };
.catch((error) => {
console.log("error", error);
});
};
const cancel = (e) => { const cancel = (e) => {
formRef.value.resetFields(); formRef.value.resetFields();
context.emit("close", false); context.emit("close", false);
}; };
return {
state,
submit,
cancel,
formRef,
formState,
formRules,
seqDeleted,
labelCol: { return {
span: 8, state,
}, submit,
wrapperCol: { cancel,
span: 12, formRef,
}, formState,
}; formRules,
}, seqDeleted,
});
labelCol: {
span: 8
},
wrapperCol: {
span: 12
},
};
},
});
</script> </script>