From 01d5d762121c6fd6bf76108755b6ec715da16a31 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期六, 29 三月 2025 13:18:24 +0800
Subject: [PATCH] 添加-检验项偏差页面
---
src/views/business/materialOrder/customsInspection.vue | 3
src/views/statisticalCharts/inspectionItemWarning/index.vue | 277 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
src/api/statisticalCharts/dataAnalysis.js | 16 +++
3 files changed, 294 insertions(+), 2 deletions(-)
diff --git a/src/api/statisticalCharts/dataAnalysis.js b/src/api/statisticalCharts/dataAnalysis.js
index 0775c06..1ac9276 100644
--- a/src/api/statisticalCharts/dataAnalysis.js
+++ b/src/api/statisticalCharts/dataAnalysis.js
@@ -71,3 +71,19 @@
data: query,
});
}
+//鏌ヨ棰勮鍒楄〃
+export function selectDeviationWarningPage(query) {
+ return request({
+ url: "/insProductDeviationWarning/selectDeviationWarningPage",
+ method: "get",
+ params: query,
+ });
+}
+//鏌ヨ棰勮鍒楄〃
+export function selectDeviationWarning(query) {
+ return request({
+ url: "/insProductDeviationWarning/selectDeviationWarning",
+ method: "get",
+ params: query,
+ });
+}
diff --git a/src/views/business/materialOrder/customsInspection.vue b/src/views/business/materialOrder/customsInspection.vue
index 3a45a3b..c95345c 100644
--- a/src/views/business/materialOrder/customsInspection.vue
+++ b/src/views/business/materialOrder/customsInspection.vue
@@ -356,10 +356,9 @@
</span>
</el-dialog>
<el-dialog :close-on-click-modal="false" :close-on-press-escape="false"
- :header-cell-style="{ background: '#f8f8f9', color: '#515a6e' }" border
:show-close="false" :visible.sync="bsm3Dia"
title="鍖洪棿鍊煎～鍐�" width="800px">
- <el-table :data="editTable" height="80vh" style="width: 100%">
+ <el-table :data="editTable" height="80vh" style="width: 100%" :header-cell-style="{ background: '#f8f8f9', color: '#515a6e' }" border>
<!-- inspectionItemList -->
<el-table-column label="妫�楠岄」" prop="inspectionItemList" width="180">
</el-table-column>
diff --git a/src/views/statisticalCharts/inspectionItemWarning/index.vue b/src/views/statisticalCharts/inspectionItemWarning/index.vue
new file mode 100644
index 0000000..2199965
--- /dev/null
+++ b/src/views/statisticalCharts/inspectionItemWarning/index.vue
@@ -0,0 +1,277 @@
+<template>
+ <div class="app-container">
+ <div>
+ <lims-table :tableData="tableData" :column="column"
+ :height="'calc(100vh - 500px)'" @pagination="pagination"
+ :rowClick="rowClick"
+ :page="page" :tableLoading="tableLoading"></lims-table>
+ </div>
+ <div>
+ <el-row>
+ <el-col :span="24">
+ <div class="inspection-card">
+ <div class="title">妫�楠岄」鍋忓樊棰勮鏁版嵁璇︽儏</div>
+ <Echarts ref="chart"
+ :chartStyle="chartStyle"
+ :grid="grid"
+ :options="echartsOptions"
+ :series="echartsSeries"
+ :tooltip="tooltip"
+ :xAxis="xAxis"
+ :yAxis="yAxis"
+ style="height: 40vh;"></Echarts>
+ </div>
+ </el-col>
+ </el-row>
+ </div>
+ <el-dialog :visible.sync="viewDia" title="鏌ョ湅璇︽儏" width="1100px">
+ <lims-table :tableData="tableData1" :column="column1"
+ height="570"
+ :tableLoading="tableLoading1"></lims-table>
+ </el-dialog>
+ </div>
+</template>
+
+<script>
+import limsTable from "@/components/Table/lims-table.vue";
+import {selectDeviationWarning, selectDeviationWarningPage} from "@/api/statisticalCharts/dataAnalysis";
+import Echarts from "@/components/echarts/echarts.vue";
+
+export default {
+ name: '',
+ // import 寮曞叆鐨勭粍浠堕渶瑕佹敞鍏ュ埌瀵硅薄涓墠鑳戒娇鐢�
+ components: {Echarts, limsTable},
+ data() {
+ // 杩欓噷瀛樻斁鏁版嵁
+ return {
+ viewDia: false,
+ queryParams: {},
+ tableData: [],
+ tableLoading: false,
+ column: [
+ { label: '鏍峰搧缂栧彿', prop: 'sampleCode',width: 150 },
+ { label: '鏍峰搧鍚嶇О', prop: 'sampleName',width: 150 },
+ { label: '鍨嬪彿', prop: 'sampleModel' },
+ { label: '渚涘簲鍟嗗悕绉�', prop: 'supplierName',width: 150 },
+ { label: '妫�楠岄」鍚嶇О', prop: 'inspectionItemName',width: 150 },
+ { label: '渚涘簲鍟嗗悕绉�', prop: 'supplierName',width: 150 },
+ {
+ label: "鍋忓樊鍊�",
+ prop: "deviationValue",
+ width: 150,
+ dataType: "tag",
+ formatType: (params) => {
+ return 'danger'
+ },
+ },
+ { label: '妫�娴嬫椂闂�', prop: 'detectionTime',width: 160 },
+ {
+ dataType: 'action',
+ label: '鎿嶄綔',
+ operation: [
+ {
+ name: '鏌ョ湅',
+ type: 'text',
+ clickFun: (row) => {
+ this.openDia(row);
+ },
+ }
+ ]
+ }
+ ],
+ page: {
+ total: 0,
+ size: 20,
+ current: 1
+ },
+ tableData1: [],
+ tableLoading1: false,
+ column1: [
+ { label: '鏍峰搧缂栧彿', prop: 'sampleCode'},
+ { label: '渚涘簲鍟嗗悕绉�', prop: 'supplierName'},
+ { label: '渚涘簲鍟嗗悕绉�', prop: 'supplierName'},
+ {
+ label: "妫�娴嬪��",
+ prop: "testValue",
+ width: 150,
+ dataType: "tag",
+ formatType: (params) => {
+ return 'danger'
+ },
+ },
+ { label: '妫�娴嬫椂闂�', prop: 'detectionTime',width: 160 },
+ ],
+ chartStyle: {
+ width: '100%',
+ height: '96%' // 璁剧疆鍥捐〃瀹瑰櫒鐨勯珮搴�
+ },
+ grid: {
+ left: '3%',
+ right: '4%',
+ bottom: '3%',
+ containLabel: true
+ },
+ tooltip: {},
+ echartsOptions: {},
+ echartsSeries: [
+ {
+ name: '鍋忓樊鍊�',
+ type: 'line',
+ smooth: true,
+ tooltip: {
+ valueFormatter: function (value) {
+ return value;
+ }
+ },
+ label: {
+ show: true,
+ position: 'top',
+ formatter: function (value) {
+ return value.value;
+ },
+ distance: 14
+ },
+ data: [],
+ markArea: {},
+ markPoint: {}
+ },
+ ],
+ xAxis: [
+ {
+ type: 'category',
+ data: [],
+ boundaryGap: false,
+ axisLabel: {
+ interval: 0, // 寮哄埗鏄剧ず鎵�鏈夋爣绛�
+ rotate: 0, // 涓嶆棆杞紙鍙互鏍规嵁闇�瑕佽皟鏁达級
+ formatter: function (value) {
+ // 姣忛殧涓�瀹氶暱搴︽坊鍔犳崲琛岀
+ const maxLength = 9; // 姣忔鏈�澶у瓧绗︽暟
+ let result = '';
+ for (let i = 0; i < value.length; i += maxLength) {
+ result += value.substring(i, i + maxLength) + '\n';
+ }
+ return result.trim(); // 鍘绘帀鏈熬澶氫綑鐨勬崲琛岀
+ },
+ margin: 10, // 鏍囩涓庤酱绾跨殑璺濈
+ },
+ }
+ ],
+ yAxis: [{
+ type: 'value',
+ axisLabel: {
+ formatter: '{value}'
+ }
+ }],
+ };
+ },
+ mounted() {
+ this.refreshTable()
+ },
+ // 鏂规硶闆嗗悎
+ methods: {
+ // 鏌ヨ鍒楄〃淇℃伅
+ refreshTable() {
+ this.tableLoading = true
+ selectDeviationWarningPage({ ...this.page}).then(res => {
+ this.tableLoading = false
+ this.tableData = res.data.records
+ this.page.total = res.data.total
+ }).catch(err => {
+ this.tableLoading = false
+ })
+ },
+ // 鏌ヨ鎶樼嚎鍥句俊鎭�
+ rowClick (row) {
+ selectDeviationWarning({deviationWarningId: row.deviationWarningId}).then(res => {
+ console.log('res---', res)
+ if (res.data === null) {
+ this.$message.warning('鏆傛棤鏁版嵁')
+ return
+ }
+ let lineData = []
+ let xAxis = []
+ let markAreas = []; // 瀛樺偍 markArea 鐨勬暟缁�
+ let markPoints = [];
+ res.data.forEach((item, index) => {
+ lineData.push(item.testValue)
+ xAxis.push(item.sampleCode)
+ // 濡傛灉 isIssue 涓� 1锛屽垯鍦ㄦ绱㈠紩澶勬坊鍔犱竴涓� markArea
+ if (item.isIssue == 1) {
+ const startColumn = index > 0 ? xAxis[index - 1] : xAxis[index]; // 璧风偣锛氬墠涓�鍒楁垨褰撳墠鍒�
+ const endColumn = xAxis[index]; // 缁堢偣锛氬綋鍓嶅垪
+
+ markAreas.push([
+ {
+ xAxis: startColumn, // 浠庡墠涓�鍒楀紑濮�
+ },
+ {
+ xAxis: endColumn, // 鍒板綋鍓嶅垪缁撴潫
+ }
+ ]);
+ markPoints.push({
+ name: '闂鐐�',
+ coord: [item.sampleCode, item.testValue],
+ value: item.testValue,
+ itemStyle: {
+ color: 'rgba(255, 173, 177, 0.8)'
+ },
+ label: {
+ show: true,
+ formatter: function(params) {
+ return params.value; // 鑷畾涔夋爣绛惧唴瀹�
+ },
+ color: 'black', // 鏍囩鏂囧瓧棰滆壊
+ fontSize: 12,
+ distance: 5, // 璋冩暣鏍囩涓庢皵娉＄殑璺濈
+ padding: [0,0],
+ backgroundColor: 'rgba(255, 173, 177, 0.8)', // 鏍囩鑳屾櫙鑹插強閫忔槑搴�
+ borderRadius: 4
+ }
+ });
+ }
+ })
+ this.xAxis[0].data = xAxis
+ this.echartsSeries[0].data = lineData
+ // 鏇存柊 markArea 閰嶇疆
+ this.echartsSeries[0].markArea = {
+ itemStyle: {
+ color: 'rgba(255, 173, 177, 0.4)' // 璁剧疆鑳屾櫙棰滆壊
+ },
+ data: markAreas // 鍔ㄦ�佺敓鎴愮殑 markArea 鏁版嵁
+ };
+ this.echartsSeries[0].markPoint = {
+ data: markPoints
+ };
+ })
+ },
+ // 閲嶇疆
+ refresh() {
+ // this.resetForm('entity')
+ this.refreshTable()
+ },
+ // 鍒嗛〉鍒囨崲
+ pagination(page) {
+ this.page.size = page.limit
+ this.refreshTable()
+ },
+ openDia (row) {
+ this.viewDia = true
+ this.tableLoading1 = true
+ selectDeviationWarning({deviationWarningId: row.deviationWarningId}).then(res => {
+ this.tableLoading1 = false
+ this.tableData1 = res.data
+ }).catch(() => {
+ this.tableLoading1 = false
+ })
+ },
+ }
+};
+</script>
+
+<style scoped>
+.inspection-card{
+ width: 100%;
+ margin-top: 10px;
+}
+</style>
--
Gitblit v1.9.3