<template>
|
<div class="app-container">
|
<el-form :model="filters" :inline="true">
|
<el-form-item label="发票号码:">
|
<el-input v-model="filters.invoiceNumber" placeholder="请输入发票号码" clearable style="width: 200px;" />
|
</el-form-item>
|
<el-form-item label="客户:">
|
<el-select v-model="filters.customerId" placeholder="请选择客户" clearable style="width: 200px;">
|
<el-option v-for="item in customerList" :key="item.id" :label="item.customerName" :value="item.id" />
|
</el-select>
|
</el-form-item>
|
<el-form-item label="开票日期:">
|
<el-date-picker
|
v-model="filters.dateRange"
|
type="daterange"
|
value-format="YYYY-MM-DD"
|
format="YYYY-MM-DD"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
clearable
|
style="width: 240px;"
|
/>
|
</el-form-item>
|
<el-form-item label="状态:">
|
<el-select v-model="filters.status" placeholder="请选择状态" clearable style="width: 150px;">
|
<el-option label="正常" :value="0" />
|
<el-option label="作废" :value="1" />
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" @click="onSearch">搜索</el-button>
|
<el-button @click="resetFilters">重置</el-button>
|
</el-form-item>
|
</el-form>
|
<div class="table_list">
|
<div class="actions">
|
<div></div>
|
<div>
|
<el-button type="primary" @click="add" icon="Plus">录入发票</el-button>
|
<el-button type="success" @click="handleExport" icon="Download">导出</el-button>
|
</div>
|
</div>
|
<PIMTable
|
rowKey="id"
|
v-loading="tableLoading"
|
:column="columns"
|
:tableData="dataList"
|
:page="{
|
current: pagination.currentPage,
|
size: pagination.pageSize,
|
total: pagination.total,
|
}"
|
@pagination="changePage"
|
>
|
<template #amount="{ row }">
|
<span class="text-primary">¥{{ formatMoney(row.amount) }}</span>
|
</template>
|
<template #taxAmount="{ row }">
|
<span class="text-danger">¥{{ formatMoney(row.taxAmount) }}</span>
|
</template>
|
<template #totalAmount="{ row }">
|
<span class="text-success">¥{{ formatMoney(row.totalAmount) }}</span>
|
</template>
|
<template #status="{ row }">
|
<el-tag :type="getStatusType(row.status)" effect="light" round>
|
{{ getStatusLabel(row.status) }}
|
</el-tag>
|
</template>
|
<template #operation="{ row }">
|
<el-button type="primary" link @click="view(row)">查看</el-button>
|
<el-button
|
type="primary"
|
link
|
@click="openFileDialog(row)"
|
v-if="row.accountInvoiceApplicationId"
|
>
|
附件
|
</el-button>
|
<el-button type="warning" link @click="handleCancel(row)" v-if="isNormalStatus(row.status)">作废</el-button>
|
<el-button type="danger" link @click="handleDelete(row)">删除</el-button>
|
</template>
|
</PIMTable>
|
</div>
|
|
<FormDialog
|
:title="dialogTitle"
|
v-model="dialogVisible"
|
width="800px"
|
:operation-type="isView ? 'detail' : ''"
|
@confirm="submitForm"
|
@cancel="closeDialog"
|
>
|
<el-form :model="form" :rules="rules" ref="formRef" label-width="120px">
|
<el-row v-if="isView" :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="状态">
|
<el-tag :type="getStatusType(form.status)" effect="light" round>
|
{{ getStatusLabel(form.status) }}
|
</el-tag>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="发票号码" prop="invoiceNo">
|
<el-input v-model="form.invoiceNo" placeholder="请输入发票号码" :disabled="isView" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="客户" prop="customerId">
|
<el-select v-model="form.customerId" placeholder="请选择客户" style="width: 100%;" :disabled="isView">
|
<el-option v-for="item in customerList" :key="item.id" :label="item.customerName" :value="item.id" />
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="开票日期" prop="invoiceDate">
|
<el-date-picker
|
v-model="form.invoiceDate"
|
type="date"
|
placeholder="选择日期"
|
value-format="YYYY-MM-DD"
|
style="width: 100%;"
|
:disabled="isView"
|
/>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="发票类型" prop="invoiceType">
|
<el-select
|
v-model="form.invoiceType"
|
placeholder="请选择发票类型"
|
style="width: 100%;"
|
:disabled="isView"
|
@change="handleInvoiceTypeChange"
|
>
|
<el-option label="增值税专用发票" value="增值税专用发票" />
|
<el-option label="增值税普通发票" value="增值税普通发票" />
|
<el-option label="电子发票" value="电子发票" />
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="开票申请单号">
|
<div style="display:flex;gap:8px;">
|
<el-input v-model="applyCodeDisplay" disabled placeholder="请选择开票申请" />
|
<el-button type="primary" @click="openApplyDialog" :disabled="isView">选择</el-button>
|
</div>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="税率" prop="taxRate">
|
<el-select
|
v-model="form.taxRate"
|
placeholder="请选择税率"
|
style="width: 100%;"
|
:disabled="isView"
|
@change="calculateTax"
|
>
|
<el-option
|
v-for="dict in tax_rate"
|
:key="dict.value"
|
:label="dict.label"
|
:value="Number(dict.value)"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="金额(不含税)" prop="amount">
|
<el-input-number
|
v-model="form.amount"
|
:min="0"
|
:precision="4"
|
:disabled="isView"
|
@change="calculateTax"
|
/>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="税额">
|
<el-input v-model="form.taxAmount" disabled />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="价税合计">
|
<el-input v-model="form.totalAmount" disabled />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-form-item label="发票内容" prop="content">
|
<el-input v-model="form.content" type="textarea" :rows="3" placeholder="请输入发票内容" :disabled="isView" />
|
</el-form-item>
|
<el-form-item label="备注" prop="remark">
|
<el-input v-model="form.remark" type="textarea" :rows="2" placeholder="请输入备注" :disabled="isView" />
|
</el-form-item>
|
</el-form>
|
<template v-if="!isView" #footer>
|
<el-button type="primary" :loading="submitLoading" @click="submitForm">确定</el-button>
|
<el-button @click="closeDialog">取消</el-button>
|
</template>
|
</FormDialog>
|
|
<el-dialog v-model="applyDialogVisible"
|
title="选择开票申请"
|
width="900px"
|
:close-on-click-modal="false">
|
<div style="margin-bottom:12px;display:flex;gap:12px;">
|
<el-input v-model="applySearch.applyCode" placeholder="申请单号" clearable style="width:200px;" @change="fetchApplyList" />
|
<el-input v-model="applySearch.customerName" placeholder="客户名称" clearable style="width:200px;" @change="fetchApplyList" />
|
<el-button type="primary" @click="fetchApplyList">搜索</el-button>
|
</div>
|
<el-table :data="applyList" border v-loading="applyLoading" height="400px">
|
<el-table-column label="申请单号" prop="invoiceApplicationNo" width="150" />
|
<el-table-column label="客户名称" prop="customerName" width="180" />
|
<el-table-column label="开票金额" prop="invoiceAmount" width="120" />
|
<el-table-column label="税率" prop="taxRate" width="80">
|
<template #default="{ row }">{{ row.taxRate }}%</template>
|
</el-table-column>
|
<el-table-column label="发票类型" prop="invoiceType" width="130" />
|
<el-table-column label="申请日期" prop="applyDate" width="120" />
|
<el-table-column label="操作" width="80" align="center">
|
<template #default="{ row }">
|
<el-button type="primary" link @click="selectApply(row)">选择</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
<div v-if="applyPage.total > 0">
|
<Pagination :total="applyPage.total"
|
layout="total, prev, pager, next"
|
:page="applyPage.current"
|
:limit="applyPage.size"
|
@pagination="applyPaginationChange" />
|
</div>
|
<template #footer>
|
<el-button @click="applyDialogVisible = false">关闭</el-button>
|
</template>
|
</el-dialog>
|
|
<FileList
|
v-if="fileDialogVisible"
|
v-model:visible="fileDialogVisible"
|
record-type="account_invoice_application"
|
:record-id="currentRecordId"
|
:editable="false"
|
/>
|
</div>
|
</template>
|
|
<script setup>
|
import { ref, reactive, onMounted, nextTick, getCurrentInstance, defineAsyncComponent } from "vue";
|
import { ElMessage, ElMessageBox } from "element-plus";
|
import FormDialog from "@/components/Dialog/FormDialog.vue";
|
import Pagination from "@/components/PIMTable/Pagination.vue";
|
import { listCustomer } from "@/api/basicData/customer.js";
|
import {
|
addAccountSalesInvoice,
|
listPageAccountSalesInvoice,
|
cancelAccountSalesInvoice,
|
deleteAccountSalesInvoice,
|
} from "@/api/financialManagement/accountSalesInvoice.js";
|
import { listPageAccountInvoiceApplication } from "@/api/financialManagement/invoiceApply.js";
|
|
const FileList = defineAsyncComponent(() => import("@/components/Dialog/FileList.vue"));
|
|
defineOptions({
|
name: "销项发票",
|
});
|
|
const { proxy } = getCurrentInstance();
|
const { tax_rate } = proxy.useDict("tax_rate");
|
|
const filters = reactive({
|
invoiceNumber: "",
|
customerId: "",
|
dateRange: [],
|
status: "",
|
});
|
|
const pagination = reactive({
|
currentPage: 1,
|
pageSize: 10,
|
total: 0,
|
});
|
|
const columns = [
|
{ label: "发票号码", prop: "invoiceNo", width: "140" },
|
{ label: "客户名称", prop: "customerName", width: "180" },
|
{ label: "开票日期", prop: "invoiceDate", width: "120" },
|
{ label: "金额", prop: "amount", dataType: "slot", slot: "amount" },
|
{ label: "税额", prop: "taxAmount", dataType: "slot", slot: "taxAmount" },
|
{ label: "价税合计", prop: "totalAmount", dataType: "slot", slot: "totalAmount" },
|
{ label: "发票类型", prop: "invoiceType", width: "130" },
|
{ label: "状态", prop: "status", dataType: "slot", slot: "status", width: "90", align: "center" },
|
{ label: "操作", prop: "operation", dataType: "slot", slot: "operation", width: "260", fixed: "right" },
|
];
|
|
const dataList = ref([]);
|
const tableLoading = ref(false);
|
const dialogVisible = ref(false);
|
const dialogTitle = ref("");
|
const formRef = ref(null);
|
const isView = ref(false);
|
const submitLoading = ref(false);
|
|
const customerList = ref([]);
|
const fileDialogVisible = ref(false);
|
const currentRecordId = ref(0);
|
|
// 开票申请选择
|
const applyDialogVisible = ref(false);
|
const applyLoading = ref(false);
|
const applyList = ref([]);
|
const applyCodeDisplay = ref("");
|
const applySearch = reactive({ applyCode: "", customerName: "" });
|
const applyPage = reactive({ current: 1, size: 10, total: 0 });
|
|
const openApplyDialog = () => {
|
applySearch.applyCode = "";
|
applySearch.customerName = "";
|
applyPage.current = 1;
|
fetchApplyList();
|
applyDialogVisible.value = true;
|
};
|
|
const fetchApplyList = () => {
|
applyLoading.value = true;
|
const params = {
|
current: applyPage.current,
|
size: applyPage.size,
|
status: 1, // 只查审核通过
|
};
|
if (applySearch.applyCode) params.applyCode = applySearch.applyCode;
|
if (applySearch.customerName) params.customerName = applySearch.customerName;
|
listPageAccountInvoiceApplication(params)
|
.then(res => {
|
applyList.value = res.data?.records || [];
|
applyPage.total = res.data?.total || 0;
|
})
|
.finally(() => {
|
applyLoading.value = false;
|
});
|
};
|
|
const applyPaginationChange = ({ page: p, limit }) => {
|
applyPage.current = p;
|
applyPage.size = limit;
|
fetchApplyList();
|
};
|
|
const selectApply = row => {
|
form.accountInvoiceApplicationId = row.id;
|
applyCodeDisplay.value = row.invoiceApplicationNo || "";
|
form.amount = Number(row.invoiceAmount) || 0;
|
form.taxRate = Number(row.taxRate) || 13;
|
form.invoiceType = row.invoiceType || "增值税专用发票";
|
if (row.customerId) form.customerId = row.customerId;
|
calculateTax();
|
nextTick(() => {
|
applyDialogVisible.value = false;
|
});
|
};
|
|
const openFileDialog = (row) => {
|
if (!row.accountInvoiceApplicationId) {
|
ElMessage.warning("未关联开票申请，无法查看附件");
|
return;
|
}
|
currentRecordId.value = row.accountInvoiceApplicationId;
|
fileDialogVisible.value = true;
|
};
|
|
/** 状态：0正常 1作废 */
|
const STATUS_LABEL_MAP = { 0: "正常", 1: "作废" };
|
const STATUS_TYPE_MAP = { 0: "success", 1: "info" };
|
|
const normalizeStatus = (status) => {
|
if (status === undefined || status === null || status === "") return 0;
|
const num = Number(status);
|
return Number.isNaN(num) ? 0 : num;
|
};
|
|
const isNormalStatus = (status) => normalizeStatus(status) === 0;
|
|
const getStatusLabel = (status) => {
|
const num = normalizeStatus(status);
|
return STATUS_LABEL_MAP[num] ?? "正常";
|
};
|
|
const getStatusType = (status) => {
|
const num = normalizeStatus(status);
|
return STATUS_TYPE_MAP[num] ?? "success";
|
};
|
|
const form = reactive({
|
invoiceNo: "",
|
customerId: "",
|
invoiceDate: "",
|
invoiceType: "增值税专用发票",
|
taxRate: 13,
|
amount: 0,
|
taxAmount: 0,
|
totalAmount: 0,
|
content: "",
|
remark: "",
|
accountInvoiceApplicationId: undefined,
|
storageAttachmentId: undefined,
|
});
|
|
const rules = {
|
invoiceNo: [{ required: true, message: "请输入发票号码", trigger: "blur" }],
|
customerId: [{ required: true, message: "请选择客户", trigger: "change" }],
|
invoiceDate: [{ required: true, message: "请选择开票日期", trigger: "change" }],
|
invoiceType: [{ required: true, message: "请选择发票类型", trigger: "change" }],
|
taxRate: [{ required: true, message: "请选择税率", trigger: "change" }],
|
amount: [{ required: true, message: "请输入金额", trigger: "blur" }],
|
};
|
|
const formatMoney = (value) => {
|
if (value === undefined || value === null) return "0.00";
|
const parts = Number(value).toFixed(4).split(".");
|
parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
return parts.join(".");
|
};
|
|
const calculateTax = () => {
|
form.taxAmount = Number((form.amount * form.taxRate / 100).toFixed(4));
|
form.totalAmount = Number((form.amount + form.taxAmount).toFixed(4));
|
};
|
|
const handleInvoiceTypeChange = () => {
|
calculateTax();
|
};
|
|
const normalizeTableRow = (row) => ({
|
...row,
|
invoiceNo: row.invoiceNumber ?? row.invoiceNo,
|
invoiceDate: row.issueDate ?? row.invoiceDate,
|
amount: row.taxExclusivelPrice ?? row.amount,
|
taxAmount: row.taxPrice ?? row.taxAmount,
|
totalAmount: row.taxInclusivePrice ?? row.totalAmount,
|
content: row.invoiceContent ?? row.content,
|
status: normalizeStatus(row.status),
|
});
|
|
const fillFormFromRow = (row) => {
|
Object.assign(form, {
|
invoiceNo: row.invoiceNo ?? row.invoiceNumber ?? "",
|
customerId: row.customerId,
|
invoiceDate: row.invoiceDate ?? row.issueDate ?? "",
|
invoiceType: row.invoiceType ?? "增值税专用发票",
|
taxRate: row.taxRate ?? 13,
|
amount: row.amount ?? row.taxExclusivelPrice ?? 0,
|
taxAmount: row.taxAmount ?? row.taxPrice ?? 0,
|
totalAmount: row.totalAmount ?? row.taxInclusivePrice ?? 0,
|
content: row.content ?? row.invoiceContent ?? "",
|
remark: row.remark ?? "",
|
accountInvoiceApplicationId: row.accountInvoiceApplicationId,
|
storageAttachmentId: row.storageAttachmentId,
|
status: normalizeStatus(row.status),
|
});
|
};
|
|
const buildCancelPayload = (row) => ({
|
id: row.id,
|
accountInvoiceApplicationId: row.accountInvoiceApplicationId,
|
invoiceNumber: row.invoiceNumber ?? row.invoiceNo,
|
taxRate: row.taxRate,
|
invoiceType: row.invoiceType,
|
issueDate: row.issueDate ?? row.invoiceDate,
|
taxExclusivelPrice: row.taxExclusivelPrice ?? row.amount,
|
taxPrice: row.taxPrice ?? row.taxAmount,
|
taxInclusivePrice: row.taxInclusivePrice ?? row.totalAmount,
|
remark: row.remark ?? "",
|
invoiceContent: row.invoiceContent ?? row.content,
|
customerId: row.customerId,
|
storageAttachmentId: row.storageAttachmentId,
|
status: 1,
|
});
|
|
const buildSubmitPayload = () => ({
|
invoiceNumber: form.invoiceNo,
|
customerId: form.customerId,
|
issueDate: form.invoiceDate,
|
invoiceType: form.invoiceType,
|
taxRate: form.taxRate,
|
taxExclusivelPrice: form.amount,
|
taxPrice: form.taxAmount,
|
taxInclusivePrice: form.totalAmount,
|
invoiceContent: form.content,
|
remark: form.remark || "",
|
accountInvoiceApplicationId: form.accountInvoiceApplicationId,
|
storageAttachmentId: form.storageAttachmentId,
|
});
|
|
const getCustomerList = () => {
|
listCustomer({ current: -1, size: -1, type: 0 }).then((res) => {
|
if (res.code === 200) {
|
customerList.value = res.data?.records || [];
|
}
|
});
|
};
|
|
const appendFilterParams = (params) => {
|
if (filters.invoiceNumber) {
|
params.invoiceNumber = filters.invoiceNumber;
|
}
|
if (filters.customerId) {
|
params.customerId = filters.customerId;
|
}
|
if (filters.dateRange?.length === 2) {
|
params.startDate = filters.dateRange[0];
|
params.endDate = filters.dateRange[1];
|
}
|
if (filters.status !== "" && filters.status != null) {
|
params.status = filters.status;
|
}
|
return params;
|
};
|
|
const buildListParams = () =>
|
appendFilterParams({
|
current: pagination.currentPage,
|
size: pagination.pageSize,
|
});
|
|
const buildExportParams = () => appendFilterParams({});
|
|
const handleExport = () => {
|
const params = buildExportParams();
|
proxy.download("/accountSalesInvoice/exportAccountSalesInvoice", params, `销项发票_${Date.now()}.xlsx`);
|
};
|
|
const getTableData = () => {
|
tableLoading.value = true;
|
listPageAccountSalesInvoice(buildListParams())
|
.then((res) => {
|
if (res.code === 200) {
|
const records = res.data?.records ?? [];
|
dataList.value = records.map(normalizeTableRow);
|
pagination.total = res.data?.total ?? 0;
|
} else {
|
dataList.value = [];
|
pagination.total = 0;
|
ElMessage.error(res.msg || "查询失败");
|
}
|
})
|
.catch(() => {
|
dataList.value = [];
|
pagination.total = 0;
|
ElMessage.error("查询失败");
|
})
|
.finally(() => {
|
tableLoading.value = false;
|
});
|
};
|
|
const onSearch = () => {
|
pagination.currentPage = 1;
|
getTableData();
|
};
|
|
const resetFilters = () => {
|
filters.invoiceNumber = "";
|
filters.customerId = "";
|
filters.dateRange = [];
|
filters.status = "";
|
pagination.currentPage = 1;
|
getTableData();
|
};
|
|
const changePage = ({ current, size }) => {
|
pagination.currentPage = current;
|
pagination.pageSize = size;
|
getTableData();
|
};
|
|
const closeDialog = () => {
|
dialogVisible.value = false;
|
isView.value = false;
|
};
|
|
const add = () => {
|
isView.value = false;
|
dialogTitle.value = "录入发票";
|
Object.assign(form, {
|
invoiceNo: "",
|
customerId: "",
|
invoiceDate: new Date().toISOString().split("T")[0],
|
invoiceType: "增值税专用发票",
|
taxRate: 13,
|
amount: 0,
|
taxAmount: 0,
|
totalAmount: 0,
|
content: "",
|
remark: "",
|
accountInvoiceApplicationId: undefined,
|
storageAttachmentId: undefined,
|
});
|
applyCodeDisplay.value = "";
|
dialogVisible.value = true;
|
};
|
|
const view = (row) => {
|
isView.value = true;
|
dialogTitle.value = "查看发票";
|
fillFormFromRow(row);
|
applyCodeDisplay.value = row.invoiceApplicationNo || "";
|
dialogVisible.value = true;
|
};
|
|
const handleCancel = (row) => {
|
ElMessageBox.confirm(`确认作废发票「${row.invoiceNo ?? row.invoiceNumber}」吗？`, "作废确认", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning",
|
}).then(() => {
|
cancelAccountSalesInvoice(buildCancelPayload(row))
|
.then((res) => {
|
if (res.code === 200) {
|
ElMessage.success("作废成功");
|
getTableData();
|
} else {
|
ElMessage.error(res.msg || "作废失败");
|
}
|
})
|
.catch(() => {
|
ElMessage.error("作废失败");
|
});
|
});
|
};
|
|
const handleDelete = (row) => {
|
ElMessageBox.confirm(`确认删除发票「${row.invoiceNo ?? row.invoiceNumber}」吗？删除后不可恢复。`, "删除确认", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning",
|
}).then(() => {
|
deleteAccountSalesInvoice([row.id])
|
.then((res) => {
|
if (res.code === 200) {
|
ElMessage.success("删除成功");
|
getTableData();
|
} else {
|
ElMessage.error(res.msg || "删除失败");
|
}
|
})
|
.catch(() => {
|
ElMessage.error("删除失败");
|
});
|
});
|
};
|
|
const submitForm = () => {
|
formRef.value.validate((valid) => {
|
if (!valid) return;
|
submitLoading.value = true;
|
addAccountSalesInvoice(buildSubmitPayload())
|
.then((res) => {
|
if (res.code === 200) {
|
ElMessage.success("录入成功");
|
closeDialog();
|
getTableData();
|
} else {
|
ElMessage.error(res.msg || "录入失败");
|
}
|
})
|
.catch(() => {
|
ElMessage.error("录入失败");
|
})
|
.finally(() => {
|
submitLoading.value = false;
|
});
|
});
|
};
|
|
onMounted(() => {
|
getCustomerList();
|
getTableData();
|
});
|
</script>
|
|
<style lang="scss" scoped>
|
.actions {
|
display: flex;
|
justify-content: space-between;
|
margin-bottom: 15px;
|
}
|
|
.text-primary {
|
color: #409eff;
|
font-weight: bold;
|
}
|
|
.text-danger {
|
color: #f56c6c;
|
font-weight: bold;
|
}
|
|
.text-success {
|
color: #67c23a;
|
font-weight: bold;
|
}
|
</style>
|
