feat: 初始化素材中心页面路由结构
This commit is contained in:
@ -8,7 +8,7 @@
|
||||
:columns="columns"
|
||||
:data="dataSource"
|
||||
:pagination="pagination"
|
||||
class="mt-8px h-540px"
|
||||
class="mt-8px"
|
||||
@page-change="handlePageChange"
|
||||
@page-size-change="handlePageSizeChange"
|
||||
>
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
<div class="title-row">
|
||||
<span class="title">企业信息</span>
|
||||
</div>
|
||||
<a-table :columns="columns" :data="dataSource" :pagination="false" class="mt-8px h-540px">
|
||||
<a-table :columns="columns" :data="dataSource" :pagination="false" class="mt-8px">
|
||||
<template #empty>
|
||||
<NoData />
|
||||
</template>
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
<div class="title-row">
|
||||
<span class="title">个人信息</span>
|
||||
</div>
|
||||
<a-table :columns="columns" :data="dataSource" :pagination="false" class="mt-8px h-540px">
|
||||
<a-table :columns="columns" :data="dataSource" :pagination="false" class="mt-8px">
|
||||
<template #empty>
|
||||
<NoData />
|
||||
</template>
|
||||
|
||||
@ -5,6 +5,7 @@ import SenderInput from '../sender-input/index.vue';
|
||||
|
||||
import { useSharedDataStore } from '@/stores/modules/share-data';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { handleUserHome } from '@/utils/user';
|
||||
|
||||
export default {
|
||||
setup(props, { emit, expose }) {
|
||||
@ -20,12 +21,7 @@ export default {
|
||||
const handleSearch = () => {
|
||||
console.log('searchValue.value', searchValue.value);
|
||||
// const conversationId = searchValue.value;
|
||||
// router.push({
|
||||
// name: 'Home',
|
||||
// params: {
|
||||
// conversationId,
|
||||
// },
|
||||
// });
|
||||
// handleUserHome({conversationId})
|
||||
};
|
||||
|
||||
const tagList = [
|
||||
|
||||
@ -5,6 +5,8 @@ import Conversations from '@/components/xt-chat/xt-conversations';
|
||||
import SvgIcon from '@/components/svg-icon';
|
||||
import { Button, Flex, Input } from 'ant-design-vue';
|
||||
import DeleteChatModal from './delete-chat-modal.vue';
|
||||
|
||||
import { handleUserHome } from '@/utils/user';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
export default {
|
||||
@ -48,12 +50,7 @@ export default {
|
||||
};
|
||||
const handleActiveChange = (item) => {
|
||||
const { id } = item;
|
||||
router.push({
|
||||
name: 'Home',
|
||||
params: {
|
||||
conversationId: id,
|
||||
},
|
||||
});
|
||||
handleUserHome({ conversationId: id });
|
||||
};
|
||||
|
||||
expose({
|
||||
|
||||
@ -0,0 +1,26 @@
|
||||
export enum AuditStatus {
|
||||
All = '0',
|
||||
Pending = '1',
|
||||
Auditing = '2',
|
||||
Passed = '3',
|
||||
}
|
||||
|
||||
export const TABS_LIST = [
|
||||
{
|
||||
label: '全部',
|
||||
value: AuditStatus.All,
|
||||
},
|
||||
{
|
||||
label: '待审核',
|
||||
value: AuditStatus.Pending,
|
||||
},
|
||||
{
|
||||
label: '审核中',
|
||||
value: AuditStatus.Auditing,
|
||||
},
|
||||
{
|
||||
label: '已通过',
|
||||
value: AuditStatus.Passed,
|
||||
},
|
||||
];
|
||||
|
||||
@ -0,0 +1,35 @@
|
||||
<script lang="tsx">
|
||||
import { Tabs, TabPane } from 'ant-design-vue';
|
||||
|
||||
import { TABS_LIST, AuditStatus } from './constants';
|
||||
|
||||
export default defineComponent({
|
||||
setup(_, { attrs, slots, expose }) {
|
||||
const activeKey = ref(AuditStatus.All);
|
||||
|
||||
return () => (
|
||||
<div class="finished-products-wrap h-full flex flex-col">
|
||||
<div class="bg-#fff rounded-8px mb-16px">
|
||||
<Tabs v-model:activeKey={activeKey.value} v-slots={{
|
||||
'rightExtra': () => (
|
||||
<div class="flex items-center">
|
||||
123
|
||||
</div>
|
||||
)
|
||||
}}>
|
||||
{TABS_LIST.map((item) => (
|
||||
<TabPane key={item.value} tab={item.label}>
|
||||
{item.label}
|
||||
</TabPane>
|
||||
))}
|
||||
</Tabs>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import './style.scss';
|
||||
</style>
|
||||
@ -0,0 +1,37 @@
|
||||
.finished-products-wrap {
|
||||
:deep(.ant-tabs) {
|
||||
.ant-tabs-nav {
|
||||
margin-bottom: 0;
|
||||
padding: 0 24px;
|
||||
.ant-tabs-nav-wrap {
|
||||
height: 56px;
|
||||
.ant-tabs-nav-list {
|
||||
.ant-tabs-tab {
|
||||
.ant-tabs-tab-btn {
|
||||
color: var(--Text-2, #55585f);
|
||||
font-family: $font-family-regular;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 24px;
|
||||
}
|
||||
&.ant-tabs-tab-active {
|
||||
.ant-tabs-tab-btn {
|
||||
color: var(--Brand-6, #6d4cfe);
|
||||
font-weight: 500;
|
||||
font-family: $font-family-medium;
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
.ant-tabs-ink-bar {
|
||||
background: #6D4CFE;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.ant-tabs-content-holder {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
16
src/views/material-center/components/raw-material/index.vue
Normal file
16
src/views/material-center/components/raw-material/index.vue
Normal file
@ -0,0 +1,16 @@
|
||||
<script lang="tsx">
|
||||
export default defineComponent({
|
||||
setup(_, { attrs, slots, expose }) {
|
||||
|
||||
return () => (
|
||||
<div class="raw-material-wrap h-full flex flex-col">
|
||||
原材料库
|
||||
</div>
|
||||
);
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import './style.scss';
|
||||
</style>
|
||||
@ -0,0 +1,3 @@
|
||||
.raw-material-wrap {
|
||||
|
||||
}
|
||||
54
src/views/material-center/index.vue
Normal file
54
src/views/material-center/index.vue
Normal file
@ -0,0 +1,54 @@
|
||||
<script lang="tsx">
|
||||
import FinishedProducts from './components/finished-products/index.vue';
|
||||
import RawMaterial from './components/raw-material/index.vue';
|
||||
|
||||
const TABS = [
|
||||
{
|
||||
label: '成品库',
|
||||
key: '1',
|
||||
routeName: 'MaterialCenterFinishedProducts',
|
||||
},
|
||||
{
|
||||
label: '原料库',
|
||||
key: '2',
|
||||
routeName: 'MaterialCenterRawMaterial',
|
||||
},
|
||||
];
|
||||
export default defineComponent({
|
||||
setup(_, { attrs, slots, expose }) {
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
const activeKey = ref('1');
|
||||
|
||||
onMounted(() => {
|
||||
activeKey.value = TABS.find((item) => item.routeName === route.name)?.key;
|
||||
});
|
||||
return () => (
|
||||
<div class="material-center-wrap h-full flex flex-col">
|
||||
<header class="py-16px px-24px rounded-8px bg-#fff flex items-center mb-16px">
|
||||
{TABS.map((item) => (
|
||||
<p
|
||||
key={item.key}
|
||||
class={`font-family-medium color-#737478 font-400 text-16px lh-24px cursor-pointer mr-32px ${
|
||||
item.key === activeKey.value ? '!color-#6D4CFE font-500' : ''
|
||||
}`}
|
||||
onClick={() => {
|
||||
activeKey.value = item.key;
|
||||
router.push({ name: item.routeName });
|
||||
}}
|
||||
>
|
||||
{item.label}
|
||||
</p>
|
||||
))}
|
||||
</header>
|
||||
{activeKey.value === '1' ? <FinishedProducts /> : <RawMaterial />}
|
||||
</div>
|
||||
);
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import './style.scss';
|
||||
</style>
|
||||
2
src/views/material-center/style.scss
Normal file
2
src/views/material-center/style.scss
Normal file
@ -0,0 +1,2 @@
|
||||
.material-center-wrap {
|
||||
}
|
||||
Reference in New Issue
Block a user