|
@@ -1,97 +1,118 @@
|
|
<template>
|
|
<template>
|
|
- <div class="modelBlock">
|
|
|
|
- <div class="model-title">
|
|
|
|
- <div class="model-title-text">今日任务</div>
|
|
|
|
- </div>
|
|
|
|
- <div class="model-contents">
|
|
|
|
- <!-- @click="$router.push({ path: item.path })" -->
|
|
|
|
- <!-- <div class="number">{{ houseData[item.fontObj] }}</div>
|
|
|
|
|
|
+ <div :class="valueClass == 1 ? 'modelBlock' : 'modelBlock enlarge'">
|
|
|
|
+ <div class="model-title">
|
|
|
|
+ <div class="model-title-text">今日任务</div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="model-contents">
|
|
|
|
+ <!-- @click="$router.push({ path: item.path })" -->
|
|
|
|
+ <!-- <div class="number">{{ houseData[item.fontObj] }}</div>
|
|
<div class="text">{{ item.name }}</div> -->
|
|
<div class="text">{{ item.name }}</div> -->
|
|
- <div class="blockmuen" :style="item.style" v-for="(item, index) in blockArr" :key="index">
|
|
|
|
- <div v-if="index == 1 ? true : index == 0 ? true : false">
|
|
|
|
- <span class="text" style="margin-right: 20px">{{ item.name }}</span>
|
|
|
|
- <span class="number" style="font-size: 30px; position: relative; top: 4px">{{ item.resData }}</span>
|
|
|
|
- </div>
|
|
|
|
- <div v-else>
|
|
|
|
- <div class="number" style="font-size: 20px; margin-bottom: 10px">{{ item.resData }}</div>
|
|
|
|
- <div class="text">{{ item.name }}</div>
|
|
|
|
- </div>
|
|
|
|
- </div>
|
|
|
|
|
|
+ <div
|
|
|
|
+ :class="valueClass == 1 ? 'blockmuen' : 'blockmuenEnlarge'"
|
|
|
|
+ :style="item.style"
|
|
|
|
+ v-for="(item, index) in blockArr"
|
|
|
|
+ :key="index"
|
|
|
|
+ >
|
|
|
|
+ <div v-if="index == 1 ? true : index == 0 ? true : false">
|
|
|
|
+ <span
|
|
|
|
+ class="text"
|
|
|
|
+ style="margin-right: 20px"
|
|
|
|
+ >{{ item.name }}</span>
|
|
|
|
+ <span
|
|
|
|
+ class="number"
|
|
|
|
+ style="font-size: 30px; position: relative; top: 4px"
|
|
|
|
+ >{{ item.resData }}</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div v-else>
|
|
|
|
+ <div
|
|
|
|
+ class="number"
|
|
|
|
+ style="font-size: 20px; margin-bottom: 10px"
|
|
|
|
+ >{{ item.resData }}</div>
|
|
|
|
+ <div class="text">{{ item.name }}</div>
|
|
</div>
|
|
</div>
|
|
|
|
+ </div>
|
|
</div>
|
|
</div>
|
|
|
|
+ </div>
|
|
</template>
|
|
</template>
|
|
<script>
|
|
<script>
|
|
import index from './allcommunit';
|
|
import index from './allcommunit';
|
|
export default {
|
|
export default {
|
|
- mixins: [index],
|
|
|
|
- data() {
|
|
|
|
- return {
|
|
|
|
- houseData: [],
|
|
|
|
- blockArr: [
|
|
|
|
- {
|
|
|
|
- style: 'background: linear-gradient(135deg, #488fff 0%, #65dcff 100%);width: 100%; grid-area: 1/1 / span 1 / span 2; height:80px',
|
|
|
|
- name: '工单',
|
|
|
|
- resData: ''
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- style: 'background: linear-gradient(315deg, #884DD2 0%, #DF63CC 100%);width: 100%; grid-area: 1/3 / span 1 / span 2;height:80px',
|
|
|
|
- name: '投诉',
|
|
|
|
- resData: ''
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- style: 'background: linear-gradient(135deg, #5EEDCC 0%, #24C3F1 100%);',
|
|
|
|
- name: '已完成',
|
|
|
|
- resData: ''
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- style: 'background: linear-gradient(135deg, #F0646C 0%, #F4994E 100%);',
|
|
|
|
- name: '未完成',
|
|
|
|
- resData: ''
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- style: 'background: linear-gradient(135deg, #5EEDCC 0%, #24C3F1 100%);',
|
|
|
|
- name: '已处理',
|
|
|
|
- resData: ''
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- style: 'background: linear-gradient(135deg, #F0646C 0%, #F4994E 100%);',
|
|
|
|
- name: '未处理',
|
|
|
|
- resData: ''
|
|
|
|
- }
|
|
|
|
- ],
|
|
|
|
- mixins_query: {
|
|
|
|
- communityId: '',
|
|
|
|
- date: ''
|
|
|
|
- }
|
|
|
|
- };
|
|
|
|
- },
|
|
|
|
- methods: {
|
|
|
|
- // 获取房屋信息
|
|
|
|
- getData() {
|
|
|
|
- this.$http.get('/sc-community/statisticTodayTask', this.mixins_query).then(({ data, msg, status }) => {
|
|
|
|
- if (status == 0) {
|
|
|
|
- this.blockArr[0].resData = data.workOrder.total;
|
|
|
|
- this.blockArr[1].resData = data.feedback.total;
|
|
|
|
- this.blockArr[2].resData = data.workOrder.completeTotal;
|
|
|
|
- this.blockArr[3].resData = data.workOrder.unfinishedTotal;
|
|
|
|
- this.blockArr[4].resData = data.feedback.completeTotal;
|
|
|
|
- this.blockArr[5].resData = data.feedback.unfinishedTotal;
|
|
|
|
- }
|
|
|
|
- });
|
|
|
|
|
|
+ mixins: [index],
|
|
|
|
+ data () {
|
|
|
|
+ return {
|
|
|
|
+ valueClass: '',
|
|
|
|
+ houseData: [],
|
|
|
|
+ blockArr: [
|
|
|
|
+ {
|
|
|
|
+ style: 'background: linear-gradient(135deg, #488fff 0%, #65dcff 100%);width: 100%; grid-area: 1/1 / span 1 / span 2; height:80px',
|
|
|
|
+ name: '工单',
|
|
|
|
+ resData: ''
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ style: 'background: linear-gradient(315deg, #884DD2 0%, #DF63CC 100%);width: 100%; grid-area: 1/3 / span 1 / span 2;height:80px',
|
|
|
|
+ name: '投诉',
|
|
|
|
+ resData: ''
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ style: 'background: linear-gradient(135deg, #5EEDCC 0%, #24C3F1 100%);',
|
|
|
|
+ name: '已完成',
|
|
|
|
+ resData: ''
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ style: 'background: linear-gradient(135deg, #F0646C 0%, #F4994E 100%);',
|
|
|
|
+ name: '未完成',
|
|
|
|
+ resData: ''
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ style: 'background: linear-gradient(135deg, #5EEDCC 0%, #24C3F1 100%);',
|
|
|
|
+ name: '已处理',
|
|
|
|
+ resData: ''
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ style: 'background: linear-gradient(135deg, #F0646C 0%, #F4994E 100%);',
|
|
|
|
+ name: '未处理',
|
|
|
|
+ resData: ''
|
|
|
|
+ }
|
|
|
|
+ ],
|
|
|
|
+ mixins_query: {
|
|
|
|
+ communityId: '',
|
|
|
|
+ date: ''
|
|
|
|
+ }
|
|
|
|
+ };
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ // 获取房屋信息
|
|
|
|
+ getData () {
|
|
|
|
+ this.$http.get('/sc-community/statisticTodayTask', this.mixins_query).then(({ data, msg, status }) => {
|
|
|
|
+ if (status == 0) {
|
|
|
|
+ this.blockArr[0].resData = data.workOrder.total;
|
|
|
|
+ this.blockArr[1].resData = data.feedback.total;
|
|
|
|
+ this.blockArr[2].resData = data.workOrder.completeTotal;
|
|
|
|
+ this.blockArr[3].resData = data.workOrder.unfinishedTotal;
|
|
|
|
+ this.blockArr[4].resData = data.feedback.completeTotal;
|
|
|
|
+ this.blockArr[5].resData = data.feedback.unfinishedTotal;
|
|
}
|
|
}
|
|
- },
|
|
|
|
- created() {
|
|
|
|
- var date = new Date();
|
|
|
|
- let year = date.getFullYear();
|
|
|
|
- let month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1;
|
|
|
|
- let resdate = date.getDate();
|
|
|
|
- this.mixins_query.date = year + '-' + month + '-' + resdate;
|
|
|
|
- this.getData();
|
|
|
|
|
|
+ });
|
|
}
|
|
}
|
|
|
|
+ },
|
|
|
|
+ created () {
|
|
|
|
+ if (window.screen.width == 1920 || window.screen.width < 1920) {
|
|
|
|
+ this.valueClass = 1;
|
|
|
|
+ } else if (window.screen.width <= 2560 || window.screen.width > 1920) {
|
|
|
|
+ this.valueClass = 2;
|
|
|
|
+ }
|
|
|
|
+ var date = new Date();
|
|
|
|
+ let year = date.getFullYear();
|
|
|
|
+ let month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1;
|
|
|
|
+ let resdate = date.getDate();
|
|
|
|
+ this.mixins_query.date = year + '-' + month + '-' + resdate;
|
|
|
|
+ this.getData();
|
|
|
|
+ }
|
|
};
|
|
};
|
|
</script>
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
@import '../style.scss';
|
|
@import '../style.scss';
|
|
|
|
+@import '../stylePc.scss';
|
|
.modelBlock {
|
|
.modelBlock {
|
|
height: 280px;
|
|
height: 280px;
|
|
.model-contents {
|
|
.model-contents {
|
|
@@ -121,4 +142,18 @@ export default {
|
|
color: #ffffff;
|
|
color: #ffffff;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
+
|
|
|
|
+.modelBlock.enlarge {
|
|
|
|
+ .blockmuenEnlarge {
|
|
|
|
+ height: 105px !important;
|
|
|
|
+ border-radius: rem(10);
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ padding-left: rem(20);
|
|
|
|
+ padding-top: rem(20);
|
|
|
|
+ // cursor: pointer;
|
|
|
|
+ .number {
|
|
|
|
+ font-size: rem(30);
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+}
|
|
</style>
|
|
</style>
|