封装看板跳转页面
This commit is contained in:
@@ -1,19 +1,18 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<my-header></my-header>
|
||||
<view>
|
||||
<web-view :src="url"></web-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MyHeader from '@/components/MyHeader.vue'
|
||||
export default {
|
||||
components: {
|
||||
MyHeader
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
url: ''
|
||||
};
|
||||
},
|
||||
onLoad (options) {
|
||||
this.url = options.url
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
64
pages/index.vue
Normal file
64
pages/index.vue
Normal file
@@ -0,0 +1,64 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="content">
|
||||
<view class="zd-row">
|
||||
<view class="zd-col-6 label">地址</view>
|
||||
<view class="zd-col-17"><input type="text" class="inputStyle" v-model="val"></view>
|
||||
</view>
|
||||
<button class="button" @tap="toConfig">配置</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
val: this.$store.getters.baseUrl
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
toConfig () {
|
||||
let obj = {
|
||||
baseUrl: this.val
|
||||
}
|
||||
this.$store.dispatch('setConfig', obj)
|
||||
let url = '/pages/home' + '?url=' + this.val
|
||||
uni.redirectTo({
|
||||
url: url
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '../common/style/mixin.styl';
|
||||
.container
|
||||
display flex
|
||||
flex-direction column
|
||||
justify-content center
|
||||
align-items center
|
||||
width 100%
|
||||
height 100%
|
||||
.content
|
||||
display flex
|
||||
flex-direction column
|
||||
justify-content center
|
||||
width 500px
|
||||
height 100%
|
||||
.label
|
||||
_font(16px, 40px, #fff,,)
|
||||
.inputStyle
|
||||
height 40px
|
||||
_font(16px, 40px, #606266,,)
|
||||
padding 0 15px
|
||||
border none
|
||||
background-color #ffffff
|
||||
.button
|
||||
_wh(100%, 40px)
|
||||
_font(18px, 40px, #fff,,center)
|
||||
margin 30px 0 10px 0
|
||||
background-color #2778f3
|
||||
border-radius 3px
|
||||
</style>
|
||||
209
pages/screen.vue
Normal file
209
pages/screen.vue
Normal file
@@ -0,0 +1,209 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<my-header></my-header>
|
||||
<view class="left_bg"></view>
|
||||
<view class="right_bg"></view>
|
||||
<view class="button_bg"></view>
|
||||
<div class="n_body_container">
|
||||
<div class="n_left_wraper">
|
||||
<div class="w_wraper">
|
||||
<div class="item_wraper">
|
||||
<div class="title_wraper">
|
||||
<p>原料库存</p>
|
||||
</div>
|
||||
<div class="content_wraper content_wraper_2">
|
||||
<div class="pie_wraper">
|
||||
<div id="home_1" style="width: 100%; height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item_wraper">
|
||||
<div class="title_wraper">
|
||||
<p>当日出入</p>
|
||||
</div>
|
||||
<div class="content_wraper">
|
||||
<div class="w_wraper">
|
||||
<div id="home_2" style="width: 100%; height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item_wraper">
|
||||
<div class="title_wraper">
|
||||
<p>历史分析</p>
|
||||
</div>
|
||||
<div class="content_wraper">
|
||||
<div class="w_wraper">
|
||||
<div id="home_3" style="width: 100%; height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="n-center_wraper">
|
||||
<div class="w_wraper">
|
||||
<div class="item_wraper item_wraper_1">
|
||||
<div class="title_wraper title_wraper_1">
|
||||
<p>设备监控</p>
|
||||
</div>
|
||||
<div class="content_wraper content_wraper_3">
|
||||
<div class="agv_wrap">
|
||||
<div class="agv_item" v-for="(e , i) in agvList" :key="'agv' + i">
|
||||
<div class="agv_left">
|
||||
<div class="agv_img"></div>
|
||||
<p class="p1">{{ e.device_name }}</p>
|
||||
</div>
|
||||
<div class="agv_info">
|
||||
<div class="agv_txt">
|
||||
<p class="p2">任务号</p>
|
||||
<p class="p3">{{ e.task_code }}</p>
|
||||
</div>
|
||||
<div class="agv_txt">
|
||||
<p class="p2">电量</p>
|
||||
<p class="p3">{{ e.battery_level }}</p>
|
||||
</div>
|
||||
<div class="agv_txt">
|
||||
<p class="p2">状态</p>
|
||||
<p class="p3">{{ e.status }}</p>
|
||||
</div>
|
||||
<div class="agv_txt">
|
||||
<p class="p2">提示信息</p>
|
||||
<p class="p3">{{ e.message }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="agv_wrap rgv_wrap">
|
||||
<div class="agv_item rgv_item" v-for="(e , i) in rgvList" :key="'rgv' + i">
|
||||
<div class="agv_left rgv_left">
|
||||
<div class="agv_img rgv_img"></div>
|
||||
<p class="p1">{{ e.device_name }}</p>
|
||||
</div>
|
||||
<div class="rgv_info">
|
||||
<div class="agv_txt rgv_txt">
|
||||
<p class="p2">当前位置</p>
|
||||
<p class="p3">{{ e.current_loc }}</p>
|
||||
</div>
|
||||
<div class="agv_txt rgv_txt">
|
||||
<p class="p2">目标位置
|
||||
</p>
|
||||
<p class="p3">{{ e.target_loc }}</p>
|
||||
</div>
|
||||
<div class="agv_txt rgv_txt">
|
||||
<p class="p2">电量</p>
|
||||
<p class="p3">{{ e.battery_level }}</p>
|
||||
</div>
|
||||
<div class="agv_txt rgv_txt">
|
||||
<p class="p2">状态</p>
|
||||
<p class="p3">{{ e.status }}</p>
|
||||
</div>
|
||||
<div class="agv_txt rgv_txt">
|
||||
<p class="p2">提示信息</p>
|
||||
<p class="p3">{{ e.message }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item_wraper">
|
||||
<div class="title_wraper title_wraper_1">
|
||||
<p>当日搬运任务</p>
|
||||
</div>
|
||||
<div class="content_wraper" style="padding: 0">
|
||||
<div class="scroll_wrap">
|
||||
<ul class="scroll_tab_1">
|
||||
<li>创建时间</li>
|
||||
<li>设备</li>
|
||||
<li>起点位置</li>
|
||||
<li>终点位置</li>
|
||||
<li>任务号</li>
|
||||
<li>任务状态</li>
|
||||
</ul>
|
||||
<div class="scroll_container_1">
|
||||
<vue-seamless-scroll :data="taskList" :class-option="defaultOption1">
|
||||
<ul class="scroll-ul_1">
|
||||
<li v-for="(e, i) in taskList" :key="i">
|
||||
<div class="scroll-ul_1_div">{{e.create_time}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.carno}}</div>
|
||||
<!-- <div class="scroll-ul_1_div">
|
||||
<span class="state" :class="'state_' + e.status"></span>
|
||||
<p class="state_name">{{['关机', '待机', '生产中', '故障'][Number(e.status)]}}</p>
|
||||
</div> -->
|
||||
<div class="scroll-ul_1_div">{{e.start_point_code}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.next_point_code}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.task_code}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.task_status}}</div>
|
||||
</li>
|
||||
</ul>
|
||||
</vue-seamless-scroll>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="n_right_wraper">
|
||||
<div class="w_wraper">
|
||||
<div class="item_wraper">
|
||||
<div class="title_wraper">
|
||||
<p>当日生产统计</p>
|
||||
</div>
|
||||
<div class="content_wraper">
|
||||
<div class="w_wraper">
|
||||
<div id="home_4" style="width: 100%; height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item_wraper item_wraper_1">
|
||||
<div class="title_wraper">
|
||||
<p>当日车间上下料</p>
|
||||
</div>
|
||||
<div class="content_wraper">
|
||||
<div class="w_wraper">
|
||||
<div id="home_5" style="width: 100%; height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MyHeader from '@/components/MyHeader.vue'
|
||||
export default {
|
||||
components: {
|
||||
MyHeader
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.left_bg
|
||||
position absolute
|
||||
left 0
|
||||
top 0
|
||||
width 17px
|
||||
height 100%
|
||||
background center / 100% auto url('../static/image/bg-left.png') no-repeat
|
||||
.right_bg
|
||||
position absolute
|
||||
right 0
|
||||
top 0
|
||||
width 17px
|
||||
height 100%
|
||||
background center / 100% auto url('../static/image/bg-right.png') no-repeat
|
||||
.button_bg
|
||||
position absolute
|
||||
left 0
|
||||
bottom 0
|
||||
width 100%
|
||||
height 20px
|
||||
background center center / auto 100% url('../static/image/bg-button.png') no-repeat
|
||||
</style>
|
||||
@@ -39,7 +39,7 @@
|
||||
}
|
||||
this.$store.dispatch('setConfig', obj)
|
||||
uni.redirectTo({
|
||||
url: '/pages/home'
|
||||
url: '/pages/screen'
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user