From ffa4fdb58442c4e4304d14ec8ac6fb7f34fb4c69 Mon Sep 17 00:00:00 2001
From: spring <2396852758@qq.com>
Date: 星期一, 17 二月 2025 09:07:39 +0800
Subject: [PATCH] 修改统计日期传参
---
src/components/view/b4-inspection-item-statistics.vue | 799 ++++++++++++++++++++++++++++++++++----------------------
1 files changed, 478 insertions(+), 321 deletions(-)
diff --git a/src/components/view/b4-inspection-item-statistics.vue b/src/components/view/b4-inspection-item-statistics.vue
index 5654875..e356bfe 100644
--- a/src/components/view/b4-inspection-item-statistics.vue
+++ b/src/components/view/b4-inspection-item-statistics.vue
@@ -3,7 +3,7 @@
<div class="inspection-content" style="height:100%">
<div class="time" style="margin-bottom: 10px;">
<el-radio-group v-model="type" size="small">
- <el-radio-button label="鍛�" ></el-radio-button>
+ <el-radio-button label="鍛�"></el-radio-button>
<el-radio-button label="鏈�"></el-radio-button>
<el-radio-button label="骞�"></el-radio-button>
</el-radio-group>
@@ -11,401 +11,558 @@
v-model="time.week"
type="week"
format="yyyy 绗� WW 鍛�"
- placeholder="閫夋嫨鍛�" size="small" v-if="type=='鍛�'" @change="m=>changeTime(type,m)">
+ placeholder="閫夋嫨鍛�"
+ size="small"
+ v-if="type == '鍛�'"
+ @change="m => changeTime(type, m)"
+ >
</el-date-picker>
<el-date-picker
v-model="time.month"
type="month"
- placeholder="閫夋嫨鏈�" size="small" v-if="type=='鏈�'" @change="m=>changeTime(type,m)">
+ placeholder="閫夋嫨鏈�"
+ size="small"
+ v-if="type == '鏈�'"
+ @change="m => changeTime(type, m)"
+ >
</el-date-picker>
<el-date-picker
v-model="time.year"
type="year"
- placeholder="閫夋嫨骞�" size="small" v-if="type=='骞�'" @change="m=>changeTime(type,m)">
+ placeholder="閫夋嫨骞�"
+ size="small"
+ v-if="type == '骞�'"
+ @change="m => changeTime(type, m)"
+ >
</el-date-picker>
</div>
<el-row :gutter="20">
- <el-col :xs="12" :sm="8" :md="6" :lg="4" :xl="4" style="margin-bottom: 16px;">
+ <el-col
+ :xs="12"
+ :sm="8"
+ :md="6"
+ :lg="4"
+ :xl="4"
+ style="margin-bottom: 16px;"
+ >
<div class="inspection-card">
<div class="inspection-head">
<div class="inspection-head-left">
- <h4>鏈瑊{type}}椤圭洰鎺ユ敹</h4>
- <span >{{ pageData.RECEVICE }}</span>
+ <h4>鏈瑊{ type }}椤圭洰鎺ユ敹</h4>
+ <span>{{ pageData.RECEVICE }}</span>
</div>
- <img src="../../../static/img/daliy-0.svg" alt="" srcset="">
+ <img src="../../../static/img/daliy-0.svg" alt="" srcset="" />
</div>
<div class="inspection-head-left-info">
- <img :src="`../../../static/img/daliy-${pageData.RECEIVE_RATIO<0?'down':'up'}.svg`" alt="">
- <span :class="{active:pageData.RECEIVE_RATIO<0}" class="num" v-html="` ${handleData(pageData.RECEIVE_RATIO)}% `"></span>
- <span style="font-size: 12px;">杈冧笂{{type}}</span>
+ <img
+ :src="
+ `../../../static/img/daliy-${
+ pageData.RECEIVE_RATIO < 0 ? 'down' : 'up'
+ }.svg`
+ "
+ alt=""
+ />
+ <span
+ :class="{ active: pageData.RECEIVE_RATIO < 0 }"
+ class="num"
+ v-html="` ${handleData(pageData.RECEIVE_RATIO)}% `"
+ ></span>
+ <span style="font-size: 12px;">杈冧笂{{ type }}</span>
</div>
</div>
</el-col>
- <el-col :xs="12" :sm="8" :md="6" :lg="4" :xl="4" style="margin-bottom: 16px;">
+ <el-col
+ :xs="12"
+ :sm="8"
+ :md="6"
+ :lg="4"
+ :xl="4"
+ style="margin-bottom: 16px;"
+ >
<div class="inspection-card">
<div class="inspection-head">
<div class="inspection-head-left">
- <h4>鏈瑊{type}}椤圭洰瀹屾垚</h4>
- <span >{{ pageData.FINISHE }}</span>
+ <h4>鏈瑊{ type }}椤圭洰瀹屾垚</h4>
+ <span>{{ pageData.FINISHE }}</span>
</div>
- <img src="../../../static/img/daliy-1.svg" alt="" srcset="">
+ <img src="../../../static/img/daliy-1.svg" alt="" srcset="" />
</div>
<div class="inspection-head-left-info">
- <img :src="`../../../static/img/daliy-${pageData.FINISHE_RATIO<0?'down':'up'}.svg`" alt="">
- <span :class="{active:pageData.FINISHE_RATIO<0}" class="num" v-html="` ${handleData(pageData.FINISHE_RATIO)}% `"></span>
- <span style="font-size: 12px;">杈冧笂{{type}}</span>
+ <img
+ :src="
+ `../../../static/img/daliy-${
+ pageData.FINISHE_RATIO < 0 ? 'down' : 'up'
+ }.svg`
+ "
+ alt=""
+ />
+ <span
+ :class="{ active: pageData.FINISHE_RATIO < 0 }"
+ class="num"
+ v-html="` ${handleData(pageData.FINISHE_RATIO)}% `"
+ ></span>
+ <span style="font-size: 12px;">杈冧笂{{ type }}</span>
</div>
</div>
</el-col>
- <el-col :xs="12" :sm="8" :md="6" :lg="4" :xl="4" style="margin-bottom: 16px;">
+ <el-col
+ :xs="12"
+ :sm="8"
+ :md="6"
+ :lg="4"
+ :xl="4"
+ style="margin-bottom: 16px;"
+ >
<div class="inspection-card">
<div class="inspection-head">
<div class="inspection-head-left">
- <h4>鏈瑊{type}}椤圭洰鍓╀綑</h4>
- <span >{{ pageData.SURPLUS }}</span>
+ <h4>鏈瑊{ type }}椤圭洰鍓╀綑</h4>
+ <span>{{ pageData.SURPLUS }}</span>
</div>
- <img src="../../../static/img/daliy-2.svg" alt="" srcset="">
+ <img src="../../../static/img/daliy-2.svg" alt="" srcset="" />
</div>
<div class="inspection-head-left-info">
- <img :src="`../../../static/img/daliy-${pageData.SURPLUS_RATIO<0?'down':'up'}.svg`" alt="">
- <span :class="{active:pageData.SURPLUS_RATIO<0}" class="num" v-html="` ${handleData(pageData.SURPLUS_RATIO)}% `"></span>
- <span style="font-size: 12px;">杈冧笂{{type}}</span>
+ <img
+ :src="
+ `../../../static/img/daliy-${
+ pageData.SURPLUS_RATIO < 0 ? 'down' : 'up'
+ }.svg`
+ "
+ alt=""
+ />
+ <span
+ :class="{ active: pageData.SURPLUS_RATIO < 0 }"
+ class="num"
+ v-html="` ${handleData(pageData.SURPLUS_RATIO)}% `"
+ ></span>
+ <span style="font-size: 12px;">杈冧笂{{ type }}</span>
</div>
</div>
</el-col>
- <el-col :xs="12" :sm="8" :md="6" :lg="4" :xl="4" style="margin-bottom: 16px;">
- <div class="inspection-card inspection-head" style="flex-direction: column;padding-bottom: 5px;">
- <h4 style="margin-bottom: 5px;">鏈瑊{type}}椤圭洰鍚堟牸鐜�</h4>
- <echart-module :id="'inspection-qualified'" :config="chartConfig2" :datas="chartData2" style="align-self: center;"></echart-module>
+ <el-col
+ :xs="12"
+ :sm="8"
+ :md="6"
+ :lg="4"
+ :xl="4"
+ style="margin-bottom: 16px;"
+ >
+ <div
+ class="inspection-card inspection-head"
+ style="flex-direction: column;padding-bottom: 5px;"
+ >
+ <h4 style="margin-bottom: 5px;">鏈瑊{ type }}椤圭洰鍚堟牸鐜�</h4>
+ <echart-module
+ :id="'inspection-qualified'"
+ :config="chartConfig2"
+ :datas="chartData2"
+ style="align-self: center;"
+ ></echart-module>
</div>
</el-col>
- <el-col :xs="12" :sm="8" :md="6" :lg="4" :xl="4" style="margin-bottom: 16px;">
- <div class="inspection-card inspection-head" style="flex-direction: column;padding-bottom: 5px;">
- <h4 style="margin-bottom: 5px;">鏈瑊{type}}椤圭洰瀹屾垚鐜�</h4>
- <echart-module :id="'inspection-complete'" :config="chartConfig3" :datas="chartData3" style="align-self: center;"></echart-module>
+ <el-col
+ :xs="12"
+ :sm="8"
+ :md="6"
+ :lg="4"
+ :xl="4"
+ style="margin-bottom: 16px;"
+ >
+ <div
+ class="inspection-card inspection-head"
+ style="flex-direction: column;padding-bottom: 5px;"
+ >
+ <h4 style="margin-bottom: 5px;">鏈瑊{ type }}椤圭洰瀹屾垚鐜�</h4>
+ <echart-module
+ :id="'inspection-complete'"
+ :config="chartConfig3"
+ :datas="chartData3"
+ style="align-self: center;"
+ ></echart-module>
</div>
</el-col>
- <el-col :xs="12" :sm="8" :md="6" :lg="4" :xl="4" style="margin-bottom: 16px;">
- <div class="inspection-card inspection-head" style="flex-direction: column;padding-bottom: 5px;">
- <h4 style="margin-bottom: 5px;">鏈瑊{type}}椤圭洰寤舵湡鐜�</h4>
- <echart-module :id="'inspection-extension'" :config="chartConfig4" :datas="chartData4" style="align-self: center;"></echart-module>
+ <el-col
+ :xs="12"
+ :sm="8"
+ :md="6"
+ :lg="4"
+ :xl="4"
+ style="margin-bottom: 16px;"
+ >
+ <div
+ class="inspection-card inspection-head"
+ style="flex-direction: column;padding-bottom: 5px;"
+ >
+ <h4 style="margin-bottom: 5px;">鏈瑊{ type }}椤圭洰寤舵湡鐜�</h4>
+ <echart-module
+ :id="'inspection-extension'"
+ :config="chartConfig4"
+ :datas="chartData4"
+ style="align-self: center;"
+ ></echart-module>
</div>
</el-col>
</el-row>
<el-row :gutter="20" style="height: calc(100% - 200px);">
- <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12" style="margin-bottom: 16px; height: 100%;">
+ <el-col
+ :xs="24"
+ :sm="24"
+ :md="12"
+ :lg="12"
+ :xl="12"
+ style="margin-bottom: 16px; height: 100%;"
+ >
<div class="inspection-card chart-box" style="height: 100%;">
- <h4>鏈瑊{type}}椤圭洰鎺ユ敹閲�</h4>
- <echart-module :id="'inspection-left'" :config="chartConfig0" :datas="chartData0" style="height: calc(100% - 32px);"></echart-module>
+ <h4>鏈瑊{ type }}椤圭洰鎺ユ敹閲�</h4>
+ <echart-module
+ :id="'inspection-left'"
+ :config="chartConfig0"
+ :datas="chartData0"
+ style="height: calc(100% - 32px);"
+ ></echart-module>
</div>
</el-col>
- <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12" style="margin-bottom: 16px;height: 100%;">
+ <el-col
+ :xs="24"
+ :sm="24"
+ :md="12"
+ :lg="12"
+ :xl="12"
+ style="margin-bottom: 16px;height: 100%;"
+ >
<div class="inspection-card chart-box" style="height: 100%;">
- <h4>鏈瑊{type}}瀹為檯瀹屾垚椤圭洰涓庢帴鏀堕」鐩姣�</h4>
- <echart-module :id="'inspection-right'" :config="chartConfig1" :datas="chartData1" style="height: calc(100% - 32px);"></echart-module>
+ <h4>鏈瑊{ type }}瀹為檯瀹屾垚椤圭洰涓庢帴鏀堕」鐩姣�</h4>
+ <echart-module
+ :id="'inspection-right'"
+ :config="chartConfig1"
+ :datas="chartData1"
+ style="height: calc(100% - 32px);"
+ ></echart-module>
</div>
</el-col>
</el-row>
</div>
</div>
- </template>
+</template>
- <script>
-
- import EchartModule from '../tool/echart.vue'
- import {
- getYearAndMonthAndDays
- } from '../../util/date'
- export default {
- components: {EchartModule},
- data(){
- return{
- chartConfig0:{
- height: '',
- isLoading:true,
- type:'line'
- },
- chartData0:{
- xData:[],
- yData:[
- {
- title:'椤圭洰鎺ユ敹閲�',
- data:[]
- }
- ]
- },
- chartConfig1:{
- height: '',
- isLoading:true,
- type:'bar'
- },
- chartData1:{
- xData:[],
- yData:[
- {
- title:'鎺ユ敹',
- data:[]
- },
- {
- title:'瀹屾垚',
- data:[]
- },
- ]
- },
- chartConfig2:{
- height: '103px',
- width:'140px',
- isLoading:true,
- type:'pie'
- },
- chartData2:{
- title:'椤圭洰鍚堟牸鐜�',
- percentage:'0',
- color:['#1CCAB8','#E1E4E8'],
- data:[
- {
- name:'鍚堟牸',
- value:'0'
- },
- {
- name:'涓嶅悎鏍�',
- value:'0'
- },
- ]
- },
- chartConfig3:{
- height: '103px',
- width:'140px',
- isLoading:true,
- type:'pie'
- },
- chartData3:{
- title:'椤圭洰瀹屾垚鐜�',
- percentage:'0',
- color:['#FBB647','#E1E4E8'],
- data:[
- {
- name:'瀹屾垚',
- value:'0'
- },
- {
- name:'鏈畬鎴�',
- value:'0'
- },
- ]
- },
- chartConfig4:{
- height: '103px',
- width:'140px',
- isLoading:true,
- type:'pie'
- },
- chartData4:{
- title:'椤瑰欢鏈熺巼',
- percentage:'0',
- color:['#FF3838','#E1E4E8'],
- data:[
- {
- name:'寤舵湡',
- value:'0'
- },
- {
- name:'鏈欢鏈�',
- value:'0'
- },
- ]
- },
- loading:false,
- pageData:{},
- timers:null,
- type:'鍛�',
- time:{
- week:'',
- month:'',
- year:'',
- },
- startTime:'',
- endTime:''
- }
- },
- watch:{
- type(val){
- switch(val){
- case '鍛�':
- this.time.week = new Date()
- this.changeTime(val,this.time.week)
+<script>
+import EchartModule from "../tool/echart.vue";
+import { getYearAndMonthAndDays } from "../../util/date";
+export default {
+ components: { EchartModule },
+ data() {
+ return {
+ chartConfig0: {
+ height: "",
+ isLoading: true,
+ type: "line"
+ },
+ chartData0: {
+ xData: [],
+ yData: [
+ {
+ title: "椤圭洰鎺ユ敹閲�",
+ data: []
+ }
+ ]
+ },
+ chartConfig1: {
+ height: "",
+ isLoading: true,
+ type: "bar"
+ },
+ chartData1: {
+ xData: [],
+ yData: [
+ {
+ title: "鎺ユ敹",
+ data: []
+ },
+ {
+ title: "瀹屾垚",
+ data: []
+ }
+ ]
+ },
+ chartConfig2: {
+ height: "103px",
+ width: "140px",
+ isLoading: true,
+ type: "pie"
+ },
+ chartData2: {
+ title: "椤圭洰鍚堟牸鐜�",
+ percentage: "0",
+ color: ["#1CCAB8", "#E1E4E8"],
+ data: [
+ {
+ name: "鍚堟牸",
+ value: "0"
+ },
+ {
+ name: "涓嶅悎鏍�",
+ value: "0"
+ }
+ ]
+ },
+ chartConfig3: {
+ height: "103px",
+ width: "140px",
+ isLoading: true,
+ type: "pie"
+ },
+ chartData3: {
+ title: "椤圭洰瀹屾垚鐜�",
+ percentage: "0",
+ color: ["#FBB647", "#E1E4E8"],
+ data: [
+ {
+ name: "瀹屾垚",
+ value: "0"
+ },
+ {
+ name: "鏈畬鎴�",
+ value: "0"
+ }
+ ]
+ },
+ chartConfig4: {
+ height: "103px",
+ width: "140px",
+ isLoading: true,
+ type: "pie"
+ },
+ chartData4: {
+ title: "椤瑰欢鏈熺巼",
+ percentage: "0",
+ color: ["#FF3838", "#E1E4E8"],
+ data: [
+ {
+ name: "寤舵湡",
+ value: "0"
+ },
+ {
+ name: "鏈欢鏈�",
+ value: "0"
+ }
+ ]
+ },
+ loading: false,
+ pageData: {},
+ timers: null,
+ type: "鍛�",
+ time: {
+ week: "",
+ month: "",
+ year: ""
+ },
+ startTime: "",
+ endTime: ""
+ };
+ },
+ watch: {
+ type(val) {
+ switch (val) {
+ case "鍛�":
+ this.time.week = new Date();
+ this.changeTime(val, this.time.week);
break;
- case '鏈�':
- this.time.month = new Date()
- this.changeTime(val,this.time.month)
+ case "鏈�":
+ this.time.month = new Date();
+ this.changeTime(val, this.time.month);
break;
- case '骞�':
- this.time.year = new Date()
- this.changeTime(val,this.time.year)
+ case "骞�":
+ this.time.year = new Date();
+ this.changeTime(val, this.time.year);
break;
}
}
},
- mounted(){
- this.changeTime(this.type)
- // this.timers&&clearInterval(this.timers);
- // setInterval(this.changeTime(this.type),1000*60*5)
- },
- methods:{
- init(){
- this.chartConfig0.isLoading = false
- this.chartConfig1.isLoading = false
- this.chartConfig2.isLoading = false
- this.chartConfig3.isLoading = false
- this.chartConfig4.isLoading = false
+ mounted() {
+ this.changeTime(this.type);
+ // this.timers&&clearInterval(this.timers);
+ // setInterval(this.changeTime(this.type),1000*60*5)
+ },
+ methods: {
+ init() {
+ this.chartConfig0.isLoading = false;
+ this.chartConfig1.isLoading = false;
+ this.chartConfig2.isLoading = false;
+ this.chartConfig3.isLoading = false;
+ this.chartConfig4.isLoading = false;
this.loading = true;
- this.$axios.get(this.$api.report.testProductByDay+'?startTime='+this.startTime+'&endTime='+this.endTime+'&type='+this.type).then(res => {
- if (res.code == 201) return
- this.pageData = this.HaveJson(res.data)
- let xData = res.data.DAYS.map(m=>{
- let arr = m.split('-')
- if(this.type=='骞�'){
- return `${arr[1]}鏈坄
- }else{
- return `${arr[1]}-${arr[2]}`
- }
- })
- this.chartData0.xData = xData
- this.chartData1.xData = xData
- this.chartData0.yData[0].data = this.pageData.RECETENDAYS
- this.chartData1.yData[0].data = this.pageData.RECETENDAYS
- this.chartData1.yData[1].data = this.pageData.FINISHTENDAYS
- this.chartData2.percentage = (this.pageData.ACCEPT_RATE_TODAY*100).toFixed(0)+'%'
- this.chartData3.percentage = (this.pageData.FINISH_RATE_TODAY*100).toFixed(0)+'%'
- this.chartData4.percentage = (this.pageData.DELAY_RATE_TODAY*100).toFixed(0)+'%'
- this.chartData2.data[0].value = this.pageData.ACCEPT
- this.chartData2.data[1].value = this.pageData.FINISHE - this.pageData.ACCEPT
- this.loading = false;
- this.chartData3.data[0].value = this.pageData.FINISHE
- this.chartData3.data[1].value = this.pageData.RECEVICE - this.pageData.FINISHE
- this.chartData4.data[0].value = this.pageData.SURPLUS
- this.chartData4.data[1].value = this.pageData.RECEVICE - this.pageData.SURPLUS
- this.chartConfig0.isLoading = true
- this.chartConfig1.isLoading = true
- this.chartConfig2.isLoading = true
- this.chartConfig3.isLoading = true
- this.chartConfig4.isLoading = true
- })
- },
- handleData(val){
- if(val){
- let num = Math.abs(val)*100
- return num.toFixed(0);
- }else{
- return '0'
- }
- },
- changeTime(type,m){
- if(m){
- switch(type){
- case '鍛�':
- this.startTime = getYearAndMonthAndDays(new Date(this.time.week.getTime() - 24 * 60 * 60 * 1000))
- this.endTime = getYearAndMonthAndDays(new Date(this.time.week.getTime() + 24 * 60 * 60 * 1000 * 5))
- break;
- case '鏈�':
- const year = new Date(this.time.month).getFullYear();
- const month = new Date(this.time.month).getMonth();
- const day = new Date(year, month + 1, 0).getDate(); //
- // 璁剧疆璧峰鏃ユ湡鍜岀粨鏉熸棩鏈�
- this.startTime = `${year}-${month + 1}-01`
- this.endTime = `${year}-${month + 1}-${day}` // 鏈堟湯
- break;
- case '骞�':
- const year0 = new Date(this.time.year).getFullYear();
- this.startTime = `${year0}-01-01`; // 骞村垵
- this.endTime = `${year0}-12-31`; // 骞存湯
- break;
- }
- }else{
- this.startTime = getYearAndMonthAndDays(new Date((new Date).getTime() - 24 * 60 * 60 * 1000))
- this.endTime = getYearAndMonthAndDays(new Date((new Date).getTime() + 24 * 60 * 60 * 1000 * 5))
- this.time.week = new Date()
- }
- this.init()
+ this.$axios
+ .get(
+ this.$api.report.testProductByDay +
+ "?startTime=" +
+ this.startTime +
+ "&endTime=" +
+ this.endTime +
+ "&type=" +
+ this.type
+ )
+ .then(res => {
+ if (res.code == 201) return;
+ this.pageData = this.HaveJson(res.data);
+ let xData = res.data.DAYS.map(m => {
+ let arr = m.split("-");
+ if (this.type == "骞�") {
+ return `${arr[1]}鏈坄;
+ } else {
+ return `${arr[1]}-${arr[2]}`;
+ }
+ });
+ this.chartData0.xData = xData;
+ this.chartData1.xData = xData;
+ this.chartData0.yData[0].data = this.pageData.RECETENDAYS;
+ this.chartData1.yData[0].data = this.pageData.RECETENDAYS;
+ this.chartData1.yData[1].data = this.pageData.FINISHTENDAYS;
+ this.chartData2.percentage =
+ (this.pageData.ACCEPT_RATE_TODAY * 100).toFixed(0) + "%";
+ this.chartData3.percentage =
+ (this.pageData.FINISH_RATE_TODAY * 100).toFixed(0) + "%";
+ this.chartData4.percentage =
+ (this.pageData.DELAY_RATE_TODAY * 100).toFixed(0) + "%";
+ this.chartData2.data[0].value = this.pageData.ACCEPT;
+ this.chartData2.data[1].value =
+ this.pageData.FINISHE - this.pageData.ACCEPT;
+ this.loading = false;
+ this.chartData3.data[0].value = this.pageData.FINISHE;
+ this.chartData3.data[1].value =
+ this.pageData.RECEVICE - this.pageData.FINISHE;
+ this.chartData4.data[0].value = this.pageData.SURPLUS;
+ this.chartData4.data[1].value =
+ this.pageData.RECEVICE - this.pageData.SURPLUS;
+ this.chartConfig0.isLoading = true;
+ this.chartConfig1.isLoading = true;
+ this.chartConfig2.isLoading = true;
+ this.chartConfig3.isLoading = true;
+ this.chartConfig4.isLoading = true;
+ });
+ },
+ handleData(val) {
+ if (val) {
+ let num = Math.abs(val) * 100;
+ return num.toFixed(0);
+ } else {
+ return "0";
}
},
- deactivated(){
- this.timers&&clearInterval(this.timers);
+ changeTime(type, m) {
+ if (m) {
+ switch (type) {
+ case "鍛�":
+ this.startTime = getYearAndMonthAndDays(
+ new Date(this.time.week.getTime() - 24 * 60 * 60 * 1000)
+ );
+ this.endTime = getYearAndMonthAndDays(
+ new Date(this.time.week.getTime() + 24 * 60 * 60 * 1000 * 5)
+ );
+ break;
+ case "鏈�":
+ const year = new Date(this.time.month).getFullYear();
+ const month = new Date(this.time.month).getMonth() + 1;
+ const day = new Date(year, month, 0).getDate(); //
+ // 璁剧疆璧峰鏃ユ湡鍜岀粨鏉熸棩鏈�
+ this.startTime = `${year}-${month > 9 ? "0" + month : month}-01`;
+ this.endTime = `${year}-${month > 9 ? "0" + month : month}-${day}`; // 鏈堟湯
+ break;
+ case "骞�":
+ const year0 = new Date(this.time.year).getFullYear();
+ this.startTime = `${year0}-01-01`; // 骞村垵
+ this.endTime = `${year0}-12-31`; // 骞存湯
+ break;
+ }
+ } else {
+ this.startTime = getYearAndMonthAndDays(
+ new Date(new Date().getTime() - 24 * 60 * 60 * 1000)
+ );
+ this.endTime = getYearAndMonthAndDays(
+ new Date(new Date().getTime() + 24 * 60 * 60 * 1000 * 5)
+ );
+ this.time.week = new Date();
+ }
+ this.init();
}
+ },
+ deactivated() {
+ this.timers && clearInterval(this.timers);
}
- </script>
+};
+</script>
- <style scoped>
- .inspection-main{
- height: 100%;
- overflow-y: auto;
- overflow-x: hidden;
- }
- .inspection-content{
- padding: 20px 0;
- box-sizing: border-box;
- }
- .inspection-card{
- width: 100%;
- background: #FFFFFF;
- border-radius: 14px;
- box-shadow: 6px 6px 54px 0px rgba(0,0,0,0.05);
- padding: 16px;
+<style scoped>
+.inspection-main {
+ height: 100%;
+ overflow-y: auto;
+ overflow-x: hidden;
+}
+.inspection-content {
+ padding: 20px 0;
box-sizing: border-box;
- }
+}
+.inspection-card {
+ width: 100%;
+ background: #ffffff;
+ border-radius: 14px;
+ box-shadow: 6px 6px 54px 0px rgba(0, 0, 0, 0.05);
+ padding: 16px;
+ box-sizing: border-box;
+}
- .inspection-head{
- display: flex;
- justify-content: space-between;
- align-items: flex-start;
- }
+.inspection-head {
+ display: flex;
+ justify-content: space-between;
+ align-items: flex-start;
+}
- .inspection-head h4{
- color: #202224;
- font-size: 16px;
- font-weight: 400;
- margin-bottom: 20px;
- opacity: 0.8;
- }
+.inspection-head h4 {
+ color: #202224;
+ font-size: 16px;
+ font-weight: 400;
+ margin-bottom: 20px;
+ opacity: 0.8;
+}
- .inspection-head-left>span{
- font-family: Nunito Sans-Bold;color: #202224;
- font-weight: bold;
- font-size: 24px;
- display: inline-block;
- margin-bottom: 18px;
- }
+.inspection-head-left > span {
+ font-family: Nunito Sans-Bold;
+ color: #202224;
+ font-weight: bold;
+ font-size: 24px;
+ display: inline-block;
+ margin-bottom: 18px;
+}
- .inspection-head-left-info{
- display: flex;
- align-items: center;
- font-size: 16px;
- color: #202224;
- }
+.inspection-head-left-info {
+ display: flex;
+ align-items: center;
+ font-size: 16px;
+ color: #202224;
+}
- .num{
- color: #00B69B;
- }
+.num {
+ color: #00b69b;
+}
- .num.active{
- color: #F93C65;
- }
+.num.active {
+ color: #f93c65;
+}
- .chart-box{
- padding: 16px 24px;
- box-sizing: border-box;
- }
+.chart-box {
+ padding: 16px 24px;
+ box-sizing: border-box;
+}
- .chart-box h4{
- color: #202224;
- font-family: PingFang SC-Regular;
- font-weight: 400;
- font-size: 24px;
- margin-bottom: 16px;
- }
+.chart-box h4 {
+ color: #202224;
+ font-family: PingFang SC-Regular;
+ font-weight: 400;
+ font-size: 24px;
+ margin-bottom: 16px;
+}
- .chart{
- width: 100%;
- height: 450px;
- }
- </style>
+.chart {
+ width: 100%;
+ height: 450px;
+}
+</style>
--
Gitblit v1.9.3