Commit 0a75ba2f authored by chenjiahao's avatar chenjiahao

Merge remote-tracking branch 'origin/master'

parents 2bfdff78 439b5134
This diff is collapsed.
...@@ -1317,11 +1317,17 @@ export const ResourceRoute: AppRouteRecordRaw = { ...@@ -1317,11 +1317,17 @@ export const ResourceRoute: AppRouteRecordRaw = {
name: 'detail1', name: 'detail1',
component: () => import('@/views/dataSharingAndExchange/resourceManagement/detail/index.vue'), component: () => import('@/views/dataSharingAndExchange/resourceManagement/detail/index.vue'),
}, },
{
path: 'carouselManagement/detail',
name: 'detail2',
component: () => import('@/views/dataSharingAndExchange/carouselManagement/detail/index.vue'),
},
], ],
}; };
/**
/**服务平台*/ * 服务平台
export const ServicePlatform: AppRouteRecordRaw = { */
export const ServicePlatformRoute: AppRouteRecordRaw = {
path: '/servicePlatform', path: '/servicePlatform',
name: 'servicePlatform', name: 'servicePlatform',
component: LAYOUT, component: LAYOUT,
...@@ -1332,6 +1338,11 @@ export const ServicePlatform: AppRouteRecordRaw = { ...@@ -1332,6 +1338,11 @@ export const ServicePlatform: AppRouteRecordRaw = {
currentActiveMenu: '/servicePlatform', currentActiveMenu: '/servicePlatform',
}, },
children: [ children: [
{
path: 'policyManagement/detail',
name: 'policyManagementDetail',
component: () => import('@/views/servicePlatform/policyManagement/detail/index.vue'),
},
{ {
path: 'enterpriseCertification/detail', path: 'enterpriseCertification/detail',
name: 'detail', name: 'detail',
...@@ -1340,6 +1351,9 @@ export const ServicePlatform: AppRouteRecordRaw = { ...@@ -1340,6 +1351,9 @@ export const ServicePlatform: AppRouteRecordRaw = {
title: '企业认证', title: '企业认证',
icon: '', icon: '',
}, },
path: 'carouselManagement/detail',
name: 'detail2',
component: () => import('@/views/dataSharingAndExchange/carouselManagement/detail/index.vue'),
}, },
], ],
}; };
...@@ -1377,5 +1391,5 @@ export const basicRoutes = [ ...@@ -1377,5 +1391,5 @@ export const basicRoutes = [
processCenterRoute, processCenterRoute,
BenchmarkRoute, BenchmarkRoute,
PCFontRoute, PCFontRoute,
ServicePlatform, ServicePlatformRoute,
]; ];
<template>
<BasicModal width="40%" v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup>
import {ref, computed, unref, reactive} from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { accountFormSchema } from './institution.data';
import { getDeptList } from '@/api/system/dept/dept';
import {addUserApi,UserDetailApi,UserUpdataApi} from '@/api/system/user/user'
import { encryptTwo } from '../../../../src/utils/jsencrypt.js'
import { useMessage } from '@/hooks/web/useMessage';
import {TreeData} from "@/views/dataSharingAndExchange/catalogingManagement/institutionData";
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const isUpdate = ref(true);
const isMove = ref(false);
const rowId = ref('');
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
schemas: accountFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false });
isUpdate.value = !!data?.isUpdate;
isMove.value = !!data?.isMove;
if (unref(isUpdate)) {
// 获取行数据的id
rowId.value = data.record.businessId;
// 塞值
setFieldsValue({
...data.record,
});
}
const treeList = handleTree(TreeData, 'businessId',undefined,undefined,undefined)
updateSchema([
{
field: 'institutionId',
componentProps: {
treeData: treeList
},
},
]);
});
const getTitle = computed(() => (!unref(isUpdate) ? '新增账号' : '编辑账号'));
function handleTree(data, id, parentId, children, rootId) {
id = id || 'id'
parentId = parentId || 'parentId'
children = children || 'children'
rootId = rootId || Math.min.apply(Math, data.map(item => { return item[parentId] })) || 0
// 对源数据深度克隆
const cloneData = JSON.parse(JSON.stringify(data))
// 循环所有项
const treeData = cloneData.filter(father => {
const branchArr = cloneData.filter(child => {
// 返回每一项的子级数组
return father[id] === child[parentId]
})
branchArr.length > 0 ? father.children = branchArr : ''
// 返回第一层
return father[parentId] === rootId
})
return treeData !== '' ? treeData : data
}
/**确定按钮*/
async function handleSubmit() {
try {
//拿到表单内容
const values = await validate();
//通过表单获取的institutionId去查找相同TreeData中的institutionId的institutionName
const institutionName = TreeData.find(item => item.businessId === values.institutionId).institutionName
values.institutionName = institutionName
setModalProps({ confirmLoading: true });
// 编辑
if(unref(isUpdate)) {
values.businessId = rowId.value
//修改列表值
emit('success', { isUpdate: unref(isUpdate), values: { ...values, id: rowId.value } });
createMessage.success('编辑成功');
closeModal();
}else {
//根据institutionId去查找相同TreeData中的institutionId的institutionName
const institutionName = TreeData.find(item => item.businessId === values.institutionId).institutionName
const paramsAdd = {
username: values.username,
name: values.name,
institutionId: values.institutionId,
institutionName: institutionName,
createDate: formatDate(new Date())
}
emit('success', { isUpdate: unref(isUpdate), values: { ...paramsAdd } });
createMessage.success('新增成功');
closeModal();
}
} finally {
setModalProps({ confirmLoading: false });
}
}
// 格式化日期
function formatDate(date) {
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始,需要加1
const day = String(date.getDate()).padStart(2, '0');
const hours = String(date.getHours()).padStart(2, '0');
const minutes = String(date.getMinutes()).padStart(2, '0');
const seconds = String(date.getSeconds()).padStart(2, '0');
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}
</script>
<template>
<BasicModal
width="50%"
v-bind="$attrs"
@register="registerModal"
:title="getTitle"
@ok="handleSubmit"
>
<BasicTable @register="registerTable" />
</BasicModal>
</template>
<script lang="ts" setup>
import { BasicModal, useModalInner, useModal } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { reactive, unref, onDeactivated, onMounted, ref, computed } from 'vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { useMessage } from '@/hooks/web/useMessage';
import { addUserData, columns, searchFormSchema, TreeData } from './institutionData';
import { useGo } from '@/hooks/web/usePage';
import { downloadByData } from '@/utils/file/download';
import { useRoute, onBeforeRouteLeave } from 'vue-router';
import { useFilterStore } from '@/store/modules/filterData';
import { useUserStore } from '@/store/modules/user';
import { userData } from '@/views/dataSharingAndExchange/catalogingManagement/institutionData';
defineOptions({ name: 'AccountManagement' });
const { createMessage } = useMessage();
const filterStore = useFilterStore();
const route = useRoute();
const go = useGo();
const [registerMoveUser, { openModal: openMoveUserModal }] = useModal();
const searchInfo = reactive<Recordable>({});
const emit = defineEmits(['success', 'register']);
const tableData = ref([]);
const isAdd = ref(true);
const [
registerTable,
{ reload, updateTableDataRecord, getSearchInfo, getForm, getRowSelection },
] = useTable({
title: '添加编目',
api: async (params) => {
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: tableData.value.length,
code: '',
message: '',
data: [],
};
var data = [];
data = tableData.value;
if (params.name != undefined && params.name != '' && params.name != null) {
//过滤出名字包含params.name的数据
data = data.filter((item) => item.name.includes(params.name));
}
if (params.username != undefined && params.username != '' && params.username != null) {
data = data.filter((item) => item.username.includes(params.username));
}
return { ...response, data: data };
},
rowKey: 'businessId',
columns,
rowSelection: true,
formConfig: {
labelWidth: 100,
schemas: searchFormSchema,
autoSubmitOnEnter: true,
},
useSearchForm: true,
showTableSetting: false,
bordered: true,
handleSearchInfoFn(info) {
return info;
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
setModalProps({ confirmLoading: false });
isAdd.value = !!data?.isAdd;
});
const getTitle = computed(() => {
return isAdd.value ? '添加轮播图' : '编辑轮播图';
});
/** 新增成功*/
function handleSubmit() {
const rowSelection = getRowSelection().selectedRowKeys;
if (rowSelection.length > 0) {
//已选中
//根据选中的查询用户 然后进行添加
let data = [];
data = tableData.value.filter((item) => rowSelection.includes(item.businessId));
emit('success', { isAdd: unref(isAdd), values: { ...data }, length: rowSelection.length });
closeModal();
}
}
onMounted(() => {
tableData.value = addUserData;
});
</script>
<template>
<div class="m-4 mr-0 overflow-hidden bg-white">
<BasicTree
title="部门列表"
ref="treeRef"
toolbar
search
treeWrapperClassName="h-[calc(100%-35px)] overflow-auto"
:clickRowToExpand="false"
:defaultExpandAll="true"
:treeData="treeData"
:fieldNames="{ key: 'businessId', title: 'institutionName' }"
@select="handleSelect"
:actionList="actionList"
/>
</div>
<MoveTreeModal @register="registerMoveTreeModel" @success="handleSuccess" />
<UpdateTreeModal @register="registerModal" @success="handleSuccess" />
</template>
<script lang="ts" setup>
import {h, nextTick, onMounted, ref, unref} from 'vue';
import {BasicTree, TreeActionItem, TreeActionType, TreeItem} from '@/components/Tree';
import { getDeptList } from '@/api/system/dept/dept';
import {Nullable} from "@vben/types";
import { TreeData } from "@/views/dataSharingAndExchange/catalogingManagement/institutionData";
import {DeleteOutlined, PlusOutlined,EditOutlined,FolderOutlined } from "@ant-design/icons-vue";
import {Modal} from "ant-design-vue";
import { useMessage } from '@/hooks/web/useMessage';
import MoveTreeModal from './MoveTreeModal.vue';
import UpdateTreeModal from './UpdateTreeModal.vue';
import {useModal} from "@/components/Modal";
defineOptions({ name: 'DeptTree' });
const emit = defineEmits(['select']);
const { createMessage } = useMessage();
const treeData = ref<TreeItem[]>([]);
const treeRef = ref<Nullable<TreeActionType>>(null);
const [registerModal, { openModal }] = useModal();
const [registerMoveTreeModel, { openModal:openMoveTreeModel }] = useModal();
function getTree() {
const tree = unref(treeRef);
if (!tree) {
throw new Error('tree is null!');
}
return tree;
}
async function fetch() {
const data = TreeData
treeData.value = handleTree(data, 'businessId',undefined,undefined,undefined)
await nextTick(() => {
getTree().expandAll(true)
})
}
function handleTree(data, id, parentId, children, rootId) {
id = id || 'id'
parentId = parentId || 'parentId'
children = children || 'children'
rootId = rootId || Math.min.apply(Math, data.map(item => { return item[parentId] })) || 0
// 对源数据深度克隆
const cloneData = JSON.parse(JSON.stringify(data))
// 循环所有项
const treeData = cloneData.filter(father => {
const branchArr = cloneData.filter(child => {
// 返回每一项的子级数组
return father[id] === child[parentId]
})
branchArr.length > 0 ? father.children = branchArr : ''
// 返回第一层
return father[parentId] === rootId
})
return treeData !== '' ? treeData : data
}
function handleSelect(keys) {
emit('select', keys[0]);
}
onMounted(() => {
fetch();
});
/** 成功回调函数*/
function handleSuccess() {
}
// 树的操作列表
const actionList = [
{
//新增
render: (node) => {
return h(PlusOutlined, {
class: 'ml-2',
onClick: () => {
handleAdd(node);
},
});
},
},
{
//修改
render: (node) => {
return h(EditOutlined, {
class: 'ml-2',
onClick: () => {
handleUpdate(node);
},
});
},
},
{
//删除
render: (node) => {
return h(DeleteOutlined, {
class: 'ml-2',
onClick: () => {
handleDelete(node);
},
});
},
},
{
//移动
render: (node) => {
return h(FolderOutlined, {
class: 'ml-2',
onClick: () => {
handleMove(node);
},
});
},
},
];
// 新增节点
const handleAdd = (node) => {
openModal(true, {
isAdd: true,
record: node,
});
};
// 修改节点
const handleUpdate = (node) => {
openModal(true, {
isUpdate: true,
record: node,
});
};
// 移动节点
const handleMove = (node) => {
openMoveTreeModel(true, {
isMove: true,
record: node,
});
};
// 删除节点
const handleDelete = (node) => {
Modal.confirm({
title: '确认删除',
content: '确定要删除此节点吗?',
okText: '确认',
cancelText: '取消',
onOk() {
// 执行删除逻辑
createMessage.success('删除成功!')
},
onCancel() {
console.log('取消删除');
createMessage.info('取消删除')
},
});
};
</script>
<template>
<BasicModal width="40%" v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup>
import {ref, computed, unref, reactive} from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import {AddTreeSchema, MoveFormSchema} from './institution.data';
import { useMessage } from '@/hooks/web/useMessage';
import {TreeData} from "@/views/dataSharingAndExchange/catalogingManagement/institutionData";
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const isUpdate = ref(true);
const isMove = ref(false);
const rowId = ref('')
const form = ref([])
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
schemas: MoveFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false });
form.value = data.record
const formData = {
institutionId: data.record.parentId,
}
// 塞值
setFieldsValue({
...formData,
});
const treeList = handleTree(TreeData, 'businessId',undefined,undefined,undefined)
updateSchema([
{
field: 'institutionId',
componentProps: {
treeData: treeList
},
},
]);
});
const getTitle = computed(() => ('移动'));
function handleTree(data, id, parentId, children, rootId) {
id = id || 'id'
parentId = parentId || 'parentId'
children = children || 'children'
rootId = rootId || Math.min.apply(Math, data.map(item => { return item[parentId] })) || 0
// 对源数据深度克隆
const cloneData = JSON.parse(JSON.stringify(data))
// 循环所有项
const treeData = cloneData.filter(father => {
const branchArr = cloneData.filter(child => {
// 返回每一项的子级数组
return father[id] === child[parentId]
})
branchArr.length > 0 ? father.children = branchArr : ''
// 返回第一层
return father[parentId] === rootId
})
return treeData !== '' ? treeData : data
}
/**确定按钮*/
async function handleSubmit() {
const values = await validate();
createMessage.success('移动成功')
closeModal()
}
// 格式化日期
function formatDate(date) {
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始,需要加1
const day = String(date.getDate()).padStart(2, '0');
const hours = String(date.getHours()).padStart(2, '0');
const minutes = String(date.getMinutes()).padStart(2, '0');
const seconds = String(date.getSeconds()).padStart(2, '0');
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}
</script>
<template>
<BasicModal width="40%" v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup>
import {ref, computed, unref, reactive} from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import {AddTreeSchema} from './institution.data';
import { useMessage } from '@/hooks/web/useMessage';
import {TreeData} from "@/views/dataSharingAndExchange/catalogingManagement/institutionData";
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const isUpdate = ref(true);
const isMove = ref(false);
const isAdd = ref(false);
const rowId = ref('');
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
schemas: AddTreeSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false });
//修改
isAdd.value = !!data?.isAdd;
//修改
isUpdate.value = !!data?.isUpdate;
if (unref(isUpdate)) {
//修改
// 获取行数据的id
rowId.value = data.record.businessId;
const formData = {
institutionId: data.record.parentId,
institutionName: data.record.anotherName,
code:data.record.code
}
// 塞值
setFieldsValue({
...formData,
});
}else if (unref(isAdd)){
//新增
}
const treeList = handleTree(TreeData, 'businessId',undefined,undefined,undefined)
updateSchema([
{
field: 'institutionId',
componentProps: {
treeData: treeList
},
},
]);
});
const getTitle = computed(() => (!unref(isUpdate) ? '新增编目' : '编辑编目'));
function handleTree(data, id, parentId, children, rootId) {
id = id || 'id'
parentId = parentId || 'parentId'
children = children || 'children'
rootId = rootId || Math.min.apply(Math, data.map(item => { return item[parentId] })) || 0
// 对源数据深度克隆
const cloneData = JSON.parse(JSON.stringify(data))
// 循环所有项
const treeData = cloneData.filter(father => {
const branchArr = cloneData.filter(child => {
// 返回每一项的子级数组
return father[id] === child[parentId]
})
branchArr.length > 0 ? father.children = branchArr : ''
// 返回第一层
return father[parentId] === rootId
})
return treeData !== '' ? treeData : data
}
/**确定按钮*/
async function handleSubmit() {
const values = await validate();
if (unref(isUpdate)){
createMessage.success('修改成功')
closeModal()
}else if (!unref(isUpdate)){
createMessage.success('新增成功')
closeModal()
}
}
// 格式化日期
function formatDate(date) {
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始,需要加1
const day = String(date.getDate()).padStart(2, '0');
const hours = String(date.getHours()).padStart(2, '0');
const minutes = String(date.getMinutes()).padStart(2, '0');
const seconds = String(date.getSeconds()).padStart(2, '0');
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}
</script>
<template>
<BasicModal width="40%" v-bind="$attrs" @register="registerModal" title="编辑" @ok="handleSubmit">
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup>
import {ref, computed, unref, reactive} from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import {accountFormSchema, EditFormSchema} from '../institution.data';
import { getDeptList } from '@/api/system/dept/dept';
import {addUserApi,UserDetailApi,UserUpdataApi} from '@/api/system/user/user'
import { encryptTwo } from '../../../../src/utils/jsencrypt.js'
import { useMessage } from '@/hooks/web/useMessage';
import {TreeData} from "@/views/dataSharingAndExchange/catalogingManagement/institutionData";
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const isUpdate = ref(true);
const isMove = ref(false);
const rowId = ref('');
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
schemas: EditFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false });
isUpdate.value = !!data?.isUpdate;
isMove.value = !!data?.isMove;
if (unref(isUpdate)) {
// 获取行数据的id
rowId.value = data.record.businessId;
// 塞值
setFieldsValue({
...data.record,
});
}
const treeList = handleTree(TreeData, 'businessId',undefined,undefined,undefined)
updateSchema([
{
field: 'institutionId',
componentProps: {
treeData: treeList
},
},
]);
});
const getTitle = computed(() => (!unref(isUpdate) ? '编辑' : '编辑'));
function handleTree(data, id, parentId, children, rootId) {
id = id || 'id'
parentId = parentId || 'parentId'
children = children || 'children'
rootId = rootId || Math.min.apply(Math, data.map(item => { return item[parentId] })) || 0
// 对源数据深度克隆
const cloneData = JSON.parse(JSON.stringify(data))
// 循环所有项
const treeData = cloneData.filter(father => {
const branchArr = cloneData.filter(child => {
// 返回每一项的子级数组
return father[id] === child[parentId]
})
branchArr.length > 0 ? father.children = branchArr : ''
// 返回第一层
return father[parentId] === rootId
})
return treeData !== '' ? treeData : data
}
/**确定按钮*/
async function handleSubmit() {
try {
//拿到表单内容
const values = await validate();
//通过表单获取的institutionId去查找相同TreeData中的institutionId的institutionName
const institutionName = TreeData.find(item => item.businessId === values.institutionId).institutionName
values.institutionName = institutionName
setModalProps({ confirmLoading: true });
// 编辑
if(unref(isUpdate)) {
values.businessId = rowId.value
//修改列表值
emit('success', { isUpdate: unref(isUpdate), values: { ...values, id: rowId.value } });
createMessage.success('编辑成功');
closeModal();
}else {
//根据institutionId去查找相同TreeData中的institutionId的institutionName
const institutionName = TreeData.find(item => item.businessId === values.institutionId).institutionName
const paramsAdd = {
username: values.username,
name: values.name,
institutionId: values.institutionId,
institutionName: institutionName,
createDate: formatDate(new Date())
}
emit('success', { isUpdate: unref(isUpdate), values: { ...paramsAdd } });
createMessage.success('新增成功');
closeModal();
}
} finally {
setModalProps({ confirmLoading: false });
}
}
// 格式化日期
function formatDate(date) {
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始,需要加1
const day = String(date.getDate()).padStart(2, '0');
const hours = String(date.getHours()).padStart(2, '0');
const minutes = String(date.getMinutes()).padStart(2, '0');
const seconds = String(date.getSeconds()).padStart(2, '0');
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}
</script>
import { getAllRoleList } from '@/api/system/role/role';
import { BasicColumn, FormSchema } from '@/components/Table';
import { h } from 'vue';
import { Tag } from 'ant-design-vue';
import { Switch } from 'ant-design-vue';
import { useMessage } from '@/hooks/web/useMessage';
import { changeFlagApi } from '@/api/system/user/user'; // 引入开关组件
type CheckedType = boolean | string | number;
export const columns: BasicColumn[] = [
{
title: '质量主体名称',
dataIndex: 'fileName',
width: 150,
slots: { customRender: 'fileName' },
},
{
title: '描述',
dataIndex: 'descripe',
width: 150,
},
{
title: '创建者',
dataIndex: 'holder',
width: 150,
},
{
title: '创建时间',
dataIndex: 'createDate',
width: 150,
},
{
title: '更新时间',
dataIndex: 'updateDate',
width: 150,
},
{
title: '原始主体',
dataIndex: 'originalPrincipal',
slots: { customRender: 'originalPrincipal' },
width: 150,
},
];
export const searchFormSchema: FormSchema[] = [
{
field: 'name',
label: '名称',
component: 'Input',
componentProps: {
placeholder: '请输入名称',
},
colProps: { span: 7 },
},
];
export const accountFormSchema: any[] = [
{
field: 'fileName',
label: '文件名称',
component: 'Input',
colProps: { lg: 24, md: 24 },
componentProps: {
disabled: true,
},
},
{
field: 'location',
label: '保存位置',
component: 'Input',
colProps: { lg: 24, md: 24 },
componentProps: {
disabled: true,
},
},
{
field: 'createDate',
label: '创建时间',
component: 'Input',
colProps: { lg: 24, md: 24 },
componentProps: {
disabled: true,
},
},
{
field: 'updateDate',
label: '最近修改',
component: 'Input',
colProps: { lg: 24, md: 24 },
componentProps: {
disabled: true,
},
},
];
/**移动*/
export const MoveFormSchema: any[] = [
{
field: 'taskId',
label: '路径',
component: 'TreeSelect',
colProps: { lg: 24, md: 24 },
componentProps: {
fieldNames: {
label: 'fileName',
value: 'businessId',
},
getPopupContainer: () => document.body,
},
required: true,
},
];
/**存储管理*/
export const StorageSchema: FormSchema[] = [
{
field: 'isStorage',
label: '存储主体问题数据明细',
component: 'Checkbox',
colProps: { lg: 12, md: 24 },
componentProps: ({ formModel, formActionType }) => ({
onChange: () => {
formActionType.updateSchema([{ field: 'isStorageInHDFS', ifShow: formModel.isStorage }]);
formActionType.updateSchema([{ field: 'handle', ifShow: formModel.isStorage }]);
formActionType.updateSchema([{ field: 'isAutoClear', ifShow: formModel.isStorage }]);
formActionType.updateSchema([{ field: 'clear', ifShow: formModel.isStorage }]);
formActionType.updateSchema([{ field: 'divider', ifShow: formModel.isStorage }]);
},
}),
},
{
field: 'isStorageInHDFS',
label: '存储到HDFS',
labelWidth: 85,
component: 'Checkbox',
colProps: { lg: 12, md: 24 },
ifShow: false,
},
{
field: 'handle',
label: '手动清理',
component: 'BasicTitle',
ifShow: false,
colProps: { lg: 24, md: 24 },
},
{
field: 'clear',
label: '清理',
component: 'Input',
labelWidth: 30,
colProps: { lg: 24, md: 24 },
ifShow: false,
slot: 'clear',
},
{
field: 'divider',
component: 'Divider',
ifShow: false,
colProps: { lg: 24, md: 24 },
},
{
field: 'isAutoClear',
label: '自动清理',
labelWidth: 70,
component: 'Checkbox',
colProps: { lg: 12, md: 24 },
ifShow: false,
componentProps: ({ formModel, formActionType }) => ({
onChange: () => {
formActionType.updateSchema([{ field: 'maxRetentionTime', ifShow: formModel.isAutoClear }]);
formActionType.updateSchema([{ field: 'inspectionCycle', ifShow: formModel.isAutoClear }]);
formActionType.updateSchema([{ field: 'inspectionTime', ifShow: formModel.isAutoClear }]);
},
}),
},
{
field: 'maxRetentionTime',
label: '最长保留时间',
component: 'Input',
colProps: { lg: 24, md: 24 },
componentProps: {
addonAfter: '天',
},
ifShow: false,
},
{
field: 'inspectionCycle',
label: '检查周期',
component: 'Select',
colProps: { lg: 24, md: 24 },
componentProps: {
options: [
{ label: '每天', value: '每天' },
{ label: '每周', value: '每周' },
{ label: '每月', value: '每月' },
{ label: '每年', value: '每年' },
],
},
ifShow: false,
},
{
field: 'inspectionTime',
label: '检查时间',
component: 'Input',
colProps: { lg: 24, md: 24 },
ifShow: false,
slot: 'isStorageInHDFS',
},
];
export const resetNameFormSchema: FormSchema[] = [
{
field: 'fileName',
label: '文件名称',
component: 'Input',
rules: [
{
required: true,
message: '请输入文件名称',
},
],
componentProps: {
placeholder: '请输入文件名称',
},
colProps: { span: 8 },
},
];
export const createFileFormSchema: FormSchema[] = [
{
field: 'taskId',
label: '路径',
component: 'TreeSelect',
colProps: { lg: 24, md: 24 },
componentProps: {
fieldNames: {
label: 'fileName',
value: 'businessId',
},
getPopupContainer: () => document.body,
},
required: true,
},
{
field: 'fileName',
label: '文件名称',
component: 'Input',
colProps: { lg: 24, md: 24 },
rules: [
{
required: true,
message: '请输入文件名称',
},
],
componentProps: {
placeholder: '请输入文件名称',
},
},
];
export const createTaskFormSchema: FormSchema[] = [
{
field: 'taskId',
label: '路径',
component: 'TreeSelect',
colProps: { lg: 24, md: 24 },
componentProps: {
fieldNames: {
label: 'fileName',
value: 'businessId',
},
getPopupContainer: () => document.body,
},
required: true,
},
{
field: 'name',
label: '质量主体名称',
component: 'Input',
rules: [
{
required: true,
message: '请输入质量主体名称',
},
],
componentProps: {
placeholder: '请输入质量主体名称',
},
colProps: { lg: 24, md: 24 },
},
{
field: 'fileType',
label: '文件类型',
component: 'Input',
defaultValue: '质量主体',
componentProps: {
readonly: true,
style: {
border: 'none',
backgroundColor: 'transparent',
},
},
colProps: { lg: 24, md: 24 },
},
];
<template>
<PageWrapper dense contentClass="flex">
<template #headerContent>
<div style="display: flex; justify-content: space-between">
<div class="title">
<div class="title_left">
<div>
<Icon icon="dashicons:images-alt2" :size="32" :color="'#7360E2'" />
</div>
<div style="padding-left: 10px">
<div class="name">轮播图管理</div>
<div style="color: darkgray">数据要素/商城管理</div>
</div>
</div>
</div>
</div>
<div class="headerForm">
<BasicForm @register="registerForm">
<template #toolbar>
<a-button type="primary">导入</a-button>
</template>
</BasicForm>
</div>
</template>
<BasicTable @register="registerTable" :searchInfo="searchInfo">
<template #toolbar>
<a-button type="primary">新增轮播图</a-button>
<a-button type="primary">批量删除</a-button>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
// 详情按钮
{
icon: 'dashicons:media-document',
tooltip: '详情',
onClick: handleDetails.bind(null, record),
},
// 编辑按钮
{
icon: 'dashicons:edit-large',
tooltip: '编辑',
// onClick: handleDetails.bind(null, record),
},
]"
/>
</template>
</template>
</BasicTable>
<AccountModal @register="registerModal" @success="handleSuccess" />
<MoveUser @register="registerMoveUser" @success="handleMoveSuccess" />
<AddUserModal @register="registerAddUserModal" @success="handleAddSuccess" />
</PageWrapper>
</template>
<script lang="ts" setup>
import { reactive, unref, onDeactivated, onMounted, ref } from 'vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { Row, Col } from 'ant-design-vue';
import { getAccountList, deleteUser, exportUserList } from '@/api/system/user/user';
import { PageWrapper } from '@/components/Page';
import { useMessage } from '@/hooks/web/useMessage';
import { useModal } from '@/components/Modal';
import BasicForm from '@/components/Form/src/BasicForm.vue';
import user from '../../../../mock/sys/user';
import * as echarts from 'echarts';
import Icon from '@/components/Icon/Icon.vue';
import { useForm } from '@/components/Form';
import { useGo } from '@/hooks/web/usePage';
import { downloadByData } from '@/utils/file/download';
import { useRoute, onBeforeRouteLeave, useRouter } from 'vue-router';
import { useFilterStore } from '@/store/modules/filterData';
import { tableDataForIndex } from '@/views/dataSharingAndExchange/carouselManagement/institutionData';
import AccountModal from './AccountModal.vue';
import importModal from './importModal.vue';
import MoveUser from './moveUser.vue';
import AddUserModal from './AddUserModal.vue';
import { columns, searchFormSchema } from './institution.data';
defineOptions({ name: 'AccountManagement' });
const { createMessage, createConfirm } = useMessage();
const filterStore = useFilterStore();
const route = useRoute();
const go = useGo();
const [registerModal, { openModal }] = useModal();
const [registerAddUserModal, { openModal: addUserModal }] = useModal();
const [registerMoveUser, { openModal: openMoveUserModal }] = useModal();
const searchInfo = reactive<Recordable>({});
const tableData = ref([]);
const { push } = useRouter();
const [
registerTable,
{ reload, updateTableDataRecord, getSearchInfo, getForm, getRowSelection },
] = useTable({
title: '轮播图管理列表',
api: async (params) => {
console.log(params);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: tableData.value.length,
code: '',
message: '',
data: [],
};
//过滤data中的数据,取出等于params.deptId的数据
var data = [];
//按照部门筛选 如果有进行过滤相应部门的 没有就赋值全部
if (params.institutionId != undefined && params.institutionId != '') {
data = tableData.value.filter((item) => item.institutionId === params.institutionId);
} else {
data = tableData.value;
}
if (params.name != undefined && params.name != '' && params.name != null) {
//过滤出名字包含params.name的数据
data = data.filter((item) => item.name.includes(params.name));
}
if (params.username != undefined && params.username != '' && params.username != null) {
data = data.filter((item) => item.username.includes(params.username));
}
return { ...response, data: data };
},
rowKey: 'businessId',
columns,
rowSelection: true,
formConfig: {
labelWidth: 10,
schemas: searchFormSchema,
autoSubmitOnEnter: true,
resetFunc: () => {
searchInfo.institutionId = '';
},
},
useSearchForm: false,
showTableSetting: false,
showIndexColumn: false,
bordered: true,
handleSearchInfoFn(info) {
return info;
},
actionColumn: {
width: 100,
title: '操作',
dataIndex: 'action',
},
});
//初始化表单
const [registerForm, { getFieldsValue, setFieldsValue, updateSchema, resetFields, validate }] =
useForm({
labelWidth: 10,
schemas: searchFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
/** 新增按钮*/
function handleCreate() {
addUserModal(true, {
isAdd: true,
});
}
function updateData() {
console.log();
}
/**批量移动*/
function handleMoveBatch() {
const rowSelection = getRowSelection().selectedRowKeys;
openMoveUserModal(true, {
idList: rowSelection,
isMove: true,
});
}
/** 移动按钮*/
function handleMove(record: Recordable) {
openMoveUserModal(true, {
record,
isMove: true,
});
}
/** 新增按钮*/
function handleAdd(record: Recordable) {
openModal(true, {
record,
isAdd: true,
});
}
/** 编辑按钮*/
function handleEdit(record: Recordable) {
openModal(true, {
record,
isUpdate: true,
});
} /** 详情按钮*/
function handleDetails(record: Recordable) {
push({
path: '/dataSharingAndExchange/carouselManagement/detail',
// path: '/dataSharingAndExchange/resourceManagement/detail/index',
// path: '/dataWarehousePlanning/physicalModel/detail',
query: record,
});
console.log('path', record);
}
/** 删除按钮*/
function handleDelete(record: Recordable) {
tableData.value.splice(
tableData.value.findIndex((item) => item.businessId === record.businessId),
1,
);
createMessage.success('删除成功!');
reload();
}
/** 导入成功*/
function handleImportSuccess() {
reload();
}
/** 新增/编辑成功*/
function handleSuccess({ isUpdate, values }) {
if (isUpdate) {
// 注意:updateTableDataRecord要求表格的rowKey属性为string并且存在于每一行的record的keys中
//修改表单的值
const result = updateTableDataRecord(values.businessId, values);
reload();
} else {
tableData.value.push(values);
reload();
}
}
/** 移动*/
function handleMoveSuccess({ isMove, values }) {
const rowSelection = getRowSelection().selectedRowKeys;
if (rowSelection.length > 0) {
//批量移动
for (let i = 0; i < rowSelection.length; i++) {
const result = updateTableDataRecord(values[i].institutionId, values[i]);
}
} else {
//单个移动
const result = updateTableDataRecord(values.businessId, values);
}
reload();
}
/** 添加用户*/
function handleAddSuccess({ isAdd, values, length }) {
if (length > 0) {
//批量添加
for (let i = 0; i < length; i++) {
tableData.value.push(values[i]);
}
}
reload();
}
/** 部门树的select*/
function handleSelect(institutionId = '') {
searchInfo.institutionId = institutionId;
reload();
}
function handleView(record: Recordable) {
go('/system/account_detail/' + record.id);
}
onMounted(() => {
tableData.value = tableDataForIndex;
const path = route.path;
if (filterStore.getSearchParams[path]) {
if (JSON.parse(filterStore.getSearchParams[path] !== {})) {
const params = JSON.parse(filterStore.getSearchParams[path]);
getForm().setFieldsValue({
page: params.page,
pageSize: params.pageSize,
username: params.username,
flag: params.flag,
});
searchInfo.institutionId = params.institutionId;
}
}
});
onBeforeRouteLeave((to, from, next) => {
const params = Object.assign({}, getSearchInfo(), getForm().getFieldsValue());
filterStore.setSearchParams({
path: from.path,
param: {
...params,
},
});
next(); // 允许导航
});
</script>
<style scoped lang="scss">
.title {
display: flex;
align-items: center;
justify-content: space-between;
.title_left {
display: flex;
align-items: center;
justify-content: space-between;
.name {
padding-bottom: 5px;
font-size: 17px;
font-weight: 600;
}
}
}
.headerForm {
margin-top: 30px;
}
</style>
<template>
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" minHeight="50">
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup>
import {ref, computed, unref, reactive} from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import {accountFormSchema, MoveFormSchema, resetPasswordFormSchema} from './institution.data';
import { getDeptList } from '@/api/system/dept/dept';
import {resetUserPwd} from '@/api/system/user/user'
import { encryptTwo } from '@/utils/jsencrypt'
import { useMessage } from '@/hooks/web/useMessage';
import {TreeData, userData} from "@/views/dataSharingAndExchange/catalogingManagement/institutionData";
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const isUpdate = ref(true);
const rowId = ref('');
const idList = ref([])
const rowData = ref([])
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { span: 24 },
schemas: MoveFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
//每次点击弹窗 需要清空存储的数据
rowData.value = []
//重置表单数据
resetFields();
setModalProps({ confirmLoading: false });
if (data.idList != null && data.idList != undefined && data.idList.length > 0){
//批量移动
//根据id查用户信息
idList.value = data.idList;
//过滤出userData中businessId与idList相等的数据
const result = userData.filter(item => data.idList.includes(item.businessId));
result.forEach(item => {
rowData.value.push(item)
})
}else {
rowData.value.push(data.record)
//单个移动
rowId.value = data.record.businessId;
setFieldsValue({
...data.record,
});
}
const treeList = handleTree(TreeData, 'businessId',undefined,undefined,undefined)
updateSchema([
{
field: 'institutionId',
componentProps: {
treeData: treeList
},
},
]);
});
const getTitle = computed(() => ('移动用户'));
/**确定按钮*/
async function handleSubmit() {
try {
//校验并得到表单数据
const values = await validate();
setModalProps({ confirmLoading: true });
//拿到表单里修改后的值 进行修改赋值 传给父组件
console.log('rowData.value:',rowData.value)
rowData.value.forEach(item => {
item.institutionId = values.institutionId
})
emit('success', { values: { ...rowData.value }})
createMessage.success('移动成功');
closeModal();
} finally {
setModalProps({ confirmLoading: false });
}
}
/**数组对象转成树*/
function handleTree(data, id, parentId, children, rootId) {
id = id || 'id'
parentId = parentId || 'parentId'
children = children || 'children'
rootId = rootId || Math.min.apply(Math, data.map(item => { return item[parentId] })) || 0
// 对源数据深度克隆
const cloneData = JSON.parse(JSON.stringify(data))
// 循环所有项
const treeData = cloneData.filter(father => {
const branchArr = cloneData.filter(child => {
// 返回每一项的子级数组
return father[id] === child[parentId]
})
branchArr.length > 0 ? father.children = branchArr : ''
// 返回第一层
return father[parentId] === rootId
})
return treeData !== '' ? treeData : data
}
</script>
...@@ -248,10 +248,16 @@ ...@@ -248,10 +248,16 @@
const { createMessage } = useMessage(); const { createMessage } = useMessage();
const page = ref('1'); const page = ref('1');
const tableData = ref(infoData); const tableData = ref([]);
const samplingTableData = ref(samplingInfoData); const samplingTableData = ref([]);
const associationData = ref(associationRulesData); const associationData = ref([]);
const associationInfoData = ref(associationRulesInfoData); const associationInfoData = ref([]);
// 初始化数据
tableData.value = infoData;
samplingTableData.value = samplingInfoData;
associationData.value = associationRulesData;
associationInfoData.value = associationRulesInfoData;
const title = ref(''); const title = ref('');
const sql = ref(''); const sql = ref('');
let changeAble = ref(false); let changeAble = ref(false);
......
...@@ -14,17 +14,14 @@ ...@@ -14,17 +14,14 @@
</div> </div>
</div> </div>
</div> </div>
<div class="headerForm"
><BasicForm @register="registerForm">
<template #toolbar>
<a-button type="primary">导入</a-button>
</template>
</BasicForm></div
>
</template> </template>
</PageWrapper>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<template #headerContent
><BasicForm @register="registerForm">
<template #toolbar>
<a-button type="primary">导入</a-button>
</template>
</BasicForm></template
>
<BasicTable @register="registerTable" :searchInfo="searchInfo"> <BasicTable @register="registerTable" :searchInfo="searchInfo">
<template #toolbar> </template> <template #toolbar> </template>
<template #bodyCell="{ column, record }"> <template #bodyCell="{ column, record }">
...@@ -313,4 +310,8 @@ ...@@ -313,4 +310,8 @@
} }
} }
} }
.headerForm {
margin-top: 30px;
}
</style> </style>
import { FormSchema } from '@/components/Form';
export const infoFormSchema: FormSchema[] = [
{
label: '标题',
field: 'title',
component: 'Input',
required: true,
colProps: { span: 12 },
componentProps: {
style: {
width: '90%',
},
},
},
{
label: '来源',
field: 'from',
component: 'Input',
colProps: { span: 12 },
componentProps: {
style: {
width: '90%',
},
},
},
{
label: '编辑人',
field: 'createBy',
component: 'Input',
colProps: { span: 12 },
componentProps: {
style: {
width: '90%',
},
},
},
{
label: '编辑时间',
field: 'createTime',
component: 'DatePicker',
colProps: { span: 12 },
componentProps: {
valueFormat: 'YYYY-MM-DD HH:mm:ss',
showTime: 'showTime',
style: {
width: '90%',
},
},
},
];
export const detailFormSchema: FormSchema[] = [
{
label: '图片',
field: 'imgSrc',
slot: 'imgSrc',
colProps: { span: 24 },
},
{
label: '正文',
field: 'details',
required: true,
component: 'InputTextArea',
componentProps: {
rows: 4,
style: {
width: '95%',
},
},
colProps: { span: 24 },
},
];
<template>
<PageWrapper dense contentBackground headerSticky>
<template #headerContent>
<div class="header">
<div class="h-title">
<FileProtectOutlined class="h-icon" :color="'#6499e9'" />
<div class="h-txt">
<div v-if="status === 'detail'" class="h-des">{{ data.title }}</div>
<div v-if="status === 'add'" class="h-des">新增政策</div>
<div v-if="status === 'edit'" class="h-des">编辑政策</div>
</div>
</div>
<div class="h-group">
<a-button
class="btn"
type="primary"
v-if="['add', 'edit'].includes(status)"
@click="handleSave"
>
保存
</a-button>
<a-button
class="btn"
type="primary"
:disabled="!(['add', 'edit'].includes(status) && isSave)"
v-if="['add', 'edit'].includes(status)"
@click="handleUpload"
>
发布
</a-button>
<a-button class="btn" type="primary" v-if="status === 'detail'" @click="handleEdit">
编辑
</a-button>
</div>
</div>
<!-- <div v-show="['add', 'edit'].includes(status)" class="pd-body">-->
<div class="pd-body">
<div class="title">基本信息</div>
<BasicForm :disabled="status === 'detail'" @register="infoForm" />
<div class="title">正文</div>
<BasicForm :disabled="status === 'detail'" @register="detailForm">
<template #imgSrc="{ field, model }">
<Upload
:style="{ pointerEvents: status === 'detail' ? 'none' : null }"
style="width: 45%"
v-model:file-list="fileList"
>
<a-button>
<UploadOutlined />
选择图片
</a-button>
</Upload>
</template>
</BasicForm>
</div>
<!-- <div v-show="status === 'detail'" class="pd-detail">-->
<!-- <div class="pd-des">-->
<!-- <div class="pd-time">{{ data.uploadTime }}</div>-->
<!-- <div class="pd-from">来源:{{ data.from }}</div>-->
<!-- </div>-->
<!-- <Divider style="width: 100%" />-->
<!-- <div class="pd-txt">-->
<!-- <img-->
<!-- v-if="fileList[0] && fileList[0].thumbUrl"-->
<!-- :src="fileList[0] ? fileList[0].thumbUrl : null"-->
<!-- style="width: 80%; height: 200px;"-->
<!-- alt=""-->
<!-- />-->
<!-- <div class="des-p">-->
<!-- {{ data.details }}-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
</template>
</PageWrapper>
</template>
<script lang="ts" setup>
import { nextTick, onMounted, ref } from 'vue';
import PageWrapper from '@/components/Page/src/PageWrapper.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { BasicTable, useTable, TableAction, BasicTableProps } from '@/components/Table';
import { Input, Upload, Divider } from 'ant-design-vue';
import { FileProtectOutlined, UploadOutlined } from '@ant-design/icons-vue';
import {
policyFormSchema,
policyTableColumn,
} from '@/views/servicePlatform/policyManagement/policy.data';
import { policyData } from '@/views/servicePlatform/policyManagement/policyData';
import { useRoute, useRouter } from 'vue-router';
import BasicForm from '@/components/Form/src/BasicForm.vue';
import { useForm } from '@/components/Form';
import { editFormSchema } from '@/views/dataWarehousePlanning/logicalModel/modelDetail/model.data';
import {
detailFormSchema,
infoFormSchema,
} from '@/views/servicePlatform/policyManagement/detail/detail.data';
import moment from 'moment';
// 初始化
const route = useRoute();
const { createMessage } = useMessage();
// 数据
const status = ref(route.query.status);
const data = ref(route.query);
const isSave = ref(false);
const fileList = ref([]);
onMounted(() => {
console.log('date', moment().format('YYYY-MM-DD HH:mm:ss'));
setInfoValue({
...data.value,
createBy: 'admin',
createTime: moment().format('YYYY-MM-DD HH:mm:ss'),
});
setDetailValue({
...data.value,
});
if (data.value.imgSrc) {
fileList.value = [
{
uid: 1,
name: '测试图片1',
status: 'done',
},
];
}
});
/**
* 方法
*/
function handleImg() {
console.log('图片', fileList);
}
async function handleSave() {
await infoValidate();
await detailValidate();
createMessage.success('保存成功!');
isSave.value = true;
}
function handleUpload() {
data.value = { ...getInfoValue(), ...getDetailValue() };
createMessage.success('发布成功!');
status.value = 'detail';
}
function handleEdit() {
status.value = 'edit';
isSave.value = false;
}
/**
* form
*/
const [
infoForm,
{ setFieldsValue: setInfoValue, getFieldsValue: getInfoValue, validate: infoValidate },
] = useForm({
labelWidth: 100,
schemas: infoFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
const [
detailForm,
{ setFieldsValue: setDetailValue, getFieldsValue: getDetailValue, validate: detailValidate },
] = useForm({
labelWidth: 100,
baseColProps: { span: 25 },
schemas: detailFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
</script>
<style scoped>
.header {
display: flex;
flex-direction: row;
gap: 10px;
.h-title {
flex: 1;
display: flex;
gap: 10px;
.h-icon {
font-size: 40px !important;
color: #0a208a;
}
.h-des {
font-size: 18px;
font-weight: bolder;
line-height: 40px;
}
.h-path {
font-size: 12px;
}
}
.h-group {
display: flex;
gap: 10px;
}
}
.pd-body {
padding: 20px 0;
}
.pd-detail {
margin-top: 15px;
.pd-des {
display: flex;
gap: 10px;
}
.pd-txt {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.des-p {
width: 80%;
font-size: 16px;
text-indent: 2em;
line-height: 40px;
word-wrap: break-word; /* 防止单词溢出 */
white-space: normal; /* 允许文本自动换行 */
overflow-wrap: break-word; /* 确保文本不会溢出 */
}
}
}
.title {
font-weight: bolder;
font-size: 16px;
margin: 15px 10px;
}
</style>
...@@ -10,13 +10,23 @@ ...@@ -10,13 +10,23 @@
</div> </div>
<div class="h-group"> <div class="h-group">
<a-button class="btn" type="primary" @click="handleAdd"> 新增 </a-button> <a-button class="btn" type="primary" @click="handleAdd"> 新增 </a-button>
<a-button class="btn" type="primary" @click="handleDelete"> 批量删除 </a-button> <a-button :disabled="getDisabled()" class="btn" type="primary" @click="handleDelete">
批量删除
</a-button>
</div> </div>
</div> </div>
</template> </template>
<div class="h-full" style="padding: 0 25px"> <div class="h-full" style="padding: 0 25px">
<BasicTable @register="registerApplySuccessTable"> <BasicTable @register="registerTable" ref="table">
<template #bodyCell="{ column, record }"> <template #bodyCell="{ column, record, text }">
<template v-if="column.key === 'imgSrc'">
<TableImg
:size="60"
:simpleShow="true"
:showBadge="false"
:imgList="text"
/>
</template>
<template v-if="column.key === 'action'"> <template v-if="column.key === 'action'">
<TableAction <TableAction
:actions="[ :actions="[
...@@ -30,6 +40,7 @@ ...@@ -30,6 +40,7 @@
}, },
{ {
label: '删除', label: '删除',
color: 'error',
onClick: handleRemove.bind(null, record), onClick: handleRemove.bind(null, record),
}, },
]" ]"
...@@ -45,42 +56,110 @@ ...@@ -45,42 +56,110 @@
import { onMounted, ref } from 'vue'; import { onMounted, ref } from 'vue';
import PageWrapper from '@/components/Page/src/PageWrapper.vue'; import PageWrapper from '@/components/Page/src/PageWrapper.vue';
import { useMessage } from '@/hooks/web/useMessage'; import { useMessage } from '@/hooks/web/useMessage';
import { BasicTable, useTable, TableAction } from '@/components/Table'; import {
BasicTable,
useTable,
TableAction,
BasicTableProps,
FormProps,
TableImg,
} from '@/components/Table';
import { FileProtectOutlined } from '@ant-design/icons-vue'; import { FileProtectOutlined } from '@ant-design/icons-vue';
import {
policyFormSchema,
policyTableColumn,
} from '@/views/servicePlatform/policyManagement/policy.data';
import { policyData } from '@/views/servicePlatform/policyManagement/policyData';
import { useRouter } from 'vue-router';
// 初始化 // 初始化
const { createMessage } = useMessage(); const router = useRouter();
const { createMessage, createConfirm } = useMessage();
const table = ref();
// 数据 // 数据
onMounted(() => {}); onMounted(() => {});
// 方法 // 方法
// 获取禁用
function getDisabled() {
if (table.value) {
return getSelectRows().length <= 0;
} else {
return true;
}
}
// 新增 // 新增
function handleAdd() { function handleAdd() {
router.push({
path: '/servicePlatform/policyManagement/detail',
query: {
status: 'add',
},
});
} }
// 批量删除 // 批量删除
function handleDelete() { function handleDelete() {
createConfirm({
iconType: 'warning',
title: '确认批量删除',
content: '确认批量删除选中的数据吗?',
onOk() {
createMessage.success('批量删除成功!');
},
});
}
// 详情
function handleDetail(record) {
router.push({
path: '/servicePlatform/policyManagement/detail',
query: {
...record,
status: 'detail',
},
});
}
// 编辑
function handleEdit(record) {
router.push({
path: '/servicePlatform/policyManagement/detail',
query: {
...record,
status: 'edit',
},
});
}
// 删除
function handleRemove() {
createConfirm({
iconType: 'warning',
title: '确认删除',
content: '确认删除这条数据吗?',
onOk() {
createMessage.success('删除成功!');
},
});
} }
/** /**
* table * table
*/ */
const [registerApplySuccessTable] = useTable({ const [registerTable, { getSelectRows }] = useTable({
dataSource: [], dataSource: policyData,
columns: [], columns: policyTableColumn,
rowSelection: true,
useSearchForm: true, useSearchForm: true,
formConfig: { formConfig: {
baseColProps: { span: 4 },
showActionButtonGroup: false, showActionButtonGroup: false,
schemas: [], schemas: policyFormSchema,
autoSubmitOnEnter: true, autoSubmitOnEnter: true,
}, } as FormProps,
actionColumn: { actionColumn: {
width: 120, width: 150,
title: '操作', title: '操作',
dataIndex: 'action', dataIndex: 'action',
}, },
showIndexColumn: false, showIndexColumn: false,
}); } as BasicTableProps);
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
......
import { BasicColumn, FormSchema } from '@/components/Table';
export const policyTableColumn: BasicColumn[] = [
{
title: '标题',
dataIndex: 'title',
},
{
title: '发布时间',
dataIndex: 'uploadTime',
},
{
title: '发布人',
dataIndex: 'uploadBy',
},
{
title: '图片',
dataIndex: 'imgSrc',
},
{
title: '类型',
dataIndex: 'type',
},
{
title: '来源',
dataIndex: 'from',
},
{
title: '审核人',
dataIndex: 'auditor',
},
];
export const policyFormSchema: FormSchema[] = [
{
field: 'title',
component: 'Input',
componentProps: {
placeholder: '请输入关键字进行搜索',
},
style: {
width: '120px',
},
},
{
label: ' ',
field: 'uploadTime',
component: 'RangePicker',
labelWidth: 10,
style: {
width: '120px',
},
},
{
label: ' ',
field: 'type',
component: 'Select',
componentProps: {
placeholder: '请选择类型',
options: [
{
label: '国家政策',
value: '国家政策',
},
{
label: '行业新闻',
value: '行业新闻',
},
],
},
labelWidth: 10,
style: {
width: '120px',
},
},
];
This diff is collapsed.
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