<template>
	<view class="viewport">
		<CustomNavbar />
		<u-tabs :list="tabsList" :is-scroll="false" :current="tabsCurrent" @change="fnTabsChg"></u-tabs>
		<view style="padding:0px 20px; 0px 20px">
			<u-form ref="dataForm" label-width="120">
				<u-form-item label="车间名称" prop="leaveReason">
					<jnpf-select v-model="workVal" placeholder="请选择车间名称" :options="workshopList"
						@change="fnGetList"></jnpf-select>
				</u-form-item>
			</u-form>
		</view>
		<u-card v-for="orderItem in orderList">
			<view class="" slot="head">
				<text>{{ orderItem.deviceCode }}（{{ orderItem.deviceName }}）</text>
			</view>
			<view class="" slot="body">
				<u-row gutter="16">
					<u-col span="12">
						<text>生产日期：</text><text>{{ fnFormat(orderItem.manufactureTime)   }}&nbsp; &nbsp; &nbsp;{{orderItem.className }}</text>
					</u-col>
					<u-col span="12">
						<text>产品名称：</text><text>{{ orderItem.productName }}</text>
					</u-col>
					<u-col span="12">
						<text>规格型号：</text><text>{{ orderItem.models }}</text>
					</u-col>
					<u-col span="12">
						<text>计划数量：</text><text>{{ orderItem.planNumber }} {{ orderItem.measurementUnit }}</text>
					</u-col>
					<u-col span="12">
						<text>待确认数量：</text><text>{{ orderItem.isConfirmNums }} {{ orderItem.measurementUnit }}</text>
					</u-col>
					<u-col span="12">
						<text>开始结束时间：</text><text>{{ orderItem.startTime }} - {{ orderItem.endTime }}</text>
					</u-col>
				</u-row>
			</view>
			<view :style="{ textAlign: 'center' }" slot="foot">
				<u-button v-if="fnTabsNow(tabsCurrent)['flag'] == '1'" size="mini" :custom-style="{
            color: 'white',
            margin: '5px',
            backgroundColor: '#2A4BB4',
          }" :plain="true" shape="circle" @click="fnPopSure(orderItem)">
					<text :style="{ padding: '20px' }">报工</text>
				</u-button>
				<u-button v-else-if="fnTabsNow(tabsCurrent)['flag'] == '2'" size="mini" :custom-style="{
            color: 'white',
            margin: '5px',
            backgroundColor: '#2A4BB4',
          }" :plain="true" shape="circle" @click="fnPopSureInfo(orderItem)">
					<text :style="{ padding: '20px' }">查看详情</text>
				</u-button>
			</view>
		</u-card>
		<template v-if="orderList.length==0">
			<u-empty mode="data"></u-empty>
		</template>
		<PopSure ref="refPopSure" @evtRefresh="fnRefreshA"></PopSure>
		<PopSureInfo ref="refPopSureInfo"></PopSureInfo>
		<u-top-tips ref="uTips"></u-top-tips>
	</view>
</template>

<script>
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	import {
		mapGetters
	} from "vuex";
	import dayjs from "dayjs";
	import {
		getOrderList,
		takeOrder,
		finish,
	} from "@/api/yys/materialProcurementOrder.js";
	import {
		workshop
	} from '@/api/yys/eqmt.js'
	import {
		confirm
	} from "@/api/yys/dayWork.js";
	import CustomNavbar from "./components/CustomNavbar";
	import PopSure from "./components/PopSure";
	import PopSureInfo from "./components/PopSureInfo";
	export default {
		components: {
			CustomNavbar,
			PopSure,
			PopSureInfo
		},
		mixins: [],
		data() {
			return {
				workVal: '',
				isLoading: false,
				tabsList: [{
						name: "待报工",
						flag: "1"
					},
					{
						name: "已报工",
						flag: "2"
					},
				],
				tabsCurrent: 0,
				workshopList: [],
				orderList: [],
			};
		},
		watch: {},
		computed: {},
		onLoad(params) {
			this.getWorkshop();
			this.fnGetList();
		},
		onUnload() {},
		methods: {
			getWorkshop() {
				workshop()
					.then(res => {
						if (res.code == 200) {
							res.data.forEach((item, i) => {
								this.workshopList.push({
									id: item,
									fullName: item
								})
							})
						}
					})
					.catch(err => {
						console.log(err)
					})
			},
			fnTabsChg(index) {
				this.tabsCurrent = index;
				this.orderList = []
				this.fnGetList();
			},
			fnTabsNow(tabsCurrent) {
				let tabsNow = this.tabsList[this.tabsCurrent];
				return tabsNow;
			},
			fnGetList() {
				let tabsNow = this.tabsList[this.tabsCurrent];
				let params = {
					flag: tabsNow.flag,
					workshopName: this.workVal
				};
				confirm(params)
					.then((res) => {
						if (res.code == 200) {
							this.orderList = res.data;
						}
					})
					.catch((err) => {
						console.log(err);
					});
			},
			fnPopSure(orderItem) {
				this.$refs.refPopSure.init(orderItem);
			},
			fnPopSureInfo(orderItem) {
				this.$refs.refPopSureInfo.init(orderItem);
			},
			fnRefreshA() {
				// this.$refs.uTips.show({
				// 	title: "报工确认提交成功",
				// 	type: "success",
				// 	duration: "2300",
				// });
        // if (confirm("报工确认提交成功")) {
        //   // 用户点击了“确定”按钮
        //   this.fnGetList();
        // } else {
        //   // 用户点击了“取消”按钮
        //   console.log("用户取消了操作");
        // }
				this.fnGetList();
			},
			fnFormat(time, fmtStr = "YYYY-MM-DD") {
				return dayjs(time).format(fmtStr);
			},
		},
	};
</script>

<style lang="scss"></style>
