<template>
	<view>
		<kevyloading v-if="loading" type="bsm-loader" color="#618af8" transparent></kevyloading>

		<wd-form :model="form" :rules="rules" :disabled="mode == 'show'" ref="dialogForm" label-width="100px">
			<wd-form-item label="折扣名称" prop="name">
				<wd-input placeholder="请输入折扣名称" v-model="dataForm.name" clearable style="width: 100%"></wd-input>
			</wd-form-item>

			<wd-form-item label="折扣比例" prop="discount">
				<wd-input type="number" placeholder="请输入折扣比例" step="1" v-model.number="dataForm.discount" clearable
					style="width: 100%"></wd-input>

				<div style="color: #666;font-size: 12px;">
					如商品单价100，折扣比例40 (4折)，仅需付40元
				</div>
			</wd-form-item>

			<wd-form-item label="会员等级">
				<wd-picker :columns="columns" v-model="dataForm.user_members_level" @confirm="handleConfirm" />
			</wd-form-item>

			<wd-form-item label="选择商品">
				<yGoods v-model="dataForm.goods_list" :size="1"></yGoods>
			</wd-form-item>


			<div style="display: flex;flex-direction: column;">
				<wd-datetime-picker v-model="dataForm.start_time" label="开始时间" />
				<wd-datetime-picker v-model="dataForm.end_time" label="结束时间" />
			</div>

			<!-- 是否启用 -->
			<wd-form-item label="是否启用：" prop="status">
				<wd-switch v-model="dataForm.status" :active-value="1" :inactive-value="0"></wd-switch>
			</wd-form-item>

			<!-- 提交按钮 -->
			<view class="mt-2 px-12 py-3 bg-slate-50">
				<wd-button type="primary" size="large" @click="handleSubmit" block>
					保存
				</wd-button>
			</view>

		</wd-form>
	</view>
</template>

<script>
import { ref } from 'vue';
import yGoods from "@/components/yGoods/index.vue";
import uniDataPicker from "@/components/uni-data-picker/components/uni-data-picker/uni-data-picker.vue";
import system from '@/api/modules/system.js';
import index from '@/api/store/index.js';
import kevyloading from "@/components/kevy-loading/kevy-loading";
import utils from '@/utils/utils.js'
import userMembers from '@/api/store/userMembers.js';
import { useApi } from "@/hooks/useApi.js"

console.log(yGoods);

/**
 * 从本地存储中获取用户信息
 */
const user_info = uni.getStorageSync("user_info");

export default {
	components: {
		yGoods, uniDataPicker, kevyloading
	},
	data() {
		return {
			utils,
			user_info,
			// 表单数据
			dataForm: {
				"id": 0,
				"mch_id": 0,
				"user_members_level": 0,
				"name": "2",
				"discount": 0,
				"status": 1,
				"goods_list": [],
				"start_time": new Date(),
				"end_time": new Date(),
				"delete_time": null,
				"time": [
					"2024-01-08 00:00:00",
					"2024-01-09 00:00:00"
				]
			},
			columns: [],
			loading: false
		};
	},
	onLoad(e) {
		if (e.edit) {
			this.dataForm = JSON.parse(e.edit)

			this.dataForm.start_time = new Date(this.dataForm.start_time * 1000)
			this.dataForm.end_time = new Date(this.dataForm.end_time * 1000)

			console.log(this.dataForm);
		}

		for (let index = 1; index <= 100; index++) {
			this.columns.push(index)
		}
		this.getmemberList()
	},
	methods: {
		async getmemberList() {
			const { fetchData } = await useApi(userMembers.LevelShow)

			fetchData().then(res => {
				this.columns = res.data.map(item => {
					return {
						label: item.name,
						value: item.level
					}
				})
			})
		},
		/**
		 * 获取门店设置
		 */
		async getStoreSetting() {
			this.loading = true;
			const res = await index.getStoreSetting();

			if (res.data.id) {
				this.dataForm = res.data;
			}
			this.loading = false;
		},

		/**
		 * 处理省市区选择变化
		 * @param {Object} value - 选择的值
		 */
		areaChange(value) {
			// 处理省市区选择变化的逻辑
		},

		/**
		 * 处理省市区选择
		 * @param {Object} detail - 选择器详细信息
		 */
		select({ detail }) {
			if (detail.value.length) {
				const [province_id, city_id, district_id] = detail.value.map(
					(el) => el.value
				);

				this.datadataForm.province_id = province_id;
				this.datadataForm.city_id = city_id;
				this.datadataForm.district_id = district_id;
				this.datadataForm.district = [province_id, city_id, district_id];
			}
		},

		/**
		 * 处理表单提交
		 */
		async handleSubmit() {
			// 处理表单提交的逻辑
			const res = await userMembers.LevelSave({
				...this.dataForm,
				start_time: utils.dateFormat(this.dataForm.start_time),
				end_time: utils.dateFormat(this.dataForm.end_time),
			});

			if (res.code == 0) {
				setTimeout(() => {
					uni.showToast({
						title: '保存成功!',
						icon: 'success'
					});
				}, 100);

				uni.navigateBack()
			}
		},
	},
};

</script>

<style>
/* 在这里添加样式，根据需要自定义表单样式 */
</style>
