首页样式调整

test
zhangdi 1 year ago
parent 5256936d8a
commit aa170572c8
  1. 7
      api/api.js
  2. 5
      manifest.json
  3. 205
      pages/home/components/eacharts.vue
  4. 212
      pages/home/components/eacharts_pie.vue
  5. 48
      pages/home/index.vue
  6. 36
      pages/notice/announcement.vue

@ -353,8 +353,13 @@ const install = (Vue, vm) => {
authorizations: true, authorizations: true,
isparams: false isparams: false
}) })
// 通知公告/
let getNoticeList = (params) => http.get('/blade-desk/notice/list', params, {
authorizations: true,
isparams: false
})
// 将各个定义的接口名称,统一放进对象挂载到vm.$u.api(因为vm就是this,也即this.$u.api)下 // 将各个定义的接口名称,统一放进对象挂载到vm.$u.api(因为vm就是this,也即this.$u.api)下
vm.$u.api = { getTenantInfo, login, logout, registerUser, getworkbench, getLoginRecords, getEditRecords, subEditRecords, getChildList, getDeviceList, workOrderSave, getWorkOrderRecords, getBreakdownInfo, workOrderupdate, evaluateSign, getRepairPersons, getGoodsList, getDictionaryList, getUserList, workList, deviceList, upkeepStat, pieStat, getUserInfo, overview, sendOrders, cloneOrder, editData, repairReject, applySave, sendVerify, serviceman, servicemanReceive, servicemanSubmit, supervisorReject, supervisorconfirm, customerConfirm, customerReject, servicemanRepairSubmit, evaluateRepairReject, getDeviceDetail, getTaskPage, getTaskDetail, taskSupervisorconfirm, taskServicemanreceive, updateCoordinate, taskServicemanUpdateTime, getPlanDetail, getRepairPage, updateDetaile, taskServicemanSubmit, taskCustomerConfirm, taskCustomerRefuse, taskSolutionSave, taskSolutionSubmit, repairSolutionSupervisor, repairSolutionRefuse, repairSolutionCustomer, repairCustomerRefuse, repairServicemanSubmit,repairConfirmFinish,repairRefuseFinish ,confirmPayment,getPosition,getRepairDetail,updatePosition,resetPwd}; vm.$u.api = { getTenantInfo, login, logout, registerUser, getworkbench, getLoginRecords, getEditRecords, subEditRecords, getChildList, getDeviceList, workOrderSave, getWorkOrderRecords, getBreakdownInfo, workOrderupdate, evaluateSign, getRepairPersons, getGoodsList, getDictionaryList, getUserList, workList, deviceList, upkeepStat, pieStat, getUserInfo, overview, sendOrders, cloneOrder, editData, repairReject, applySave, sendVerify, serviceman, servicemanReceive, servicemanSubmit, supervisorReject, supervisorconfirm, customerConfirm, customerReject, servicemanRepairSubmit, evaluateRepairReject, getDeviceDetail, getTaskPage, getTaskDetail, taskSupervisorconfirm, taskServicemanreceive, updateCoordinate, taskServicemanUpdateTime, getPlanDetail, getRepairPage, updateDetaile, taskServicemanSubmit, taskCustomerConfirm, taskCustomerRefuse, taskSolutionSave, taskSolutionSubmit, repairSolutionSupervisor, repairSolutionRefuse, repairSolutionCustomer, repairCustomerRefuse, repairServicemanSubmit,repairConfirmFinish,repairRefuseFinish ,confirmPayment,getPosition,getRepairDetail,updatePosition,resetPwd,getNoticeList};
} }
export default { export default {

@ -53,7 +53,10 @@
"sdkConfigs" : { "sdkConfigs" : {
"ad" : {}, "ad" : {},
"push" : { "push" : {
"unipush" : {} "unipush" : {
"version" : "2",
"offline" : false
}
}, },
"maps" : { "maps" : {
"amap" : { "amap" : {

@ -1,31 +1,9 @@
<template> <template>
<view class="eacharts-box"> <view class="eacharts-box">
<view class="eacharts-time">
<!-- <u-form :model="form" ref="uForm">
<u-form-item label="选择时间:" label-width="140" :border-bottom="false">
<u-input v-model="form.searchTime" type="select" @click="calendarShow = true" :border="true"
placeholder="请选择时间" />
</u-form-item>
</u-form> -->
<u-calendar v-model="calendarShow" :mode="mode" @change="change"></u-calendar>
</view>
<!-- eacharts 图表 --> <!-- eacharts 图表 -->
<view class="echarts" v-if="type == 'maintenanceStatistics'"> <view class="echarts" >
<l-echart ref="chartRef" :key="Math.random()"></l-echart> <l-echart ref="chartRef" :key="Math.random()"></l-echart>
</view> </view>
<!-- 饼状图 -->
<view class="echartsPie" v-if="type == 'maintenanceStatisticsPie'">
<view class="pie-item">
<view style="height:308rpx"><l-echart ref="chartRefPieLeft" :key="Math.random()"></l-echart></view>
<text class="pie-title">故障现象分类</text>
</view>
<view class="pie-item">
<view style="height:308rpx"><l-echart ref="chartRefPieRight" :key="Math.random()"></l-echart></view>
<text class="pie-title">设备分类</text>
</view>
</view>
</view> </view>
</template> </template>
<script> <script>
@ -53,17 +31,7 @@ export default {
}; };
}, },
mounted() { mounted() {
//
if (this.type == "maintenanceStatistics") {
this.upkeepStat() this.upkeepStat()
}
if (this.type == "maintenanceStatisticsPie") {
this.pieStat()
}
}, },
methods: { methods: {
// //
@ -72,12 +40,6 @@ export default {
startTime: this.form.startTime, startTime: this.form.startTime,
endTime: this.form.endTime, endTime: this.form.endTime,
} }
// if(this.form.startTime!=''){
// query_.startTime=this.form.startTime
// }
// if(this.form.endTime!=''){
// query_.endTime=this.form.endTime
// }
this.$u.api.upkeepStat(query_).then(res => { this.$u.api.upkeepStat(query_).then(res => {
if (res.code == 200) { if (res.code == 200) {
this.upkeepStatInfo = JSON.parse(JSON.stringify(res.data)) this.upkeepStatInfo = JSON.parse(JSON.stringify(res.data))
@ -85,36 +47,6 @@ export default {
} }
}) })
}, },
//
pieStat() {
let query_ = {
startTime: this.form.startTime,
endTime: this.form.endTime,
}
this.$u.api.pieStat(query_).then(res => {
if (res.code == 200) {
this.pieInfo = res.data
this.maintenancePieLeftInit();
this.maintenancePieRightInit();
}
})
},
selectFun() {
this.calendarShow = true;
},
change(e) {
this.form.startTime = e.startDate;
this.form.endTime = e.endDate;
this.form.searchTime = e.startDate + "-" + e.endDate;
if (this.type == "maintenanceStatistics") {
this.upkeepStat()
}
if (this.type == "maintenanceStatisticsPie") {
this.pieStat()
}
//
},
// //
maintenanceInit() { maintenanceInit() {
let opts = { let opts = {
@ -174,147 +106,22 @@ export default {
return chart; return chart;
}); });
}, },
//
maintenancePieLeftInit() {
let opts = {
series: [
{
name: "",
type: "pie",
radius: ['40%', '70%'],
label: {
// .
normal: {
show: true,
fontSize: 8, // [ default: false ]
position: "outside", // 'outside'线'inside','inner' 'inside','center'
formatter: "{b}\n {c}", //
color: '#000'
},
},
data: this.pieInfo.fault,
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: "rgba(0, 0, 0, 1)",
},
},
labelLine: {
// 线, label 'outside'线
normal: {
show: true, // 线
length: 5, // label 'outside'线
length2: 5,
//
lineStyle: {
// 线
type: "solid",
},
},
},
},
],
};
this.$refs.chartRefPieLeft.init((config) => {
const { canvas } = config;
const chart = echarts.init(canvas, null, config);
chart.setOption(opts);
// chart
return chart;
});
},
maintenancePieRightInit() {
let opts = {
series: [
{
type: "pie",
radius: ['40%', '70%'],
label: {
// .
normal: {
show: true,
fontSize: 8, // [ default: false ]
position: "outside", // 'outside'线'inside','inner' 'inside','center'
formatter: "{b}\n {c}", //
color: '#000'
},
},
data: this.pieInfo.device,
labelLine: {
// 线, label 'outside'线
normal: {
show: true, // 线
length: 5, // label 'outside'线
length2: 5,
//
lineStyle: {
// 线
type: "solid",
},
},
},
},
],
};
this.$refs.chartRefPieRight.init((config) => {
const { canvas } = config;
const chart = echarts.init(canvas, null, config);
chart.setOption(opts);
// chart
return chart;
});
},
}, },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.eacharts-box { .eacharts-box {
background: #fff; background: #fff;
margin: 0 40rpx 32rpx; margin: 0 32rpx 32rpx;
border-radius: 20rpx; border-radius: 20rpx;
overflow: hidden; overflow: hidden;
height: 368rpx;
.eacharts-time {
margin: 0 136rpx 0 24rpx;
display: flex;
flex-direction: row;
text {
line-height: 60rpx;
color: rgba(16, 16, 16, 1);
font-size: 28rpx;
margin-top: 30rpx;
margin-right: 10rpx;
}
}
.echarts { .echarts {
width: calc(100% - 64rpx); width: calc(100% - 64rpx);
height: 308rpx; height: 328rpx;
margin: 0 auto 20rpx; margin:30rpx auto 20rpx;
} overflow: hidden;
.echartsPie {
width: calc(100% - 64rpx);
min-height: 308rpx;
margin: 0 auto 0;
.pie-item {
width: 100%;
height: 368rpx;
// float: left;
}
}
.pie-title {
height: 30rpx;
text-align: center;
display: block;
color: rgba(16, 16, 16, 1);
font-size: 28rpx;
} }
} }
</style> </style>

@ -4,7 +4,7 @@
<!-- 饼状图 --> <!-- 饼状图 -->
<view class="echartsPie"> <view class="echartsPie">
<view class="pie-item"> <view class="pie-item">
<view style="height:308rpx"><l-echart ref="chartRefPieLeft" :key="Math.random()"></l-echart></view> <view style="height:308rpx;margin-top: 40rpx;"><l-echart ref="chartRefPieLeft" :key="Math.random()"></l-echart></view>
</view> </view>
</view> </view>
@ -20,11 +20,17 @@ export default {
type: String, type: String,
default: "", default: "",
}, },
data:{ echartData: {
type: Array, type: Array,
default: [] default: []
} }
}, },
watch: {
echartData(val) {
this.pieInfo = val
this.maintenancePieInit()
}
},
data() { data() {
return { return {
form: { form: {
@ -32,137 +38,14 @@ export default {
startTime: "", startTime: "",
endTime: "", endTime: "",
}, },
calendarShow: false, pieInfo: [],//
mode: "range",
upkeepStatInfo: {},
pieInfo: {},//
};
},
mounted() {
this.maintenancePieLeftInit()
// //
// if (this.type == "maintenanceStatistics") {
// this.upkeepStat()
// }
// if (this.type == "maintenanceStatisticsPie") {
// this.pieStat()
// }
},
methods: {
//
upkeepStat() {
let query_ = {
startTime: this.form.startTime,
endTime: this.form.endTime,
}
// if(this.form.startTime!=''){
// query_.startTime=this.form.startTime
// }
// if(this.form.endTime!=''){
// query_.endTime=this.form.endTime
// }
this.$u.api.upkeepStat(query_).then(res => {
if (res.code == 200) {
this.upkeepStatInfo = JSON.parse(JSON.stringify(res.data))
this.maintenanceInit();
}
})
},
//
pieStat() {
let query_ = {
startTime: this.form.startTime,
endTime: this.form.endTime,
}
this.$u.api.pieStat(query_).then(res => {
if (res.code == 200) {
this.pieInfo = res.data
this.maintenancePieLeftInit();
this.maintenancePieRightInit();
}
})
},
selectFun() {
this.calendarShow = true;
},
change(e) {
this.form.startTime = e.startDate;
this.form.endTime = e.endDate;
this.form.searchTime = e.startDate + "-" + e.endDate;
if (this.type == "maintenanceStatistics") {
this.upkeepStat()
}
if (this.type == "maintenanceStatisticsPie") {
this.pieStat()
}
//
},
//
maintenanceInit() {
let opts = {
tooltip: {},
legend: {
//
data: ["总计", "已完成", "未完成"],
},
xAxis: {
data: this.upkeepStatInfo.xData,
},
grid: {
top: "15%",
left: "10%",
right: "5%",
bottom: "15%",
},
yAxis: {},
series: [
{
name: "总计",
type: "bar",
data: this.upkeepStatInfo.total,
barWidth: 30, //
barGap: "0", // 0
itemStyle: {
color: "#2478f2",
},
},
{
name: "已完成",
type: "bar",
data: this.upkeepStatInfo.completed,
barWidth: 30, //
barGap: "0", // 0
itemStyle: {
color: "#84b7f9",
},
},
{
name: "未完成",
type: "bar",
data: this.upkeepStatInfo.unCompleted,
barWidth: 30, //
barGap: "0", // 0
itemStyle: {
color: "#5f9cf8",
},
},
],
}; };
this.$refs.chartRef.init((config) => {
const { canvas } = config;
const chart = echarts.init(canvas, null, config);
chart.setOption(opts);
// chart
return chart;
});
}, },
mounted() { },
methods: {
// //
maintenancePieLeftInit() { maintenancePieInit() {
let opts = { let opts = {
series: [ series: [
{ {
@ -180,7 +63,7 @@ export default {
}, },
}, },
data: this.data, data: this.pieInfo,
emphasis: { emphasis: {
itemStyle: { itemStyle: {
shadowBlur: 10, shadowBlur: 10,
@ -213,74 +96,20 @@ export default {
return chart; return chart;
}); });
}, },
maintenancePieRightInit() {
let opts = {
series: [
{
type: "pie",
radius: ['40%', '70%'],
label: {
// .
normal: {
show: true,
fontSize: 8, // [ default: false ]
position: "outside", // 'outside'线'inside','inner' 'inside','center'
formatter: "{b}\n {c}", //
color: '#000'
},
},
data: this.pieInfo.device,
labelLine: {
// 线, label 'outside'线
normal: {
show: true, // 线
length: 5, // label 'outside'线
length2: 5,
//
lineStyle: {
// 线
type: "solid",
},
},
},
},
],
};
this.$refs.chartRefPieRight.init((config) => {
const { canvas } = config;
const chart = echarts.init(canvas, null, config);
chart.setOption(opts);
// chart
return chart;
});
},
}, },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.eacharts-box { .eacharts-box {
background: #fff; background: #fff;
margin: 0 40rpx 32rpx; margin: 0 32rpx 32rpx;
border-radius: 20rpx; border-radius: 20rpx;
overflow: hidden; overflow: hidden;
.eacharts-time {
margin: 0 136rpx 0 24rpx;
display: flex;
flex-direction: row;
text {
line-height: 60rpx;
color: rgba(16, 16, 16, 1);
font-size: 28rpx;
margin-top: 30rpx;
margin-right: 10rpx;
}
}
.echarts { .echarts {
width: calc(100% - 64rpx); width: calc(100% - 64rpx);
height: 308rpx; height: 368rpx;
margin: 0 auto 20rpx; margin: 0 auto 20rpx;
} }
@ -292,16 +121,9 @@ export default {
.pie-item { .pie-item {
width: 100%; width: 100%;
height: 368rpx; height: 368rpx;
overflow: hidden;
// float: left; // float: left;
} }
} }
.pie-title {
height: 30rpx;
text-align: center;
display: block;
color: rgba(16, 16, 16, 1);
font-size: 28rpx;
}
} }
</style> </style>

@ -9,8 +9,8 @@
</u-navbar> </u-navbar>
<!-- 通知公告 --> <!-- 通知公告 -->
<view class="notice_box" v-if="noticeList.length > 0"> <view class="notice_box" v-if="noticeList.length > 0">
<u-notice-bar mode="horizontal" type="primary" :list="noticeList" :more-icon="true" <u-notice-bar mode="horizontal" type="primary" :list="noticeList" :more-icon="true" @getMore="getNotice()"
@getMore="getNotice()"></u-notice-bar> :is-circular="false"></u-notice-bar>
</view> </view>
<view class=""> <view class="">
<view class="banner-swiper" v-if="swiperList.length > 0"> <view class="banner-swiper" v-if="swiperList.length > 0">
@ -34,20 +34,17 @@
</view> </view>
</view> </view>
<view class="work-title">实验室巡检</view>
<swiperSlider></swiperSlider>
<view class="work-title">设备统计</view> <view class="work-title">设备统计</view>
<eacharts_pie :data="pieInfo"></eacharts_pie> <eachartsPie :echartData="pieInfo"></eachartsPie>
<view class="work-title">检修单状态</view> <view class="work-title">检修单状态</view>
<eachartsPie :echartData="pieInfo"></eachartsPie>
<!-- <view>
<alarm></alarm>
</view> -->
<view class="work-title">维修统计</view> <view class="work-title">维修统计</view>
<view class="statistics"> <view class="statistics">
<eacharts :type="'maintenanceStatistics'"></eacharts> <eacharts :type="'maintenanceStatistics'"></eacharts>
<eacharts :type="'maintenanceStatisticsPie'"></eacharts> <!-- <eacharts :type="'maintenanceStatisticsPie'"></eacharts> -->
</view> </view>
</view> </view>
<betone-tabbar ref="tabbarRef" /> <betone-tabbar ref="tabbarRef" />
@ -58,13 +55,13 @@
import swiperSlider from "./components/swiper.vue"; import swiperSlider from "./components/swiper.vue";
import alarm from "./components/alarm.vue"; import alarm from "./components/alarm.vue";
import eacharts from "./components/eacharts.vue"; import eacharts from "./components/eacharts.vue";
import eacharts_pie from "./components/eacharts_pie.vue"; import eachartsPie from "./components/eacharts_pie.vue";
export default { export default {
components: { components: {
swiperSlider, swiperSlider,
alarm, alarm,
eacharts, eacharts,
eacharts_pie eachartsPie
}, },
data() { data() {
return { return {
@ -72,23 +69,21 @@ export default {
workList: [], workList: [],
pieInfo: [],// pieInfo: [],//
noticeList: [ noticeList: [
'寒雨连江夜入吴',
'平明送客楚山孤',
'洛阳亲友如相问',
'一片冰心在玉壶'
],// ],//
}; };
}, },
onLoad() {
this.pieStat()
},
onShow() { onShow() {
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.tabbarRef.getPermission(); this.$refs.tabbarRef.getPermission();
this.getNoticeList()
// this.BetLoading.show();
// setTimeout(() => {
// this.BetLoading.hide();
// }, 1000);
}); });
// //
this.getUserInfo() this.getUserInfo()
this.getoverview() this.getoverview()
}, },
@ -167,7 +162,18 @@ export default {
uni.navigateTo({ uni.navigateTo({
url: '/pages/notice/announcement', url: '/pages/notice/announcement',
}); });
},
getNoticeList() {
this.$u.api.getNoticeList().then(res => {
if (res.code == 200) {
let data = res.data.records
data.forEach(item => {
this.noticeList.push(item.title)
})
} }
})
},
}, },
}; };
</script> </script>
@ -257,10 +263,10 @@ export default {
} }
.menu_box { .menu_box {
width: 100%;
background: #fff; background: #fff;
position: relative; position: relative;
margin: 0 32rpx;
border-radius: 20rpx;
&::after { &::after {
content: ''; content: '';
position: absolute; position: absolute;

@ -1,7 +1,8 @@
<template> <template>
<view class="notice-list"> <view class="notice-list">
<scroll-view scroll-y="true" style="height:calc(100vh - 140rpx);width: 100%;background: #F5F5F5;margin-top:32rpx" <scroll-view scroll-y="true"
style="height:calc(100vh - 140rpx);width: 100%;background: #F5F5F5;margin-top:32rpx"
:refresher-triggered="triggered" :refresher-enabled="true" @refresherrefresh="refresherrefresh" :refresher-triggered="triggered" :refresher-enabled="true" @refresherrefresh="refresherrefresh"
refresher-background="#f1f1f1" @scrolltolower="onListBottom"> refresher-background="#f1f1f1" @scrolltolower="onListBottom">
<ul class="card"> <ul class="card">
@ -9,12 +10,11 @@
<view class="title"> <view class="title">
<view class="text"> <view class="text">
<view>{{ item.title }}</view> <view>{{ item.title }}</view>
<view class="mark" v-if="!item.readStatus"></view> <!-- <view class="mark" v-if="!item.readStatus"></view> -->
</view> </view>
<view style="flex-shrink: 0;color: #999999;">{{ item.createdAt }}</view> <view style="flex-shrink: 0;color: #999999;">{{ item.categoryName }}</view>
</view> </view>
<view> <view>
<!-- {{ item.content }} -->
<u-parse :html="item.content"></u-parse> <u-parse :html="item.content"></u-parse>
</view> </view>
</li> </li>
@ -32,12 +32,6 @@
data() { data() {
return { return {
dataList: [ dataList: [
{
title:'11111',//
createdAt:'转发通知',
content:'222<p>44444444444</p>',
readStatus:true
}
], ],
current: 0, current: 0,
style: { style: {
@ -64,18 +58,21 @@
this.reSearch() this.reSearch()
} }
}, },
methods: { methods: {
getList() { getList() {
// this.$wx_http.get(requestName['pageNotice'], this.search).then(res => { this.$u.api.getNoticeList(this.search).then(res => {
// let data = res.data.records if (res.code == 200) {
// this.scrollType = '' let data = res.data.records
// this.triggered = false this.scrollType = ''
// if (data.length >= this.search.pageSize) { this.triggered = false
// this.scrollType = 'more' if (data.length >= this.search.pageSize) {
// } this.scrollType = 'more'
// this.dataList = this.dataList.concat(data) }
// }) this.dataList = this.dataList.concat(data)
}
})
}, },
reSearch() { reSearch() {
@ -106,6 +103,7 @@
height: calc(100vh - 0px); height: calc(100vh - 0px);
background: #F5F5F5; background: #F5F5F5;
overflow: hidden; overflow: hidden;
.mark-read-btn { .mark-read-btn {
background: #FFFFFF; background: #FFFFFF;
border-radius: 8rpx; border-radius: 8rpx;

Loading…
Cancel
Save