<template>
	<NavBar />
	<view class="container">
		<view class="swiper">
			<HomeSwiper :position="1" />
		</view>
		<view class="title">
			<PageTitle :title="$t('menu.partner')" />
		</view>
		<view>
			<view class="" v-if="sysShareSystemId">
				<image :src="imgUrls[0]" mode="aspectFill" class="shareImg"></image>
			</view>
			<uni-forms ref="shareLinkForm" :modelValue="shareLinkFormData" :rules="shareLinkFormRules">
				<view class="shareTypeTitle">{{ $t('partner.promotionLink.selectLinkType') }}</view>
				<view class="mtTypeWrapper">
					<view :class="['mtType', selectedShareType === '2' ? 'active' : '']" @click="selectShareType('2')">
						<image src="/static/partner/clientLink.png" mode="aspectFit" class="typeIcon"></image>
						<text class="label">{{ $t('partner.promotionLink.clientLink') }}</text>
					</view>
					<view :class="['mtType', selectedShareType === '1' ? 'active' : '']" @click="selectShareType('1')">
						<image src="/static/partner/ibLink.png" mode="aspectFit" class="typeIcon"></image>
						<text class="label">{{ $t('partner.promotionLink.ibLink') }}</text>
					</view>
				</view>
				<view class="voucherImgTitle">{{ $t('partner.promotionLink.settings') }}</view>
				<uni-forms-item name="name">
					<text class="uni-subtitle">{{ $t('partner.promotionLink.customName') }}</text>
					<uni-easyinput trim="all" primaryColor="#29BBE4" v-model="shareLinkFormData.name"></uni-easyinput>
				</uni-forms-item>
				<uni-forms-item name="mt_type">
					<text class="uni-subtitle">{{ $t('partner.promotionLink.selectAccountType') }}</text>
					<uni-data-checkbox
						v-model="shareLinkFormData.mt_type"
						:localdata="shareMtTypeOptions"
						@change="handlePresetChange"
						:multiple="true"
						selectedColor="#29BBE4"
						class="datePreset"
					></uni-data-checkbox>
				</uni-forms-item>
			</uni-forms>
			<view>
				<button :disabled="btnLoading" class="primaryButton" @click="handleCreateShareLink">
					<image v-show="btnLoading" src="/static/loadingCircle.svg" mode="aspectFit" style="width: 16px; height: 16px"></image>
					{{ $t('partner.promotionLink.createLink') }}
				</button>
			</view>
		</view>
	</view>
</template>

<script>
import { getShareMtTypeList, saveShareRecord } from '@/services/partner/promotionLink.ts';
export default {
	data() {
		return {
			btnLoading: false,
			selectedShareType: undefined,
			sysShareSystemId: undefined,
			imgUrls: [],
			shareLinkFormData: {},
			shareLinkFormRules: {
				name: {
					rules: [
						{
							required: true,
							errorMessage: this.$t('partner.promotionLink.customNameRequired')
						}
					]
				},
				mt_type: {
					rules: [
						{
							required: true,
							errorMessage: this.$t('partner.promotionLink.selectAccountTypeRequired')
						}
					]
				}
			},
			shareMtTypeOptions: []
		};
	},
	methods: {
		async getShareMtTypes() {
			const res = await getShareMtTypeList({
				sysShareSystemId: this.sysShareSystemId
			});
			if (res && res.code === 0) {
				this.shareMtTypeOptions = res.data.map((item) => ({
					text: item.name,
					value: item.id
				}));
			}
		},
		selectShareType(type) {
			this.selectedShareType = type;
		},
		async handleCreateShareLink() {
			if (!this.selectedShareType) {
				this.$cusModal.showModal({
					type: 'message',
					status: 'warning',
					contentText: this.$t('partner.promotionLink.selectLinkTypeRequired')
				});
				return;
			}
			this.$refs.shareLinkForm.validate().then(async (fields) => {
				const params = {
					...fields,
					share_type: this.selectedShareType
				};
				params.mt_type = params.mt_type.join(',');
				if (this.sysShareSystemId) {
					params.sys_share_system_id = this.sysShareSystemId;
				}
				this.btnLoading = true;
				const res = await saveShareRecord(params);
				this.btnLoading = false;
				if (res && res.code === 0) {
					uni.navigateTo({
						url: '/pages/partner/createSuccess/index'
					});
				} else {
					this.$cusModal.showModal({
						type: 'message',
						status: 'warning',
						contentText: res.msg ?? this.$t('common.error.sysError')
					});
				}
			});
		}
	},
	onLoad(params) {
		this.sysShareSystemId = params.sysId;
		this.imgUrls = params.imgUrls?.split(',');
		this.getShareMtTypes();
	}
};
</script>

<style lang="scss" scoped>
@import './index.scss';
</style>
