|
@@ -0,0 +1,452 @@
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ <view class="head">
|
|
|
+ <view class="">
|
|
|
+ <image class="userFlagimg" src="../../static/img/userFlag.png" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="pname">
|
|
|
+ <font class="wenzi" style="color: #BDD6F3;font-size:28upx"> {{$t('mainStatistics.name')}}: {{pnameData}}</font>
|
|
|
+ </view>
|
|
|
+ <view class="company">
|
|
|
+ <font style="color: #BDD6F3;font-size:28upx">{{$t('mainStatistics.company')}}</font>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="ri">
|
|
|
+ <view class="riShell">
|
|
|
+ <view class="riImg">
|
|
|
+ <image style="width: 64upx;height: 64upx;padding-top: 20upx;" :src="$t('mainStatistics.dayImg')"></image>
|
|
|
+ </view>
|
|
|
+ <view class="riTitle">
|
|
|
+ <view style="text-align:left;font-size:28upx;font-family:PingFang-SC-Medium">
|
|
|
+ <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.dayTotalMoney')}}:</font>
|
|
|
+ <font style="color: #ED341F;">{{dayRandomTimes}}</font>
|
|
|
+ </view>
|
|
|
+ <view style="text-align:left;font-size:28upx;font-family:PingFang-SC-Medium">
|
|
|
+ <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.dayTotalNum')}}:</font>
|
|
|
+ <font style="color: #ED341F;">{{dayRegularTimes}}</font>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="riqi">
|
|
|
+ <view style="text-align:right" class="tody">
|
|
|
+ <font style="color: #596D83;">{{today}}</font>
|
|
|
+ </view>
|
|
|
+ <view style="text-align:right" class="xingqi">
|
|
|
+ <font style="color: #596D83;">{{week}}</font>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="fourTitle">
|
|
|
+ <view class="four">
|
|
|
+ <view class="fourImg">
|
|
|
+ <image style="width: 54upx;height: 54upx;padding-top: 20upx;" :src="$t('mainStatistics.weekImg')" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="fourShell">
|
|
|
+ <view class="one">
|
|
|
+ <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.weekTotalMoney')}}:</font>
|
|
|
+ <font style="color: #ED341F;">{{weekRandomTimes}}</font>
|
|
|
+ </view>
|
|
|
+ <view class="two">
|
|
|
+ <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.weekTotalNum')}}:</font>
|
|
|
+ <font style="color: #ED341F;">{{weekRegularTimes}}</font>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="four">
|
|
|
+ <view class="fourImg">
|
|
|
+ <image style="width: 54upx;height: 54upx;padding-top: 20upx;" :src="$t('mainStatistics.monthImg')" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="fourShell">
|
|
|
+ <view class="one">
|
|
|
+ <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.monthTotalMoney')}}:</font>
|
|
|
+ <font style="color: #ED341F;">{{monthRandomTimes}}</font>
|
|
|
+ </view>
|
|
|
+ <view class="two">
|
|
|
+ <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.monthTotalNum')}}:</font>
|
|
|
+ <font style="color: #ED341F;">{{monthRegularTimes}}</font>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="four">
|
|
|
+ <view class="fourImg">
|
|
|
+ <image style="width: 54upx;height: 54upx;padding-top: 20upx;" :src="$t('mainStatistics.yearImg')" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="fourShell">
|
|
|
+ <view class="one">
|
|
|
+ <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.yearTotalMoney')}}:</font>
|
|
|
+ <font style="color: #ED341F;">{{yearRandomTimes}}</font>
|
|
|
+ </view>
|
|
|
+ <view class="two">
|
|
|
+ <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.yearTotalNum')}}:</font>
|
|
|
+ <font style="color: #ED341F;">{{yearRegularTimes}}</font>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="four">
|
|
|
+ <view class="fourImg">
|
|
|
+ <image style="width: 54upx;height: 54upx;padding-top: 20upx;" :src="$t('mainStatistics.allImg')" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="fourShell">
|
|
|
+ <view class="one">
|
|
|
+ <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.machineTotalNum')}}:</font>
|
|
|
+ <font style="color: #ED341F;">{{machineTotalNum}}</font>
|
|
|
+ </view>
|
|
|
+ <view class="two">
|
|
|
+ <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.machineUseNum')}}:</font>
|
|
|
+ <font style="color: #ED341F;">{{machineUseNum}}</font>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ mapState,
|
|
|
+ mapActions,
|
|
|
+ mapMutations
|
|
|
+ } from 'vuex';
|
|
|
+ import uCharts from '@/components/u-charts/u-charts.js';
|
|
|
+ import uniCollapse from '@/components/uni-collapse/uni-collapse.vue'
|
|
|
+ import uniCollapseItem from '@/components/uni-collapse-item/uni-collapse-item.vue'
|
|
|
+ import uniList from '@/components/uni-list/uni-list.vue'
|
|
|
+ import uniListItem from '@/components/uni-list-item/uni-list-item.vue'
|
|
|
+ import {
|
|
|
+ dateUtils
|
|
|
+ } from '@/common/util.js';
|
|
|
+ var _self;
|
|
|
+ export default {
|
|
|
+ name: 'mainStatistics',
|
|
|
+ props: {
|
|
|
+ equipmentId: '',
|
|
|
+ adminId: '',
|
|
|
+ pname: '',
|
|
|
+ },
|
|
|
+ components: {
|
|
|
+ uniCollapse,
|
|
|
+ uniCollapseItem,
|
|
|
+ uniList,
|
|
|
+ uniListItem,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ machineTotalNum: 0,
|
|
|
+ machineUseNum: 0,
|
|
|
+ dayRandomTimes: 0,
|
|
|
+ dayRegularTimes: 0,
|
|
|
+ weekRandomTimes: 0,
|
|
|
+ weekRegularTimes: 0,
|
|
|
+ monthRandomTimes: 0,
|
|
|
+ monthRegularTimes: 0,
|
|
|
+ yearRandomTimes: 0,
|
|
|
+ yearRegularTimes: 0,
|
|
|
+ today: '',
|
|
|
+ week: '',
|
|
|
+ pnameData:''
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ computed: {
|
|
|
+ ...mapState(['loginUser']),
|
|
|
+ // pnameData: {
|
|
|
+ // get() {
|
|
|
+ // return this.pname;
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+
|
|
|
+ var equipmentId = uni.getStorageSync("nowEquipmentId");
|
|
|
+ if(equipmentId!=null||equipmentId!=''){
|
|
|
+ this.equipmentId=equipmentId;
|
|
|
+ }
|
|
|
+ var equipmentName = uni.getStorageSync("nowEquipmentName");
|
|
|
+ if(equipmentName!=null||equipmentName!=''){
|
|
|
+ this.pnameData=equipmentName;
|
|
|
+ }
|
|
|
+ var token = uni.getStorageSync("token");
|
|
|
+ if (token.toString().length > 1) {
|
|
|
+ this.init();
|
|
|
+
|
|
|
+ } else {
|
|
|
+ uni.reLaunch({
|
|
|
+ url: '../Login/Login',
|
|
|
+ });
|
|
|
+ }
|
|
|
+ // this.input = this.input + 1;
|
|
|
+ var test = uni.getStorageSync('test');
|
|
|
+ var globalUser = uni.getStorageSync("globalUser");
|
|
|
+ this.globalUser = globalUser;
|
|
|
+ if (globalUser.toString().length > 1) {
|
|
|
+ //判断是不是初次登陆
|
|
|
+ if (test == 2) {
|
|
|
+ this.init();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ var id = this.adminId;
|
|
|
+
|
|
|
+ this.day();
|
|
|
+ // this.equipmentStatus();
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ var token = uni.getStorageSync("token");
|
|
|
+ if (token.toString().length > 1) {
|
|
|
+ this.init();
|
|
|
+ } else {
|
|
|
+ uni.reLaunch({
|
|
|
+ url: '../Login/Login',
|
|
|
+ });
|
|
|
+ }
|
|
|
+ // this.day();
|
|
|
+ this.equipmentStatus();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ ...mapActions('chart', ['getStatistics', 'getMainStatistics', 'getMachineNum', 'getEquipmentListByUser']),
|
|
|
+ async init() {
|
|
|
+ if (!this.pname) {
|
|
|
+ this.pname = this.loginUser.name;
|
|
|
+ }
|
|
|
+ _self = this;
|
|
|
+ await this.getMainStatisticsData();
|
|
|
+ // await this.getEquipmentListData();
|
|
|
+ //初次登陆跳转后,把test变成2
|
|
|
+ uni.setStorageSync('test', '2');
|
|
|
+
|
|
|
+ },
|
|
|
+ day() {
|
|
|
+ var date = new Date();
|
|
|
+ // var daystr = dateUtils.formateDate(date, 'yyyy年MM月dd日');
|
|
|
+ var daystr = dateUtils.formateDate(date, 'yyyy-MM-dd');
|
|
|
+ this.today = daystr;
|
|
|
+ // var str= '星期'+'日一二三四五六'.charAt(date.getDay());
|
|
|
+ this.week = this.$t('mainStatistics.week' + date.getDay());
|
|
|
+
|
|
|
+ },
|
|
|
+ equipmentStatus() {
|
|
|
+ var id = uni.getStorageSync("globalUser").id;
|
|
|
+ var token = uni.getStorageSync("token");
|
|
|
+ uni.request({
|
|
|
+ url: this.serverurl + '/TEquipment/equipmentStatus',
|
|
|
+ data: {
|
|
|
+ "adminId": id
|
|
|
+ },
|
|
|
+ header: {
|
|
|
+ 'token': token
|
|
|
+ },
|
|
|
+ method: "POST",
|
|
|
+ success: (res) => {
|
|
|
+
|
|
|
+ },
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getMainStatisticsData() {
|
|
|
+ const param = {};
|
|
|
+ if (this.adminId) { // 子组件,则拿传过来的参
|
|
|
+ param['adminId'] = this.adminId;
|
|
|
+ } else if ('admin' !== this.loginUser['username']) { //否则为主页,拿登录用户
|
|
|
+ param['adminId'] = this.loginUser['id'];
|
|
|
+ }
|
|
|
+ var globalUser = uni.getStorageSync("globalUser");
|
|
|
+ if (globalUser.id != 1) {
|
|
|
+ if (param.adminId == null || param.adminId == undefined) {
|
|
|
+ param['adminId'] = globalUser.id;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (this.equipmentId) {
|
|
|
+ param['equipmentId'] = this.equipmentId;
|
|
|
+ }
|
|
|
+ // console.log('getMainStatisticsData:{}', param);
|
|
|
+ var adminId = param.adminId;
|
|
|
+ var equipmentId = this.equipmentId;
|
|
|
+ var serverurl = this.serverurl;
|
|
|
+ var token = uni.getStorageSync("token");
|
|
|
+ uni.request({
|
|
|
+ url: serverurl + '/TEquipment/getMachineNum',
|
|
|
+ data: {
|
|
|
+ "adminId": adminId,
|
|
|
+ "equipmentId": equipmentId
|
|
|
+ },
|
|
|
+ method: "POST",
|
|
|
+ header: {
|
|
|
+ 'token': token
|
|
|
+ },
|
|
|
+ success: (res) => {
|
|
|
+ var list = res.data.data;
|
|
|
+ this.machineTotalNum = list[0];
|
|
|
+ this.machineUseNum = list[1];
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return this.getMainStatistics(param)
|
|
|
+ .then(data => {
|
|
|
+ for (let bean of data) {
|
|
|
+ if (bean['categorie'] === 'day') {
|
|
|
+ if (bean['randomTimes'] != null) {
|
|
|
+ this.dayRandomTimes = bean['randomTimes'];
|
|
|
+ }
|
|
|
+ if (bean['regularTimes'] != null) {
|
|
|
+ this.dayRegularTimes = bean['regularTimes'];
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ if (bean['categorie'] === 'week') {
|
|
|
+ if (bean['randomTimes'] != null) {
|
|
|
+ this.weekRandomTimes = bean['randomTimes'];
|
|
|
+ }
|
|
|
+ if (bean['regularTimes'] != null) {
|
|
|
+ this.weekRegularTimes = bean['regularTimes'];
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ if (bean['categorie'] === 'month') {
|
|
|
+ if (bean['randomTimes'] != null) {
|
|
|
+ this.monthRandomTimes = bean['randomTimes'];
|
|
|
+ }
|
|
|
+ if (bean['regularTimes'] != null) {
|
|
|
+ this.monthRegularTimes = bean['regularTimes'];
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ if (bean['categorie'] === 'year') {
|
|
|
+ if (bean['randomTimes'] != null) {
|
|
|
+ this.yearRandomTimes = bean['randomTimes'];
|
|
|
+ }
|
|
|
+ if (bean['regularTimes'] != null) {
|
|
|
+ this.yearRegularTimes = bean['regularTimes'];
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
+ }, _ => void uni.stopPullDownRefresh());
|
|
|
+ },
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+ page {
|
|
|
+ /* background: #F2F2F2; */
|
|
|
+ background: #FFFFFF;
|
|
|
+ width: 750upx;
|
|
|
+ overflow-x: hidden;
|
|
|
+ }
|
|
|
+
|
|
|
+ .head {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ background: #206DC3;
|
|
|
+ width: 750upx;
|
|
|
+ height: 180upx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .company {
|
|
|
+ width: 48%;
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+
|
|
|
+ .pname {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ width: 40%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .userFlagimg {
|
|
|
+ padding-left: 30upx;
|
|
|
+ padding-top: 10upx;
|
|
|
+ width: 26upx;
|
|
|
+ height: 28upx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .wenzi {
|
|
|
+ padding-left: 5upx;
|
|
|
+ /* text-align:right; */
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ /* text-overflow: ellipsis; */
|
|
|
+ }
|
|
|
+
|
|
|
+ .ri {
|
|
|
+ width: 690upx;
|
|
|
+ height: 180upx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 15upx;
|
|
|
+ /* 上移 */
|
|
|
+ transform: translateY(-90upx);
|
|
|
+ text-align: center;
|
|
|
+ margin: auto;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ /* 阴影 */
|
|
|
+ box-shadow: 0upx -1upx 20upx #D3D3D3;
|
|
|
+ /* box-shadow:0px 0px 10px 5px #aaa; */
|
|
|
+ }
|
|
|
+
|
|
|
+ .riShell {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ margin: auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ .riTitle {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ margin: auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ .riqi {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ margin: auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ .fourTitle {
|
|
|
+ width: 690upx;
|
|
|
+ height: 294upx;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ background: #FFFFFF;
|
|
|
+ box-shadow: 0upx 0upx 20upx #D3D3D3;
|
|
|
+ margin: auto;
|
|
|
+ border-radius: 15upx;
|
|
|
+ transform: translateY(-60upx);
|
|
|
+ }
|
|
|
+
|
|
|
+ .four {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ margin: auto;
|
|
|
+ width: 48%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .fourImg {
|
|
|
+ width: 54upx;
|
|
|
+ height: 54upx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .qiun-padding {
|
|
|
+ padding: 2%;
|
|
|
+ width: 96%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .qiun-wrap {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ }
|
|
|
+
|
|
|
+ .qiun-rows {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .fontLeft {
|
|
|
+ margin-right: 6upx;
|
|
|
+ }
|
|
|
+</style>
|