<template>
	<uni-row class="main" v-bind:style="{ height: client.win_height + 'px' }">
		<uni-col :span="24" class="one">
			<form @submit="onSubmit">
				<view class="content">
					<view class="title">异常描述：</view>
					<input :value="info.desc" name="desc" placeholder="请输入异常描述" />
				</view>
				<view class="btn">
					<button type="primary" size="mini" form-type="submit" v-if="!info.id">
						提交保存
					</button>
				</view>
			</form>
		</uni-col>
	</uni-row>
</template>

<script>
	import {
		mapState,
		mapGetters,
		createNamespacedHelpers
	} from "vuex";
	const _ = require("lodash");
	const moment = require("moment");
	const {
		mapActions
	} = createNamespacedHelpers("baoan_work_warning");
	const {
		mapActions: companyBaoanWork
	} =
	createNamespacedHelpers("company_baoan_work");
	export default {
		name: "info",
		props: {},
		components: {},
		data: function() {
			return {
				info: {},
			};
		},
		onLoad: function(option) {
			this.search(option);
		},
		methods: {
			...companyBaoanWork({
				getCBW: "fetch"
			}),
			...mapActions(["fetch", "create", "update"]),
			async search({
				id
			} = {}) {
				if (!id) return;
				const res = await this.fetch({
					id
				});
				if (this.$checkRes(res)) {
					this.$set(this, `info`, res.data);
				}
			},
			onSubmit: async function(e) {
				let res;
				let data = _.cloneDeep(e.detail.value);
				data.warning_date = moment().format("YYYY-MM-DD HH:mm:ss");
				const pos = await this.toGetLocation();
				data = {
					...data,
					...pos
				};
				if (_.get(data, "id")) res = await this.update(data);
				else {
					const userInfo = _.pick(this.user, ["name", "phone"]);
					data.security_guard_id = this.user.id;
					data = {
						...data,
						...userInfo
					};
					// 获取入职信息
					const cbw = await this.getCBW({
						security_guard_id: this.user.id,
				 	is_quit: "0",
					});
					if (this.$checkRes(res)) {
						data.company = _.get(cbw, "data.company_name");
						data.company_id = _.get(cbw, "data.company_id");
					}
					res = await this.create(data);
				}
				if (this.$checkRes(res)) {
					uni.showToast({
						title: "操作成功",
				 	icon: "success",
					});
					uni.redirectTo({
						url: "/pages/warning/index",
					});
				} else {
					uni.showToast({
						title: "操作失败",
				  icon: "error",
					});
				}
			},
			getText(field) {
				const {
					model,
					format
				} = field;
				if (!format) return _.get(this.info, model, "");
				return format(_.get(this.info, model, ""));
			},
			// 获取定位
			async toGetLocation() {
				const [err, posRes] = await uni.getLocation({
					type: "gcj02"
				});
				if (err) return;
				return {
					latitude: posRes.latitude,
					longitude: posRes.longitude
				};
			},
		},
		computed: {
			...mapState(["user"]),
			...mapGetters(["client"]),
		},
	};
</script>

<style lang="scss" scoped>
	.main {
		background-color: #409eff;
		overflow-y: auto;

		.one {
			float: left;
			width: 100%;

			.content {
				padding: 0 10px;
				margin: 10px 0;

				.title {
					font-size: 16px;
					margin: 0 0 8px 0;
					color: #000000;
				}

				input {
					border: 1px solid #ccc;
					border-radius: 5px;
					padding: 10px;
				}
			}

			.btn {
				text-align: center;
				margin: 15rpx 0 0 0;

				button {
					margin: 0 10px;
				}
			}
		}
	}
</style>
