Commit 8cc2ee09 authored by liwei's avatar liwei

新增了服务开发页面

parent 3e4f42be
<template>
<BasicModal width="40%" v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<BasicForm @register="registerForm">
<template #formFooter>
<a-Button type="info" @click="handleDownByData" style="margin-left: 150px;border-color: #4aabfe">下载文件模版</a-Button>
</template>
</BasicForm>
</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 { importDataStandardsFormSchema } from './indicatorStandards.data';
import { useMessage } from '@/hooks/web/useMessage';
import { BasicUpload } from '@/components/Upload';
import { uploadApi } from '@/api/sys/upload';
import {downloadByData} from "@/utils/file/download";
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const getTitle = computed(() => ('标准导入'));
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
schemas: importDataStandardsFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false });
});
/**下载*/
function handleDownByData() {
downloadByData('text content', '导入数据标准模版.xls');
}
/**上传事件*/
function handleChange(list: string[]) {
createMessage.success(`已上传文件${JSON.stringify(list)}`);
}
/**提交按钮*/
function handleSubmit() {
createMessage.success('导入成功!')
closeModal();
}
</script>
<template>
<BasicModal width="50%" v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<BasicForm @register="registerForm" />
<BasicTable @register="registerTable"/>
</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 {addValueColumns, addValueFormSchema, addValueSearchSchema, searchFormSchema} from './api.data';
import { useMessage } from '@/hooks/web/useMessage';
import {
addValueData,TreeData
} from "./apiData";
import { BasicTable, useTable, TableAction } from '@/components/Table';
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const rowId = ref('');
const getTitle = computed(() => ('添加值'));
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
schemas: addValueFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false });
setFieldsValue({
...data.record,
})
const treeList = handleTree(TreeData, 'businessId',undefined,undefined,undefined)
updateSchema([
{
field: 'QualityId',
componentProps: {
treeData: treeList
},
},
]);
});
const [registerTable] = useTable({
title: '源系统码值',
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: addValueData.length,
code:'',
message:'',
data: [],
};
//过滤data中的数据,取出等于params.deptId的数据
return { ...response,data: addValueData };
},
columns:addValueColumns,
useSearchForm: true,
showTableSetting: false,
showIndexColumn:false,
pagination:false,
bordered: true,
formConfig: {
labelWidth: 120,
schemas: addValueSearchSchema,
autoSubmitOnEnter: true,
},
});
/**确定按钮*/
async function handleSubmit() {
createMessage.success('添加成功');
closeModal()
}
/**数组对象转成树*/
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>
<template>
<div class="m-4 mr-0 overflow-hidden bg-white">
<BasicTree
title="API"
ref="treeRef"
toolbar
search
treeWrapperClassName="h-[calc(100%-35px)] overflow-auto"
:clickRowToExpand="false"
:defaultExpandAll="true"
:treeData="treeData"
:fieldNames="{ key: 'businessId', title: 'apiName' }"
@select="handleSelect"
:beforeRightClick="getRightMenuList"
:actionList="actionList"
/>
</div>
<!-- 移动 弹窗-->
<MoveModal @register="registerMoveModal" @success="handleSuccess" />
<!-- 复制到 弹窗-->
<CopyModal @register="registerCopyModal" @success="handleSuccess" />
<!-- 新建公共代码 弹窗-->
<CreatePublicCode @register="registerCreatePublicCodeModal" @success="handleSuccess" />
<!-- 新建标准分类 弹窗-->
<CreateStandardsType @register="registerCreateStandardsTypeModal" @success="handleSuccess" />
</template>
<script lang="ts" setup>
import {h, nextTick, onMounted, ref, unref} from 'vue';
import {BasicTree, ContextMenuItem, TreeActionType, TreeItem} from '@/components/Tree';
import {Nullable} from "packages/types/src/index";
import { TreeData } from "./apiData";
import {EventDataNode} from "ant-design-vue/es/vc-tree/interface";
import {PlusOutlined,EllipsisOutlined} from "@ant-design/icons-vue";
import {useMessage} from "@/hooks/web/useMessage";
import {Modal} from "ant-design-vue";
import {useModal} from "@/components/Modal";
import {router} from "@/router";
import CreatePublicCode from './createDocument.vue';
import CreateStandardsType from './createAPI.vue';
import MoveModal from './MoveModal.vue';
import CopyModal from './CopyModal.vue';
defineOptions({ name: 'DeptTree' });
const emit = defineEmits(['select']);
const treeData = ref<TreeItem[]>([]);
const treeRef = ref<Nullable<TreeActionType>>(null);
const { createMessage, createConfirm } = useMessage();
const [registerMoveModal, { openModal: openMoveModal }] = useModal();
const [registerCopyModal, { openModal: openCopyModal }] = useModal();
const [registerCreatePublicCodeModal, { openModal: openCreatePublicCodeModal }] = useModal();
const [registerCreateStandardsTypeModal, { openModal: openCreateStandardsTypeModal }] = 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();
});
// 树的操作列表
const actionList = [
{
//全部操作按钮
render: (node) => {
return h(EllipsisOutlined, {
class: 'ml-2',
onClick: () => {
getRightMenuList(node)
},
});
},
},
];
function getRightMenuList(node: EventDataNode): Promise<ContextMenuItem[]> {
const menu = [
{
label: '查看详情',
handler: () => {
detailButton(node)
},
icon: 'ant-design:file-search-outlined',
},
{
label: '编辑',
handler: () => {
editButton(node)
},
icon: 'ant-design:edit-outlined',
},
{
label: '标准分类信息',
handler: () => {
standardsTypeButton(node)
},
icon: 'ant-design:file-text-twotone',
},
{
label: '新建标准分类',
handler: () => {
createStandardsTypeButton(node)
},
icon: 'ant-design:file-add-outlined',
},
{
label: '新建公共代码',
handler: () => {
createPublicCodeButton(node)
},
icon: 'ant-design:file-add-outlined',
},
{
label: '复制到',
handler: () => {
copyButton()
},
icon: 'ant-design:snippets-twotone',
},
{
label: '删除',
handler: () => {
deleteButton(node)
},
icon: 'ant-design:rest-outlined',
},
{
label: '移动',
handler: () => {
MoveButton()
},
icon: 'ant-design:folder-open-outlined',
},
];
return new Promise((resolve) => {
resolve(menu);
});
}
/**查看详情*/
function detailButton(record) {
router.push({
path: '/dataStandards/publicCode/detailPublicCode',
query: {
businessId:record.businessId,
},
});
}
/**移动*/
function MoveButton() {
openMoveModal(true, {
});
}
/**新建标准分类*/
function createStandardsTypeButton(record) {
openCreateStandardsTypeModal(true, {
record
});
}
/**新建公共代码*/
function createPublicCodeButton(record) {
openCreatePublicCodeModal(true, {
record
});
}
/**复制到 按钮*/
function copyButton() {
openCopyModal(true, {
});
}
/**删除 按钮*/
function deleteButton(record: Recordable) {
createConfirm({
iconType: 'warning',
title: '确认删除',
content: '确认批量删除选中数据吗?',
onOk() {
createMessage.success('删除成功!');
},
});
}
/** 修改 按钮*/
function handleUpdateButton(record: Recordable) {
}
/**编辑标准*/
function editButton(record) {
router.push({
path: '/dataStandards/publicCode/editDetailStandard',
query: {
businessId:record.businessId,
},
});
}
/**标准分类信息*/
function standardsTypeButton(record: Recordable) {
createMessage.success('标准分类信息')
}
/** 成功回调*/
function handleSuccess() {
}
</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 { moveFormSchema } from './api.data';
import { useMessage } from '@/hooks/web/useMessage';
import {TreeData} from "@/views/dataStandards/basicStandards/basicStandardsData";
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const rowId = ref('');
const getTitle = computed(() => ('复制到'));
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
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 });
setFieldsValue({
...data.record,
})
const treeList = handleTree(TreeData, 'businessId',undefined,undefined,undefined)
updateSchema([
{
field: 'treeId',
componentProps: {
treeData: treeList
},
},
]);
});
/**确定按钮*/
async function handleSubmit() {
createMessage.success('移动成功');
closeModal()
}
/**数组对象转成树*/
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>
<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 { moveFormSchema } from './api.data';
import { useMessage } from '@/hooks/web/useMessage';
import {TreeData} from "@/views/dataStandards/basicStandards/basicStandardsData";
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const rowId = ref('');
const getTitle = computed(() => ('移动'));
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
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 });
setFieldsValue({
...data.record,
})
const treeList = handleTree(TreeData, 'businessId',undefined,undefined,undefined)
updateSchema([
{
field: 'treeId',
componentProps: {
treeData: treeList
},
},
]);
});
/**确定按钮*/
async function handleSubmit() {
createMessage.success('移动成功');
closeModal()
}
/**数组对象转成树*/
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>
<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 { resetNameFormSchema } from './api.data';
import { useMessage } from '@/hooks/web/useMessage';
import {TreeData} from "@/views/dataStandards/basicStandards/basicStandardsData";
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const rowId = ref('');
const getTitle = computed(() => ('重命名'));
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
schemas: resetNameFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false });
setFieldsValue({
...data.record,
})
});
/**确定按钮*/
async function handleSubmit() {
createMessage.success('移动成功');
closeModal()
}
</script>
<template>
<BasicModal width="50%" v-bind="$attrs" @register="registerModal" :title="getTitle">
<BasicTable @register="registerTable">
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
label: '对比',
onClick: contrastButton.bind(null, record),
},
{
label: '回滚',
onClick: returnButton.bind(null, record),
},
{
// icon: 'clarity:note-edit-line',
label: '查看',
onClick: detailButton.bind(null, record),
},
]"
/>
</template>
</template>
</BasicTable>
<ReturnVersionModal @register="registerReturnVersionModal" @success="handleSuccess" />
</BasicModal>
</template>
<script lang="ts" setup>
import { BasicModal, useModalInner } 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 { useModal } from '@/components/Modal';
import { searchFormSchema, versionColumns, versionData } from './apiData';
import { useGo } from '@/hooks/web/usePage';
import { useRoute } from 'vue-router';
import { useFilterStore } from '@/store/modules/filterData';
import {router} from "@/router";
import ReturnVersionModal from './returnVersionModal.vue'
defineOptions({ name: 'AccountManagement' });
const { createMessage } = useMessage();
const filterStore = useFilterStore();
const route = useRoute();
const go = useGo();
const [registerReturnVersionModal, { openModal: openReturnVersionModal }] = useModal();
const searchInfo = reactive<Recordable>({});
const emit = defineEmits(['success', 'register']);
const getTitle = computed(() => ('版本管理'));
const tableData = ref([])
const isAdd = ref(true)
const [registerTable, { reload, updateTableDataRecord, getSearchInfo,getForm,getRowSelection }] = useTable({
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 };
},
columns:versionColumns,
formConfig: {
labelWidth: 100,
schemas: searchFormSchema,
autoSubmitOnEnter: true,
},
useSearchForm: true,
showTableSetting: false,
showIndexColumn: false,
bordered: true,
actionColumn: {
width: 150,
title: '操作',
dataIndex: 'action',
},
handleSearchInfoFn(info) {
return info;
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
setModalProps({ confirmLoading: false,showOkBtn:false,showCancelBtn:false });
isAdd.value = !!data?.isAdd;
});
/** 对比 按钮*/
function contrastButton() {
closeModal()
router.push({
path: '/serviceDevelopment/apiContrast',
query: {
businessId:route.query.businessId,
},
});
}
/** 回滚成功*/
function returnButton() {
openReturnVersionModal(true,{
})
}
/** 查看*/
function detailButton(record) {
closeModal();
router.push({
path: '/serviceDevelopment/detailApi',
query: {
businessId:route.query.businessId,
},
});
}
onMounted(() => {
tableData.value = versionData
});
</script>
This diff is collapsed.
<template>
<PageWrapper title="版本管理" contentFullHeight contentBackground contentClass="flex">
<div class="w-1/2 xl:w-1/2 pl-4">
<div style="display: flex;justify-content: space-between; align-items: center;margin-bottom: 10px;margin-left: 12px">
<div style="margin-top: 10px;display: flex;font-weight: bold;font-size: 20px;margin-left: 10px">
<Icon icon="ion:layers-outline" :size="25" :color="'#1091FE'" />
{{title}}
<div style="font-size: 15px;padding-left: 10px;padding-left: 50px">
<div>
版本<Select
v-model:value="optionValue"
show-search
placeholder="请选择版本"
style="width: 200px;margin-left: 10px"
:options="options"
@change="handleChange"
></Select>
</div>
</div>
</div>
</div>
<Divider />
<div>
<BasicForm @register="registerForm" />
</div>
<Divider />
<div>
<BasicTable @register="registerTable1"/>
<BasicTable @register="registerTable2"/>
<BasicTable @register="registerTable3"/>
</div>
</div>
<div class="w-1/2 xl:w-1/2">
<div style="display: flex;justify-content: space-between; align-items: center;margin-bottom: 10px;margin-left: 12px">
<div style="margin-top: 10px;display: flex;font-weight: bold;font-size: 20px;margin-left: 10px">
<Icon icon="ion:layers-outline" :size="25" :color="'#1091FE'" />
{{title}}
<div style="font-size: 15px;padding-left: 10px;padding-left: 50px">
<div>
版本<Select
v-model:value="optionValue"
show-search
placeholder="请选择版本"
style="width: 200px;margin-left: 10px"
:options="options"
@change="handleChange"
></Select>
</div>
</div>
</div>
</div>
<Divider />
<div>
<BasicForm @register="registerForm" />
</div>
<Divider />
<div>
<BasicTable @register="registerTable4"/>
<BasicTable @register="registerTable5"/>
<BasicTable @register="registerTable6"/>
</div>
<Divider />
</div>
</PageWrapper>
</template>
<script lang="ts" setup>
import { PageWrapper } from '@/components/Page';
import {
addValueSearchSchema,
contrastSchema,
contrastTableColumns1,
contrastTableColumns2,
contrastTableColumns3,
resetNameFormSchema
} from './api.data';
import { leftContrastTableData1,leftContrastTableData2,leftContrastTableData3,rightContrastTableData1,rightContrastTableData2,rightContrastTableData3} from './apiData';
import { useMessage } from '@/hooks/web/useMessage';
import { BasicForm, useForm } from '@/components/Form';
import {onMounted,ref} from "vue";
import { Select } from 'ant-design-vue';
import Icon from '@/components/Icon/Icon.vue';
import {router} from "@/router";
import { useRoute,onBeforeRouteLeave } from 'vue-router';
import { Divider } from 'ant-design-vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
defineOptions({ name: 'Metadata' });
const route = useRoute();
const optionValue = ref('')
const startContrastFlag = ref(false)
const title = ref('员工薪资查询-向导模式')
const options = ref<any>([
{ value: 'V1', label: 'V1 2022-10-25 14:52:50' },
{ value: 'V2', label: 'V2 2022-10-25 14:52:50' },
{ value: 'V3', label: 'V3 2022-10-25 14:52:50' },
]);
const { createMessage } = useMessage();
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
schemas: contrastSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
const [registerTable1] = useTable({
title: '请求参数',
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: leftContrastTableData1.length,
code:'',
message:'',
data: [],
};
//过滤data中的数据,取出等于params.deptId的数据
return { ...response,data: leftContrastTableData1 };
},
columns:contrastTableColumns1,
useSearchForm: false,
showTableSetting: false,
showIndexColumn:false,
pagination:false,
bordered: true,
scroll: { y: 300 },
});
const [registerTable2] = useTable({
title: '分页参数',
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: rightContrastTableData2.length,
code:'',
message:'',
data: [],
};
//过滤data中的数据,取出等于params.deptId的数据
return { ...response,data: rightContrastTableData2 };
},
columns:contrastTableColumns2,
useSearchForm: false,
showTableSetting: false,
showIndexColumn:false,
pagination:false,
bordered: true,
scroll: { y: 300 },
});
const [registerTable3] = useTable({
title: '返回参数',
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: leftContrastTableData3.length,
code:'',
message:'',
data: [],
};
//过滤data中的数据,取出等于params.deptId的数据
return { ...response,data: leftContrastTableData3 };
},
columns:contrastTableColumns3,
useSearchForm: false,
showTableSetting: false,
showIndexColumn:false,
pagination:false,
bordered: true,
scroll: { y: 300 },
});
const [registerTable4] = useTable({
title: '请求参数',
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: rightContrastTableData1.length,
code:'',
message:'',
data: [],
};
//过滤data中的数据,取出等于params.deptId的数据
return { ...response,data: rightContrastTableData1 };
},
columns:contrastTableColumns1,
useSearchForm: false,
showTableSetting: false,
showIndexColumn:false,
pagination:false,
bordered: true,
scroll: { y: 300 },
});
const [registerTable5] = useTable({
title: '分页参数',
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: leftContrastTableData2.length,
code:'',
message:'',
data: [],
};
//过滤data中的数据,取出等于params.deptId的数据
return { ...response,data: leftContrastTableData2 };
},
columns:contrastTableColumns2,
useSearchForm: false,
showTableSetting: false,
showIndexColumn:false,
pagination:false,
bordered: true,
scroll: { y: 300 },
});
const [registerTable6] = useTable({
title: '返回参数',
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: rightContrastTableData3.length,
code:'',
message:'',
data: [],
};
//过滤data中的数据,取出等于params.deptId的数据
return { ...response,data: rightContrastTableData3 };
},
columns:contrastTableColumns3,
useSearchForm: false,
showTableSetting: false,
showIndexColumn:false,
pagination:false,
bordered: true,
scroll: { y: 300 },
});
/**开始对比*/
function startContrast() {
createMessage.info('开始对比');
startContrastFlag.value = true
}
/**结束对比*/
function endContrast() {
createMessage.info('结束对比');
startContrastFlag.value = false
}
/**回滚*/
function returnButton() {
createMessage.success('回滚成功');
}
onMounted(() => {
optionValue.value = 'V3'
});
</script>
This diff is collapsed.
<template>
<BasicModal width="50%" v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<div class="cardBody">
<div :class="`${prefixCls}__content`">
<List>
<Row :gutter="16">
<template v-for="item in cardData" :key="item.title">
<Col :span="6">
<List.Item>
<Card :hoverable="true" :class="`${prefixCls}__card`">
<div :class="`${prefixCls}__card-title`">
<Icon class="icon" v-if="item.icon" :icon="item.icon" :color="item.color" />
{{ item.title }}
</div>
<div :class="`${prefixCls}__card-detail`">
{{item.details}}
</div>
</Card>
</List.Item>
</Col>
</template>
</Row>
</List>
</div>
</div>
<BasicForm @register="registerForm"/>
<div class="modalRow">
<div>可见范围</div>
</div>
<div class="addDialogBG">
<div style="float: right">
<Icon icon="ant-design:delete-outlined" :size="25" :color="'#ED6F6F'" />
</div>
<TreeTwo class="w-1/4 xl:w-1/5" @select="handleSelect" />
</div>
</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 { useMessage } from '@/hooks/web/useMessage';
import {createAPIFormSchema} from './api.data';
import {TreeData} from "./apiData";
import TreeTwo from '@/views/dataStandards/basicStandards/treeTwo.vue'
import {router} from "@/router";
import Icon from '@/components/Icon/Icon.vue';
import { cardData } from './apiData';
import { Card, Row, Col, List } from 'ant-design-vue';
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const isUpdate = ref(true);
const rowId = ref('');
const prefixCls = 'list-card';
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
schemas: createAPIFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false });
var formData = {}
if (data.record === null || data.record === undefined){
formData = {
standardsTree: '100'
}
} else {
formData = {
standardsTree: data.record.businessId
}
}
// 塞值
setFieldsValue({
...formData,
});
const treeList = handleTree(TreeData, 'businessId',undefined,undefined,undefined)
updateSchema([
{
field: 'path',
componentProps: {
treeData: treeList
},
},
]);
});
const getTitle = computed(() => ('新建文件'));
/**确定按钮*/
async function handleSubmit() {
closeModal()
}
function handleParse() {
router.push({
path: '/kinship/kinshipParse/parse',
});
}
/**数组对象转成树*/
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>
<style lang="less" scoped>
.modalRow{
padding: 0 20px;
display: flex;
align-items: center;
justify-content: space-between;
.clearAll{
padding-right: 10px;
font-size: 16px;
}
.right{
display: flex;
align-items: center;
justify-content: space-between;
}
}
.addDialogBG{
margin: 10px;
border-radius: 10px;
padding: 20px;
background-color: #E8ECF7;
width: 98%;
height: 400px;
}
.list-card {
&__link {
margin-top: 10px;
font-size: 14px;
a {
margin-right: 30px;
}
span {
margin-left: 5px;
}
}
&__card {
width: 300px;
margin-bottom: -8px;
.ant-card-body {
padding: 16px;
}
&-title {
margin-bottom: 5px;
color: @text-color-base;
font-size: 15px;
font-weight: 400;
.icon {
margin-top: -5px;
margin-right: 10px;
font-size: 25px !important;
}
}
&-detail {
padding-top: 10px;
color: @text-color-secondary;
font-size: 14px;
}
}
}
.cardBody{
}
.cardBody{
margin-bottom: 20px;
::v-deep(.ant-card-body){
width: 200px!important;
height: 150px!important;
}
::v-deep(.ant-row){
display: flex!important;
justify-content: center!important;
}
::v-deep(.ant-col){
margin-right: 30px;
}
}
</style>
<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 {resetNameFormSchema} from './api.data';
import { useMessage } from '@/hooks/web/useMessage';
import {TreeData} from "./apiData";
import {createDocumentFormSchema} from './api.data';
import TreeTwo from './treeTwo.vue'
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: createDocumentFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false });
var formData = {}
if (data.record === null || data.record === undefined){
formData = {
standardsTree: '100'
}
} else {
formData = {
standardsTree: data.record.businessId
}
}
// 塞值
setFieldsValue({
...formData,
});
const treeList = handleTree(TreeData, 'businessId',undefined,undefined,undefined)
updateSchema([
{
field: 'path',
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() {
closeModal()
}
</script>
<style lang="scss" scoped>
</style>
<template>
<div style="background-color: white">
<div style="display:flex;margin-top: 15px;margin-bottom: 15px;justify-content: space-between; align-items: center;" v-if="isShow">
<div style="margin-left: 15px;font-size: 15px;font-weight: bold">
查看版本
<Select
v-model:value="optionValue"
show-search
placeholder="请选择版本"
style="width: 200px"
:options="options"
@change="handleChange"
></Select>
</div>
<div>
<a-button type="primary" @click="contrastButton">版本对比</a-button>
<a-button type="primary" style="margin-left: 10px" @click="resetButton">回滚</a-button>
<a-button type="primary" style="margin-left: 10px" @click="exitButton">退出查看</a-button>
</div>
</div>
<Divider />
<div style="display: flex;justify-content: space-between; align-items: center;margin-bottom: 10px;margin-left: 12px">
<div style="margin-top: 10px;display: flex;font-weight: bold;font-size: 25px;margin-left: 10px">
{{title}}
<div style="font-size: 15px;padding-top: 15px;padding-left: 10px">
版本:{{optionValue}}
</div>
</div>
<div style="margin-top: 10px;display: flex" v-if="!isShow">
<a-button type="primary" @click="editButton">编辑标准</a-button>
<a-button type="primary" style="margin-left: 10px" @click="versionButton">版本管理</a-button>
</div>
</div>
<Divider />
<BasicForm @register="registerForm1" />
<Divider />
<BasicTable @register="registerTable">
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
icon: 'ant-design:file-search-outlined',
// label: '查看详情',
onClick: detailButton.bind(null, record),
},
]"
/>
</template>
</template>
<template #referenceStandard="{ text, record }">
<span v-for="(item, index) in text" :key="index">
{{ item.icon }}
</span>
</template>
</BasicTable>
<!-- 版本管理 弹窗-->
<VersionModal @register="registerModal" @success="handleSuccess" />
<!-- 查看详情 弹窗-->
<DetailPublicCodeModal @register="registerDetailModal" @success="handleSuccess" />
</div>
</template>
<script lang="ts" setup>
import { Select } from 'ant-design-vue';
import { Description } from '@/components/Description';
import { PageWrapper } from '@/components/Page';
import { Divider } from 'ant-design-vue';
import {detailData, TreeData} from './apiData';
import {router} from "@/router";
import { BasicForm, useForm } from '@/components/Form';
import {
detailColumns, detailFormSchema,
detailSchema
} from './api.data';
import {onMounted, ref} from "vue";
import {useRoute} from "vue-router";
import VersionModal from './VersionModal.vue'
import DetailPublicCodeModal from './detailApiModal.vue'
import {useModal} from "@/components/Modal";
import { useMessage } from '@/hooks/web/useMessage';
import { BasicTable, useTable, TableAction } from '@/components/Table';
const route = useRoute()
const title = ref('')
const formData = ref({})
const businessId = ref('')
const isShow = ref(false)
const optionValue = ref('')
const [registerModal, { openModal }] = useModal();
const [registerDetailModal, { openModal: openDetailModal }] = useModal();
const { createMessage, createConfirm } = useMessage();
const [registerForm1, { setFieldsValue: setFieldsValue1 }] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
schemas: detailSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
const [registerTable, { reload, updateTableDataRecord, getSearchInfo,getForm,getRowSelection }] = useTable({
title: '公共代码',
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: detailData.length,
code:'',
message:'',
data: [],
};
//过滤data中的数据,取出等于params.deptId的数据
return { ...response,data: detailData };
},
columns:detailColumns,
scroll: { y: 600 },
formConfig: {
labelWidth: 120,
schemas: detailFormSchema,
autoSubmitOnEnter: true,
},
useSearchForm: true,
showTableSetting: false,
showIndexColumn:false,
bordered: true,
actionColumn: {
width: 250,
title: '操作',
dataIndex: 'action',
},
});
const options = ref<any>([
{ value: 'V1', label: 'V1' },
{ value: 'V2', label: 'V2' },
{ value: 'V3', label: 'V3' },
]);
/**编辑标准*/
function editButton(record) {
router.push({
path: '/dataStandards/publicCode/editDetail',
query: {
businessId:businessId.value,
},
});
}
/**基本标准对比*/
function contrastButton(record) {
router.push({
path: '/dataStandards/publicCode/publicCodeContrast',
query: {
businessId:businessId.value,
},
});
}
/**版本管理 弹窗*/
function versionButton(record) {
openModal(true, {
});
}
/**下拉框改变事件*/
function handleChange(value) {
}
/**回滚*/
function resetButton(value) {
createMessage.success('回滚成功!')
}
/**查看详情*/
function detailButton(record) {
openDetailModal(true,{
record:record
})
}
/**退出查看*/
function exitButton(record) {
isShow.value = false
optionValue.value = 'V3'
}
/**版本管理 弹出回调函数*/
function handleSuccess(record) {
optionValue.value = record.values.versionName
isShow.value = true
}
/**初始化*/
onMounted(() => {
optionValue.value = 'V3'
businessId.value = route.query.businessId
const data = TreeData.filter(item => item.businessId == businessId.value)
title.value = data[0].standardChineseName
setFieldsValue1({
...data[0]
})
});
</script>
<style lang="less" scoped>
.desc-wrap {
padding: 16px;
background-color: @component-background;
}
</style>
<template>
<BasicModal width="50%" 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 {detailPublicCodeSchema, editPublicCodeSchema} from './api.data';
import { useMessage } from '@/hooks/web/useMessage';
import {
addValueData
} from "./apiData";
import { BasicTable, useTable, TableAction } from '@/components/Table';
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const rowId = ref('');
const getTitle = computed(() => ('查看详情'));
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
schemas: detailPublicCodeSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false,showOkBtn: false,showCancelBtn: false });
setFieldsValue({
...data.record,
})
});
/**确定按钮*/
async function handleSubmit() {
createMessage.success('编辑成功');
closeModal()
}
</script>
<template>
<BasicModal width="50%" 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 {editPublicCodeSchema} from './api.data';
import { useMessage } from '@/hooks/web/useMessage';
import {
addValueData
} from "./apiData";
import { BasicTable, useTable, TableAction } from '@/components/Table';
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const rowId = ref('');
const getTitle = computed(() => ('编辑公共代码'));
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
schemas: editPublicCodeSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false });
setFieldsValue({
...data.record,
})
});
/**确定按钮*/
async function handleSubmit() {
createMessage.success('编辑成功');
closeModal()
}
</script>
<template>
<div style="background-color: white">
<Divider />
<div style="display: flex;justify-content: space-between; align-items: center;margin-bottom: 10px;margin-left: 12px">
<div style="margin-top: 10px;display: flex;font-weight: bold;font-size: 25px">
{{title}}
</div>
<div style="margin-top: 10px;display: flex">
<a-button type="primary" @click="publishButton">发布</a-button>
<a-button type="primary" style="margin-left: 10px" @click="saveButton">保存修改</a-button>
<a-button type="primary" style="margin-left: 10px" @click="exitEditButton">退出编辑</a-button>
</div>
</div>
<Divider />
<BasicForm @register="registerForm1" />
<Divider />
<BasicTable @register="registerTable">
<template #toolbar>
<a-button type="primary" @click="addValueButton">添加值</a-button>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
icon: 'ant-design:form-outlined',
// label: '编辑',
onClick: editButton.bind(null, record),
},
{
icon: 'ant-design:delete-outlined',
// label: '删除',
color: 'error',
popConfirm: {
title: '是否确认删除',
placement: 'left',
confirm: deleteButton.bind(null, record),
},
},
]"
/>
</template>
</template>
<template #referenceStandard="{ text, record }">
<span v-for="(item, index) in text" :key="index">
{{ item.icon }}
</span>
</template>
</BasicTable>
<AddCodeValueModal @register="registerModal" @success="handleSuccess" />
<EditPublicCodeModal @register="registerEditPublicCodeModal" @success="handleSuccess" />
</div>
</template>
<script lang="ts" setup>
import { Description } from '@/components/Description';
import { PageWrapper } from '@/components/Page';
import { Divider } from 'ant-design-vue';
import {detailData, TreeData} from './apiData';
import {router} from "@/router";
import { BasicForm, useForm } from '@/components/Form';
import {
detailColumns, detailFormSchema,
editStandardsDetailFormSchema,
} from './api.data';
import {onMounted, ref} from "vue";
import {useRoute} from "vue-router";
import {useModal} from "@/components/Modal";
import { useMessage } from '@/hooks/web/useMessage';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import AddCodeValueModal from './AddCodeValueModal.vue';
import EditPublicCodeModal from './editApiModal.vue';
const route = useRoute()
const title = ref('')
const formData = ref({})
const businessId = ref('')
const { createMessage, createConfirm } = useMessage();
const [registerModal, { openModal: openModal }] = useModal();
const [registerEditPublicCodeModal, { openModal: openEditPublicCodeModal }] = useModal();
const [registerForm1, { setFieldsValue: setFieldsValue1 }] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
schemas: editStandardsDetailFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
const [registerTable, { reload, updateTableDataRecord, getSearchInfo,getForm,getRowSelection }] = useTable({
title: '公共代码',
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: detailData.length,
code:'',
message:'',
data: [],
};
//过滤data中的数据,取出等于params.deptId的数据
return { ...response,data: detailData };
},
columns:detailColumns,
scroll: { y: 600 },
formConfig: {
labelWidth: 120,
schemas: detailFormSchema,
autoSubmitOnEnter: true,
},
useSearchForm: true,
showTableSetting: false,
showIndexColumn:false,
bordered: true,
actionColumn: {
width: 250,
title: '操作',
dataIndex: 'action',
},
});
/**编辑标准*/
function exitEditButton(record) {
router.push({
path: '/dataStandards/publicCode/detailPublicCode',
query: {
businessId:businessId.value,
},
});
}
/**保存*/
function saveButton(record) {
createMessage.success('保存成功')
router.push({
path: '/dataStandards/publicCode/detailPublicCode',
query: {
businessId:businessId.value,
},
});
}
/**编辑*/
function editButton(record) {
openEditPublicCodeModal(true,{
record:record
})
}
/**添加值*/
function addValueButton(record) {
openModal(true,{
})
}
/**删除*/
function deleteButton(record) {
createMessage.success('删除成功!')
}
/**发布*/
function publishButton(record) {
createMessage.success('发布成功!')
router.push({
path: '/dataStandards/publicCode/detailPublicCode',
query: {
businessId:businessId.value,
},
});
}
/**初始化*/
onMounted(() => {
businessId.value = route.query.businessId
const data = TreeData.filter(item => item.businessId == businessId.value)
title.value = data[0].standardChineseName
setFieldsValue1({
...data[0]
})
});
</script>
<style lang="less" scoped>
.desc-wrap {
padding: 16px;
background-color: @component-background;
}
</style>
<template>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<BasicStandardsTree class="w-1/4 xl:w-1/5" @select="handleSelect" />
<BasicTable @register="registerTable" class="w-3/4 xl:w-4/5" :searchInfo="searchInfo">
<template #toolbar>
<a-button type="primary" @click="typeManageButton">类别管理</a-button>
<a-button type="primary" @click="exportButton">导出</a-button>
<a-button type="primary" @click="importButton">导入</a-button>
<a-button type="primary" @click="copyButton">复制到</a-button>
<a-button type="primary" @click="MoveButton">移动</a-button>
<a-button type="primary" @click="createDocumentButton">新建文件夹</a-button>
<a-button type="primary" @click="createAPIButton">新建API</a-button>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
icon: 'ant-design:form-outlined',
// label: '重命名',
onClick: resetNameButton.bind(null, record),
},
{
icon: 'ant-design:folder-open-outlined',
// label: '移动',
onClick: MoveButton.bind(null, record),
},
{
icon: 'ant-design:delete-outlined',
// label: '删除',
color: 'error',
popConfirm: {
title: '是否确认删除',
placement: 'left',
confirm: deleteButton.bind(null, record),
},
},
{
icon: 'ant-design:folder-outlined',
// label: '复制',
onClick: copyButton.bind(null, record),
},
{
icon: 'ant-design:file-search-outlined',
// label: '查看详情',
onClick: detailButton.bind(null, record),
},
{
icon: 'ant-design:down-circle-outlined',
// label: '版本管理',
onClick: versionButton.bind(null, record),
},
]"
/>
</template>
</template>
<template #referenceStandard="{ text, record }">
<span v-for="(item, index) in text" :key="index">
{{ item.icon }}
</span>
</template>
</BasicTable>
<!-- 新建文件夹 弹窗-->
<CreateDocument @register="registerCreateDocumentModal" @success="handleSuccess" />
<!-- 新建API 弹窗-->
<CreateAPI @register="registerCreateAPIModal" @success="handleSuccess" />
<!-- 移动 弹窗-->
<MoveModal @register="registerMoveModal" @success="handleSuccess" />
<!-- 复制到 弹窗-->
<CopyModal @register="registerCopyModal" @success="handleSuccess" />
<!-- 重命名 弹窗-->
<ResetNameModal @register="registerResetNameModal" @success="handleSuccess" />
<!-- 版本管理 弹窗-->
<VersionModal @register="registerVersionModal" @success="handleSuccess" />
</PageWrapper>
</template>
<script lang="ts" setup>
import { reactive,unref,onDeactivated,onMounted,ref } from 'vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { PageWrapper } from '@/components/Page';
import BasicStandardsTree from './ApiTree.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { useModal } from '@/components/Modal';
import CreateDocument from './createDocument.vue';
import CreateAPI from './createAPI.vue';
import MoveModal from './MoveModal.vue';
import CopyModal from './CopyModal.vue';
import ResetNameModal from './ResetNameModal.vue';
import VersionModal from './VersionModal.vue';
import { columns, searchFormSchema } from './api.data';
import { useGo } from '@/hooks/web/usePage';
import { useRoute } from 'vue-router';
import { TreeData } from "./apiData";
import { router } from '@/router';
import {exportUserList} from "@/api/system/user/user";
import {downloadByData} from "@/utils/file/download";
defineOptions({ name: 'AccountManagement' });
const { createMessage, createConfirm } = useMessage();
const route = useRoute();
const go = useGo();
const [registerVersionModal, { openModal: openVersionModal }] = useModal();
const [registerCreateDocumentModal, { openModal: openCreateDocumentModal }] = useModal();
const [registerCreateAPIModal, { openModal: openCreateAPIModal }] = useModal();
const [registerMoveModal, { openModal: openMoveModal }] = useModal();
const [registerCopyModal, { openModal: openCopyModal }] = useModal();
const [registerResetNameModal, { openModal: openResetNameModal }] = useModal();
const searchInfo = reactive<Recordable>({});
const tableData = ref([])
const [registerTable, { reload, updateTableDataRecord, getSearchInfo,getForm,getRowSelection }] = useTable({
title: '',
api: async (params) => {
//过滤掉tableData.value中,businessId等于100的
var data = [];
if (params.taskId == undefined || params.taskId == ''){
data = tableData.value.filter((item) => item.businessId >= 200);
}else if (params.taskId >= 200){
data = tableData.value.filter((item) => item.businessId == params.taskId);
}else {
data = tableData.value.filter((item) => item.parentId == params.taskId);
}
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: data.length,
code:'',
message:'',
data: [],
};
//过滤data中的数据,取出等于params.deptId的数据
return { ...response,data: data };
},
rowKey: 'businessId',
columns,
rowSelection: true,
formConfig: {
labelWidth: 120,
schemas: searchFormSchema,
autoSubmitOnEnter: true,
resetFunc: () => {
searchInfo.taskId=''
},
},
useSearchForm: true,
showTableSetting: false,
showIndexColumn:false,
bordered: true,
handleSearchInfoFn(info) {
return info;
},
actionColumn: {
width: 250,
title: '操作',
dataIndex: 'action',
},
});
/**版本管理 按钮*/
function versionButton() {
openVersionModal(true, {
});
}
/**复制到 按钮*/
function copyButton() {
openCopyModal(true, {
});
}
/**重命名 按钮*/
function resetNameButton(record) {
openResetNameModal(true, {
record
});
}
/**复制到 按钮*/
function copyButton1() {
openCopyModal(true, {
});
}
/**查看详情*/
function detailButton(record) {
router.push({
path: '/dataStandards/publicCode/detailPublicCode',
query: {
businessId:record.businessId,
},
});
}
/**移动*/
function MoveButton() {
openMoveModal(true, {
});
}
/**删除按钮*/
function deleteButton() {
createMessage.success('删除成功!');
}
/**新建文件夹*/
function createDocumentButton() {
openCreateDocumentModal(true, {
});
}
/**新建API*/
function createAPIButton() {
openCreateAPIModal(true, {
});
}
/**导出关联关系*/
async function ExportButton() {
const params = Object.assign({}, getSearchInfo(), getForm().getFieldsValue());
const data = await exportUserList(params);
downloadByData(data, '关联关系信息' + '.xlsx');
}
function handleSuccess({ isUpdate, values }) {
}
/** 树的select*/
function handleSelect(taskId = '') {
searchInfo.taskId = taskId;
reload();
}
/**关联关系*/
function relatedRelationshipsButton(record: Recordable) {
router.push({
path: '/dataStandards/publicCode/relatedRelationships',
query: {
businessId:record.businessId,
},
});
}
onMounted(() => {
tableData.value = TreeData
});
</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 { returnVersionFormSchema } from './api.data';
import { useMessage } from '@/hooks/web/useMessage';
import {TreeData} from "@/views/dataStandards/basicStandards/basicStandardsData";
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const rowId = ref('');
const getTitle = computed(() => ('版本回滚'));
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
schemas: returnVersionFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false });
setFieldsValue({
...data.record,
})
});
/**确定按钮*/
async function handleSubmit() {
createMessage.success('回滚成功');
closeModal()
}
</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="true"
:checkable="true"
:defaultExpandAll="true"
:treeData="treeData"
:fieldNames="{ key: 'businessId', title: 'label' }"
@select="handleSelect"
/>
</div>
</template>
<script lang="ts" setup>
import {nextTick, onMounted, ref, unref} from 'vue';
import {BasicTree, TreeActionType, TreeItem} from '@/components/Tree';
import { getDeptList } from '@/api/system/dept/dept';
import {Nullable} from "packages/types/src/index";
import {treeDataListTwo} from "./apiData";
defineOptions({ name: 'DeptTree' });
const emit = defineEmits(['select']);
const treeData = ref<TreeItem[]>([]);
const treeRef = ref<Nullable<TreeActionType>>(null);
async function fetch() {
treeData.value = treeDataListTwo
await nextTick(() => {
getTree().expandAll(true)
})
}
function getTree() {
const tree = unref(treeRef);
if (!tree) {
throw new Error('tree is null!');
}
return tree;
}
function handleSelect(keys) {
emit('select', keys[0]);
}
onMounted(() => {
fetch();
});
</script>
<style lang="scss" scoped>
.bg-white{
width: 97%;
}
::v-deep(.vben-tree){
background-color: #E8ECF7!important;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment