agv入料页面完善
This commit is contained in:
@@ -1,9 +1,12 @@
|
||||
<template>
|
||||
<view>
|
||||
<dateCheck></dateCheck>
|
||||
<view class="agv-page">
|
||||
<dateCheck @dateChouse="dateChouse"></dateCheck>
|
||||
<uni-segmented-control :current="queryData.state" :values="items" @clickItem="onClickItem" styleType="button"
|
||||
activeColor="#5500ff" class="segmented-control-box"></uni-segmented-control>
|
||||
<scroll-view class="scroll-view-box" :scroll-y="true">
|
||||
<view v-for="(item, index) in oldMaterialList">
|
||||
<materialItem style="background-color: darkgray" :materialInfo="item"></materialItem>
|
||||
<view v-for="(item, index) in list">
|
||||
<orderItem :data="item"></orderItem>
|
||||
<!-- <materialItem style="background-color: darkgray" :materialInfo="item"></materialItem> -->
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
@@ -11,32 +14,67 @@
|
||||
|
||||
<script>
|
||||
import dateCheck from '@/pages/agv/components/dateCheck/index.vue';
|
||||
import orderItem from '@/pages/agv/components/orderItem/index.vue';
|
||||
export default {
|
||||
components: {
|
||||
dateCheck
|
||||
dateCheck,
|
||||
orderItem
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
oldMaterialList: [],
|
||||
queryData: {
|
||||
year: 0,
|
||||
week: 0,
|
||||
day: 0,
|
||||
state: 1,
|
||||
},
|
||||
|
||||
items: ['全部', '未完成', '已完成'],
|
||||
list: [1,2,3],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
getList() {
|
||||
const queryData = this.queryData;
|
||||
},
|
||||
onClickItem(e) {
|
||||
if (this.queryData.state != e.currentIndex) {
|
||||
this.queryData.state = e.currentIndex;
|
||||
}
|
||||
this.getList();
|
||||
},
|
||||
dateChouse(data) {
|
||||
this.queryData.year = data.year
|
||||
this.queryData.week = data.week
|
||||
this.queryData.date = data.date
|
||||
console.log(data);
|
||||
this.getList();
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.scroll-view-box {
|
||||
.agv-page {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.segmented-control-box {
|
||||
width: 94%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.scroll-view-box {
|
||||
width: 94%;
|
||||
margin: 0 auto;
|
||||
margin-top: 30px;
|
||||
height: 400px;
|
||||
height: 450px;
|
||||
padding: 10px;
|
||||
background-color: rgba(179, 179, 179, 0.7);
|
||||
border-radius: 5px;
|
||||
}
|
||||
.scroll-view-last {
|
||||
}
|
||||
|
||||
.scroll-view-last {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
font-size: 20px;
|
||||
@@ -49,12 +87,13 @@
|
||||
padding-right: 10px;
|
||||
border-radius: 10px;
|
||||
background-color: white;
|
||||
}
|
||||
.button-box {
|
||||
}
|
||||
|
||||
.button-box {
|
||||
width: 80%;
|
||||
margin: 10px auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,7 +1,8 @@
|
||||
<template>
|
||||
<div>
|
||||
<u-calendar :show="show" title="请选择工单日期"></u-calendar>
|
||||
<u-button @click="show = true">选择工单日期</u-button>
|
||||
<uni-calendar ref="calendar" :insert="false" @confirm="confirm" />
|
||||
<div class="button"><button @click="open">请选择工单时间</button></div>
|
||||
<div class="text">当前选择:{{year}}年-{{week}}周-{{date}}日</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -9,24 +10,62 @@
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
params: {
|
||||
year: true,
|
||||
month: true,
|
||||
day: true,
|
||||
hour: false,
|
||||
minute: false,
|
||||
second: false
|
||||
},
|
||||
year:0,
|
||||
week:0,
|
||||
date:0
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.year = new Date().getFullYear();
|
||||
this.week = this.getYearWeek(new Date().getFullYear(), new Date().getMonth()+1, new Date().getDate());
|
||||
this.date = new Date().getDay()
|
||||
this.emitData();
|
||||
},
|
||||
methods: {
|
||||
change(e) {
|
||||
console.log(e);
|
||||
open() {
|
||||
this.$refs.calendar.open();
|
||||
},
|
||||
confirm(e) {
|
||||
this.year = e.lunar.cYear;
|
||||
this.week = this.getYearWeek(e.lunar.cYear, e.lunar.cMonth, e.lunar.cDay);
|
||||
this.date = e.lunar.nWeek;
|
||||
this.emitData();
|
||||
|
||||
},
|
||||
// 选择日期
|
||||
emitData() {
|
||||
const data = {
|
||||
year:this.year,
|
||||
week:this.week,
|
||||
date:this.date
|
||||
}
|
||||
this.$emit('dateChouse', data)
|
||||
},
|
||||
getYearWeek(year, month, day) {
|
||||
/*
|
||||
date1是当前日期
|
||||
date2是当年第一天
|
||||
date3是当前日期是今年第多少天
|
||||
用date3 + 当前年的第一天的周差距的和在除以7就是本年第几周
|
||||
*/
|
||||
let date1 = new Date(year, parseInt(month) - 1, day),
|
||||
date2 = new Date(year, 0, 1),
|
||||
date3 = Math.round((date1.valueOf() - date2.valueOf()) / 86400000);
|
||||
return Math.ceil((date3 + ((date2.getDay() + 1) - 1)) / 7);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
<style scoped>
|
||||
.text{
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
font-weight: 700;
|
||||
}
|
||||
.button{
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
margin-top: 10px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,12 +1,24 @@
|
||||
<template>
|
||||
<div>
|
||||
<u-picker v-model="show" mode="time"></u-picker>
|
||||
<u-button @click="show = true">打开</u-button>
|
||||
<uni-list-chat title="uni-app" note="您收到一条新的消息" time="2020-02-02 20:20" clickable>
|
||||
<template v-slot:header>
|
||||
<!-- <image class="slot-image" src="/static/logo.png" mode="widthFix"></image> -->
|
||||
</template>
|
||||
<view class="chat-custom-right">
|
||||
<text class="chat-custom-text">任务</text>
|
||||
<!-- 需要使用 uni-icons 请自行引入 -->
|
||||
<uni-icons type="star-filled" color="#999" size="18"></uni-icons>
|
||||
</view>
|
||||
</uni-list-chat>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
data: {
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
|
||||
Reference in New Issue
Block a user