tijiao
This commit is contained in:
13
hx-ai-intelligent/src/api/origanizemanage.ts
Normal file
13
hx-ai-intelligent/src/api/origanizemanage.ts
Normal file
@@ -0,0 +1,13 @@
|
||||
// import request from '@/utils/request';
|
||||
|
||||
// export function login(data) {
|
||||
// return request({
|
||||
// url: '/carbon-smart/api/user/queryUserByPage',
|
||||
// method: 'post',
|
||||
// data,
|
||||
// });
|
||||
// }
|
||||
|
||||
export const origanizemanage = {
|
||||
list: '/carbon-smart/api/user/queryUserByPage',
|
||||
};
|
@@ -1,9 +1,11 @@
|
||||
import { dateUtil } from '/nerv-lib/util/date-util';
|
||||
import { data } from './mock.json';
|
||||
import { origanizemanage } from '/@/api/origanizemanage';
|
||||
|
||||
export const tableConfig = {
|
||||
title: '设备台账',
|
||||
api: '/carbon_emission/device/getDeviceList',
|
||||
// api: '/carbon_emission/device/getDeviceList',
|
||||
api: origanizemanage.list,
|
||||
treeConfig: {
|
||||
dynamicParams: { abc: 'title', key: 'key' },
|
||||
defaultExpandAll: true,
|
||||
|
@@ -0,0 +1,166 @@
|
||||
import { ref } from 'vue';
|
||||
|
||||
export const formConfig = (disabled: Boolean) => {
|
||||
return ref([
|
||||
{
|
||||
field: 'field111',
|
||||
component: 'NsChildForm',
|
||||
componentProps: {
|
||||
schemas: [
|
||||
{
|
||||
label: '部门名称',
|
||||
field: 'name',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
disabled: disabled,
|
||||
placeholder: '请输入部门名称',
|
||||
maxLength: 20,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入部门名称',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '上级部门',
|
||||
field: 'department',
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
disabled: true,
|
||||
options: [
|
||||
{
|
||||
label: '部门1',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '部门2',
|
||||
value: 2,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '部门编码',
|
||||
field: 'code',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
disabled: disabled,
|
||||
placeholder: '请输入部门编码',
|
||||
maxLength: 20,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入部门编码',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '排序',
|
||||
field: 'order',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
disabled: disabled,
|
||||
placeholder: '请输入排序',
|
||||
maxLength: 2,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'remark',
|
||||
label: '备注',
|
||||
component: 'NsTextarea',
|
||||
componentProps: {
|
||||
disabled: disabled,
|
||||
placeholder: '请输入',
|
||||
maxLength: 300,
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
]);
|
||||
};
|
||||
|
||||
export const formConfig2 = (disabled2: Boolean) => {
|
||||
return ref([
|
||||
{
|
||||
field: 'field111',
|
||||
component: 'NsChildForm',
|
||||
componentProps: {
|
||||
schemas: [
|
||||
{
|
||||
label: '角色名称',
|
||||
field: 'departname',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
disabled: disabled2,
|
||||
placeholder: '请输入角色名称',
|
||||
maxLength: 20,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入角色名称',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '上级领导',
|
||||
field: 'department',
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
disabled: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '节点编码',
|
||||
field: 'code',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
disabled: disabled2,
|
||||
placeholder: '请输入节点编码',
|
||||
maxLength: 20,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入节点编码',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '是否部门领导',
|
||||
field: 'isleader',
|
||||
component: 'NsRadioGroup',
|
||||
componentProps: {
|
||||
disabled: disabled2,
|
||||
radioType: 'radio',
|
||||
options: [
|
||||
{ label: '是', value: 1 },
|
||||
{ label: '否', value: 2 },
|
||||
],
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择是否部门领导',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'remark',
|
||||
label: '备注',
|
||||
component: 'NsTextarea',
|
||||
componentProps: {
|
||||
disabled: disabled2,
|
||||
placeholder: '请输入',
|
||||
maxLength: 300,
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
]);
|
||||
};
|
@@ -9,7 +9,7 @@
|
||||
<ns-button style="margin: 10px" type="primary" @click="addApartment">新增部门</ns-button>
|
||||
<ns-button type="primary" @click="addApartmentSon">新增子部门</ns-button>
|
||||
<ns-button style="margin: 10px" type="primary" @click="deleteApartment">删除</ns-button>
|
||||
<a-tree :tree-data="apartmentTreeData" @select="SelectApartmentTree">
|
||||
<a-tree :tree-data="apartmentTreeData" defaultExpandAll @select="SelectApartmentTree">
|
||||
<template #title="{ title }">
|
||||
{{ title }}
|
||||
</template>
|
||||
@@ -18,13 +18,19 @@
|
||||
<a-col :span="12" class="list">
|
||||
<a-tabs v-model:activeKey="activeKey">
|
||||
<a-tab-pane key="1" tab="部门信息">
|
||||
<ns-form :schemas="formSchema" :model="formData" formLayout="vertical" class="form" />
|
||||
<ns-form
|
||||
ref="formRef"
|
||||
:schemas="formSchema"
|
||||
:model="formData"
|
||||
formLayout="vertical"
|
||||
class="form" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="部门权限">
|
||||
<a-tree
|
||||
:tree-data="apartmentAdminTreeData"
|
||||
v-model:checkedKeys="ApartcheckedKeys"
|
||||
checkable
|
||||
defaultExpandAll
|
||||
@select="ApartmentSelect">
|
||||
<template #title="{ title }">
|
||||
{{ title }}
|
||||
@@ -46,7 +52,7 @@
|
||||
<ns-button style="margin: 10px" type="primary" @click="addUser">新增角色</ns-button>
|
||||
<ns-button type="primary" @click="addUserSon">新增子角色</ns-button>
|
||||
<ns-button style="margin: 10px" type="primary" @click="deleteUser">删除</ns-button>
|
||||
<a-tree :tree-data="userTreeData" @select="SelectUserTree">
|
||||
<a-tree :tree-data="userTreeData" defaultExpandAll @select="SelectUserTree">
|
||||
<template #title="{ title }">
|
||||
{{ title }}
|
||||
</template>
|
||||
@@ -65,6 +71,7 @@
|
||||
<a-tree
|
||||
:tree-data="userAdminTreeData"
|
||||
v-model:checkedKeys="UsercheckedKeys"
|
||||
defaultExpandAll
|
||||
checkable
|
||||
@select="UserSelect">
|
||||
<template #title="{ title }">
|
||||
@@ -86,9 +93,12 @@
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { uuid } from '@antv/x6/lib/util/string/uuid';
|
||||
import { cloneDeep } from 'lodash-es';
|
||||
import { formConfig, formConfig2 } from './config';
|
||||
export default defineComponent({
|
||||
name: 'AuthorityManageIndex',
|
||||
setup() {
|
||||
const formRef = ref();
|
||||
let formData = ref({});
|
||||
let formData2 = ref({});
|
||||
const activeKey = ref('1');
|
||||
@@ -97,7 +107,12 @@
|
||||
const disabled2 = ref(true);
|
||||
const ApartcheckedKeys = ref<string[]>([]);
|
||||
const UsercheckedKeys = ref<string[]>([]);
|
||||
|
||||
const selectKey = ref();
|
||||
const selectRef = ref();
|
||||
const selectKey2 = ref();
|
||||
const selectRef2 = ref();
|
||||
const formSchema = formConfig(disabled as any);
|
||||
const formSchema2 = formConfig2(disabled2 as any);
|
||||
watch(ApartcheckedKeys, () => {
|
||||
console.log('checkedKeys', ApartcheckedKeys.value);
|
||||
});
|
||||
@@ -115,9 +130,10 @@
|
||||
{
|
||||
title: '铁路总局',
|
||||
key: '0-0',
|
||||
info: { name: '铁路总局' },
|
||||
children: [
|
||||
{ title: '济阳站', key: '0-0-0' },
|
||||
{ title: '临沂站', key: '0-0-1' },
|
||||
{ title: '济阳站', key: '0-0-0', info: { name: '济阳站' } },
|
||||
{ title: '临沂站', key: '0-0-1', info: { name: '临沂站' } },
|
||||
],
|
||||
},
|
||||
]);
|
||||
@@ -127,8 +143,8 @@
|
||||
title: '产品总监',
|
||||
key: '0-0',
|
||||
children: [
|
||||
{ title: '产品经理', key: '0-0-0' },
|
||||
{ title: '产品助理', key: '0-0-1' },
|
||||
{ title: '产品经理', key: '0-0-0', info: { departname: '产品经理' } },
|
||||
{ title: '产品助理', key: '0-0-1', info: { departname: '产品助理' } },
|
||||
],
|
||||
},
|
||||
]);
|
||||
@@ -182,14 +198,22 @@
|
||||
|
||||
const addUserSon = () => {
|
||||
disabled.value = false;
|
||||
opMap.type = 'addson';
|
||||
};
|
||||
|
||||
const deleteApartment = () => {
|
||||
Modal.confirm({
|
||||
title: '是否确认删除',
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: createVNode('div', { style: 'color:red;' }, ''),
|
||||
onOk() {},
|
||||
onOk() {
|
||||
function deepDel(data = apartmentTreeData.value[0].children) {
|
||||
data.map((item, index) => {
|
||||
if (item.key === selectKey.value) data.splice(index, 1);
|
||||
});
|
||||
}
|
||||
deepDel();
|
||||
console.log(selectKey.value);
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
},
|
||||
@@ -202,7 +226,15 @@
|
||||
title: '是否确认删除',
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: createVNode('div', { style: 'color:red;' }, ''),
|
||||
onOk() {},
|
||||
onOk() {
|
||||
function deepDel(data = userTreeData.value[0].children) {
|
||||
data.map((item, index) => {
|
||||
if (item.key === selectKey2.value) data.splice(index, 1);
|
||||
});
|
||||
}
|
||||
deepDel();
|
||||
console.log(selectKey2.value);
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
},
|
||||
@@ -213,12 +245,18 @@
|
||||
const SelectApartmentTree = (selectedKeys: any, info: any) => {
|
||||
disabled.value = false;
|
||||
console.log(selectedKeys, 'selectedKeys');
|
||||
console.log(info, 'info');
|
||||
console.log(info.node.dataRef, 'info');
|
||||
selectKey.value = selectedKeys[0];
|
||||
selectRef.value = info.node.dataRef;
|
||||
formData.value = info.node.dataRef.info;
|
||||
};
|
||||
const SelectUserTree = (selectedKeys: any, info: any) => {
|
||||
disabled2.value = false;
|
||||
console.log(selectedKeys, 'selectedKeys');
|
||||
console.log(info, 'info');
|
||||
console.log(info.node.dataRef.info, 'info');
|
||||
selectKey2.value = selectedKeys[0];
|
||||
selectRef2.value = info.node.dataRef;
|
||||
formData2.value = info.node.dataRef.info;
|
||||
};
|
||||
|
||||
const CancelApartment = () => {
|
||||
@@ -240,6 +278,8 @@
|
||||
};
|
||||
|
||||
const ApartmentSure = () => {
|
||||
// formRef.value?.triggerSubmit().then(() => {});
|
||||
|
||||
disabled.value = !disabled.value;
|
||||
opMap.fuc && opMap.fuc(formData.value);
|
||||
// console.log(formData.value.name, 'formData');
|
||||
@@ -248,191 +288,42 @@
|
||||
apartmentTreeData.value[0].children.push({
|
||||
title: formData.value.name,
|
||||
key: 'a1',
|
||||
info: { ...formData.value },
|
||||
});
|
||||
} else {
|
||||
} else if (selectRef.value && opMap.type === 'addson')
|
||||
selectRef.value['children'] = [
|
||||
{ key: '123', title: formData.value.name, info: { ...cloneDeep(formData.value) } },
|
||||
];
|
||||
else {
|
||||
console.log('ss');
|
||||
}
|
||||
formData.value = {};
|
||||
};
|
||||
const UserSure = () => {
|
||||
disabled2.value = !disabled2.value;
|
||||
opMap.fuc && opMap.fuc(formData2.value);
|
||||
console.log(formData2.value, 'formData2');
|
||||
userTreeData.value[0].children.push({
|
||||
title: formData2.value.departname,
|
||||
key: 'a2',
|
||||
});
|
||||
console.log(opMap.type, 'opMap.type');
|
||||
if (opMap.type === 'add') {
|
||||
userTreeData.value[0].children.push({
|
||||
title: formData2.value.departname,
|
||||
key: 'a2',
|
||||
info: { ...formData2.value },
|
||||
});
|
||||
} else if (selectRef2.value && opMap.type === 'addson')
|
||||
selectRef2.value['children'] = [
|
||||
{
|
||||
key: '123',
|
||||
title: formData2.value.departname,
|
||||
info: { ...cloneDeep(formData2.value) },
|
||||
},
|
||||
];
|
||||
else {
|
||||
console.log('ss');
|
||||
}
|
||||
formData2.value = {};
|
||||
};
|
||||
|
||||
const formSchema = reactive([
|
||||
{
|
||||
field: 'field111',
|
||||
component: 'NsChildForm',
|
||||
componentProps: {
|
||||
schemas: [
|
||||
{
|
||||
label: '部门名称',
|
||||
field: 'name',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
disabled: disabled,
|
||||
placeholder: '请输入部门名称',
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: false,
|
||||
message: '请输入部门名称',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '上级部门',
|
||||
field: 'department',
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
disabled: disabled,
|
||||
placeholder: '请选择上级部门',
|
||||
options: [
|
||||
{
|
||||
label: '部门1',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '部门2',
|
||||
value: 2,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '部门编码',
|
||||
field: 'code',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
disabled: disabled,
|
||||
placeholder: '请输入部门编码',
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: false,
|
||||
message: '请输入部门编码',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '排序',
|
||||
field: 'order',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
disabled: disabled,
|
||||
placeholder: '请输入排序',
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: false,
|
||||
message: '请输入排序',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
field: 'remark',
|
||||
label: '备注',
|
||||
component: 'NsTextarea',
|
||||
componentProps: {
|
||||
disabled: disabled,
|
||||
placeholder: '请输入',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
]);
|
||||
const formSchema2 = reactive([
|
||||
{
|
||||
field: 'field111',
|
||||
component: 'NsChildForm',
|
||||
componentProps: {
|
||||
schemas: [
|
||||
{
|
||||
label: '角色名称',
|
||||
field: 'departname',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
disabled: disabled2,
|
||||
placeholder: '请输入角色名称',
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: false,
|
||||
message: '请输入角色名称',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '上级领导',
|
||||
field: 'department',
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
disabled: disabled2,
|
||||
placeholder: '请选择上级领导',
|
||||
options: [
|
||||
{
|
||||
label: '领导1',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '领导2',
|
||||
value: 2,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '节点编码',
|
||||
field: 'code',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
disabled: disabled2,
|
||||
placeholder: '请输入节点编码',
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: false,
|
||||
message: '请输入节点编码',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '是否部门领导',
|
||||
field: 'isleader',
|
||||
component: 'NsRadioGroup',
|
||||
componentProps: {
|
||||
disabled: disabled2,
|
||||
radioType: 'radio',
|
||||
options: [
|
||||
{ label: '是', value: 1 },
|
||||
{ label: '否', value: 2 },
|
||||
],
|
||||
rules: [
|
||||
{
|
||||
required: false,
|
||||
message: '请选择是否部门领导',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'remark',
|
||||
label: '备注',
|
||||
component: 'NsTextarea',
|
||||
componentProps: {
|
||||
disabled: disabled2,
|
||||
placeholder: '请输入',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
]);
|
||||
return {
|
||||
disabled,
|
||||
disabled2,
|
||||
@@ -462,6 +353,7 @@
|
||||
userAdminTreeData,
|
||||
UsercheckedKeys,
|
||||
UserSelect,
|
||||
formRef,
|
||||
};
|
||||
},
|
||||
});
|
||||
|
@@ -0,0 +1,74 @@
|
||||
<template>
|
||||
<a-modal title="企业信息" :width="600" v-model:visible="visible" @ok="handleOk">
|
||||
<ns-form ref="formRef" :schemas="formSchema" :model="formData" formLayout="vertical" />
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, reactive, ref } from 'vue';
|
||||
export default defineComponent({
|
||||
name: 'AddBorderVisible',
|
||||
setup() {
|
||||
let formData = ref({});
|
||||
const formRef = ref();
|
||||
const visible = ref(false);
|
||||
const toggle = () => {
|
||||
visible.value = !visible.value;
|
||||
};
|
||||
const formSchema = reactive([
|
||||
{
|
||||
field: 'name',
|
||||
label: '企业名称',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入企业名称',
|
||||
maxLength: 20,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入企业名称',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
field: 'Isshare',
|
||||
label: '点位数据',
|
||||
component: 'NsRadioGroup',
|
||||
componentProps: {
|
||||
radioType: 'radio',
|
||||
options: [
|
||||
{ label: '分享', value: 1 },
|
||||
{ label: '不分享', value: 2 },
|
||||
],
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择是否分享',
|
||||
type: 'number',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
]);
|
||||
const handleOk = () => {
|
||||
formRef.value?.triggerSubmit().then(() => {
|
||||
toggle();
|
||||
});
|
||||
};
|
||||
return { handleOk, formData, formSchema, visible, toggle, formRef };
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
// :deep(.ns-child-form) {
|
||||
// width: 1100px !important;
|
||||
// justify-content: flex-start !important;
|
||||
// }
|
||||
// :deep(.ant-input-group-addon) {
|
||||
// border: 0px solid #dcdfe2 !important;
|
||||
// }
|
||||
</style>
|
@@ -1,101 +1,109 @@
|
||||
import { dateUtil } from '/nerv-lib/util/date-util';
|
||||
import { mockData } from './mock';
|
||||
import { cloneDeep } from 'lodash-es';
|
||||
import { Modal } from 'ant-design-vue';
|
||||
import { createVNode, ref } from 'vue';
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
|
||||
export const tableConfig = {
|
||||
title: '企业管理',
|
||||
api: '/carbon_emission/device/getDeviceList',
|
||||
|
||||
params: {
|
||||
page: 0,
|
||||
pageSize: 10,
|
||||
},
|
||||
rowSelection: null,
|
||||
columns: [
|
||||
{
|
||||
title: '设备id',
|
||||
dataIndex: 'id',
|
||||
export const formConfig = [
|
||||
{
|
||||
field: 'zuzhi',
|
||||
label: '组织ID',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入组织ID',
|
||||
},
|
||||
{
|
||||
title: '设备编号',
|
||||
dataIndex: 'deviceCode',
|
||||
},
|
||||
{
|
||||
title: '设备名称',
|
||||
dataIndex: 'deviceName',
|
||||
textNumber: 8,
|
||||
textEllipsis: true,
|
||||
},
|
||||
{
|
||||
title: '设备类别',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
],
|
||||
columnActions: {
|
||||
title: '操作',
|
||||
actions: [
|
||||
rules: [
|
||||
{
|
||||
label: '删除',
|
||||
name: 'AppointMessageRefund',
|
||||
confirm: true,
|
||||
required: true,
|
||||
message: '请输入组织编号',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'jituanname',
|
||||
label: '企业名称',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入企业名称',
|
||||
maxLength: 20,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
field: 'createTime',
|
||||
label: '支付时间',
|
||||
component: 'NsRangePicker',
|
||||
fieldMap: ['queryStartDate', 'queryEndDate'],
|
||||
componentProps: {
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'payWay',
|
||||
label: '支付方式',
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
placeholder: '请选择',
|
||||
options: [
|
||||
{
|
||||
label: '全部',
|
||||
value: '',
|
||||
},
|
||||
{
|
||||
label: '现金',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '支付宝',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '微信',
|
||||
value: 3,
|
||||
},
|
||||
// {
|
||||
// label: '丰收互联',
|
||||
// value: 4,
|
||||
// },
|
||||
// {
|
||||
// label: '银联云闪付',
|
||||
// value: 5,
|
||||
// },
|
||||
// {
|
||||
// label: '余额',
|
||||
// value: 6,
|
||||
// },
|
||||
{
|
||||
label: '优惠支付',
|
||||
value: 7,
|
||||
},
|
||||
],
|
||||
},
|
||||
required: true,
|
||||
message: '请输入企业名称',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
params: {},
|
||||
},
|
||||
// pagination: { pageSizeOptions: false },
|
||||
rowKey: 'uuid',
|
||||
};
|
||||
{
|
||||
field: 'jituanname',
|
||||
label: '集团名称',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入集团名称',
|
||||
maxLength: 20,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'cityName',
|
||||
label: '省市区',
|
||||
component: 'NsInputCity',
|
||||
defaultValue: '',
|
||||
fieldMap: ['provinceName', 'cityName', 'areaName', 'province', 'city', 'area'],
|
||||
componentProps: {
|
||||
placeholder: '请选择',
|
||||
api: '/api/parking_merchant/objs/BaseArea',
|
||||
isSeparate: true,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择区域',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
field: 'address',
|
||||
label: '地址',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入地址',
|
||||
maxLength: 50,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'person',
|
||||
label: '联系人',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入联系人',
|
||||
maxLength: 10,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入联系人',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
field: 'phone',
|
||||
label: '联系电话',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入联系电话',
|
||||
maxLength: 11,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入联系电话',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
@@ -1,7 +1,435 @@
|
||||
<!-- @format -->
|
||||
|
||||
<template>
|
||||
<ns-view-list-table v-bind="tableConfig" />
|
||||
<ns-view-list-table v-bind="tableConfig" :model="data" ref="mainRef" rowKey="uuid" />
|
||||
<a-drawer
|
||||
:width="1200"
|
||||
:visible="visible"
|
||||
:body-style="{ paddingBottom: '80px' }"
|
||||
:footer-style="{ textAlign: 'right' }"
|
||||
destroyOnClose
|
||||
@close="onClose">
|
||||
<ns-form ref="formRef" :schemas="formSchema" :model="formData" formLayout="vertical" />
|
||||
<a-button style="margin-right: 8px" @click="onClose">取消</a-button>
|
||||
<a-button type="primary" @click="onEdit">确定</a-button>
|
||||
</a-drawer>
|
||||
<a-drawer
|
||||
:width="600"
|
||||
:visible="borderVisible"
|
||||
:body-style="{ paddingBottom: '80px' }"
|
||||
:footer-style="{ textAlign: 'right' }"
|
||||
destroyOnClose
|
||||
@close="onClose">
|
||||
<a-button type="primary" @click="borderAdd">新增</a-button>
|
||||
<a-button type="primary" style="margin-left: 10px; margin-bottom: 10px" @click="borderAddSon"
|
||||
>新增子集</a-button
|
||||
>
|
||||
<a-directory-tree @select="handleSelect" multiple :tree-data="treeData">
|
||||
<template #title="{ title, key }">
|
||||
{{ title }}
|
||||
<a-button type="link" @click="editTree(title, key)">编辑</a-button>
|
||||
<a-button type="link" danger @click="deleteTree(title, key)">删除</a-button>
|
||||
</template>
|
||||
</a-directory-tree>
|
||||
</a-drawer>
|
||||
|
||||
<a-drawer
|
||||
:width="600"
|
||||
:visible="serviceVisible"
|
||||
:body-style="{ paddingBottom: '80px' }"
|
||||
:footer-style="{ textAlign: 'right' }"
|
||||
destroyOnClose
|
||||
@close="onClose">
|
||||
<a-input-search
|
||||
placeholder="请选择开通模块"
|
||||
v-model:value="searchValue"
|
||||
style="margin-bottom: 8px"
|
||||
@search="onSearch" />
|
||||
<a-tree
|
||||
:tree-data="treeData"
|
||||
v-model:checkedKeys="checkedKeys"
|
||||
checkable
|
||||
@select="ServiceSelect">
|
||||
<template #title="{ title }">
|
||||
{{ title }}
|
||||
</template>
|
||||
</a-tree>
|
||||
<ns-button style="margin: 20px" type="primary" @click="onClose">取消</ns-button>
|
||||
<ns-button type="primary" @click="Sure">确定</ns-button>
|
||||
</a-drawer>
|
||||
|
||||
<tree-add ref="treeAdd" />
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { tableConfig } from '/@/view/organizationManage/enterpriseManage/config';
|
||||
<script lang="ts">
|
||||
import { Modal } from 'ant-design-vue';
|
||||
import { createVNode, defineComponent, reactive, ref, watch } from 'vue';
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { cloneDeep } from 'lodash-es';
|
||||
import TreeAdd from './TreeAdd.vue';
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { h } from 'vue';
|
||||
import { formConfig } from './config';
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
import { mockData, treeData } from './mock';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'OrderListIndex',
|
||||
components: {
|
||||
TreeAdd,
|
||||
},
|
||||
setup() {
|
||||
const data = reactive({});
|
||||
const treeAdd = ref();
|
||||
const mainRef = ref();
|
||||
let formData = ref({});
|
||||
const formRef = ref();
|
||||
const searchValue = ref<string>('');
|
||||
const checkedKeys = ref<string[]>([]);
|
||||
const visible = ref(false);
|
||||
const borderVisible = ref(false);
|
||||
const serviceVisible = ref(false);
|
||||
const treeAddVisible = ref(false);
|
||||
const formSchema = formConfig;
|
||||
|
||||
const opMap: any = {
|
||||
type: 'add',
|
||||
fuc: () => {},
|
||||
record: {},
|
||||
};
|
||||
|
||||
watch(checkedKeys, () => {
|
||||
console.log('checkedKeys', checkedKeys.value);
|
||||
});
|
||||
|
||||
const handleSelect = (selectedKeys: any, info: any) => {
|
||||
console.log(selectedKeys, 'selectedKeys');
|
||||
console.log(info, 'info');
|
||||
};
|
||||
|
||||
const ServiceSelect = (selectedKeys: any, info: any) => {
|
||||
console.log(selectedKeys, 'selectedKeys');
|
||||
console.log(info, 'info');
|
||||
};
|
||||
|
||||
const onClose = () => {
|
||||
visible.value = false;
|
||||
borderVisible.value = false;
|
||||
serviceVisible.value = false;
|
||||
};
|
||||
|
||||
const borderAdd = () => {
|
||||
treeAddVisible.value = true;
|
||||
treeAdd.value?.toggle();
|
||||
};
|
||||
|
||||
const borderAddSon = () => {
|
||||
treeAddVisible.value = true;
|
||||
};
|
||||
|
||||
const onEdit = () => {
|
||||
formRef.value?.triggerSubmit().then(() => {
|
||||
console.log(formData.value, 'formData.value');
|
||||
opMap.fuc && opMap.fuc(formData.value);
|
||||
visible.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
const Sure = () => {
|
||||
serviceVisible.value = false;
|
||||
};
|
||||
|
||||
const editTree = (title: any, key: any) => {
|
||||
console.log(title, 'title');
|
||||
console.log(key, 'key');
|
||||
};
|
||||
|
||||
const deleteTree = (title: any, key: any) => {
|
||||
console.log(title, 'title');
|
||||
console.log(key, 'key');
|
||||
Modal.confirm({
|
||||
title: '是否确定删除',
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: createVNode('div', { style: 'color:red;' }, ''),
|
||||
onOk() {
|
||||
// http
|
||||
// .post('/api/parking_merchant/objs/gateInfo/delete', {
|
||||
// uuid: record.uuid,
|
||||
// })
|
||||
// .then((res) => {
|
||||
// mainRef.value.nsTableRef.reload();
|
||||
// });
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
},
|
||||
class: 'test',
|
||||
});
|
||||
};
|
||||
|
||||
const onSearch = () => {
|
||||
console.log(searchValue.value);
|
||||
};
|
||||
|
||||
const tableConfig = {
|
||||
// title: '企业管理',
|
||||
// api: {
|
||||
// url: '/carbon_emission/device/getGatewayList',
|
||||
// method: 'post',
|
||||
// },
|
||||
value: mockData.value,
|
||||
listField: 'data.records',
|
||||
headerActions: [
|
||||
{
|
||||
label: '新增',
|
||||
name: 'RoleTypeAdd',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
opMap.type = 'add';
|
||||
opMap.fuc = (formData: any) => {
|
||||
console.log(formData, 'formData');
|
||||
mockData.value.push({
|
||||
id: Math.random().toString().slice(2, 6),
|
||||
...cloneDeep(formData),
|
||||
});
|
||||
};
|
||||
visible.value = true;
|
||||
},
|
||||
},
|
||||
],
|
||||
params: {
|
||||
page: 0,
|
||||
pageSize: 10,
|
||||
},
|
||||
rowSelection: null,
|
||||
columns: [
|
||||
{
|
||||
title: '序号',
|
||||
dataIndex: 'address',
|
||||
width: 80,
|
||||
customRender: (text: any) => {
|
||||
return text.index + 1;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '组织ID',
|
||||
dataIndex: 'zuzhi',
|
||||
},
|
||||
{
|
||||
title: '集团名称',
|
||||
dataIndex: 'jituanname',
|
||||
},
|
||||
{
|
||||
title: '组织名称',
|
||||
dataIndex: 'zuzhiname',
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status',
|
||||
},
|
||||
{
|
||||
title: '省市区',
|
||||
dataIndex: 'area',
|
||||
},
|
||||
{
|
||||
title: '地址',
|
||||
dataIndex: 'address',
|
||||
},
|
||||
{
|
||||
title: '联系人',
|
||||
dataIndex: 'person',
|
||||
},
|
||||
{
|
||||
title: '联系电话',
|
||||
dataIndex: 'phone',
|
||||
},
|
||||
],
|
||||
columnActions: {
|
||||
title: '操作',
|
||||
actions: [
|
||||
{
|
||||
label: '编辑',
|
||||
name: 'RoleTypeEdit',
|
||||
handle: (record: any) => {
|
||||
console.log(record, 'record');
|
||||
formData.value = record;
|
||||
opMap.type = 'edit';
|
||||
opMap.fuc = (formData: any) => {
|
||||
Object.assign(
|
||||
mockData.value.filter((item) => item.id === record.id)[0],
|
||||
formData,
|
||||
);
|
||||
};
|
||||
visible.value = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '组织边界',
|
||||
handle: (record: any) => {
|
||||
console.log(record, 'record');
|
||||
borderVisible.value = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '服务',
|
||||
handle: (record: any) => {
|
||||
console.log(record, 'record');
|
||||
serviceVisible.value = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '冻结',
|
||||
name: 'RoleTypeEdit',
|
||||
handle: (record: any) => {
|
||||
console.log(record, 'record');
|
||||
Modal.confirm({
|
||||
title: '是否冻结该账户',
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: createVNode('div', { style: 'color:red;' }, ''),
|
||||
onOk() {
|
||||
NsMessage.success('冻结成功');
|
||||
},
|
||||
class: 'test',
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '重置密码',
|
||||
name: 'RoleTypeEdit',
|
||||
handle: (record: any) => {
|
||||
console.log(record, 'record');
|
||||
Modal.confirm({
|
||||
title: '重置密码',
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
okText: '重置',
|
||||
content: h('div', {}, [
|
||||
h('p', `企业名称: ${record.jituanname}`),
|
||||
h('p', '管理员账号: hxdtadmin'),
|
||||
]),
|
||||
onOk() {
|
||||
Modal.confirm({
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: '是否确认重置该企业管理员密码',
|
||||
onOk() {
|
||||
Modal.success({
|
||||
okText: '确认',
|
||||
content: h('div', {}, [
|
||||
h('p', '重置成功'),
|
||||
h('p', '点击【确认】后自动复制密码并离开'),
|
||||
]),
|
||||
});
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
},
|
||||
class: 'test',
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '删除',
|
||||
name: 'RoleTypeEdit',
|
||||
dynamicParams: {
|
||||
uuid: 'uuid',
|
||||
},
|
||||
confirm: true,
|
||||
handle: (record: any, name: any, reload: any) => {
|
||||
console.log(record, name, reload, 'record');
|
||||
mockData.value.splice(0, 1);
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'zuzhibianhao',
|
||||
label: '组织编号',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
maxLength: 20,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'jituanname',
|
||||
label: '集团名称',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
maxLength: 20,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'zuzhiname',
|
||||
label: '组织名称',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
maxLength: 20,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'status',
|
||||
label: '状态',
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
options: [
|
||||
{
|
||||
label: '正常',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '冻结',
|
||||
value: 2,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'cityName',
|
||||
label: '城市地区',
|
||||
component: 'NsInputCity',
|
||||
defaultValue: '',
|
||||
fieldMap: ['provinceName', 'cityName', 'areaName', 'province', 'city', 'area'],
|
||||
componentProps: {
|
||||
api: '/api/parking_merchant/objs/BaseArea',
|
||||
isSeparate: true,
|
||||
},
|
||||
},
|
||||
],
|
||||
params: {},
|
||||
},
|
||||
// pagination: { defaultPageSize: 10 },
|
||||
rowKey: 'id',
|
||||
};
|
||||
|
||||
return {
|
||||
searchValue,
|
||||
onSearch,
|
||||
tableConfig,
|
||||
data,
|
||||
mainRef,
|
||||
visible,
|
||||
borderVisible,
|
||||
treeAddVisible,
|
||||
onClose,
|
||||
onEdit,
|
||||
editTree,
|
||||
deleteTree,
|
||||
borderAdd,
|
||||
borderAddSon,
|
||||
formSchema,
|
||||
formData,
|
||||
treeData,
|
||||
handleSelect,
|
||||
serviceVisible,
|
||||
ServiceSelect,
|
||||
checkedKeys,
|
||||
treeAdd,
|
||||
Sure,
|
||||
formRef,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped></style>
|
||||
|
@@ -0,0 +1,43 @@
|
||||
import { ref } from 'vue';
|
||||
|
||||
export const mockData = ref([
|
||||
{
|
||||
id: 3,
|
||||
zuzhi: '22',
|
||||
jituanname: 'axb',
|
||||
zuzhiname: '张三',
|
||||
status: '男',
|
||||
area: '123456789',
|
||||
address: '1234567889',
|
||||
person: '1',
|
||||
phone: '1',
|
||||
},
|
||||
]);
|
||||
|
||||
export const mockData2 = ref([
|
||||
{
|
||||
information: '铁路局1/产品部1/产品总监1',
|
||||
},
|
||||
]);
|
||||
|
||||
export const treeData = ref([
|
||||
{
|
||||
title: '铁路总局',
|
||||
key: '0-0',
|
||||
children: [
|
||||
{ title: '济阳站', key: '0-0-0' },
|
||||
{ title: '临沂站', key: '0-0-1' },
|
||||
],
|
||||
},
|
||||
]);
|
||||
|
||||
export const treeData2 = [
|
||||
{
|
||||
title: '全部',
|
||||
key: '0-0',
|
||||
children: [
|
||||
{ title: '产品部', key: '0-0-0' },
|
||||
{ title: '运维部', key: '0-0-1' },
|
||||
],
|
||||
},
|
||||
];
|
@@ -0,0 +1,126 @@
|
||||
import { mockData } from './mock';
|
||||
import { cloneDeep } from 'lodash-es';
|
||||
import { Modal } from 'ant-design-vue';
|
||||
import { createVNode, ref } from 'vue';
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
export const formConfig = [
|
||||
{
|
||||
field: 'field111',
|
||||
component: 'NsChildForm',
|
||||
componentProps: {
|
||||
title: '用户信息',
|
||||
schemas: [
|
||||
{
|
||||
label: '账号',
|
||||
field: 'zhanghao',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入账号',
|
||||
maxLength: 20,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入账号',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '姓名',
|
||||
field: 'name',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入姓名',
|
||||
maxLength: 20,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入姓名',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '性别',
|
||||
field: 'sex',
|
||||
component: 'NsRadioGroup',
|
||||
componentProps: {
|
||||
radioType: 'radio',
|
||||
options: [
|
||||
{ label: '男', value: 1 },
|
||||
{ label: '女', value: 2 },
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '手机号',
|
||||
field: 'phone',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入手机号',
|
||||
maxLength: 11,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入正确手机号格式',
|
||||
pattern: /^[1][3-9][0-9]{9}$/,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '邮箱',
|
||||
field: 'email',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入邮箱',
|
||||
maxLength: 30,
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '组织关系',
|
||||
field: 'relation',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
disabled: true,
|
||||
maxLength: 30,
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
];
|
||||
export const formConfig2 = (casData: any) => {
|
||||
return ref([
|
||||
{
|
||||
field: 'information',
|
||||
component: 'NsCascader',
|
||||
componentProps: {
|
||||
placeholder: '请选择',
|
||||
displayRender: ({ labels }: any) => {
|
||||
casData.value = labels;
|
||||
return labels.join('/');
|
||||
},
|
||||
options: [
|
||||
{
|
||||
value: '1',
|
||||
label: '铁路局',
|
||||
children: [
|
||||
{
|
||||
value: '2',
|
||||
label: '产品部',
|
||||
children: [
|
||||
{
|
||||
value: '3',
|
||||
label: '产品总监',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
]);
|
||||
};
|
@@ -11,7 +11,7 @@
|
||||
style="margin-bottom: 8px"
|
||||
placeholder="请输入关联企业"
|
||||
@search="onSearch" />
|
||||
<a-tree :tree-data="treeData" @select="handleSelect">
|
||||
<a-tree :tree-data="treeData" defaultExpandAll @select="handleSelect">
|
||||
<template #title="{ title }">
|
||||
{{ title }}
|
||||
<!-- <span v-if="title.indexOf(searchValue) > -1">
|
||||
@@ -29,7 +29,7 @@
|
||||
style="margin-bottom: 8px"
|
||||
placeholder="请输入关联部门"
|
||||
@search="onSearch2" />
|
||||
<a-tree :tree-data="treeData2" @select="handleSelect2">
|
||||
<a-tree :tree-data="treeData2" defaultExpandAll @select="handleSelect2">
|
||||
<template #title="{ title }">
|
||||
{{ title }}
|
||||
<!-- <span v-if="title.indexOf(searchValue) > -1">
|
||||
@@ -48,8 +48,9 @@
|
||||
:visible="visible"
|
||||
:body-style="{ paddingBottom: '80px' }"
|
||||
:footer-style="{ textAlign: 'right' }"
|
||||
destroyOnClose
|
||||
@close="onClose">
|
||||
<ns-form :schemas="formSchema" :model="formData" class="form" />
|
||||
<ns-form ref="formRef" :schemas="formSchema" :model="formData" class="form" />
|
||||
<span class="admin">用户权限</span>
|
||||
<ns-view-list-table v-bind="tableConfig2" :model="data" ref="mainRef" rowKey="uuid" />
|
||||
<a-button style="margin-right: 8px" @click="onClose">取消</a-button>
|
||||
@@ -74,6 +75,8 @@
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { cloneDeep } from 'lodash-es';
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
import { formConfig, formConfig2 } from './config';
|
||||
import { mockData, mockData2, treeData, treeData2 } from './mock';
|
||||
export default defineComponent({
|
||||
name: 'OrderListIndex',
|
||||
setup() {
|
||||
@@ -81,56 +84,21 @@
|
||||
const data = reactive({});
|
||||
let formData = ref({});
|
||||
let formData2 = ref({});
|
||||
const formRef = ref();
|
||||
const visible = ref(false);
|
||||
const addformvisible = ref(false);
|
||||
const searchValue = ref<string>('');
|
||||
const searchValue2 = ref<string>('');
|
||||
const formSchema = formConfig;
|
||||
const casData = ref([]);
|
||||
const formSchema2 = formConfig2(casData);
|
||||
|
||||
const opMap: any = {
|
||||
type: 'add',
|
||||
fuc: () => {},
|
||||
record: {},
|
||||
};
|
||||
|
||||
const mockData = ref([
|
||||
{
|
||||
id: 3,
|
||||
zhanghao: 'axb',
|
||||
name: '张三',
|
||||
sex: '男',
|
||||
phone: '123456789',
|
||||
email: '1234567889',
|
||||
relation: '1',
|
||||
role: '1',
|
||||
status: '1',
|
||||
},
|
||||
]);
|
||||
const mockData2 = ref([
|
||||
{
|
||||
information: '铁路局1/产品部1/产品总监1',
|
||||
},
|
||||
]);
|
||||
|
||||
const treeData = [
|
||||
{
|
||||
title: '铁路总局',
|
||||
key: '0-0',
|
||||
children: [
|
||||
{ title: '济阳站', key: '0-0-0' },
|
||||
{ title: '临沂站', key: '0-0-1' },
|
||||
],
|
||||
},
|
||||
];
|
||||
const treeData2 = [
|
||||
{
|
||||
title: '全部',
|
||||
key: '0-0',
|
||||
children: [
|
||||
{ title: '产品部', key: '0-0-0' },
|
||||
{ title: '运维部', key: '0-0-1' },
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
const onSearch = () => {
|
||||
console.log(searchValue.value);
|
||||
};
|
||||
@@ -152,9 +120,11 @@
|
||||
};
|
||||
|
||||
const onEdit = () => {
|
||||
console.log(formData.value, 'formData.value');
|
||||
opMap.fuc && opMap.fuc(formData.value);
|
||||
visible.value = false;
|
||||
formRef.value?.triggerSubmit().then(() => {
|
||||
console.log(formData.value, 'formData.value');
|
||||
opMap.fuc && opMap.fuc(formData.value);
|
||||
visible.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
const handleOk = () => {
|
||||
@@ -187,7 +157,10 @@
|
||||
opMap.type = 'add';
|
||||
opMap.fuc = (formData: any) => {
|
||||
console.log(formData, 'formData');
|
||||
mockData.value.push(cloneDeep(formData));
|
||||
mockData.value.push({
|
||||
id: Math.random().toString().slice(2, 6),
|
||||
...cloneDeep(formData),
|
||||
});
|
||||
};
|
||||
visible.value = true;
|
||||
},
|
||||
@@ -219,7 +192,25 @@
|
||||
confirm: true,
|
||||
isReload: true,
|
||||
handle: (data: any) => {
|
||||
console.log(data.list);
|
||||
console.log('object :>> ', data.list);
|
||||
const idList = data.list.map((item) => item.id);
|
||||
mockData.value.splice(0);
|
||||
return;
|
||||
const copyData = cloneDeep(mockData.value);
|
||||
mockData.value = copyData.filter((tar) => {
|
||||
return !idList.includes(tar.id);
|
||||
});
|
||||
|
||||
console.log(mockData.value);
|
||||
|
||||
return;
|
||||
copyData.map((item, index) => {
|
||||
if (idList.includes(item.id)) {
|
||||
mockData.value.filter((tar) => {
|
||||
return !idList.includes(tar.id);
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
],
|
||||
@@ -369,6 +360,7 @@
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入账号名',
|
||||
maxLength: 30,
|
||||
},
|
||||
},
|
||||
{
|
||||
@@ -377,6 +369,7 @@
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入姓名',
|
||||
maxLength: 30,
|
||||
},
|
||||
},
|
||||
{
|
||||
@@ -385,6 +378,7 @@
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入手机号',
|
||||
maxLength: 11,
|
||||
},
|
||||
},
|
||||
{
|
||||
@@ -393,6 +387,7 @@
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入邮箱',
|
||||
maxLength: 30,
|
||||
},
|
||||
},
|
||||
{
|
||||
@@ -401,6 +396,7 @@
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
placeholder: '请选择',
|
||||
disabled: true,
|
||||
options: [
|
||||
{
|
||||
label: '正常',
|
||||
@@ -476,155 +472,13 @@
|
||||
console.log(record, name, reload, 'record');
|
||||
mockData2.value.splice(0, 1);
|
||||
},
|
||||
|
||||
// Modal.confirm({
|
||||
// title: '确定确认删除',
|
||||
// icon: createVNode(ExclamationCircleOutlined),
|
||||
// content: createVNode('div', { style: 'color:red;' }, ''),
|
||||
// onOk() {
|
||||
// // http
|
||||
// // .post('/api/parking_merchant/objs/gateInfo/delete', {
|
||||
// // uuid: record.uuid,
|
||||
// // })
|
||||
// // .then((res) => {
|
||||
// // mainRef.value.nsTableRef.reload();
|
||||
// // });
|
||||
// },
|
||||
// onCancel() {
|
||||
// console.log('Cancel');
|
||||
// },
|
||||
// class: 'test',
|
||||
// });
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
const casData = ref([]);
|
||||
|
||||
const formSchema = reactive([
|
||||
{
|
||||
field: 'field111',
|
||||
component: 'NsChildForm',
|
||||
componentProps: {
|
||||
title: '用户信息',
|
||||
schemas: [
|
||||
{
|
||||
label: '账号',
|
||||
field: 'zhanghao',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入账号',
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: false,
|
||||
message: '请输入账号',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '姓名',
|
||||
field: 'name',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入姓名',
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: false,
|
||||
message: '请输入姓名',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '性别',
|
||||
field: 'sex',
|
||||
component: 'NsRadioGroup',
|
||||
componentProps: {
|
||||
radioType: 'radio',
|
||||
options: [
|
||||
{ label: '男', value: 1 },
|
||||
{ label: '女', value: 2 },
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '手机号',
|
||||
field: 'phone',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入手机号',
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: false,
|
||||
message: '请输入手机号',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '邮箱',
|
||||
field: 'email',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入邮箱',
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '组织关系',
|
||||
field: 'relation',
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
placeholder: '请选择组织关系',
|
||||
options: [
|
||||
{
|
||||
label: '正常',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '冻结',
|
||||
value: 2,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
]);
|
||||
const formSchema2 = reactive([
|
||||
{
|
||||
field: 'information',
|
||||
component: 'NsCascader',
|
||||
componentProps: {
|
||||
placeholder: '请选择',
|
||||
displayRender: ({ labels }: any) => {
|
||||
casData.value = labels;
|
||||
return labels.join('/');
|
||||
},
|
||||
options: [
|
||||
{
|
||||
value: '1',
|
||||
label: '铁路局',
|
||||
children: [
|
||||
{
|
||||
value: '2',
|
||||
label: '产品部',
|
||||
children: [
|
||||
{
|
||||
value: '3',
|
||||
label: '产品总监',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
]);
|
||||
|
||||
return {
|
||||
formRef,
|
||||
tableConfig,
|
||||
tableConfig2,
|
||||
data,
|
||||
|
@@ -0,0 +1,43 @@
|
||||
import { ref } from 'vue';
|
||||
|
||||
export const mockData = ref([
|
||||
{
|
||||
id: 3,
|
||||
zhanghao: 'axb',
|
||||
name: '张三',
|
||||
sex: '男',
|
||||
phone: '123456789',
|
||||
email: '1234567889',
|
||||
relation: '1',
|
||||
role: '1',
|
||||
status: '1',
|
||||
},
|
||||
]);
|
||||
|
||||
export const mockData2 = ref([
|
||||
{
|
||||
information: '铁路局1/产品部1/产品总监1',
|
||||
},
|
||||
]);
|
||||
|
||||
export const treeData = ref([
|
||||
{
|
||||
title: '铁路总局',
|
||||
key: '0-0',
|
||||
children: [
|
||||
{ title: '济阳站', key: '0-0-0' },
|
||||
{ title: '临沂站', key: '0-0-1' },
|
||||
],
|
||||
},
|
||||
]);
|
||||
|
||||
export const treeData2 = [
|
||||
{
|
||||
title: '全部',
|
||||
key: '0-0',
|
||||
children: [
|
||||
{ title: '产品部', key: '0-0-0' },
|
||||
{ title: '运维部', key: '0-0-1' },
|
||||
],
|
||||
},
|
||||
];
|
Reference in New Issue
Block a user