<template>
	<view class="mainBox">
		<uni-nav-bar background-color="#157A2C" color="#fff" fixed="true" statusBar="true" left-icon="back"
			:title="title" @clickLeft="back">
		</uni-nav-bar>
		<u-subsection :list="list" :current="current" @change="sectionChange"></u-subsection>
		<u-cell-group v-show="current == 0">
			<u-cell title="编码" arrow-direction="down">
				<view slot="value" style="display: flex;align-items: center;width: 100%;">
					<u--input disabled style="flex:1" border="surround" v-model="form.code">
					</u--input>
				</view>
			</u-cell>
			<u-cell title="工单名称" arrow-direction="down">
				<view slot="value" style="display: flex;align-items: center;width: 100%;">
					<u--input :disabled="!isDisable" @click.native="selectWorkOrder" style="flex:1" border="surround"
						v-model="form.name">
					</u--input>
				</view>
			</u-cell>
			<u-cell title="领用部门" arrow-direction="down">
				<view slot="value" style="display: flex;align-items: center;width: 100%;">
					<u--input :disabled="!isDisable" style="flex:1" border="surround" v-model="form.contactName">
					</u--input>
				</view>
			</u-cell>
			<u-cell title="领用人" arrow-direction="down">
				<view slot="value" style="display: flex;align-items: center;width: 100%;">
					<u--input :disabled="!isDisable" style="flex:1" border="surround" v-model="form.contactName">
					</u--input>
				</view>
			</u-cell>
			<u-cell title="使用部门" arrow-direction="down">
				<view slot="value" style="display: flex;align-items: center;width: 100%;">
					<u--input :disabled="!isDisable" style="flex:1" border="surround" v-model="form.contactName">
					</u--input>
				</view>
			</u-cell>
			<u-cell title="使用人" arrow-direction="down">
				<view slot="value" style="display: flex;align-items: center;width: 100%;">
					<u--input :disabled="!isDisable" style="flex:1" border="surround" v-model="form.contactName">
					</u--input>
				</view>
			</u-cell>
			<u-cell title="使用时间" arrow-direction="down">
				<uni-datetime-picker :disabled="!isDisable" type="date" slot="value" v-model="form.usageTime">
				</uni-datetime-picker>
			</u-cell>
			<u-cell title="用途" arrow-direction="down">
				<view slot="value" style="display: flex;align-items: center;width: 100%;">
					<u--textarea style="flex:1" border="surround" placeholder="请输入内容"
						v-model="form.purpose"></u--textarea>
				</view>
			</u-cell>
		</u-cell-group>
		<view class="footerButton" v-if="isDisable">
			<u-button type="default" text="返回" @click="back"></u-button>
			<u-button type="primary" @click="save" text="保存"></u-button>
		</view>
	</view>
</template>

<script>
	export default {
		computed: {
			isDisable() {
				let flag = this.type != 'view'
				return flag;
			}
		},
		data() {
			return {
				current: 0,
				list: ['基本信息', '配件信息'],
				title: '',
				type: '',
				form: {}
			}
		},
		onLoad(params) {
			this.title = params.type == 'view' ? '配件申请详情' : params.type == 'edit' ? '配件申请修改' : '配件申请新增';
			this.type = params.type;
			console.log(params, 'params --')
		},
		created() {
			uni.$off('updateWorkData')
			uni.$on('updateWorkData', ({
				data
			}) => {
				console.log(data, 'data');
			})
		},
		methods: {
			sectionChange(index) {
				this.current = index;
			},
			save() {

			},
			selectWorkOrder() {
				uni.navigateTo({
					url: `/pages/salesServiceManagement/accessory/components/selectWork`
				})
				console.log('打开工单数据');
			}
		}
	}
</script>

<style scoped lang="scss">
	/deep/.u-subsection__item__text {
		font-size: 28rpx !important;
	}

	/deep/.u-cell__body__content {
		flex: none;
		margin-right: 16rpx;
	}

	.footerButton {
		width: 100%;
		height: 84rpx;
		display: flex;
		position: fixed;
		bottom: 0;
		z-index: 10;

		/deep/.u-button {
			height: 100%;
		}

		>view {
			flex: 1;

		}
	}
</style>