refactor(detail): 移除i18n相关

This commit is contained in:
悠静萝莉 2024-09-03 01:14:29 +08:00
parent 6dc5b4c829
commit c5535de8f9
No known key found for this signature in database
GPG Key ID: 4EDF1CA1CEA8EBCC
8 changed files with 244 additions and 278 deletions

View File

@ -1,13 +1,11 @@
import { t } from '@/locales';
export const BASE_INFO_DATA = [ export const BASE_INFO_DATA = [
{ {
name: t('constants.contract.name'), name: '合同名称',
value: '总部办公用品采购项目', value: '总部办公用品采购项目',
type: null, type: null,
}, },
{ {
name: t('constants.contract.status'), name: '合同状态',
value: '履行中', value: '履行中',
type: { type: {
key: 'contractStatus', key: 'contractStatus',
@ -15,52 +13,52 @@ export const BASE_INFO_DATA = [
}, },
}, },
{ {
name: t('constants.contract.num'), name: '合同编号',
value: 'BH00010', value: 'BH00010',
type: null, type: null,
}, },
{ {
name: t('constants.contract.type'), name: '合同类型',
value: t('constants.contract.typeOptions.main'), value: '主合同',
type: null, type: null,
}, },
{ {
name: t('constants.contract.payType'), name: '合同收付类型',
value: t('constants.contract.pay'), value: '付款',
type: null, type: null,
}, },
{ {
name: t('constants.contract.amount'), name: '合同金额',
value: '¥ 5,000,000', value: '5,000,000',
type: null, type: null,
}, },
{ {
name: t('constants.contract.company'), name: '甲方',
value: '腾讯科技(深圳)有限公司', value: '腾讯科技(深圳)有限公司',
type: null, type: null,
}, },
{ {
name: t('constants.contract.employee'), name: '乙方',
value: '欧尚', value: '欧尚',
type: null, type: null,
}, },
{ {
name: t('constants.contract.signDate'), name: '合同签订日期',
value: '2020-12-20', value: '2020-12-20',
type: null, type: null,
}, },
{ {
name: t('constants.contract.effectiveDate'), name: '合同生效日期',
value: '2021-01-20', value: '2021-01-20',
type: null, type: null,
}, },
{ {
name: t('constants.contract.endDate'), name: '合同结束日期',
value: '2022-12-20', value: '2022-12-20',
type: null, type: null,
}, },
{ {
name: t('constants.contract.attachment'), name: '合同附件',
value: '总部办公用品采购项目合同.pdf', value: '总部办公用品采购项目合同.pdf',
type: { type: {
key: 'contractAnnex', key: 'contractAnnex',
@ -68,17 +66,68 @@ export const BASE_INFO_DATA = [
}, },
}, },
{ {
name: t('constants.contract.remark'), name: '备注',
value: '--', value: '--',
type: null, type: null,
}, },
{ {
name: t('constants.contract.createDate'), name: '创建时间',
value: '2020-12-22 10:00:00', value: '2020-12-22 10:00:00',
type: null, type: null,
}, },
]; ];
export const TABLE_COLUMNS_DATA = [
{
width: 280,
ellipsis: true,
colKey: 'index',
title: '申请号',
sorter: (a: any, b: any) => a.index.substr(3) - b.index.substr(3),
},
{
width: 200,
ellipsis: true,
colKey: 'pdName',
title: '产品名称',
sorter: (a: any, b: any) => a.pdName.length - b.pdName.length,
},
{
width: 200,
ellipsis: true,
colKey: 'pdNum',
title: '产品编号',
},
{
width: 160,
ellipsis: true,
colKey: 'purchaseNum',
title: '采购数量',
sorter: (a: any, b: any) => a.purchaseNum - b.purchaseNum,
},
{
width: 160,
ellipsis: true,
colKey: 'adminName',
title: '申请部门',
},
{
width: 200,
ellipsis: true,
colKey: 'updateTime',
title: '创建时间',
sorter: (a: any, b: any) => Date.parse(a.updateTime) - Date.parse(b.updateTime),
},
{
align: 'left' as const,
fixed: 'right' as const,
width: 200,
className: 'test2',
colKey: 'op',
title: '操作',
},
];
export const PRODUCT_LIST = [ export const PRODUCT_LIST = [
{ {
name: 'MacBook Pro 2021', name: 'MacBook Pro 2021',

View File

@ -1,8 +1,9 @@
<template> <template>
<div class="detail-advanced"> <div class="detail-advanced">
<t-card :bordered="false"> <t-card title="基本信息" :bordered="false">
<t-descriptions :title="$t('pages.detailCard.baseInfo.title')"> <div class="info-block">
<t-descriptions-item v-for="(item, index) in BASE_INFO_DATA" :key="index" :label="item.name"> <div v-for="(item, index) in BASE_INFO_DATA" :key="index" class="info-item">
<h1>{{ item.name }}</h1>
<span <span
:class="{ :class="{
['inProgress']: item.type && item.type.value === 'inProgress', ['inProgress']: item.type && item.type.value === 'inProgress',
@ -12,37 +13,28 @@
<i v-if="item.type && item.type.key === 'contractStatus'" /> <i v-if="item.type && item.type.key === 'contractStatus'" />
{{ item.value }} {{ item.value }}
</span> </span>
</t-descriptions-item> </div>
</t-descriptions> </div>
</t-card> </t-card>
<!-- 发票进度 --> <!-- 发票进度 -->
<t-card :title="$t('pages.detailCard.invoice.title')" class="container-base-margin-top" :bordered="false"> <t-card title="发票进度" class="container-base-margin-top" :bordered="false">
<t-row justify="space-between"> <t-row justify="space-between">
<t-steps :current="updateCurrent"> <t-steps :current="updateCurrent">
<t-step-item <t-step-item title="申请提交" content="已于12月21日提交" />
:title="$t('pages.detailCard.invoice.step1.title')" <t-step-item title="电子发票" content="预计13个工作日" />
:content="$t('pages.detailCard.invoice.step1.content')" <t-step-item title="发票已邮寄" content="电子发票开出后7个工作日联系" />
/> <t-step-item title="完成" content="" />
<t-step-item
:title="$t('pages.detailCard.invoice.step2.title')"
:content="$t('pages.detailCard.invoice.step2.content')"
/>
<t-step-item
:title="$t('pages.detailCard.invoice.step3.title')"
:content="$t('pages.detailCard.invoice.step3.content')"
/>
<t-step-item :title="$t('pages.detailCard.invoice.step4.title')" />
</t-steps> </t-steps>
</t-row> </t-row>
</t-card> </t-card>
<!-- 产品目录 --> <!-- 产品目录 -->
<t-card :title="$t('pages.detailCard.product.title')" class="container-base-margin-top" :bordered="false"> <t-card title="产品目录" class="container-base-margin-top" :bordered="false">
<template #actions> <template #actions>
<t-radio-group default-value="dateVal"> <t-radio-group default-value="dateVal">
<t-radio-button value="dateVal"> {{ $t('pages.detailCard.product.quarter') }} </t-radio-button> <t-radio-button value="dateVal"> 季度 </t-radio-button>
<t-radio-button value="monthVal"> {{ $t('pages.detailCard.product.month') }} </t-radio-button> <t-radio-button value="monthVal"> 月份 </t-radio-button>
</t-radio-group> </t-radio-group>
</template> </template>
<t-row :gutter="16" class="product-block-container"> <t-row :gutter="16" class="product-block-container">
@ -50,7 +42,7 @@
<div class="product-add"> <div class="product-add">
<div class="product-sub"> <div class="product-sub">
<t-icon name="add" class="product-sub-icon" /> <t-icon name="add" class="product-sub-icon" />
<span>{{ $t('pages.detailCard.product.add') }}</span> <span>新增产品</span>
</div> </div>
</div> </div>
</t-col> </t-col>
@ -61,7 +53,7 @@
</t-card> </t-card>
<!-- 产品采购明细 --> <!-- 产品采购明细 -->
<t-card :title="$t('pages.detailCard.detail.title')" class="container-base-margin-top" :bordered="false"> <t-card title="产品采购明细" class="container-base-margin-top" :bordered="false">
<t-table <t-table
:columns="columns" :columns="columns"
:data="data" :data="data"
@ -96,10 +88,8 @@
<template #op="slotProps"> <template #op="slotProps">
<t-space> <t-space>
<t-link theme="primary" @click="listClick()">{{ t('pages.detailCard.detail.form.manage') }}</t-link> <t-link theme="primary" @click="listClick()">管理</t-link>
<t-link theme="danger" @click="deleteClickOp(slotProps)">{{ <t-link theme="danger" @click="deleteClickOp(slotProps)">删除</t-link>
t('pages.detailCard.detail.form.delete')
}}</t-link>
</t-space> </t-space>
</template> </template>
@ -109,11 +99,11 @@
</t-table> </t-table>
</t-card> </t-card>
<t-dialog v-model:visible="visible" :header="$t('pages.detailCard.baseInfo.title')" @confirm="onConfirm"> <t-dialog v-model:visible="visible" header="基本信息" @confirm="onConfirm">
<template #body> <template #body>
<div class="dialog-info-block"> <div class="dialog-info-block">
<t-descriptions :column="1"> <div v-for="(item, index) in BASE_INFO_DATA" :key="index" class="info-item">
<t-descriptions-item v-for="(item, index) in BASE_INFO_DATA" :key="index" :label="item.name"> <h1>{{ item.name }}</h1>
<span <span
:class="{ :class="{
['inProgress']: item.type && item.type.value === 'inProgress', ['inProgress']: item.type && item.type.value === 'inProgress',
@ -123,8 +113,7 @@
<i v-if="item.type && item.type.key === 'contractStatus'" /> <i v-if="item.type && item.type.key === 'contractStatus'" />
{{ item.value }} {{ item.value }}
</span> </span>
</t-descriptions-item> </div>
</t-descriptions>
</div> </div>
</template> </template>
</t-dialog> </t-dialog>
@ -141,61 +130,9 @@ export default {
import { onMounted, ref } from 'vue'; import { onMounted, ref } from 'vue';
import { getPurchaseList } from '@/api/detail'; import { getPurchaseList } from '@/api/detail';
import { t } from '@/locales';
import Product from './components/Product.vue'; import Product from './components/Product.vue';
import { BASE_INFO_DATA, PRODUCT_LIST } from './constants'; import { BASE_INFO_DATA, PRODUCT_LIST, TABLE_COLUMNS_DATA as columns } from './constants';
const columns = [
{
width: 280,
ellipsis: true,
colKey: 'index',
title: t('pages.detailCard.detail.form.applyNo'),
sorter: (a: any, b: any) => a.index.substr(3) - b.index.substr(3),
},
{
width: 200,
ellipsis: true,
colKey: 'pdName',
title: t('pages.detailCard.detail.form.product'),
sorter: (a: any, b: any) => a.pdName.length - b.pdName.length,
},
{
width: 200,
ellipsis: true,
colKey: 'pdNum',
title: t('pages.detailCard.detail.form.productNo'),
},
{
width: 160,
ellipsis: true,
colKey: 'purchaseNum',
title: t('pages.detailCard.detail.form.num'),
sorter: (a: any, b: any) => a.purchaseNum - b.purchaseNum,
},
{
width: 160,
ellipsis: true,
colKey: 'adminName',
title: t('pages.detailCard.detail.form.department'),
},
{
width: 200,
ellipsis: true,
colKey: 'updateTime',
title: t('pages.detailCard.detail.form.createTime'),
sorter: (a: any, b: any) => Date.parse(a.updateTime) - Date.parse(b.updateTime),
},
{
align: 'left' as const,
fixed: 'right' as const,
width: 200,
className: 'test2',
colKey: 'op',
title: t('pages.detailCard.detail.form.operation'),
},
];
const data = ref([]); const data = ref([]);
const pagination = ref({ const pagination = ref({

View File

@ -0,0 +1,78 @@
export const BASE_INFO_DATA = [
{
name: '合同名称',
value: '总部办公用品采购项目',
type: null,
},
{
name: '合同状态',
value: '履行中',
type: {
key: 'contractStatus',
value: 'inProgress',
},
},
{
name: '合同编号',
value: 'BH00010',
type: null,
},
{
name: '合同类型',
value: '主合同',
type: null,
},
{
name: '合同收付类型',
value: '付款',
type: null,
},
{
name: '合同金额',
value: '5,000,000元',
type: null,
},
{
name: '甲方',
value: '腾讯科技(深圳)有限公司',
type: null,
},
{
name: '乙方',
value: '欧尚',
type: null,
},
{
name: '合同签订日期',
value: '2020-12-20',
type: null,
},
{
name: '合同生效日期',
value: '2021-01-20',
type: null,
},
{
name: '合同结束日期',
value: '2022-12-20',
type: null,
},
{
name: '合同附件',
value: '总部办公用品采购项目合同.pdf',
type: {
key: 'contractAnnex',
value: 'pdf',
},
},
{
name: '备注',
value: '--',
type: null,
},
{
name: '创建时间',
value: '2020-12-22 10:00:00',
type: null,
},
];

View File

@ -1,8 +1,9 @@
<template> <template>
<div class="detail-base"> <div class="detail-base">
<t-card :bordered="false"> <t-card title="基本信息" :bordered="false">
<t-descriptions :title="$t('pages.detailBase.baseInfo.title')"> <div class="info-block">
<t-descriptions-item v-for="(item, index) in BASE_INFO_DATA" :key="index" :label="item.name"> <div v-for="(item, index) in BASE_INFO_DATA" :key="index" class="info-item">
<h1>{{ item.name }}</h1>
<span <span
:class="{ :class="{
['inProgress']: item.type && item.type.value === 'inProgress', ['inProgress']: item.type && item.type.value === 'inProgress',
@ -12,24 +13,15 @@
<i v-if="item.type && item.type.key === 'contractStatus'" /> <i v-if="item.type && item.type.key === 'contractStatus'" />
{{ item.value }} {{ item.value }}
</span> </span>
</t-descriptions-item> </div>
</t-descriptions> </div>
</t-card> </t-card>
<t-card :title="$t('pages.detailBase.changelog.title')" class="container-base-margin-top" :bordered="false"> <t-card title="变更记录" class="container-base-margin-top" :bordered="false">
<t-steps class="detail-base-info-steps" layout="vertical" theme="dot" :current="1"> <t-steps class="detail-base-info-steps" layout="vertical" theme="dot" :current="1">
<t-step-item <t-step-item title="上传合同附件" content="这里是提示文字" />
:title="$t('pages.detailBase.changelog.step1.title')" <t-step-item title="修改合同金额" content="这里是提示文字" />
:content="$t('pages.detailBase.changelog.step1.subtitle')" <t-step-item title="新建合同" content="2020-12-01 15:00:00 管理员-李川操作" />
/>
<t-step-item
:title="$t('pages.detailBase.changelog.step2.title')"
:content="$t('pages.detailBase.changelog.step2.subtitle')"
/>
<t-step-item
:title="$t('pages.detailBase.changelog.step3.title')"
:content="$t('pages.detailBase.changelog.step3.desc')"
/>
</t-steps> </t-steps>
</t-card> </t-card>
</div> </div>
@ -42,81 +34,7 @@ export default {
</script> </script>
<script setup lang="ts"> <script setup lang="ts">
import { t } from '@/locales'; import { BASE_INFO_DATA } from './constants';
const BASE_INFO_DATA = [
{
name: t('constants.contract.name'),
value: '总部办公用品采购项目',
type: null,
},
{
name: t('constants.contract.status'),
value: '履行中',
type: {
key: 'contractStatus',
value: 'inProgress',
},
},
{
name: t('constants.contract.num'),
value: 'BH00010',
type: null,
},
{
name: t('constants.contract.type'),
value: t('constants.contract.typeOptions.main'),
type: null,
},
{
name: t('constants.contract.payType'),
value: t('constants.contract.pay'),
type: null,
},
{
name: t('constants.contract.amount'),
value: '¥ 5,000,000',
type: null,
},
{
name: t('constants.contract.company'),
value: '腾讯科技(深圳)有限公司',
type: null,
},
{
name: t('constants.contract.employee'),
value: '欧尚',
type: null,
},
{
name: t('constants.contract.signDate'),
value: '2020-12-20',
type: null,
},
{
name: t('constants.contract.effectiveDate'),
value: '2021-01-20',
type: null,
},
{
name: t('constants.contract.endDate'),
value: '2022-12-20',
type: null,
},
{
name: t('constants.contract.attachment'),
value: '总部办公用品采购项目合同.pdf',
type: {
key: 'contractAnnex',
value: 'pdf',
},
},
{
name: t('constants.contract.createDate'),
value: '2020-12-22 10:00:00',
type: null,
},
];
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>

View File

@ -80,3 +80,36 @@ export const BASE_INFO_DATA = [
type: null, type: null,
}, },
]; ];
export const TABLE_COLUMNS = [
{
width: '280',
ellipsis: true,
colKey: 'name',
title: '项目名称',
sorter: (a: any, b: any) => a.name.substr(10) - b.name.substr(10),
},
{
width: '280',
ellipsis: true,
colKey: 'adminName',
title: '管理员',
},
{
width: '280',
className: 'test',
ellipsis: true,
colKey: 'updateTime',
title: '创建时间',
sorter: (a: any, b: any) => Date.parse(a.updateTime) - Date.parse(b.updateTime),
},
{
align: 'left' as const,
width: '200',
className: 'test2',
ellipsis: true,
colKey: 'op',
fixed: 'right' as const,
title: '操作',
},
];

View File

@ -1,5 +1,4 @@
import { TChartColor } from '@/config/color'; import { TChartColor } from '@/config/color';
import { t } from '@/locales/index';
import { getDateArray, getRandomArray } from '@/utils/charts'; import { getDateArray, getRandomArray } from '@/utils/charts';
import { getChartListColor } from '@/utils/color'; import { getChartListColor } from '@/utils/color';
@ -53,7 +52,7 @@ export function getSmoothLineDataSet({
}, },
}, },
legend: { legend: {
data: [t('pages.detailDeploy.deployTrend.thisMonth'), t('pages.detailDeploy.deployTrend.lastMonth')], data: ['本月', '上月'],
icon: 'circle', icon: 'circle',
bottom: '0', bottom: '0',
itemGap: 48, itemGap: 48,
@ -66,7 +65,7 @@ export function getSmoothLineDataSet({
}, },
series: [ series: [
{ {
name: t('pages.detailDeploy.deployTrend.lastMonth'), name: '上月',
data: [ data: [
getRandomArray(), getRandomArray(),
getRandomArray(), getRandomArray(),
@ -87,7 +86,7 @@ export function getSmoothLineDataSet({
}, },
}, },
{ {
name: t('pages.detailDeploy.deployTrend.thisMonth'), name: '本月',
data: [ data: [
getRandomArray(), getRandomArray(),
getRandomArray(), getRandomArray(),
@ -130,11 +129,6 @@ export function get2ColBarChartDataSet({
thisYearListCopy = thisYearListCopy.reverse(); thisYearListCopy = thisYearListCopy.reverse();
} }
const data = [];
for (let i = 1; i < 7; i++) {
data.push(t(`pages.detailDeploy.deployTrend.week${i}`));
}
return { return {
color: getChartListColor(), color: getChartListColor(),
tooltip: { tooltip: {
@ -150,7 +144,7 @@ export function get2ColBarChartDataSet({
xAxis: [ xAxis: [
{ {
type: 'category', type: 'category',
data, data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
axisTick: { axisTick: {
alignWithLabel: true, alignWithLabel: true,
}, },
@ -179,7 +173,7 @@ export function get2ColBarChartDataSet({
}, },
], ],
legend: { legend: {
data: [t('pages.detailDeploy.deployTrend.lastYear'), t('pages.detailDeploy.deployTrend.thisYear')], data: ['去年', '今年'],
bottom: '0', bottom: '0',
icon: 'rect', icon: 'rect',
itemGap: 48, itemGap: 48,
@ -192,7 +186,7 @@ export function get2ColBarChartDataSet({
}, },
series: [ series: [
{ {
name: t('pages.detailDeploy.deployTrend.lastYear'), name: '去年',
type: 'bar', type: 'bar',
barWidth: '30%', barWidth: '30%',
data: lastYearListCopy, data: lastYearListCopy,
@ -201,7 +195,7 @@ export function get2ColBarChartDataSet({
}, },
}, },
{ {
name: t('pages.detailDeploy.deployTrend.thisYear'), name: '今年',
type: 'bar', type: 'bar',
barWidth: '30%', barWidth: '30%',
data: thisYearListCopy, data: thisYearListCopy,

View File

@ -2,18 +2,18 @@
<div class="detail-deploy"> <div class="detail-deploy">
<t-row :gutter="16"> <t-row :gutter="16">
<t-col :lg="6" :xs="12"> <t-col :lg="6" :xs="12">
<t-card :title="$t('pages.detailDeploy.deployTrend.title')" :bordered="false"> <t-card title="部署趋势" :bordered="false">
<div class="deploy-panel-left"> <div class="deploy-panel-left">
<div id="monitorContainer" style="width: 100%; height: 265px" /> <div id="monitorContainer" style="width: 100%; height: 265px" />
</div> </div>
</t-card> </t-card>
</t-col> </t-col>
<t-col :lg="6" :xs="12"> <t-col :lg="6" :xs="12">
<t-card :title="$t('pages.detailDeploy.deployTrend.warning')" :bordered="false"> <t-card title="告警情况" :bordered="false">
<template #actions> <template #actions>
<t-radio-group default-value="dateVal" @change="onAlertChange"> <t-radio-group default-value="dateVal" @change="onAlertChange">
<t-radio-button value="dateVal"> {{ $t('pages.detailDeploy.deployTrend.thisWeek') }} </t-radio-button> <t-radio-button value="dateVal"> 本周 </t-radio-button>
<t-radio-button value="monthVal"> {{ $t('pages.detailDeploy.deployTrend.thisMonth') }} </t-radio-button> <t-radio-button value="monthVal"> 本月 </t-radio-button>
</t-radio-group> </t-radio-group>
</template> </template>
<div id="dataContainer" style="width: 100%; height: 265px" /> <div id="dataContainer" style="width: 100%; height: 265px" />
@ -22,7 +22,7 @@
</t-row> </t-row>
<!-- 项目列表 --> <!-- 项目列表 -->
<t-card :title="$t('pages.detailDeploy.projectList.title')" class="container-base-margin-top" :bordered="false"> <t-card title="项目列表" class="container-base-margin-top" :bordered="false">
<t-table <t-table
:columns="columns" :columns="columns"
:data="data" :data="data"
@ -41,12 +41,8 @@
</template> </template>
<template #op="slotProps"> <template #op="slotProps">
<t-space> <t-space>
<t-link theme="primary" @click="listClick()">{{ <t-link theme="primary" @click="listClick()">管理</t-link>
$t('pages.detailDeploy.projectList.table.manage') <t-link theme="danger" @click="deleteClickOp(slotProps)">删除</t-link>
}}</t-link>
<t-link theme="danger" @click="deleteClickOp(slotProps)">{{
$t('pages.detailDeploy.projectList.table.delete')
}}</t-link>
</t-space> </t-space>
</template> </template>
<template #op-column> <template #op-column>
@ -55,11 +51,7 @@
</t-table> </t-table>
</t-card> </t-card>
<t-dialog <t-dialog v-model:visible="visible" header="基本信息" @confirm="onConfirm">
v-model:visible="visible"
:header="$t('pages.detailDeploy.projectList.dialog.title')"
@confirm="onConfirm"
>
<template #body> <template #body>
<div class="dialog-info-block"> <div class="dialog-info-block">
<div class="dialog-info-block"> <div class="dialog-info-block">
@ -94,46 +86,12 @@ import { CanvasRenderer } from 'echarts/renderers';
import { computed, onMounted, onUnmounted, ref, watch } from 'vue'; import { computed, onMounted, onUnmounted, ref, watch } from 'vue';
import { getProjectList } from '@/api/detail'; import { getProjectList } from '@/api/detail';
import { t } from '@/locales';
import { useSettingStore } from '@/store'; import { useSettingStore } from '@/store';
import { changeChartsTheme } from '@/utils/color'; import { changeChartsTheme } from '@/utils/color';
import { BASE_INFO_DATA } from './constants'; import { BASE_INFO_DATA, TABLE_COLUMNS as columns } from './constants';
import { get2ColBarChartDataSet, getSmoothLineDataSet } from './index'; import { get2ColBarChartDataSet, getSmoothLineDataSet } from './index';
const columns = [
{
width: '280',
ellipsis: true,
colKey: 'name',
title: t('pages.detailDeploy.projectList.table.name'),
sorter: (a: any, b: any) => a.name.substr(10) - b.name.substr(10),
},
{
width: '280',
ellipsis: true,
title: t('pages.detailDeploy.projectList.table.admin'),
colKey: 'adminName',
},
{
width: '280',
className: 'test',
ellipsis: true,
colKey: 'updateTime',
title: t('pages.detailDeploy.projectList.table.createTime'),
sorter: (a: any, b: any) => Date.parse(a.updateTime) - Date.parse(b.updateTime),
},
{
align: 'left' as const,
width: '200',
className: 'test2',
ellipsis: true,
colKey: 'op',
fixed: 'right' as const,
title: t('pages.detailDeploy.projectList.table.operation'),
},
];
echarts.use([ echarts.use([
TitleComponent, TitleComponent,
ToolboxComponent, ToolboxComponent,

View File

@ -18,14 +18,14 @@
<t-tooltip <t-tooltip
class="set-read-icon" class="set-read-icon"
:overlay-style="{ margin: '6px' }" :overlay-style="{ margin: '6px' }"
:content="item.status ? $t('pages.detailSecondary.setRead') : $t('pages.detailSecondary.setUnread')" :content="item.status ? '设为已读' : '设为未读'"
> >
<span class="msg-action-icon" @click="setReadStatus(item)"> <span class="msg-action-icon" @click="setReadStatus(item)">
<t-icon v-if="!!item.status" name="queue" size="16px" /> <t-icon v-if="!!item.status" name="queue" size="16px" />
<t-icon v-else name="chat" /> <t-icon v-else name="chat" />
</span> </span>
</t-tooltip> </t-tooltip>
<t-tooltip :content="t('pages.detailSecondary.delete')" :overlay-style="{ margin: '6px' }"> <t-tooltip content="删除通知" :overlay-style="{ margin: '6px' }">
<span @click="handleClickDeleteBtn(item)"> <span @click="handleClickDeleteBtn(item)">
<t-icon name="delete" size="16px" /> <t-icon name="delete" size="16px" />
</span> </span>
@ -36,7 +36,7 @@
</t-list> </t-list>
<div v-else class="secondary-msg-list__empty-list"> <div v-else class="secondary-msg-list__empty-list">
<empty-icon></empty-icon> <empty-icon></empty-icon>
<p>{{ t('pages.detailSecondary.empty') }}</p> <p>暂无通知</p>
</div> </div>
</t-tab-panel> </t-tab-panel>
</t-tabs> </t-tabs>
@ -62,21 +62,20 @@ import { computed, ref } from 'vue';
import EmptyIcon from '@/assets/assets-empty.svg?component'; import EmptyIcon from '@/assets/assets-empty.svg?component';
import { NOTIFICATION_TYPES } from '@/constants'; import { NOTIFICATION_TYPES } from '@/constants';
import { t } from '@/locales';
import { useNotificationStore } from '@/store'; import { useNotificationStore } from '@/store';
import type { NotificationItem } from '@/types/interface'; import type { NotificationItem } from '@/types/interface';
const TAB_LIST = [ const TAB_LIST = [
{ {
label: t('pages.detailSecondary.all'), label: '全部通知',
value: 'msgData', value: 'msgData',
}, },
{ {
label: t('pages.detailSecondary.unread'), label: '未读通知',
value: 'unreadMsg', value: 'unreadMsg',
}, },
{ {
label: t('pages.detailSecondary.read'), label: '已读通知',
value: 'readMsg', value: 'readMsg',
}, },
]; ];