Commit 4bd1a098 authored by LiXuyang's avatar LiXuyang

标签-图像分析

parent dce514bf
......@@ -11,7 +11,7 @@
/>
</div>
<div class="w-5/6">
<PageWrapper dense contentFullHeight fixedHeight>
<PageWrapper :title="tabName" dense contentFullHeight fixedHeight>
<template #extra>
<a-button type="primary" :disabled="selectDisabled" @click="handleNewDataGroup">新建数据集</a-button>
<a-button type="primary" :disabled="selectDisabled">删除</a-button>
......
......@@ -119,10 +119,11 @@
tabTableFormSchema,
} from '@/views/mallResourceDevelopment/label/label/label.data';
import { searchFormSchema } from '@/views/auditLog/audi.data';
import { useMessage } from '@/hooks/web/useMessage';
import {ModalOptionsEx, useMessage} from '@/hooks/web/useMessage';
import { useRoute, useRouter } from 'vue-router';
import { useModal } from '@/components/Modal';
import AddLabelModel from './addLabelModal.vue';
import {cloneDeep} from "lodash-es";
const [addLabelModal, { openModal: openAddLabelModel }] = useModal();
const tabName = ref('');
......@@ -134,8 +135,12 @@
// 获取标题
tabName.value = node.title;
if (node.children) {
console.log('children', node.children);
tabSetTableData(node.children);
const list = cloneDeep(node.children);
list.forEach((item) => {
item.children = null;
});
console.log('children', list);
tabSetTableData(list);
} else {
tabSetTableData([node]);
}
......@@ -175,7 +180,7 @@
onOk() {
createMessage.success('批量删除成功!');
},
});
} as ModalOptionsEx);
}
function handleAddLabel() {
openAddLabelModel(true, {
......@@ -193,43 +198,44 @@
query: { ...record },
});
}
const [tabTable, { setTableData: tabSetTableData, getRowSelection: tabGetRowSelection }] = useTable({
title: '',
api: async (params) => {
console.log(params);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: [],
code: '',
message: '',
data: [],
};
const [tabTable, { setTableData: tabSetTableData, getRowSelection: tabGetRowSelection }] =
useTable({
title: '',
api: async (params) => {
console.log(params);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: [],
code: '',
message: '',
data: [],
};
return { ...response };
},
return { ...response };
},
rowKey: 'businessId',
columns: tabTableColumn,
rowSelection: true,
showIndexColumn: false,
showTableSetting: false,
bordered: true,
useSearchForm: true,
formConfig: {
labelWidth: 80,
baseColProps: { span: 6 },
schemas: tabTableFormSchema,
autoSubmitOnEnter: true,
},
actionColumn: {
width: 120,
title: '操作',
dataIndex: 'action',
fixed: undefined,
},
} as BasicTableProps);
rowKey: 'businessId',
columns: tabTableColumn,
rowSelection: true,
showIndexColumn: false,
showTableSetting: false,
bordered: true,
useSearchForm: true,
formConfig: {
labelWidth: 80,
baseColProps: { span: 6 },
schemas: tabTableFormSchema,
autoSubmitOnEnter: true,
},
actionColumn: {
width: 120,
title: '操作',
dataIndex: 'action',
fixed: undefined,
},
} as BasicTableProps);
</script>
<style scoped>
......
import { FormSchema } from '@/components/Form';
import {BasicColumn} from "@/components/Table";
export const detailFormSchema: FormSchema[] = [
{
label: '画像名称',
field: 'PortraitName',
component: 'Input',
},
{
label: '主体名称',
field: 'bodyName',
component: 'Input',
},
{
label: '描述',
field: 'des',
component: 'InputTextArea',
componentProps: {
rows: 4,
},
},
{
label: '画像样式',
field: 'style',
slot: 'style',
},
];
export const fieldFormSchema: FormSchema[] = [
{
field: 'key',
component: 'Input',
},
];
export const fieldTableColumn: BasicColumn[] = [
{
title: '字段名称',
dataIndex: 'name',
},
{
title: '字段中文名',
dataIndex: 'cnName',
},
{
title: '字段分类',
dataIndex: 'fieldType',
},
];
export const tagFormSchema: FormSchema[] = [
{
field: 'key',
component: 'Input',
},
];
export const tagTableColumn: BasicColumn[] = [
{
title: '标签名称',
dataIndex: 'name',
},
{
title: '标签路径',
dataIndex: 'path',
},
{
title: '权重值',
dataIndex: 'width',
slots: { customRender: 'width' },
},
];
export const fieldTableData = [
{
name: 'em_name',
cnName: '姓名',
fieldType: '默认分类',
},
{
name: 'em_sex',
cnName: '性别',
fieldType: '默认分类',
},
{
name: 'em_typework',
cnName: '岗位类型',
fieldType: '默认分类',
},
{
name: 'em_afterschool',
cnName: '毕业学校',
fieldType: '默认分类',
},
{
name: 'em_age',
cnName: '年龄',
fieldType: '默认分类',
},
];
export const tagTableData = [
{
name: '毕业于上海',
path: '员工主体备份/员工基本信息/毕业于上海',
width: 100,
},
{
name: '现金奖励',
path: '员工主体备份/员工基本信息/现金奖励',
width: 100,
},
{
name: '罚款惩罚',
path: '员工主体备份/员工基本信息/罚款惩罚',
width: 100,
},
{
name: '优秀员工',
path: '员工主体备份/员工基本信息/优秀员工',
width: 100,
},
{
name: '考察员工',
path: '员工主体备份/员工基本信息/考察员工',
width: 100,
},
];
<template>
<PageWrapper :title="title" dense>
<template #extra>
<a-button type="primary">预览</a-button>
<a-button type="primary">保存</a-button>
</template>
<template #footer>
<div>基本信息</div>
<BasicForm @register="registerForm">
<template #style="{ field, model }">
<div class="flex" style="text-align: center; gap: 10px">
<div style="cursor: pointer" @click="model[field] = 0">
<AlignLeftOutlined class="style-icon" :class="model[field] === 0 ? 'check-class' : null" />
<div>默认</div>
</div>
<div style="cursor: pointer" @click="model[field] = 1">
<Icon icon="ion:body-outline" class="style-icon" :class="model[field] === 1 ? 'check-class' : null" style="font-size: 50px" />
<div>人物</div>
</div>
<div style="cursor: pointer" @click="model[field] = 2">
<BankOutlined class="style-icon" :class="model[field] === 2 ? 'check-class' : null" />
<div>企业画像</div>
</div>
</div>
</template>
</BasicForm>
<Divider />
<div class="flex">
<div class="w-1/2">
<div class="flex justify-between" style="padding: 16px 16px 0 32px">
<div style="font-size: 16px; font-weight: bolder">属性</div>
<a-button type="primary"><PlusOutlined />添加字段</a-button>
</div>
<BasicTable @register="fieldTable">
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
// 删除<DeleteOutlined />
icon: 'ant-design:delete-outlined',
},
]"
/>
</template>
</template>
</BasicTable>
</div>
<div class="w-1/2">
<div class="flex justify-between" style="padding: 16px 16px 0 32px">
<div style="font-size: 16px; font-weight: bolder">标签</div>
<a-button type="primary"><PlusOutlined />添加标签</a-button>
</div>
<BasicTable @register="tagTable">
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
// 删除<DeleteOutlined />
icon: 'ant-design:delete-outlined',
},
]"
/>
</template>
</template>
<template #width="{ text, record }">
<Input v-model:value="record.width" />
</template>
</BasicTable>
</div>
</div>
</template>
</PageWrapper>
</template>
<script lang="ts" setup>
import PageWrapper from '../../../../../components/Page/src/PageWrapper.vue';
import { ref } from 'vue';
import BasicForm from '@/components/Form/src/BasicForm.vue';
import Icon from '@/components/Icon/Icon.vue';
import { Divider, Input } from 'ant-design-vue';
import { AlignLeftOutlined, BankOutlined, PlusOutlined } from '@ant-design/icons-vue';
import { useForm } from '@/components/Form';
import { editFormSchema } from '@/views/dataWarehousePlanning/logicalModel/modelDetail/model.data';
import { useRoute } from 'vue-router';
import {
detailFormSchema,
fieldFormSchema,
fieldTableColumn,
tagFormSchema,
tagTableColumn,
} from '@/views/mallResourceDevelopment/label/portraitAnalysis/detail/detail.data';
import BasicTable from '@/components/Table/src/BasicTable.vue';
import { BasicTableProps, useTable } from '@/components/Table';
import { ruleData } from '@/views/dataQuality/dataSheet/rule/ruleData';
import { ruleFormSchema, ruleTable } from '@/views/dataQuality/dataSheet/rule/rule.data';
import {
fieldTableData,
tagTableData,
} from '@/views/mallResourceDevelopment/label/portraitAnalysis/detail/detailData';
import TableAction from '@/components/Table/src/components/TableAction.vue';
const route = useRoute();
const title = route.query.title;
const [registerForm] = useForm({
labelWidth: 100,
baseColProps: { span: 12 },
schemas: detailFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
const [fieldTable] = useTable({
title: '',
api: async (params) => {
console.log('params:', params);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: fieldTableData.length,
code: '',
message: '',
data: fieldTableData,
};
return { ...response };
},
rowKey: 'businessId',
columns: fieldTableColumn,
striped: false,
showIndexColumn: false,
formConfig: {
labelWidth: 120,
baseColProps: { span: 12 },
schemas: fieldFormSchema,
autoSubmitOnEnter: true,
} as BasicTableProps,
useSearchForm: true,
showTableSetting: false,
bordered: true,
actionColumn: {
width: 100,
title: '操作',
dataIndex: 'action',
},
});
const [tagTable] = useTable({
title: '',
api: async (params) => {
console.log('params:', params);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: tagTableData.length,
code: '',
message: '',
data: tagTableData,
};
return { ...response };
},
rowKey: 'businessId',
columns: tagTableColumn,
striped: false,
showIndexColumn: false,
formConfig: {
labelWidth: 120,
baseColProps: { span: 12 },
schemas: tagFormSchema,
autoSubmitOnEnter: true,
} as BasicTableProps,
useSearchForm: true,
showTableSetting: false,
bordered: true,
actionColumn: {
width: 100,
title: '操作',
dataIndex: 'action',
},
});
</script>
<style scoped>
.style-icon {
font-size: 50px;
border: 3px solid #e2e5f1;
border-radius: 10px;
}
.check-class {
color: #3b8cf7;
border: 3px solid #3b8cf7;
}
</style>
<template>
<PageWrapper dense>
<template #footer>
<div class="flex">
<div class="flex w-2/11">
<BasicTree
class="flex-1"
:treeData="labelTreeData"
defaultExpandLevel="1"
@select="handleSelect"
ref="treeData"
/>
<!-- 刷新 -->
<a-button type="link" style="padding: 0"><SyncOutlined /></a-button>
</div>
<div class="w-9/11">
<PageWrapper :title="tabName">
<template #extra>
<a-button class="top-button" type="primary" :disabled="topButtonDisabled()"
>删除</a-button
>
<a-button class="top-button" type="primary" :disabled="topButtonDisabled()"
>移动</a-button
>
<a-button class="top-button" type="primary">新建文件夹</a-button>
<a-button class="top-button" type="primary" @click="handleAddPortrait">新建画像</a-button>
</template>
<template #footer>
<BasicTable @register="portraitTable" ref="tabTableRef">
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
// 编辑
icon: 'ant-design:edit-outlined',
onClick: handleBody.bind(null, record),
},
{
// 标签
icon: 'ant-design:book-outlined',
},
]"
:dropDownActions="[
{
// 重命名
icon: 'ant-design:credit-card-outlined',
label: '重命名',
},
{
// 删除
icon: 'ant-design:delete-outlined',
label: '删除',
popConfirm: {
title: '是否确认删除',
placement: 'left',
confirm: handleRemove.bind(null, record),
},
color: 'error',
},
{
// 移动
icon: 'ion-move-outline',
label: '移动',
},
]"
/>
</template>
</template>
<template #name="{ text, record }">
<a @click="handleBody(record)">{{ text }}</a>
</template>
<template #originalSubject="{ text, record }">
<a-button type="link" @click="handleBody(record)">{{ text }}</a-button>
</template>
</BasicTable>
</template>
</PageWrapper>
</div>
</div>
</template>
</PageWrapper>
</template>
<script lang="ts" setup>
import {
SyncOutlined,
TableOutlined,
InsertRowAboveOutlined,
SolutionOutlined,
FilePdfOutlined,
RollbackOutlined,
SaveOutlined,
DownCircleOutlined,
DeleteOutlined,
CloudUploadOutlined,
EditOutlined,
PlusOutlined,
} from '@ant-design/icons-vue';
import { labelTreeData, tabTableData } from '../label/labelData';
import { h, ref, unref } from 'vue';
import { Divider } from 'ant-design-vue';
import type { BasicTableProps, TableActionType } from '@/components/Table';
import PageWrapper from '../../../../components/Page/src/PageWrapper.vue';
import BasicTree from '../../../../components/Tree/src/BasicTree.vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { TreeActionItem } from '@/components/Tree';
import { tableListViewThree } from '@/views/dataQuality/agentClass/global/details/setup/mock';
import { Threecolumns } from '@/views/dataQuality/agentClass/global/details/setup/mainBody.data';
import {
tabTableColumn,
tabTableFormSchema,
} from '@/views/mallResourceDevelopment/label/label/label.data';
import { searchFormSchema } from '@/views/auditLog/audi.data';
import { ModalOptionsEx, useMessage } from '@/hooks/web/useMessage';
import { useRoute, useRouter } from 'vue-router';
import { useModal } from '@/components/Modal';
import AddLabelModel from '../label/addLabelModal.vue';
import { cloneDeep } from 'lodash-es';
import {
portraitTableColumn,
portraitTableFormSchema,
} from '@/views/mallResourceDevelopment/label/portraitAnalysis/portrait.data';
const tabName = ref('');
const treeData = ref();
function handleSelect() {
const keys = unref(treeData).getSelectedKeys();
const node = unref(treeData).getSelectedNode(keys[0]);
console.log('node', node);
// 获取标题
tabName.value = node.title;
if (node.children) {
const list = cloneDeep(node.children);
list.forEach((item) => {
item.children = null;
});
console.log('children', list);
tabSetTableData(list);
} else {
tabSetTableData([node]);
}
// 获取列表
// console.log('key', key);
// tabName.value = findTitleById(labelTreeData[0], key[0]);
// console.log('tabName', tabName.value);
}
// 嵌套 -获取树title
const tabTableRef = ref(null);
function topButtonDisabled() {
if (tabTableRef.value) {
return tabGetRowSelection().selectedRowKeys <= 0;
} else {
return false;
}
}
const { createMessage, createConfirm } = useMessage();
function handleRemove(record) {
createMessage.success('删除成功!');
}
const router = useRouter();
function handleBody(record) {
console.log('recode', record);
router.push({
path: '/mallResourceDevelopment/label/label/labelDetail',
query: { ...record },
});
}
function handleAddPortrait() {
router.push({
path: '/mallResourceDevelopment/label/portraitAnalysis/detail',
query: {
title: tabName.value,
},
});
}
const [portraitTable, { setTableData: tabSetTableData, getRowSelection: tabGetRowSelection }] =
useTable({
title: '',
api: async (params) => {
console.log(params);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: [],
code: '',
message: '',
data: [],
};
return { ...response };
},
rowKey: 'key',
rowSelection: true,
columns: portraitTableColumn,
showIndexColumn: false,
showTableSetting: false,
bordered: true,
useSearchForm: true,
formConfig: {
labelWidth: 80,
baseColProps: { span: 6 },
schemas: portraitTableFormSchema,
autoSubmitOnEnter: true,
},
} as BasicTableProps);
</script>
<style scoped>
.top-button {
padding: 0 5px;
}
</style>
import {BasicColumn, FormSchema} from '@/components/Table';
import {InputProps} from "ant-design-vue";
export const portraitTableFormSchema: FormSchema[] = [
{
field: 'key',
component: 'Input',
componentProps: {
placeholder: '输入关键字搜索',
} as InputProps,
},
];
export const portraitTableColumn: BasicColumn[] = [
{
title: '名称',
dataIndex: 'name',
width: 100,
},
{
title: '创建时间',
dataIndex: 'createTime',
width: 100,
},
{
title: '更新时间',
dataIndex: 'updateTime',
width: 100,
},
{
title: '拥有者',
dataIndex: 'owner',
width: 100,
},
];
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