投入品管理 - 农药使用监管页面展示列表开发，表格组件调整
This commit is contained in:
parent
09c87cb373
commit
374c294836
@ -11,7 +11,7 @@ export function getMaterailTypes(params) {
|
||||
|
||||
/* 获取农药列表 */
|
||||
export function getPesticideList(params) {
|
||||
return request('/inputGoods/pesticide/page', {
|
||||
return request('/inputGoods/supervise/pesticide/page', {
|
||||
params,
|
||||
});
|
||||
}
|
||||
|
||||
330
sub-government-affairs-service/src/components/tableComponent.vue
Normal file
330
sub-government-affairs-service/src/components/tableComponent.vue
Normal file
@ -0,0 +1,330 @@
|
||||
<template>
|
||||
<div class="custom-table-container">
|
||||
<el-table
|
||||
style="flex: 1; display: flex; flex-direction: column; text-align: center"
|
||||
:max-height="tableMaxHeight"
|
||||
v-loading="loading"
|
||||
:data="tableData"
|
||||
:stripe="showStripe"
|
||||
:fit="true"
|
||||
v-bind="$attrs"
|
||||
:header-cell-class-name="headerCellClassName"
|
||||
:cell-class-name="cellClassName"
|
||||
@selection-change="handleSelectionChange"
|
||||
>
|
||||
<!-- 树形展开 -->
|
||||
<el-table-column v-if="tree" type="expand">
|
||||
<template #default="props">
|
||||
<slot name="tree" :row="props.row"></slot>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<!-- 首列多选框 -->
|
||||
<el-table-column v-if="showSelection" type="selection" width="30" align="center" fixed />
|
||||
<el-table-column label="序号" width="70" v-if="showSort" fixed align="center">
|
||||
<template #default="{ $index }">
|
||||
{{ (currentPage - 1) * pageSize + $index + 1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<template v-for="column in columns" :key="column.prop">
|
||||
<el-table-column
|
||||
:prop="column.prop"
|
||||
:label="column.label"
|
||||
:width="column.width"
|
||||
:align="column.align || 'center'"
|
||||
:fixed="column.fixed ?? false"
|
||||
:sortable="column.sortable"
|
||||
:header-class-name="column.headerClassName"
|
||||
>
|
||||
<!-- 支持插槽 -->
|
||||
<template v-if="column.slotName" #default="scope">
|
||||
<slot :name="column.slotName" :row="scope.row"></slot>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
|
||||
<div v-if="showPagination" class="pagination-container">
|
||||
<el-pagination
|
||||
v-model:current-page="computedCurrentPage"
|
||||
v-model:page-size="computedPageSize"
|
||||
:page-sizes="pageSizes"
|
||||
:small="small"
|
||||
:disabled="disabled"
|
||||
:background="background"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="total"
|
||||
@current-change="handleCurrentChange"
|
||||
@size-change="pageSizeChange"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, watch, computed, onMounted, onBeforeUnmount } from 'vue';
|
||||
|
||||
const props = defineProps({
|
||||
loading: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
// 表格数据
|
||||
tableData: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
// 列配置
|
||||
columns: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
tree: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
// 当前页码（由外部传入）
|
||||
currentPage: {
|
||||
type: Number,
|
||||
default: 1,
|
||||
},
|
||||
// 每页数量（由外部传入）
|
||||
pageSize: {
|
||||
type: Number,
|
||||
default: 10,
|
||||
},
|
||||
// 总条数
|
||||
total: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
// 是否显示分页
|
||||
showPagination: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
// 是否显示边框:border="showBorder"添加到组件会显示横竖边框，不添加只显示横边框
|
||||
showBorder: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
// 是否显示斑马纹
|
||||
showStripe: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
// 是否显示首列多选框
|
||||
showSelection: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
// 是否展示序号
|
||||
showSort: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
// 每页显示条数选项
|
||||
pageSizes: {
|
||||
type: Array,
|
||||
default: () => [10, 20, 30, 50],
|
||||
},
|
||||
// 是否使用小型分页样式
|
||||
small: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
// 是否禁用
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
// 是否为分页按钮添加背景色
|
||||
background: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
// 自定义表头类名函数
|
||||
headerCellClassName: {
|
||||
type: Function,
|
||||
default: () => 'custom-header',
|
||||
},
|
||||
// 自定义单元格类名函数
|
||||
cellClassName: {
|
||||
type: Function,
|
||||
default: () => 'custom-cell',
|
||||
},
|
||||
rowkey: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
});
|
||||
|
||||
const emit = defineEmits(['update:currentPage', 'update:pageSize', 'page-change', 'selection-change']);
|
||||
|
||||
// 每页数量（双向绑定）
|
||||
const computedPageSize = computed({
|
||||
get: () => props.pageSize,
|
||||
set: (val) => emit('update:pageSize', val),
|
||||
});
|
||||
// 当前页码（双向绑定）
|
||||
const computedCurrentPage = computed({
|
||||
get: () => props.currentPage,
|
||||
set: (val) => emit('update:currentPage', val),
|
||||
});
|
||||
|
||||
// 分页大小改变
|
||||
const pageSizeChange = (val) => {
|
||||
// console.log(`每页 ${val} 条`);
|
||||
// console.log(props.currentPage);
|
||||
emit('update:pageSize', val);
|
||||
emit('page-change', {
|
||||
page: props.currentPage,
|
||||
pageSize: val,
|
||||
});
|
||||
};
|
||||
|
||||
// 当前页改变
|
||||
const handleCurrentChange = (val) => {
|
||||
// console.log(`当前页改变 ${val} 页`);
|
||||
emit('page-change', {
|
||||
page: val,
|
||||
pageSize: props.pageSize,
|
||||
});
|
||||
};
|
||||
|
||||
// 多选框变化
|
||||
const handleSelectionChange = (selection) => {
|
||||
const selectedIds = selection.map((row) => (props.rowkey == '' ? row.id : row[props.rowkey]));
|
||||
emit('selection-change', selection, selectedIds);
|
||||
};
|
||||
|
||||
const tableRef = ref(null);
|
||||
const tableMaxHeight = ref(null); // 使用max-height而不是height
|
||||
|
||||
// 自动计算最大高度（预留分页器空间）
|
||||
const calculateMaxHeight = () => {
|
||||
const paginationHeight = 60; // 分页器固定高度
|
||||
const container = tableRef.value?.$el?.parentElement;
|
||||
if (container) {
|
||||
const containerHeight = container.clientHeight;
|
||||
tableMaxHeight.value = containerHeight - paginationHeight;
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
calculateMaxHeight();
|
||||
window.addEventListener('resize', calculateMaxHeight);
|
||||
|
||||
// 添加MutationObserver监听父容器尺寸变化
|
||||
const observer = new MutationObserver(calculateMaxHeight);
|
||||
if (tableRef.value?.$el?.parentElement) {
|
||||
observer.observe(tableRef.value.$el.parentElement, {
|
||||
attributes: true,
|
||||
attributeFilter: ['style', 'class'],
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
window.removeEventListener('resize', calculateMaxHeight);
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.custom-table-container {
|
||||
// position: relative;
|
||||
padding: 10px 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%; /* 关键：继承父容器高度 */
|
||||
overflow: hidden; /* 防止内容溢出 */
|
||||
|
||||
/* 表格弹性布局 */
|
||||
:deep(.el-table) {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
/* 表头固定 */
|
||||
.el-table__header-wrapper {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* 表体可滚动 */
|
||||
.el-table__body-wrapper {
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.demo-form-inline {
|
||||
text-align: left;
|
||||
padding-left: 20px;
|
||||
padding-top: 4px;
|
||||
}
|
||||
|
||||
.pagination-container {
|
||||
margin-top: 20px;
|
||||
padding: 0 30px 0 20px;
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
color: #999;
|
||||
font-weight: 400;
|
||||
}
|
||||
.custom-pagination-text {
|
||||
flex: 1;
|
||||
text-align: left;
|
||||
line-height: 32px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.custom-pagination-size {
|
||||
text-align: right;
|
||||
line-height: 32px;
|
||||
margin-left: 20px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
/* 去除表格边框 */
|
||||
// :deep(.el-table) {
|
||||
// --el-table-border-color: transparent;
|
||||
// }
|
||||
|
||||
/* 自定义鼠标悬停颜色 */
|
||||
// :deep(.el-table__body tr:hover > td) {
|
||||
// background-color: rgba(237 255 248) !important;
|
||||
// }
|
||||
|
||||
/* 自定义表头样式 */
|
||||
:deep(.custom-header) {
|
||||
color: #333;
|
||||
}
|
||||
/* 自定义表头样式 */
|
||||
:deep(.custom-cell) {
|
||||
color: #606266;
|
||||
}
|
||||
|
||||
:deep(.el-pagination) {
|
||||
/* 整体分页样式 */
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
|
||||
/* 每页条数选择器 */
|
||||
.el-pagination__sizes {
|
||||
.el-input__inner {
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
/* 跳页输入框 */
|
||||
.el-pagination__jump {
|
||||
font-weight: 400;
|
||||
// position: absolute;
|
||||
// right: 16px;
|
||||
// bottom: 12px;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -8,6 +8,7 @@ import 'element-plus/dist/index.css';
|
||||
import Avue from '@smallwei/avue';
|
||||
import '@smallwei/avue/lib/index.css';
|
||||
import './utils/permission';
|
||||
import './styles/custom.scss';
|
||||
import { registerDirective } from './directives';
|
||||
import { registerGlobalComponents } from './plugins/globalComponents';
|
||||
import { registerElIcons } from './plugins/icon';
|
||||
|
||||
319
sub-government-affairs-service/src/styles/custom.scss
Normal file
319
sub-government-affairs-service/src/styles/custom.scss
Normal file
@ -0,0 +1,319 @@
|
||||
.app-container {
|
||||
.container-custom {
|
||||
width: 100%;
|
||||
overflow: hidden; /* 防止全局滚动条 */
|
||||
border-radius: 10px;
|
||||
background: #fff;
|
||||
|
||||
.search-box {
|
||||
overflow: hidden;
|
||||
padding: 16px 8px 0 16px;
|
||||
background: #fff;
|
||||
.order-tab {
|
||||
width: 100%;
|
||||
.el-tabs__nav-wrap::after {
|
||||
background: transparent !important;
|
||||
}
|
||||
.el-tabs__active-bar {
|
||||
height: 3px !important;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.el-descriptions__label,
|
||||
.el-descriptions__content {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
.cell-item {
|
||||
display: inline-flex;
|
||||
}
|
||||
.el-descriptions__label {
|
||||
color: #999;
|
||||
}
|
||||
.el-descriptions__content {
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
}
|
||||
.search-bar {
|
||||
display: flex;
|
||||
flex-shrink: 0; /* 禁止收缩 */
|
||||
|
||||
.search-bar-left {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.search-bar-right {
|
||||
width: 100px;
|
||||
text-align: right;
|
||||
padding-right: 8px;
|
||||
}
|
||||
|
||||
.demo-form-inline {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.el-form--inline .el-form-item {
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
.demo-form-inline .el-input {
|
||||
--el-input-width: 160px;
|
||||
}
|
||||
|
||||
.demo-form-inline .el-select {
|
||||
--el-select-width: 160px;
|
||||
}
|
||||
|
||||
.demo-form-inline .el-date-picker {
|
||||
--el-select-width: 160px;
|
||||
}
|
||||
.el-form .el-form-item__label {
|
||||
font-weight: 400;
|
||||
}
|
||||
.custom-form-inline .el-input {
|
||||
width: 260px;
|
||||
}
|
||||
}
|
||||
.table-toolbar {
|
||||
text-align: left;
|
||||
padding-left: 20px;
|
||||
padding-top: 20px;
|
||||
background-color: #fff;
|
||||
}
|
||||
.table-cont {
|
||||
padding: 10px 20px;
|
||||
overflow: hidden;
|
||||
background-color: #fff;
|
||||
position: relative;
|
||||
.el-table__empty-text {
|
||||
width: 200px;
|
||||
}
|
||||
.el-button-custom{
|
||||
font-size: 14px !important;
|
||||
color: #25bf82;
|
||||
padding: 0;
|
||||
}
|
||||
.el-button-delete{
|
||||
font-size: 14px !important;
|
||||
color: #ff4d4f;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* 自定义弹窗样式 */
|
||||
.traceability-dialog {
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
border-radius: 16px !important;
|
||||
}
|
||||
|
||||
/* 主要内容区域 */
|
||||
.dialog-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background: white;
|
||||
border-radius: 8px;
|
||||
padding: 0 0 20px 0;
|
||||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
/* 产品信息 */
|
||||
.product-info {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20px;
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.product-name {
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
/* 二维码图片 */
|
||||
.qrcode-image {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
/* 下载区域 */
|
||||
.download-section {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 0 0 10px 0;
|
||||
color: #25bf82;
|
||||
cursor: pointer;
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
}
|
||||
|
||||
.download-icon {
|
||||
margin-left: 8px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
/* 遗传编码区域 */
|
||||
.code-section {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 10px 0;
|
||||
background: rgba(37, 191, 130, 0.1);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.genetic-code {
|
||||
font-family: monospace;
|
||||
font-size: 14px;
|
||||
color: #25bf82;
|
||||
display: inline-block;
|
||||
max-width: 250px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.copy-icon {
|
||||
margin-left: 10px;
|
||||
color: #409eff;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
/* 关闭按钮 */
|
||||
.close-button {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: -60px;
|
||||
color: white;
|
||||
font-size: 30px;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
}
|
||||
// 表格中文本的颜色
|
||||
.color-blue {
|
||||
color: #3685fe;
|
||||
}
|
||||
.color-black {
|
||||
color: #000000;
|
||||
}
|
||||
.color-gray {
|
||||
color: #5a5a5a;
|
||||
}
|
||||
.color-orange {
|
||||
color: #ffb345;
|
||||
}
|
||||
.color-green {
|
||||
color: #25bf82;
|
||||
}
|
||||
.color-red {
|
||||
color: #ff4348;
|
||||
}
|
||||
}
|
||||
.el-button {
|
||||
font-size: 12px !important;
|
||||
font-weight: 400;
|
||||
}
|
||||
// 页面添加的自定义容器，上下撑满
|
||||
.customer-control {
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
min-width: 1000px;
|
||||
}
|
||||
// 表格组件中的各插槽元素自定义样式
|
||||
.custom-tooltip-content {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 10px;
|
||||
padding: 3px 0;
|
||||
|
||||
}
|
||||
.el-icon-custom {
|
||||
vertical-align: middle;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
// color: #fff;
|
||||
}
|
||||
.table-cell-img-box {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
text-align: center;
|
||||
overflow: hidden; /* 隐藏超出部分 */
|
||||
display: flex; /* 使用 Flex 布局居中 */
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.table-cell-img {
|
||||
min-width: 100%; /* 至少撑满宽度 */
|
||||
min-height: 100%; /* 至少撑满高度 */
|
||||
object-fit: cover; /* 保持比例并覆盖容器 */
|
||||
}
|
||||
}
|
||||
|
||||
// 新增商品页面-开始
|
||||
.customer-box {
|
||||
height: 100%;
|
||||
border-radius: 16px;
|
||||
padding: 20px 16px;
|
||||
overflow-y: auto;
|
||||
background-color: #fff;
|
||||
.my-el-select {
|
||||
width: 200px;
|
||||
}
|
||||
.el-input-number .el-input__inner {
|
||||
text-align: left;
|
||||
}
|
||||
// 商品属性
|
||||
.attr-item {
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
.el-icon {
|
||||
vertical-align: middle;
|
||||
margin: 5px;
|
||||
}
|
||||
}
|
||||
.attr-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
flex-wrap: nowrap;
|
||||
gap: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.attr-input {
|
||||
width: 120px;
|
||||
}
|
||||
.attr-clomn {
|
||||
width: 160px;
|
||||
}
|
||||
.attr-clomn200 {
|
||||
width: 160px;
|
||||
}
|
||||
.attr-clomn220 {
|
||||
width: 220px;
|
||||
}
|
||||
.attr-box {
|
||||
padding: 16px 16px 6px 16px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #999;
|
||||
}
|
||||
}
|
||||
// 新增商品页面-结束
|
||||
|
||||
.flex-left-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
// 溢出隐藏
|
||||
.text-ellipsis {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
@ -1,617 +1,215 @@
|
||||
<template>
|
||||
<section class="custom-page">
|
||||
<h2>农药基本信息</h2>
|
||||
<TypeMenu v-if="materialTypes[1].length > 1" v-model:type="_type" :types="materialTypes['1']" />
|
||||
<br />
|
||||
<avue-crud
|
||||
ref="crud"
|
||||
v-model:page="pageData"
|
||||
v-model:search="searchCondition"
|
||||
:table-loading="_loading"
|
||||
:data="data"
|
||||
:option="option"
|
||||
:before-close="handleCloseDialog"
|
||||
@search-change="
|
||||
(form, done) => {
|
||||
getData(1);
|
||||
done();
|
||||
}
|
||||
"
|
||||
@search-reset="getData(1)"
|
||||
@refresh-change="getData"
|
||||
@current-change="getData"
|
||||
@size-change="getData(1)"
|
||||
@row-save="handleRowSave"
|
||||
@row-update="handleRowUpdate"
|
||||
>
|
||||
<template #menu="scope">
|
||||
<custom-table-operate :actions="actions" :data="scope" />
|
||||
<div class="app-container">
|
||||
<div class="container-custom">
|
||||
<div ref="searchBarRef" class="search-box">
|
||||
<div class="search-bar">
|
||||
<div class="search-bar-left">
|
||||
<el-form ref="searchForm" :inline="true" :model="formInline" class="demo-form-inline" :label-width="'auto'">
|
||||
<el-form-item label="姓名" prop="name">
|
||||
<el-input v-model="formInline.name" placeholder="请输入姓名" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="联系方式" prop="phone">
|
||||
<el-input v-model="formInline.phone" placeholder="请输入联系方式" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="">
|
||||
<el-button type="primary" icon="Search" @click="onSubmit">查询</el-button>
|
||||
<el-button icon="Refresh" @click="resetForm">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-toolbar">
|
||||
<el-button type="primary" icon="plus">新增</el-button>
|
||||
</div>
|
||||
<div class="table-cont">
|
||||
<tableComponent
|
||||
:table-data="tableData"
|
||||
:columns="columns"
|
||||
:show-selection="false"
|
||||
:loading="tableLoading"
|
||||
:total="tableTotal"
|
||||
:current-page="formInline.current"
|
||||
:page-size="formInline.size"
|
||||
:show-sort="true"
|
||||
@page-change="handlePaginationChange"
|
||||
>
|
||||
<!-- 自定义-操作 -->
|
||||
<template #action="slotProps">
|
||||
<el-button type="primary" @click="seeDetails(slotProps.row)">详情</el-button>
|
||||
<el-button type="primary" @click="handleEdit(slotProps.row)">编辑</el-button>
|
||||
<el-button @click="handleDelete(slotProps.row)">删除</el-button>
|
||||
</template>
|
||||
</tableComponent>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-dialog v-model="dialogFormVisible" :title="dialogTitle" width="500" :close-on-click-modal="false">
|
||||
<el-form ref="dialogRef" :model="dialogForm" :label-width="'80'" :rules="dialogFormRules">
|
||||
<el-form-item label="姓名" prop="name">
|
||||
<el-input v-model="dialogForm.name" autocomplete="off" placeholder="请输入姓名" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button type="primary" @click="onSaveCategory">保存</el-button>
|
||||
<el-button @click="cancelDialog">取消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
<template #photoUrl-form="{ type }">
|
||||
<Attrs v-model:attrs="attrs" :type="type == 'add' ? 'add' : 'view'" :limit="2" />
|
||||
</template>
|
||||
<template #checkInfo-form="{ row }">
|
||||
<section style="text-align: center; line-height: 58px">
|
||||
<el-button @click="handleCheckInfo('open')">查看报告</el-button>
|
||||
</section>
|
||||
</template>
|
||||
<template #detectionReport-form="{ type }">
|
||||
<Attrs v-model:attrs="reportAttrs" :type="type" :up-btn="reportAttrs.length < 1" :file-num="reportAttrs.length > 0 ? 1 : 3" :limit="2" />
|
||||
</template>
|
||||
<template #productSpecification-form="{ value, type }">
|
||||
<NumberSelect v-if="type == 'add'" v-model:value="productSpecification" :options="goodsUnitOptions" />
|
||||
<span v-if="type == 'view'">{{ value }}</span>
|
||||
</template>
|
||||
<template #dosage-form="{ value, type }">
|
||||
<NumberSelect v-if="type == 'add'" v-model:value="useDosage" :options="useDosageUnit" />
|
||||
<span v-if="type == 'view'">{{ value }}</span>
|
||||
</template>
|
||||
<template #checkBtn-form>
|
||||
<section style="text-align: center; line-height: 58px">
|
||||
<el-button @click="handleCheckInfo('close')">关闭</el-button>
|
||||
</section>
|
||||
</template>
|
||||
</avue-crud>
|
||||
</section>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, watch } from 'vue';
|
||||
import TypeMenu from '../../common/TypeMenu.vue';
|
||||
import { CRUD_OPTIONS, customRules } from '@/config';
|
||||
import { useBasicInfo } from '@/views/inputSuppliesManage/hooks/useBasicInfo';
|
||||
import Attrs from '@/views/inputSuppliesManage/common/Attrs.vue';
|
||||
import NumberSelect from '@/views/inputSuppliesManage/common/NumberSelect.vue';
|
||||
import { ref, reactive, computed, onMounted, onBeforeUnmount } from 'vue';
|
||||
import tableComponent from '@/components/tableComponent.vue';
|
||||
import { ElMessage } from 'element-plus';
|
||||
import inputSuppliesApi from '@/apis/inputSuppliesApi';
|
||||
import { ElMessage, ElMessageBox } from 'element-plus';
|
||||
import assistFn from '@/views/inputSuppliesManage/hooks/useAssistFn';
|
||||
const { deleteFn } = new assistFn();
|
||||
|
||||
const { defaultGet, loadFinish, materialTypes, materialTwoLevel, goodsUnitOptions, useDosageUnit, handleNumUnit, handleShowName, targetName } =
|
||||
useBasicInfo({
|
||||
moduleType: '1',
|
||||
});
|
||||
const { getPesticideList, addPesticide, pesticideReportSave, delPesticide } = inputSuppliesApi;
|
||||
|
||||
/* --------------- data --------------- */
|
||||
// #region
|
||||
const _type = ref('0');
|
||||
watch(
|
||||
() => _type.value,
|
||||
() => getData(1),
|
||||
{
|
||||
deep: true,
|
||||
}
|
||||
);
|
||||
const searchCondition = ref({
|
||||
keywords: '',
|
||||
});
|
||||
const crud = ref();
|
||||
const _loading = ref(true);
|
||||
const data = ref([]);
|
||||
const pageData = ref({
|
||||
total: 0,
|
||||
currentPage: 1,
|
||||
// 查询条件
|
||||
const formInline = reactive({
|
||||
name: '',
|
||||
phone: '',
|
||||
current: 1,
|
||||
size: 10,
|
||||
});
|
||||
const searchForm = ref(null);
|
||||
const onSubmit = () => {
|
||||
formInline.current = 1;
|
||||
loadData();
|
||||
};
|
||||
const resetForm = () => {
|
||||
searchForm.value.resetFields();
|
||||
};
|
||||
|
||||
const dicDatas = ref({
|
||||
_targetPests: {
|
||||
one: '1',
|
||||
two: '1',
|
||||
dic: [],
|
||||
},
|
||||
_mainComponent: {
|
||||
one: '1',
|
||||
two: '2',
|
||||
dic: [],
|
||||
},
|
||||
_produceDosage: {
|
||||
one: '1',
|
||||
two: '3',
|
||||
dic: [],
|
||||
},
|
||||
// 表格数据
|
||||
const tableData = ref([]);
|
||||
const selectedIds = ref([]);
|
||||
const btnStatus = computed(() => {
|
||||
return selectedIds.value.length <= 0;
|
||||
});
|
||||
const option = ref({
|
||||
...CRUD_OPTIONS,
|
||||
selection: false,
|
||||
labelWidth: 124,
|
||||
editBtn: false,
|
||||
delBtn: false,
|
||||
dialogWidth: '60%',
|
||||
updateBtnText: '上传报告',
|
||||
column: [
|
||||
{
|
||||
hide: true,
|
||||
label: '关键字',
|
||||
prop: 'keywords',
|
||||
search: true,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
searchPlaceholder: '输入肥料名称',
|
||||
viewDisplay: false,
|
||||
},
|
||||
// {
|
||||
// prop: 'id',
|
||||
// label: '农药编号',
|
||||
// addDisplay: false,
|
||||
// editDisplay: false,
|
||||
// },
|
||||
{
|
||||
prop: 'pesticideName',
|
||||
label: '名称',
|
||||
width: '120',
|
||||
editDisplay: false,
|
||||
rules: customRules({ msg: '请输入农药名称' }),
|
||||
},
|
||||
{
|
||||
hide: true,
|
||||
prop: 'productStandCode',
|
||||
label: '产品标准证号',
|
||||
width: '120',
|
||||
viewDisplay: false,
|
||||
editDisplay: false,
|
||||
rules: customRules({ msg: '请输入产品标准证号' }),
|
||||
},
|
||||
{
|
||||
hide: true,
|
||||
prop: 'photoUrl',
|
||||
label: '农药图片',
|
||||
span: 24,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
hide: true,
|
||||
prop: 'pesticideRegistCode',
|
||||
label: '农药登记证号',
|
||||
width: '120',
|
||||
viewDisplay: false,
|
||||
editDisplay: false,
|
||||
rules: customRules({ msg: '请输登记证号' }),
|
||||
},
|
||||
{
|
||||
prop: 'manufacturer',
|
||||
label: '生产厂家',
|
||||
width: '220',
|
||||
editDisplay: false,
|
||||
rules: customRules({ msg: '请输入生产厂家' }),
|
||||
},
|
||||
// {
|
||||
// prop: 'distributor',
|
||||
// width: '220',
|
||||
// label: '经销商',
|
||||
// editDisplay: false,
|
||||
// },
|
||||
{
|
||||
prop: 'productSpecification',
|
||||
width: '100',
|
||||
label: '产品规格',
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
prop: 'toxicityLevel',
|
||||
width: '140',
|
||||
label: '毒性',
|
||||
editDisplay: false,
|
||||
value: '无毒',
|
||||
},
|
||||
{
|
||||
prop: 'dosage',
|
||||
width: '140',
|
||||
label: '建议用量',
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
prop: 'expiryDate',
|
||||
label: '保质期',
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
prop: 'targetPests',
|
||||
width: '200',
|
||||
label: '防治对象',
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
prop: 'mainComponent',
|
||||
width: '200',
|
||||
label: '化学成分',
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
prop: 'produceDosage',
|
||||
width: '200',
|
||||
label: '加工剂型',
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
hide: true,
|
||||
prop: '_targetPests',
|
||||
label: '防治对象',
|
||||
type: 'cascader',
|
||||
multiple: true,
|
||||
dicData: [],
|
||||
value: [],
|
||||
span: 24,
|
||||
viewDisplay: false,
|
||||
editDisplay: false,
|
||||
rules: customRules({ msg: '请选择防治对象' }),
|
||||
expandTrigger: 'click',
|
||||
},
|
||||
{
|
||||
hide: true,
|
||||
prop: '_mainComponent',
|
||||
label: '化学成分',
|
||||
type: 'cascader',
|
||||
multiple: true,
|
||||
dicData: [],
|
||||
value: [],
|
||||
span: 24,
|
||||
viewDisplay: false,
|
||||
editDisplay: false,
|
||||
rules: customRules({ msg: '请选择主要成分' }),
|
||||
expandTrigger: 'click',
|
||||
},
|
||||
{
|
||||
hide: true,
|
||||
prop: '_produceDosage',
|
||||
label: '加工剂型',
|
||||
type: 'cascader',
|
||||
multiple: true,
|
||||
dicData: [],
|
||||
value: [],
|
||||
span: 24,
|
||||
viewDisplay: false,
|
||||
editDisplay: false,
|
||||
rules: customRules({ msg: '加工剂型' }),
|
||||
expandTrigger: 'click',
|
||||
},
|
||||
{
|
||||
hide: true,
|
||||
prop: 'usageMethod',
|
||||
label: '使用方法',
|
||||
type: 'textarea',
|
||||
span: 24,
|
||||
viewDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
hide: true,
|
||||
prop: 'precautions',
|
||||
label: '注意事项',
|
||||
type: 'textarea',
|
||||
span: 24,
|
||||
viewDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
labelWidth: 0,
|
||||
border: false,
|
||||
prop: 'checkInfo',
|
||||
span: 24,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
],
|
||||
group: [
|
||||
{
|
||||
label: '农药基本信息',
|
||||
prop: 'basic_info',
|
||||
addDisplay: false,
|
||||
viewDisplay: false,
|
||||
column: [
|
||||
{
|
||||
prop: 'pesticideName',
|
||||
label: '农药名称',
|
||||
editDisabled: true,
|
||||
span: 24,
|
||||
},
|
||||
{
|
||||
prop: 'manufacturer',
|
||||
label: '生产商',
|
||||
editDisabled: true,
|
||||
span: 24,
|
||||
},
|
||||
{
|
||||
prop: 'distributor',
|
||||
label: '经销商',
|
||||
editDisabled: true,
|
||||
span: 24,
|
||||
},
|
||||
{
|
||||
prop: 'photoUrl',
|
||||
label: '农药图片',
|
||||
editDisabled: true,
|
||||
span: 24,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '农药检测信息',
|
||||
prop: 'check_info',
|
||||
addDisplay: false,
|
||||
viewDisplay: false,
|
||||
column: [
|
||||
{
|
||||
prop: 'detectionTime',
|
||||
label: '检测时间',
|
||||
type: 'date',
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
rules: customRules({ msg: '请选择检测时间' }),
|
||||
},
|
||||
{
|
||||
prop: 'detectionResult',
|
||||
label: '检测结果',
|
||||
type: 'select',
|
||||
clearable: false,
|
||||
rules: customRules({ msg: '请选择检测结果' }),
|
||||
dicData: [
|
||||
{ value: '0', label: '合格' },
|
||||
{ value: '1', label: '不合格' },
|
||||
],
|
||||
value: '0',
|
||||
},
|
||||
{
|
||||
prop: 'detectionUnit',
|
||||
label: '检测单位',
|
||||
rules: customRules({ msg: '请输入检测单位' }),
|
||||
},
|
||||
{
|
||||
prop: 'detectionConclusion',
|
||||
label: '检测结论',
|
||||
rules: customRules({ msg: '请输入检测结论' }),
|
||||
},
|
||||
{
|
||||
prop: 'detectionReport',
|
||||
label: '质检报告',
|
||||
span: 24,
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
trigger: ['blur', 'change'],
|
||||
validator: (rule, value, callback) => {
|
||||
if (!reportAttrs.value.length) {
|
||||
callback(new Error('请上传检测报告'));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
labelWidth: 0,
|
||||
prop: 'checkBtn',
|
||||
span: 24,
|
||||
editDisplay: false,
|
||||
},
|
||||
],
|
||||
},
|
||||
const tableLoading = ref(false);
|
||||
const tableTotal = ref(0);
|
||||
let nowClickRow = ref({});
|
||||
const columns = ref([
|
||||
// { prop: "id", label: "ID" },
|
||||
{ prop: 'name', label: '类别名称' },
|
||||
{ prop: 'phone', label: '联系方式' },
|
||||
{ prop: 'landName', label: '用药地块' },
|
||||
{ prop: 'detectionTime', label: '检测时间' },
|
||||
{ prop: 'detectionResult', label: '检测结果' },
|
||||
{ prop: 'detectionUnit', label: '检测单位' },
|
||||
// { prop: 'status', label: '检测报告(是否上传)' },
|
||||
{ prop: 'action', label: '操作', slotName: 'action', width: 230, fixed: 'right' },
|
||||
]);
|
||||
const handlePaginationChange = ({ page, pageSize }) => {
|
||||
formInline.current = page;
|
||||
formInline.size = pageSize;
|
||||
// 这里可以调用API获取新数据
|
||||
loadData();
|
||||
};
|
||||
const loadData = async () => {
|
||||
tableLoading.value = true;
|
||||
try {
|
||||
let response = await getPesticideList(formInline);
|
||||
tableLoading.value = false;
|
||||
if (response.code == 200) {
|
||||
tableData.value = response.data.records;
|
||||
tableTotal.value = response.data.total;
|
||||
}
|
||||
} catch (error) {
|
||||
tableLoading.value = false;
|
||||
console.error(error);
|
||||
}
|
||||
};
|
||||
|
||||
// 查看详情
|
||||
const seeDetails = async (row) => {
|
||||
nowClickRow.value = row;
|
||||
console.log('要查看详情的行: ', row);
|
||||
};
|
||||
// 编辑操作
|
||||
const handleEdit = async (row) => {
|
||||
nowClickRow.value = row;
|
||||
dialogTitle.value = '编辑';
|
||||
dialogForm.id = row.id;
|
||||
dialogForm.name = row.name;
|
||||
dialogFormVisible.value = true;
|
||||
};
|
||||
// 删除操作
|
||||
const handleDelete = (row) => {
|
||||
deleteGoods(row.id);
|
||||
};
|
||||
const deleteGoods = async (ids) => {
|
||||
try {
|
||||
tableLoading.value = true;
|
||||
let res = await delPesticide({ id: ids });
|
||||
tableLoading.value = false;
|
||||
if (res.code == 200) {
|
||||
onSubmit();
|
||||
ElMessage.success('删除成功');
|
||||
} else {
|
||||
ElMessage.error(res.msg);
|
||||
}
|
||||
} catch (error) {
|
||||
tableLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
const dialogFormVisible = ref(false);
|
||||
const dialogRef = ref(null);
|
||||
const dialogTitle = ref('新增');
|
||||
const dialogForm = reactive({
|
||||
id: '',
|
||||
name: '',
|
||||
});
|
||||
const dialogFormRules = ref({
|
||||
name: [
|
||||
{ required: true, message: '请输入分类名称', trigger: 'blur' },
|
||||
{ min: 2, max: 10, message: '长度在 2 到 10 个字符', trigger: 'blur' },
|
||||
],
|
||||
});
|
||||
watch(
|
||||
() => loadFinish.value,
|
||||
() => {
|
||||
if (loadFinish.value) {
|
||||
for (let key in dicDatas.value) {
|
||||
option.value.column.forEach((item) => {
|
||||
if (item.prop === key) {
|
||||
let dic = materialTwoLevel?.[dicDatas.value[key].one]?.[dicDatas.value[key].two] ?? [];
|
||||
dicDatas.value[key].dic = dic;
|
||||
item.dicData = dic;
|
||||
const onSaveCategory = () => {
|
||||
dialogRef.value.validate(async (valid, fields) => {
|
||||
if (valid) {
|
||||
try {
|
||||
let param = { ...dialogForm };
|
||||
param.level = dialogForm.selectedNode.level ?? '';
|
||||
param.type = dialogForm.selectedNode.type ?? '';
|
||||
let response;
|
||||
if (dialogTitle.value == '新增') {
|
||||
response = await addPesticide(param);
|
||||
} else {
|
||||
response = await pesticideReportSave(param);
|
||||
}
|
||||
if (response.code == 200) {
|
||||
cancelDialog();
|
||||
onSubmit();
|
||||
if (dialogTitle.value == '新增') {
|
||||
ElMessage.success('新增成功!');
|
||||
} else {
|
||||
ElMessage.success('编辑成功!');
|
||||
}
|
||||
});
|
||||
} else {
|
||||
ElMessage.error(response.msg);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
const attrs = ref([]);
|
||||
const reportAttrs = ref([]);
|
||||
const productSpecification = ref({
|
||||
num: 1,
|
||||
type: '1',
|
||||
});
|
||||
const useDosage = ref({
|
||||
num: 1,
|
||||
type: '1',
|
||||
});
|
||||
const actions = ref([
|
||||
{
|
||||
name: '上传报告',
|
||||
icon: 'view',
|
||||
event: ({ row }) => handleEdit(row),
|
||||
},
|
||||
{
|
||||
name: '详情',
|
||||
icon: 'view',
|
||||
event: ({ row }) => handleInfo(row),
|
||||
},
|
||||
{
|
||||
type: 'danger',
|
||||
name: '删除',
|
||||
icon: 'delete',
|
||||
event: ({ row }) => deleteFn(row.id, delPesticide, getData),
|
||||
},
|
||||
]);
|
||||
// #endregion
|
||||
|
||||
/* --------------- methods --------------- */
|
||||
// #region
|
||||
|
||||
defaultGet(getData);
|
||||
async function getData(reset) {
|
||||
_loading.value = true;
|
||||
reset == 1 && (pageData.value.currentPage = 1);
|
||||
let params = {
|
||||
current: pageData.value.currentPage,
|
||||
size: pageData.value.size,
|
||||
pesticideName: searchCondition.value.keywords,
|
||||
};
|
||||
_type.value != '0' && (params.classifyId = _type.value);
|
||||
let res = await getPesticideList(params);
|
||||
console.log('res --- ', res);
|
||||
_loading.value = false;
|
||||
if (res && res.code === 200) {
|
||||
data.value = res.data.records;
|
||||
data.value.forEach((v) => {
|
||||
v.productSpecification = handleNumUnit({ num1: v.productSpecification, unit1: v.productUnit, type: 1 });
|
||||
v.dosage = handleNumUnit({ unit1: v.productUnit, num2: v.suggestDosage, unit2: v.suggestUnit, type: -1 });
|
||||
v.targetPests = handleShowName(v.targetPests);
|
||||
v.mainComponent = handleShowName(v.mainComponent);
|
||||
v.produceDosage = handleShowName(v.produceDosage);
|
||||
});
|
||||
pageData.value.total = res.data.total;
|
||||
}
|
||||
}
|
||||
function handleCloseDialog(done) {
|
||||
delete option.value.column[1].span;
|
||||
resetOtherInfo();
|
||||
handleCheckInfoChange();
|
||||
done();
|
||||
}
|
||||
|
||||
async function handleRowSave(form, done, loading) {
|
||||
let data = {
|
||||
pesticideName: form.pesticideName,
|
||||
productStandCode: form.productStandCode,
|
||||
pesticideRegistCode: form.pesticideRegistCode,
|
||||
manufacturer: form.manufacturer,
|
||||
distributor: form.distributor,
|
||||
toxicityLevel: form.toxicityLevel,
|
||||
usageMethod: form.usageMethod,
|
||||
precautions: form.precautions,
|
||||
expiryDate: form.expiryDate,
|
||||
productSpecification: productSpecification.value.num,
|
||||
productUnit: productSpecification.value.type,
|
||||
suggestDosage: useDosage.value.num,
|
||||
suggestUnit: useDosage.value.type,
|
||||
};
|
||||
if (attrs.value.length) {
|
||||
data.photoUrl = attrs.value.map((v) => v.url).join();
|
||||
}
|
||||
if (form._targetPests.length) {
|
||||
let names = [];
|
||||
form._targetPests.forEach((item) => {
|
||||
names.push(targetName(dicDatas.value._targetPests.dic, item, ''));
|
||||
});
|
||||
data.targetPests = JSON.stringify(form._targetPests) + '|' + JSON.stringify(names);
|
||||
}
|
||||
if (form._mainComponent.length) {
|
||||
let names = [];
|
||||
form._mainComponent.forEach((item) => {
|
||||
names.push(targetName(dicDatas.value._mainComponent.dic, item, ''));
|
||||
});
|
||||
data.mainComponent = JSON.stringify(form._mainComponent) + '|' + JSON.stringify(names);
|
||||
}
|
||||
if (form._produceDosage.length) {
|
||||
let names = [];
|
||||
form._produceDosage.forEach((item) => {
|
||||
names.push(targetName(dicDatas.value._produceDosage.dic, item, ''));
|
||||
});
|
||||
data.produceDosage = JSON.stringify(form._produceDosage) + '|' + JSON.stringify(names);
|
||||
}
|
||||
let res = await addPesticide(data);
|
||||
loading();
|
||||
if (res.code == 200) {
|
||||
ElMessage.success('保存成功');
|
||||
getData();
|
||||
resetOtherInfo();
|
||||
done();
|
||||
}
|
||||
}
|
||||
function resetOtherInfo() {
|
||||
let obj = { num: 1, type: '1' };
|
||||
attrs.value = [];
|
||||
reportAttrs.value = [];
|
||||
productSpecification.value = obj;
|
||||
useDosage.value = obj;
|
||||
}
|
||||
|
||||
function handleEdit(row) {
|
||||
handleAttrs(row);
|
||||
option.value.group[1].column[0].value = row.detectionTime;
|
||||
option.value.group[1].column[1].value = row.detectionResult;
|
||||
option.value.group[1].column[2].value = row.detectionUnit;
|
||||
option.value.group[1].column[3].value = row.detectionConclusion;
|
||||
handleCheckInfoChange('open');
|
||||
crud.value.rowEdit(row);
|
||||
}
|
||||
function handleInfo(row) {
|
||||
handleAttrs(row);
|
||||
option.value.column[1].span = 24;
|
||||
crud.value.rowView(row);
|
||||
}
|
||||
/* 处理展示附件 */
|
||||
function handleAttrs(row = {}) {
|
||||
if (!row) {
|
||||
return;
|
||||
}
|
||||
if (row.photoUrl) {
|
||||
attrs.value = row.photoUrl.split(',').map((v, i) => {
|
||||
return {
|
||||
url: v,
|
||||
uid: `photo_${i}_${Date.now()}`,
|
||||
};
|
||||
});
|
||||
}
|
||||
if (row.detectionReport) {
|
||||
reportAttrs.value = row.detectionReport.split(',').map((v, i) => {
|
||||
return {
|
||||
url: v,
|
||||
uid: `report_${i}_${Date.now()}`,
|
||||
};
|
||||
});
|
||||
}
|
||||
}
|
||||
function handleCheckInfo(type) {
|
||||
handleCheckInfoChange(type == 'open');
|
||||
}
|
||||
/* bol && 查看检测报告关闭其他信息 !bol && 关闭检测报告打开其他信息 */
|
||||
function handleCheckInfoChange(bol = false) {
|
||||
option.value.group.forEach((v) => {
|
||||
v.viewDisplay = bol;
|
||||
});
|
||||
if (bol) {
|
||||
option.value.column.forEach((v) => {
|
||||
v.viewDisplay = false;
|
||||
});
|
||||
} else {
|
||||
option.value.column.forEach((v) => {
|
||||
if (!v.hide || v.prop == 'photoUrl') {
|
||||
v.viewDisplay = true;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
async function handleRowUpdate(form, index, done, loading) {
|
||||
console.log('update from -- ', form);
|
||||
let data = {
|
||||
id: form.id,
|
||||
detectionTime: form.detectionTime,
|
||||
detectionResult: form.detectionResult,
|
||||
detectionUnit: form.detectionUnit,
|
||||
detectionConclusion: form.detectionConclusion,
|
||||
detectionReport: reportAttrs.value.map((v) => v.url).join(),
|
||||
};
|
||||
let res = await pesticideReportSave(data);
|
||||
loading();
|
||||
if (res.code == 200) {
|
||||
ElMessage.success('检测报告保存成功');
|
||||
getData();
|
||||
done();
|
||||
}
|
||||
}
|
||||
// #endregion
|
||||
};
|
||||
const cancelDialog = () => {
|
||||
Object.assign(dialogForm, {
|
||||
// 保持响应性，手动清空字段
|
||||
id: '',
|
||||
name: '',
|
||||
});
|
||||
dialogFormVisible.value = false;
|
||||
};
|
||||
onMounted(() => {
|
||||
onSubmit();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
h2 {
|
||||
font-size: 24px;
|
||||
font-weight: bold;
|
||||
font-family: '黑体';
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped></style>
|
||||
|
||||
@ -0,0 +1,624 @@
|
||||
<template>
|
||||
<section class="custom-page">
|
||||
<h2>农药使用监管</h2>
|
||||
<!-- <TypeMenu v-if="materialTypes[1].length > 1" v-model:type="_type" :types="materialTypes['1']" /> -->
|
||||
<br />
|
||||
<avue-crud
|
||||
ref="crud"
|
||||
v-model:page="pageData"
|
||||
v-model:search="searchCondition"
|
||||
:table-loading="_loading"
|
||||
:data="data"
|
||||
:option="option"
|
||||
:before-close="handleCloseDialog"
|
||||
@search-change="
|
||||
(form, done) => {
|
||||
getData(1);
|
||||
done();
|
||||
}
|
||||
"
|
||||
@search-reset="getData(1)"
|
||||
@refresh-change="getData"
|
||||
@current-change="getData"
|
||||
@size-change="getData(1)"
|
||||
@row-save="handleRowSave"
|
||||
@row-update="handleRowUpdate"
|
||||
>
|
||||
<template #menu="scope">
|
||||
<custom-table-operate :actions="actions" :data="scope" />
|
||||
</template>
|
||||
<template #photoUrl-form="{ type }">
|
||||
<Attrs v-model:attrs="attrs" :type="type == 'add' ? 'add' : 'view'" :limit="2" />
|
||||
</template>
|
||||
<template #checkInfo-form="{ row }">
|
||||
<section style="text-align: center; line-height: 58px">
|
||||
<el-button @click="handleCheckInfo('open')">查看报告</el-button>
|
||||
</section>
|
||||
</template>
|
||||
<template #detectionReport-form="{ type }">
|
||||
<Attrs v-model:attrs="reportAttrs" :type="type" :up-btn="reportAttrs.length < 1" :file-num="reportAttrs.length > 0 ? 1 : 3" :limit="2" />
|
||||
</template>
|
||||
<template #productSpecification-form="{ value, type }">
|
||||
<NumberSelect v-if="type == 'add'" v-model:value="productSpecification" :options="goodsUnitOptions" />
|
||||
<span v-if="type == 'view'">{{ value }}</span>
|
||||
</template>
|
||||
<template #dosage-form="{ value, type }">
|
||||
<NumberSelect v-if="type == 'add'" v-model:value="useDosage" :options="useDosageUnit" />
|
||||
<span v-if="type == 'view'">{{ value }}</span>
|
||||
</template>
|
||||
<template #checkBtn-form>
|
||||
<section style="text-align: center; line-height: 58px">
|
||||
<el-button @click="handleCheckInfo('close')">关闭</el-button>
|
||||
</section>
|
||||
</template>
|
||||
</avue-crud>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, watch } from 'vue';
|
||||
import TypeMenu from '../../common/TypeMenu.vue';
|
||||
import { CRUD_OPTIONS, customRules } from '@/config';
|
||||
import { useBasicInfo } from '@/views/inputSuppliesManage/hooks/useBasicInfo';
|
||||
import Attrs from '@/views/inputSuppliesManage/common/Attrs.vue';
|
||||
import NumberSelect from '@/views/inputSuppliesManage/common/NumberSelect.vue';
|
||||
import inputSuppliesApi from '@/apis/inputSuppliesApi';
|
||||
import { ElMessage, ElMessageBox } from 'element-plus';
|
||||
import assistFn from '@/views/inputSuppliesManage/hooks/useAssistFn';
|
||||
const { deleteFn } = new assistFn();
|
||||
|
||||
const { defaultGet, loadFinish, materialTypes, materialTwoLevel, goodsUnitOptions, useDosageUnit, handleNumUnit, handleShowName, targetName } =
|
||||
useBasicInfo({
|
||||
moduleType: '1',
|
||||
});
|
||||
const { getPesticideList, addPesticide, pesticideReportSave, delPesticide } = inputSuppliesApi;
|
||||
|
||||
/* --------------- data --------------- */
|
||||
// #region
|
||||
const _type = ref('0');
|
||||
watch(
|
||||
() => _type.value,
|
||||
() => getData(1),
|
||||
{
|
||||
deep: true,
|
||||
}
|
||||
);
|
||||
const searchCondition = ref({
|
||||
name: '',
|
||||
phone: '',
|
||||
});
|
||||
const crud = ref();
|
||||
const _loading = ref(true);
|
||||
const data = ref([]);
|
||||
const pageData = ref({
|
||||
total: 0,
|
||||
currentPage: 1,
|
||||
size: 10,
|
||||
});
|
||||
|
||||
const dicDatas = ref({
|
||||
_targetPests: {
|
||||
one: '1',
|
||||
two: '1',
|
||||
dic: [],
|
||||
},
|
||||
_mainComponent: {
|
||||
one: '1',
|
||||
two: '2',
|
||||
dic: [],
|
||||
},
|
||||
_produceDosage: {
|
||||
one: '1',
|
||||
two: '3',
|
||||
dic: [],
|
||||
},
|
||||
});
|
||||
const option = ref({
|
||||
...CRUD_OPTIONS,
|
||||
selection: false,
|
||||
labelWidth: 124,
|
||||
editBtn: false,
|
||||
delBtn: false,
|
||||
dialogWidth: '60%',
|
||||
updateBtnText: '上传报告',
|
||||
column: [
|
||||
// 查询条件
|
||||
{
|
||||
hide: true,
|
||||
label: '姓名',
|
||||
prop: 'name',
|
||||
search: true,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
searchPlaceholder: '请输入姓名',
|
||||
viewDisplay: false,
|
||||
},
|
||||
{
|
||||
hide: true,
|
||||
label: '手机号',
|
||||
prop: 'phone',
|
||||
search: true,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
searchPlaceholder: '请输入手机号',
|
||||
viewDisplay: false,
|
||||
},
|
||||
// 弹窗字段
|
||||
{
|
||||
prop: 'name',
|
||||
label: '姓名',
|
||||
width: '120',
|
||||
editDisplay: false,
|
||||
rules: customRules({ msg: '请输入姓名' }),
|
||||
},
|
||||
{
|
||||
prop: 'phone',
|
||||
label: '联系方式',
|
||||
width: '220',
|
||||
editDisplay: false,
|
||||
rules: customRules({ msg: '请输入联系方式' }),
|
||||
},
|
||||
{
|
||||
prop: 'landName',
|
||||
width: '200',
|
||||
label: '用药地块',
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
hide: true,
|
||||
prop: 'photoUrl',
|
||||
label: '检测报告',
|
||||
span: 24,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
hide: true,
|
||||
prop: 'pesticideRegistCode',
|
||||
label: '农药登记证号',
|
||||
width: '120',
|
||||
viewDisplay: false,
|
||||
editDisplay: false,
|
||||
rules: customRules({ msg: '请输登记证号' }),
|
||||
},
|
||||
{
|
||||
prop: 'manufacturer',
|
||||
label: '生产厂家',
|
||||
width: '220',
|
||||
editDisplay: false,
|
||||
rules: customRules({ msg: '请输入生产厂家' }),
|
||||
},
|
||||
{
|
||||
prop: 'productSpecification',
|
||||
width: '100',
|
||||
label: '产品规格',
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
prop: 'toxicityLevel',
|
||||
width: '140',
|
||||
label: '毒性',
|
||||
editDisplay: false,
|
||||
value: '无毒',
|
||||
},
|
||||
{
|
||||
prop: 'dosage',
|
||||
width: '140',
|
||||
label: '建议用量',
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
prop: 'expiryDate',
|
||||
label: '保质期',
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
prop: 'targetPests',
|
||||
width: '200',
|
||||
label: '防治对象',
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
prop: 'mainComponent',
|
||||
width: '200',
|
||||
label: '化学成分',
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
prop: 'produceDosage',
|
||||
width: '200',
|
||||
label: '加工剂型',
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
hide: true,
|
||||
prop: '_targetPests',
|
||||
label: '防治对象',
|
||||
type: 'cascader',
|
||||
multiple: true,
|
||||
dicData: [],
|
||||
value: [],
|
||||
span: 24,
|
||||
viewDisplay: false,
|
||||
editDisplay: false,
|
||||
rules: customRules({ msg: '请选择防治对象' }),
|
||||
expandTrigger: 'click',
|
||||
},
|
||||
{
|
||||
hide: true,
|
||||
prop: '_mainComponent',
|
||||
label: '化学成分',
|
||||
type: 'cascader',
|
||||
multiple: true,
|
||||
dicData: [],
|
||||
value: [],
|
||||
span: 24,
|
||||
viewDisplay: false,
|
||||
editDisplay: false,
|
||||
rules: customRules({ msg: '请选择主要成分' }),
|
||||
expandTrigger: 'click',
|
||||
},
|
||||
{
|
||||
hide: true,
|
||||
prop: '_produceDosage',
|
||||
label: '加工剂型',
|
||||
type: 'cascader',
|
||||
multiple: true,
|
||||
dicData: [],
|
||||
value: [],
|
||||
span: 24,
|
||||
viewDisplay: false,
|
||||
editDisplay: false,
|
||||
rules: customRules({ msg: '加工剂型' }),
|
||||
expandTrigger: 'click',
|
||||
},
|
||||
{
|
||||
hide: true,
|
||||
prop: 'usageMethod',
|
||||
label: '使用方法',
|
||||
type: 'textarea',
|
||||
span: 24,
|
||||
viewDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
hide: true,
|
||||
prop: 'precautions',
|
||||
label: '注意事项',
|
||||
type: 'textarea',
|
||||
span: 24,
|
||||
viewDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
{
|
||||
labelWidth: 0,
|
||||
border: false,
|
||||
prop: 'checkInfo',
|
||||
span: 24,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
},
|
||||
],
|
||||
group: [
|
||||
{
|
||||
label: '农药基本信息',
|
||||
prop: 'basic_info',
|
||||
addDisplay: false,
|
||||
viewDisplay: false,
|
||||
column: [
|
||||
{
|
||||
prop: 'pesticideName',
|
||||
label: '农药名称',
|
||||
editDisabled: true,
|
||||
span: 24,
|
||||
},
|
||||
{
|
||||
prop: 'manufacturer',
|
||||
label: '生产商',
|
||||
editDisabled: true,
|
||||
span: 24,
|
||||
},
|
||||
{
|
||||
prop: 'distributor',
|
||||
label: '经销商',
|
||||
editDisabled: true,
|
||||
span: 24,
|
||||
},
|
||||
{
|
||||
prop: 'photoUrl',
|
||||
label: '农药图片',
|
||||
editDisabled: true,
|
||||
span: 24,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '农药检测信息',
|
||||
prop: 'check_info',
|
||||
addDisplay: false,
|
||||
viewDisplay: false,
|
||||
column: [
|
||||
{
|
||||
prop: 'detectionTime',
|
||||
label: '检测时间',
|
||||
type: 'date',
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
rules: customRules({ msg: '请选择检测时间' }),
|
||||
},
|
||||
{
|
||||
prop: 'detectionResult',
|
||||
label: '检测结果',
|
||||
type: 'select',
|
||||
clearable: false,
|
||||
rules: customRules({ msg: '请选择检测结果' }),
|
||||
dicData: [
|
||||
{ value: '0', label: '合格' },
|
||||
{ value: '1', label: '不合格' },
|
||||
],
|
||||
value: '0',
|
||||
},
|
||||
{
|
||||
prop: 'detectionUnit',
|
||||
label: '检测单位',
|
||||
rules: customRules({ msg: '请输入检测单位' }),
|
||||
},
|
||||
{
|
||||
prop: 'detectionConclusion',
|
||||
label: '检测结论',
|
||||
rules: customRules({ msg: '请输入检测结论' }),
|
||||
},
|
||||
{
|
||||
prop: 'detectionReport',
|
||||
label: '质检报告',
|
||||
span: 24,
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
trigger: ['blur', 'change'],
|
||||
validator: (rule, value, callback) => {
|
||||
if (!reportAttrs.value.length) {
|
||||
callback(new Error('请上传检测报告'));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
labelWidth: 0,
|
||||
prop: 'checkBtn',
|
||||
span: 24,
|
||||
editDisplay: false,
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
});
|
||||
watch(
|
||||
() => loadFinish.value,
|
||||
() => {
|
||||
if (loadFinish.value) {
|
||||
for (let key in dicDatas.value) {
|
||||
option.value.column.forEach((item) => {
|
||||
if (item.prop === key) {
|
||||
let dic = materialTwoLevel?.[dicDatas.value[key].one]?.[dicDatas.value[key].two] ?? [];
|
||||
dicDatas.value[key].dic = dic;
|
||||
item.dicData = dic;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
const attrs = ref([]);
|
||||
const reportAttrs = ref([]);
|
||||
const productSpecification = ref({
|
||||
num: 1,
|
||||
type: '1',
|
||||
});
|
||||
const useDosage = ref({
|
||||
num: 1,
|
||||
type: '1',
|
||||
});
|
||||
const actions = ref([
|
||||
{
|
||||
name: '编辑',
|
||||
icon: 'view',
|
||||
event: ({ row }) => handleEdit(row),
|
||||
},
|
||||
{
|
||||
name: '详情',
|
||||
icon: 'view',
|
||||
event: ({ row }) => handleInfo(row),
|
||||
},
|
||||
{
|
||||
type: 'danger',
|
||||
name: '删除',
|
||||
icon: 'delete',
|
||||
event: ({ row }) => deleteFn(row.id, delPesticide, getData),
|
||||
},
|
||||
]);
|
||||
// #endregion
|
||||
|
||||
/* --------------- methods --------------- */
|
||||
// #region
|
||||
|
||||
defaultGet(getData);
|
||||
async function getData(reset) {
|
||||
_loading.value = true;
|
||||
reset == 1 && (pageData.value.currentPage = 1);
|
||||
let params = {
|
||||
current: pageData.value.currentPage,
|
||||
size: pageData.value.size,
|
||||
name: searchCondition.value.name,
|
||||
phone: searchCondition.value.phone,
|
||||
};
|
||||
_type.value != '0' && (params.classifyId = _type.value);
|
||||
let res = await getPesticideList(params);
|
||||
console.log('res --- ', res);
|
||||
_loading.value = false;
|
||||
if (res && res.code === 200) {
|
||||
data.value = res.data.records;
|
||||
// data.value.forEach((v) => {
|
||||
// v.productSpecification = handleNumUnit({ num1: v.productSpecification, unit1: v.productUnit, type: 1 });
|
||||
// v.dosage = handleNumUnit({ unit1: v.productUnit, num2: v.suggestDosage, unit2: v.suggestUnit, type: -1 });
|
||||
// v.targetPests = handleShowName(v.targetPests);
|
||||
// v.mainComponent = handleShowName(v.mainComponent);
|
||||
// v.produceDosage = handleShowName(v.produceDosage);
|
||||
// });
|
||||
pageData.value.total = res.data.total;
|
||||
}
|
||||
}
|
||||
function handleCloseDialog(done) {
|
||||
delete option.value.column[1].span;
|
||||
resetOtherInfo();
|
||||
handleCheckInfoChange();
|
||||
done();
|
||||
}
|
||||
|
||||
async function handleRowSave(form, done, loading) {
|
||||
let data = {
|
||||
pesticideName: form.pesticideName,
|
||||
productStandCode: form.productStandCode,
|
||||
pesticideRegistCode: form.pesticideRegistCode,
|
||||
manufacturer: form.manufacturer,
|
||||
distributor: form.distributor,
|
||||
toxicityLevel: form.toxicityLevel,
|
||||
usageMethod: form.usageMethod,
|
||||
precautions: form.precautions,
|
||||
expiryDate: form.expiryDate,
|
||||
productSpecification: productSpecification.value.num,
|
||||
productUnit: productSpecification.value.type,
|
||||
suggestDosage: useDosage.value.num,
|
||||
suggestUnit: useDosage.value.type,
|
||||
};
|
||||
if (attrs.value.length) {
|
||||
data.photoUrl = attrs.value.map((v) => v.url).join();
|
||||
}
|
||||
if (form._targetPests.length) {
|
||||
let names = [];
|
||||
form._targetPests.forEach((item) => {
|
||||
names.push(targetName(dicDatas.value._targetPests.dic, item, ''));
|
||||
});
|
||||
data.targetPests = JSON.stringify(form._targetPests) + '|' + JSON.stringify(names);
|
||||
}
|
||||
if (form._mainComponent.length) {
|
||||
let names = [];
|
||||
form._mainComponent.forEach((item) => {
|
||||
names.push(targetName(dicDatas.value._mainComponent.dic, item, ''));
|
||||
});
|
||||
data.mainComponent = JSON.stringify(form._mainComponent) + '|' + JSON.stringify(names);
|
||||
}
|
||||
if (form._produceDosage.length) {
|
||||
let names = [];
|
||||
form._produceDosage.forEach((item) => {
|
||||
names.push(targetName(dicDatas.value._produceDosage.dic, item, ''));
|
||||
});
|
||||
data.produceDosage = JSON.stringify(form._produceDosage) + '|' + JSON.stringify(names);
|
||||
}
|
||||
let res = await addPesticide(data);
|
||||
loading();
|
||||
if (res.code == 200) {
|
||||
ElMessage.success('保存成功');
|
||||
getData();
|
||||
resetOtherInfo();
|
||||
done();
|
||||
}
|
||||
}
|
||||
function resetOtherInfo() {
|
||||
let obj = { num: 1, type: '1' };
|
||||
attrs.value = [];
|
||||
reportAttrs.value = [];
|
||||
productSpecification.value = obj;
|
||||
useDosage.value = obj;
|
||||
}
|
||||
|
||||
function handleEdit(row) {
|
||||
handleAttrs(row);
|
||||
option.value.group[1].column[0].value = row.detectionTime;
|
||||
option.value.group[1].column[1].value = row.detectionResult;
|
||||
option.value.group[1].column[2].value = row.detectionUnit;
|
||||
option.value.group[1].column[3].value = row.detectionConclusion;
|
||||
handleCheckInfoChange('open');
|
||||
crud.value.rowEdit(row);
|
||||
}
|
||||
function handleInfo(row) {
|
||||
handleAttrs(row);
|
||||
option.value.column[1].span = 24;
|
||||
crud.value.rowView(row);
|
||||
}
|
||||
/* 处理展示附件 */
|
||||
function handleAttrs(row = {}) {
|
||||
if (!row) {
|
||||
return;
|
||||
}
|
||||
if (row.photoUrl) {
|
||||
attrs.value = row.photoUrl.split(',').map((v, i) => {
|
||||
return {
|
||||
url: v,
|
||||
uid: `photo_${i}_${Date.now()}`,
|
||||
};
|
||||
});
|
||||
}
|
||||
if (row.detectionReport) {
|
||||
reportAttrs.value = row.detectionReport.split(',').map((v, i) => {
|
||||
return {
|
||||
url: v,
|
||||
uid: `report_${i}_${Date.now()}`,
|
||||
};
|
||||
});
|
||||
}
|
||||
}
|
||||
function handleCheckInfo(type) {
|
||||
handleCheckInfoChange(type == 'open');
|
||||
}
|
||||
/* bol && 查看检测报告关闭其他信息 !bol && 关闭检测报告打开其他信息 */
|
||||
function handleCheckInfoChange(bol = false) {
|
||||
option.value.group.forEach((v) => {
|
||||
v.viewDisplay = bol;
|
||||
});
|
||||
if (bol) {
|
||||
option.value.column.forEach((v) => {
|
||||
v.viewDisplay = false;
|
||||
});
|
||||
} else {
|
||||
option.value.column.forEach((v) => {
|
||||
if (!v.hide || v.prop == 'photoUrl') {
|
||||
v.viewDisplay = true;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
async function handleRowUpdate(form, index, done, loading) {
|
||||
console.log('update from -- ', form);
|
||||
let data = {
|
||||
id: form.id,
|
||||
detectionTime: form.detectionTime,
|
||||
detectionResult: form.detectionResult,
|
||||
detectionUnit: form.detectionUnit,
|
||||
detectionConclusion: form.detectionConclusion,
|
||||
detectionReport: reportAttrs.value.map((v) => v.url).join(),
|
||||
};
|
||||
let res = await pesticideReportSave(data);
|
||||
loading();
|
||||
if (res.code == 200) {
|
||||
ElMessage.success('检测报告保存成功');
|
||||
getData();
|
||||
done();
|
||||
}
|
||||
}
|
||||
// #endregion
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
h2 {
|
||||
font-size: 24px;
|
||||
font-weight: bold;
|
||||
font-family: '黑体';
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user