TMRAppBle/pages/index.stml

1112 lines
28 KiB
Plaintext
Raw Normal View History

2023-10-19 15:00:17 +08:00
<template>
<view class="index_wrap">
<dxx-loading loadingtext="提交中" :show="loadingShow"></dxx-loading>
<view class="index_header">
<view class="header_left">
<picker class="picker" range={sbList} range-key="name" mode="selector" onChange={this.carsChange}>
<text style="font-weight:900">{carName}</text>
</picker>
<button type="button" class="header_btn" style="margin-left:25px;" @click="reloadPage">初始化</button>
<view class="header_led" @click="showZifuka">
<text class="header_led_text">WIFI:{{wifiName}}{{Rssi}}</text>
</view>
</view>
<view class="header_right">
<text class="left_text">机车手:</text>
<text class="left_text">{driveName}</text>
<button type="button" class="header_btn1" style="margin-left:35px;" @click="handleBackSys">退出登录</button>
<button type="button" class="header_btn" style="margin-left:5px;" @click="refreshDayPlan">更新配方</button>
</view>
</view>
<view class="index_section">
<scroll-view class="section_left" scroll-y>
<view v-for="(item,index) in carArr" class="left_item"
:style="{backgroundColor:index === currCarIndex?'#1482f0':'#ffffff'}">
<text class="left_item_text" @click="handleCarClick(index, item)"
:style="{color:index === currCarIndex?'#ffffff':'#000000'}">{item.name}</text>
</view>
</scroll-view>
<view class="section_right">
<scroll-view class="section_right_scroll" scroll-x>
<lanyun-steps :list="stepsList" :current="activeStepsNum" active-color="#1482f0" direction="row" />
</scroll-view>
<view class="right_operation">
<view class="operation_card">
<frame name="operationCard" v-bind:url="url"></frame>
</view>
<view class="opera_item_btn">
<view class="card_col_name">
<text class="card_col_name_text">{{batchName}},</text>
<text class="card_col_name_text">{{feedName}}:</text>
<text class="card_col_name_text">{{plan}}kg</text>
</view>
<view class="next_btn" @click="handleNext" v-if="feedStatus">
<image src="../image/loading.gif" v-show="isImgLoading" />
<text class="next_btn_text">下一步</text>
</view>
</view>
</view>
</view>
</view>
<view class="index_footer">
<text> V{{version}}</text>
<view v-for="(item,index) in classArr" class="footer_item"
:style="{backgroundColor:index === currClassIndex?'#1482f0':'#ffffff'}"
@click="handleClassClick(index,item)">
<text :style="{color:index === currClassIndex?'#ffffff':'#000000'}"
class="footer_text_one">{item.name}({item.time})</text>
</view>
</view>
<dialog id="dialog" class='dialog'>
<view class='d-area'>
<text class='title'>温馨提示</text>
<scroll-view class="content">
<text>是否退出当前账号?</text>
</scroll-view>
<view class='nav'>
<button class="btn" @click="handldeConfirmBtn('0')">取消</button>
<button class="btn" style='margin-left:40px;' @click="handldeConfirmBtn('1')">确定</button>
</view>
</view>
</dialog>
</view>
</template>
<script>
//步骤条
import "../components/lanyun-steps.stml"
//loading
import "../components/dxx-loading.stml"
import { POST, GET } from '../script/req.js'
import { socketUtil } from '../script/module/socket.js'
import { bmLocationUtil } from '../script/module/location.js'
import { Util } from '../script/util.js'
import { TTSUtil } from '../script/module/tts.js'
import { Permission } from '../script/permission.js'
import '../script/api.js'
export default {
name: 'index',
data() {
return {
wifiName: '',
Rssi: '',
weightStatus: false,
version: '',
ledStatus: true,
//机车手
driveName: '',
ifchanche: false,
templateName: '',
templetType: '',
sbId: '',
sbList: [],
// 设备名称
carName: '',
// 是否饲喂模式中
feedStatus: true,
//显示loading图标
isImgLoading: false,
//当前饲料名称
feedName: '',
batchName: '',
// 计划重量
plan: null,
// 装载重量
feed: 0,
// 当前车总重量
planTotal: 0,
total: 0,
//班次数据
classArr: [],
//当前班次
currClassIndex: 0,
//车次数据
carArr: [],
// 当前车次
currCarIndex: 0,
//当前的步骤状态值
activeStepsNum: 0,
//计划装料列表
stepsList: [],
url: '',
//局部操作loading
loadingShow: false,
gpsList: [],
refresh: true,
socketManager: null,
socketServerClient: null,
resultInterval:null,
}
},
methods: {
apiready() {
// socketManager = api.require('socketManager');
// socketServerClient = api.require('socketServerClient');
this.initPage()
api.addEventListener({
name : 'keyback'
}, function(ret, err) {
console.log('监听到返回按键');
});
// if (api.systemVersion > 10) {
// this.data.ifchanche = true
// this.startServer()
// }else{
// this.data.ifchanche = false
// }
},
startServer() {
let _this = this
// 平板服务
socketServerClient.startServer(
{
port: 2223,
heart: {
heartTime: 3,
heartMsg: '',
receiveMsg: ''
},
send: {
head: '',
end: 'ff',
outTime: 5,
sendByLength: {
length: 8
}
},
receive: {
head: '',
end: 'ff',
outTime: 5,
sendByLength: {
length: 8
}
}
}, function (ret, err) {
if (ret.status && ret.receiveMsg) {
console.log(api.deviceName + '' + ret.receiveMsg)
}
}
);
},
// 主机连接
clientConnect() {
let _this = this;
socketManager.createSocket({
host: '192.168.2.11',
port: 2223
}, function (ret, err) {
if (ret.state == 102) {
_this.writeMsg(ret.sid)
}
});
},
writeMsg(sid) {
var msg = Number(Math.random() * 10000).toFixed(2)
let _this = this;
socketManager.write({
sid: sid,
data: msg + 'ff'
}, function (ret, err) {
if (ret.status) {
_this.closeSocket(sid)
}
});
},
closeSocket(sid) {
socketManager.closeSocket({
sid: sid
}, function (ret, err) {
if (ret.status) {
// console.log(JSON.stringify(ret));
} else {
// console.log(JSON.stringify(err));
}
});
},
reloadPage() {
let _this = this;
api.confirm({
title: '提醒',
msg: '确认重新初始化页面么?',
buttons: ['确认', '取消']
}, function (ret, err) {
if (1 == ret.buttonIndex) {
_this.initPage()
}
});
},
//初始化页面
initPage() {
let _this = this
clearInterval(_this.data.resultInterval)
_this.data.resultInterval = setInterval(function () {
var feedListCache = []
var cacheList = api.getPrefs({ sync: true, key: 'feedListCache' })
// 存在
if (cacheList && cacheList!='' && cacheList!='[]') {
feedListCache = JSON.parse(cacheList)
POST('resultUpload', feedListCache[0], {}).then(ret => {
if (ret.code === 200) {
feedListCache.splice(0,1);
api.setPrefs({
key: 'feedListCache',
value: feedListCache
});
}
}).catch(err => {
api.toast({
msg: JSON.stringify(err)
})
})
}else{
}
}, 10000);
_this.resetData()
Util.appOpen()
_this.data.wifiName = ''
_this.data.Rssi = ''
var wifi = api.require('bgnWiFi');
wifi.getWifiInfo(function (ret, err) {
if (ret.status && ret.info) {
_this.data.wifiName = ret.info.SSID
}
});
_this.data.version = api.appVersion
api.clearCache(function() {
console.log("清除完成");
});
// 稳定状态false
api.setGlobalData({ key: 'wendin', value: false });
// 定时查询是否稳定
// setInterval(function () {
// var state = api.getGlobalData({ key: 'wendin' });
// if (state) {
// _this.handleNext()
// api.setGlobalData({ key: 'wendin', value: false });
// }
// }, 2000)
// 是否开启定位
// _this.ifHasLocation()
var classArr = api.getPrefs({
sync: true,
key: 'classArr'
});
if (classArr) {
_this.data.classArr = JSON.parse(classArr)
}
var carArr = api.getPrefs({
sync: true,
key: 'carArr'
});
if (carArr) {
_this.data.carArr = JSON.parse(carArr)
}
var sbList = api.getPrefs({
sync: true,
key: 'sbList'
});
if (sbList) {
_this.data.sbList = JSON.parse(sbList)
_this.data.sbId = JSON.parse(sbList)[0].sbId;
_this.data.carName = JSON.parse(sbList)[0].name;
}
// 获取登录信息
var loginUser = api.getPrefs({ sync: true, key: 'loginUser' })
var obj = JSON.parse(loginUser);
_this.data.driveName = obj.nickName
// 查询设备列表
_this.getSbList()
// 初始化班次
_this.initTime();
// 初始化语音播报
TTSUtil.initTTS()
},
//下一步
handleNext() {
let _this = this;
var json = _this.data.stepsList;
var date = new Date()
// 获取echarts页面饲喂结果
var feedJson = api.getGlobalData({ key: 'feedJson' });
if (!_this.data.isImgLoading) {
_this.data.isImgLoading = true;
_this.resultUpload(date, json, feedJson)
}
},
/**
* 查询设备列表
*/
getSbList() {
let that = this;
GET('sbList?sourceCow=' + api.getPrefs({ sync: true, key: 'sourceCow' })).then(ret => {
that.data.sbId = ret.data[0].sbId;
api.setGlobalData({ key: 'sbId', value: that.data.sbId });
that.data.carName = ret.data[0].name;
// that.initCamera(ret.data[0])
that.data.sbList = ret.data;
api.setPrefs({
key: 'sbList',
value: that.data.sbList
});
}).catch(err => {
api.toast({
msg: JSON.stringify(err)
})
})
},
/**
* 初始化班次
*/
initTime() {
let that = this
that.data.classArr = []
GET('time?sourceCow=' + api.getPrefs({ sync: true, key: 'sourceCow' })).then(ret => {
ret.data.forEach(e => {
var json = { name: e.name, time: e.start + '-' + e.end, batch: e.batch }
that.data.classArr.push(json)
})
api.setPrefs({
key: 'classArr',
value: that.data.classArr
});
var param = {
classCode: that.data.classArr[0].batch,
sbId: that.data.sbId,
sourceCow: api.getPrefs({ sync: true, key: 'sourceCow' }),
dateOf: Util.getDateStr(new Date())
}
this.initTrain(param);
}).catch(err => {
api.toast({
msg: JSON.stringify(err)
})
})
},
/**
* 初始化当前班次所有车次
*/
initTrain(param) {
let that = this;
that.data.feedStatus = true
that.data.carArr = []
that.data.feedName = '';
that.data.batchName = '';
that.data.plan = '';
that.data.stepsList = []
POST('planDay', param, {}).then(ret => {
if (ret.data.length == 0) {
api.toast({
msg: "该班次暂无车次信息"
})
var path = '../html/echarts_circle.html?id=0&plan=0&total=0&beforeWeight=0&type=1'
that.data.url = path
} else if (ret.data.length > 0) {
ret.data.forEach(e => {
let json = { id: e.id, name: '第' + e.trainNumber + '车(' + e.templetName + ')', trainNumber: e.trainNumber, classCode: e.classCode };
that.data.carArr.push(json)
})
api.setPrefs({
key: 'carArr',
value: that.data.carArr
});
var param = {
classCode: that.data.carArr[0].classCode,
sbId: that.data.sbId,
trainNumber: that.data.carArr[0].trainNumber,
sourceCow: api.getPrefs({ sync: true, key: 'sourceCow' }),
dateOf: Util.getDateStr(new Date())
}
this.initOne(param)
}
}).catch(err => {
api.toast({
msg: JSON.stringify(err)
})
})
},
/**
* 初始化当前班次每一车
*/
initOne(param) {
let that = this;
POST('planDay', param, {}).then(ret => {
if (ret.data.length == 0) {
api.toast({
msg: '该车次暂无计划信息',
location: 'middle'
})
}
ret.data.forEach(e => {
// 饲料
let feedJson = e.feedJson;
// 合并饲料和圈舍圈舍存入步骤stepsList
let json = [...e.feedJson, ...e.cowshedJson]
that.data.stepsList = json;
// 获取当前步骤下标
var index = that.data.activeStepsNum;
// 根据步骤下标取stepsList的值
// 饲料名称
that.data.feedName = json[index].name
// 班次名称
that.data.batchName = that.data.classArr[that.data.currClassIndex].name + that.data.carArr[that.data.currCarIndex].trainNumber
// 计划
that.data.plan = json[index].weight.toFixed(0)
// 获取当前车次总重量,配方名称,配方类型设备id
that.data.planTotal = e.total
that.data.templateName = e.templetName
that.data.templetType = e.templetType
that.data.sbId = e.sbId
// 设备id存入缓存
api.setGlobalData({ key: 'sbId', value: that.data.sbId });
// 清空之前所有feedJson
api.setGlobalData({ key: 'feedJson', value: {} });
// 设置下一个饲料搅拌开始时间和当前饲料名称到缓存
api.setGlobalData({ key: 'startTime', value: Util.currTimeFn(new Date()) });
api.setGlobalData({ key: 'feedName', value: that.data.feedName });
// 刷新echarts图表传入饲料id计划重量当前车次计划总重量之前重量未知,装料类型
// 判断是否圈舍
var batchRation = json[index].batchRation
var path = '';
if (undefined != batchRation) {
path = '../html/echarts_circle.html?id=' + json[index].id + '&plan=' + that.data.plan + '&total=' + that.data.planTotal + '&type=2&isFirst=true&allow=' + json[index].allow
} else {
path = '../html/echarts_circle.html?id=' + json[index].id + '&plan=' + that.data.plan + '&total=' + that.data.planTotal + '&type=1&isFirst=true&allow=' + json[index].allow
}
that.data.url = path
})
}).catch(err => {
api.toast({
msg: JSON.stringify(err)
})
})
},
initCamera(data) {
let _this = this;
if (!data.cameraAccessToken) {
api.alert({ msg: "该设备暂无摄像头信息,请检查配置" });
} else {
api.openFrame({
name: 'video',
scaleEnabled: false,
url: '../html/index.html',
rect: {
x: 555,
y: 80,
w: 220,
h: 180,
},
pageParam: {
data: data
}
});
}
},
resultUpload(date, json, feedJson) {
var dateOf = Util.getDateStr(date);
var dateTime = Util.currTimeFn(date)
let _this = this;
var param = {
dateOf: dateOf,
name: _this.data.feedName,
planWeight: feedJson.plan,
rationCowAmount: json[_this.data.activeStepsNum].cow,
batchRation: json[_this.data.activeStepsNum].batchRation,
feedWeight: feedJson.feed,
feedId: feedJson.id,
driver: _this.data.driveName,
type: feedJson.type,
sourceCow: api.getPrefs({ sync: true, key: 'sourceCow' }),
classCode: _this.data.currClassIndex + 1,
trainNumber: _this.data.currCarIndex + 1,
templet: _this.data.templateName,
templetType: _this.data.templetType,
sbId: _this.data.sbId,
createBy: _this.data.driveName,
start: api.getGlobalData({ key: 'startTime' }),
end: Util.currTimeFn(date),
time: Util.currTimeFn(date)
}
// 数据上传
_this.data.loadingShow = true;
var feedListCache = []
var cacheList = api.getPrefs({ sync: true, key: 'feedListCache' })
// 存在
if (cacheList && cacheList!='' && cacheList!='[]') {
feedListCache = JSON.parse(cacheList)
feedListCache.push(param)
api.setPrefs({
key: 'feedListCache',
value: feedListCache
});
}else{
feedListCache.push(param)
api.setPrefs({
key: 'feedListCache',
value: feedListCache
});
}
_this.data.isImgLoading = false;
_this.data.loadingShow = false;
// 设置下一个饲料开始时间
api.setGlobalData({ key: 'startTime', value: Util.currTimeFn(new Date()) });
// 读取下一个饲料信息
var data = _this.data.stepsList[_this.data.activeStepsNum + 1];
if (data == undefined) {
_this.data.refresh = true
// 计算本车此剩料
var remainWeight = api.getGlobalData({ key: 'totalWeight' }) - api.getGlobalData({ key: 'beforeWeight' })
var str = "";
if (remainWeight > 0) {
str = "剩料" + str + remainWeight + "kg";
// console.log("************************************当前车次剩料******************************" + remainWeight);
var remainData = {
cowAmount: json[_this.data.activeStepsNum].cowAmount,
cowshedId: feedJson.id,
dateOf: dateOf,
remain: remainWeight,
cowshedName: _this.data.feedName,
sourceCow: api.getPrefs({ sync: true, key: 'sourceCow' }),
createBy: "app上传"
}
POST('resultRemainUpload', remainData, {}).then(ret => {
// _this.data.isImgLoading = false;
})
}
// TTSUtil.readStr({ str: "本车饲喂完成" + str, voice: "xiaoyan" })
if (_this.data.currCarIndex + 1 == _this.data.carArr.length) {
// TTSUtil.readStr({ str: "本班次饲喂完成", voice: "xiaoyan" })
_this.data.feedStatus = false
} else {
_this.data.currCarIndex = _this.data.currCarIndex + 1
_this.data.activeStepsNum = 0
var param = {
classCode: _this.data.carArr[_this.data.currCarIndex].classCode,
sbId: _this.data.sbId,
trainNumber: _this.data.carArr[_this.data.currCarIndex].trainNumber,
sourceCow: api.getPrefs({ sync: true, key: 'sourceCow' }),
dateOf: dateOf
}
_this.initOne(param);
}
} else {
_this.data.refresh = false
_this.data.activeStepsNum += 1;
// 下一个index语音播报
var index = _this.data.activeStepsNum;
_this.data.feedName = json[index].name
_this.data.batchName = _this.data.classArr[_this.data.currClassIndex].name + _this.data.carArr[_this.data.currCarIndex].trainNumber
_this.data.plan = json[index].weight.toFixed(0)
_this.data.feed = 0;
// TTSUtil.readStr({ str: _this.data.feedName + _this.data.plan + "kg", voice: "xiaoyan" })
// setTimeout(() => {
// TTSUtil.readStr({ str: _this.data.feedName + _this.data.plan + "kg", voice: "xiaoyan" })
// }, 200);
// 清空之前所有feedJson
api.setGlobalData({ key: 'feedJson', value: {} });
// 设置下一个饲料搅拌开始时间和当前饲料名称到缓存
api.setGlobalData({ key: 'startTime', value: dateTime });
api.setGlobalData({ key: 'feedName', value: _this.data.feedName });
_this.data.url = ''
// 是否是圈舍
var batchRation = json[index].batchRation
if (undefined != batchRation) {
var path = '../html/echarts_circle.html?id=' + json[index].id + '&plan=' + _this.data.plan + '&total=' + _this.data.planTotal + '&beforeWeight=' + feedJson.beforeWeight + '&type=2&isFirst=false&allow=' + json[index].allow
} else {
var path = '../html/echarts_circle.html?id=' + json[index].id + '&plan=' + _this.data.plan + '&total=' + _this.data.planTotal + '&beforeWeight=' + feedJson.beforeWeight + '&type=1&isFirst=false&allow=' + json[index].allow
}
_this.data.url = path
}
// POST('resultUpload', param, {}).then(ret => {
// }).catch(err => {
// api.toast({
// msg: JSON.stringify(err)
// })
// })
},
// gps数据上报
startGpsService(timeInterval) {
let that = this;
bmLocationUtil.initLoc();
setInterval(function () {
bmLocationUtil.singleLocation({}, function (ret) {
if (that.data.gpsList.length < 10) {
that.data.gpsList.push(ret.location)
} else if (that.data.gpsList.length >= 10) {
console.log("*********************GPS信息上报*********************");
var data = {
sbId: that.data.sbId,
gpsList: that.data.gpsList,
}
that.gpsUpload(data)
that.data.gpsList = []
}
})
}, timeInterval)
},
/**
* 定位数据上报
*/
gpsUpload(data) {
POST('gpsUpload', data, {}).then(ret => {
}).catch(err => {
api.toast({
msg: JSON.stringify(err)
})
})
},
//选择饲喂车
carsChange(e) {
this.data.sbId = this.data.sbList[e.detail.value].sbId;
api.setGlobalData({ key: 'sbId', value: this.data.sbId });
this.data.carName = this.data.sbList[e.detail.value].name;
this.initTime();
// this.initCamera(this.data.sbList[e.detail.value])
},
//左侧车次点击事件
handleCarClick(index, item) {
this.data.isImgLoading = false;
this.data.activeStepsNum = 0
this.data.currCarIndex = index;
var param = {
classCode: item.classCode,
sbId: this.data.sbId,
trainNumber: item.trainNumber,
sourceCow: api.getPrefs({ sync: true, key: 'sourceCow' }),
dateOf: Util.getDateStr(new Date())
}
this.initOne(param)
},
//班次点击事件
handleClassClick(index, item) {
this.data.isImgLoading = false;
this.data.currCarIndex = 0
this.data.activeStepsNum = 0
this.data.feedStatus = true
var param = {
classCode: item.batch,
sbId: this.data.sbId,
sourceCow: api.getPrefs({ sync: true, key: 'sourceCow' }),
dateOf: Util.getDateStr(new Date())
}
this.initTrain(param);
this.data.currClassIndex = index;
},
// 字符卡配置信息
showZifuka() {
var size = 0;
var cacheList = api.getPrefs({ sync: true, key: 'feedListCache' })
// 存在
if (cacheList && cacheList!='' && cacheList!='[]') {
var feedListCache = JSON.parse(cacheList)
size = feedListCache.length
}
var msg = "字符卡配置 " + api.getGlobalData({ key: 'zfkTcp' }) + '字符卡地址' + api.getGlobalData({ key: 'addrList' })
msg += ", 称重配置 " + api.getGlobalData({ key: 'weightTcp' }) + ',未上传数据'+size+'条'
api.alert({ msg: msg });
},
// imgUpload(date){
// let _this = this;
// ezopenUtil.capPicture(function (ret) {
// api.ajax({
// url: 'http://192.168.0.107:8088/app/tmr/imgUpload',
// method: 'post',
// data: {
// values: {
// name: _this.data.feedName+date.getTime()
// },
// files: {
// file: ret.path
// }
// }
// },function(ret,err){
// });
// })
// },
//退出登录
handleBackSys() {
$('#dialog').show();
},
//确认退出
handldeConfirmBtn(type) {
$('#dialog').close();
if (type === '1') {
//跳转到login.stml
api.closeWin();
api.removePrefs({
key: 'token'
});
api.removePrefs({
key: 'loginUser'
});
api.removePrefs({
key: 'sourceCow'
});
api.clearCache(function() {
console.log("清除完成");
});
// api.removePrefs({
// key: 'feedListCache'
// });
}
},
/**
* 更新配方
*/
refreshDayPlan() {
api.clearCache(function() {
console.log("清除完成");
});
if (this.data.refresh) {
// this.resetData()
// // 获取登录信息
// var loginUser = api.getPrefs({ sync: true, key: 'loginUser' })
// var obj = JSON.parse(loginUser);
// this.data.driveName = obj.nickName
// // 查询设备列表
// this.getSbList()
var param = {
sourceCow: api.getPrefs({ sync: true, key: 'sourceCow' }),
dateOf: Util.getDateStr(new Date())
}
POST('planDayInit', param, {}).then(ret => {
this.initPage();
}).catch(err => {
api.toast({
msg: JSON.stringify(err)
})
})
} else {
console.log("**********************饲喂过程中禁止刷新**********************");
}
},
/**
* 重置数据
*/
resetData() {
this.data.version= '',
this.data.ifchanche= false,
this.data.wifiName= ''
this.data.Rssi= ''
this.data.total = 0,
this.data.weightStatus = false
this.data.ledStatus = true
this.data.driveName = ''
this.data.templateName = ''
this.data.templetType = ''
this.data.sbId = ''
this.data.sbList = []
this.data.carName = ''
this.data.feedStatus = true
this.data.isImgLoading = false
this.data.feedName = ''
this.data.batchName = ''
this.data.plan = null
this.data.feed = 0
this.data.planTotal = 0
this.data.total = 0
this.data.classArr = []
this.data.currClassIndex = 0
this.data.carArr = []
this.data.currCarIndex = 0
this.data.activeStepsNum = 0
this.data.stepsList = []
this.data.url = ''
this.data.loadingShow = false
this.data.gpsList = []
this.data.refresh = true
},
ifHasLocation() {
var statusJson = Permission.hasPermission('location');
if (statusJson[0].granted == true) {
// this.startGpsService(600000);
} else {
api.confirm({
title: '提醒',
msg: '需要开启定位权限,去设置?',
buttons: ['确认', '取消']
}, function (ret, err) {
if (1 == ret.buttonIndex) {
Permission.reqPermission('location', function (ret, err) {
if (ret) {
if (ret.never == true) {
return;
} else {
if (ret.list[0].granted == true) {
// this.startGpsService(600000);
} else {
return;
}
}
}
});
}
});
}
},
}
}
</script>
<style>
.index_wrap {
width: 100%;
height: 100%;
box-sizing: border-box;
padding: 1%;
position: relative;
}
.index_header {
width: 100%;
height: 8vh;
box-sizing: border-box;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
padding: 0 30px;
}
.header_left {
width: 50%;
display: flex;
flex-direction: row;
align-items: center;
}
.header_led {
display: flex;
flex-direction: row;
align-items: center;
margin-left: 10px;
}
.header_led_text {
font-size: 14px;
font-weight: 900;
color: #0616f8;
}
.header_led_circle {
width: 20px;
height: 20px;
border-radius: 50%;
background-color: rgb(160, 158, 158);
}
.header_btn {
background-color: #407ae6;
color: #ffffff;
/*平板 */
/* font-size: 20px;
height: 40px; */
/*手机 */
font-size: 12px;
height: 30px;
font-weight: 900;
width: 26%;
}
.header_btn1 {
/*平板 */
/* font-size: 20px;
height: 40px; */
/*手机 */
font-size: 12px;
height: 30px;
background-color: #e60d0d;
color: #ffffff;
font-weight: 900;
}
.header_right {
width: 50%;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.left_text {
/* 平板 */
/* font-size: 26px; */
/* 手机 */
font-size: 16px;
font-weight: 900;
}
.index_section {
width: 100%;
height: 86vh;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
box-sizing: border-box;
}
.section_left {
width: 20%;
height: 100%;
box-sizing: border-box;
border: 1px solid #a3caef;
}
.left_item {
box-sizing: border-box;
padding: 20px 0;
text-align: center;
}
.left_item_text {
/*平板 */
/* font-size: 26px; */
/*手机 */
font-size: 16px;
font-weight: 900;
}
.section_right {
width: 80%;
height: 100%;
box-sizing: border-box;
padding: 10px;
border-right: 1px solid #a3caef;
border-top: 1px solid #a3caef;
border-bottom: 1px solid #a3caef;
border-top-right-radius: 8px;
border-bottom-right-radius: 8px;
}
.section_right_scroll {
width: 100%;
height: 15vh;
}
.right_operation {
width: 100%;
height: 100%;
box-sizing: border-box;
padding: 10px;
}
.operation_card {
width: 100%;
height: 80%;
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
}
.card_col_name {
width: 100%;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.opera_item_btn {
width: 100%;
height: 20%;
text-align: right;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.next_btn {
background-color: #407ae6;
/* height: 70px; */
height: 100%;
width: 30%;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
border-radius: 4px;
}
.next_btn_text {
color: #ffffff;
/* font-size:35px; */
font-size: 25px;
font-weight: 900;
}
.card_col_name_text {
/* font-size: 75px; */
font-size: 25px;
font-weight: 900;
}
.index_footer {
width: 100%;
height: 7vh;
box-sizing: border-box;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
margin-top: 10px;
}
.footer_item {
width: 24%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
box-sizing: border-box;
border-radius: 4px;
margin-left: 10px;
border: 1px solid #1482f0;
}
.footer_text_one {
/* font-size: 26px; */
font-size: 14px;
font-weight: 900;
}
/* 弹窗样式 --start */
.dialog {
position: absolute;
top: 30%;
left: 50%;
transform: translateX(-50%);
height: 40%;
width: 30%;
border: 1px solid #ccc;
background-color: rgb(255, 255, 255);
}
.d-area {
height: 100%;
}
.title {
height: 40px;
font-weight: 900;
background-color: #ccc;
line-height: 40px;
padding-left: 8px;
}
.content {
flex: 1;
padding: 10px;
font-weight: 900;
}
.nav {
height: 45px;
flex-direction: row;
padding: 0px 30px;
justify-content: center;
align-items: center;
border-top: 1px solid #ccc;
}
.btn {
width: 100px;
height: 35px;
margin: 8px;
}
/* 弹窗样式 --end */
</style>