<template>
	<view class="bg-[#ffffff] min-h-[100vh]" :style="themeColor()">
		<view class="mx-[30rpx]">
			<!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
			<up-form labelPosition="left" :model="formData" labelWidth="160rpx" ref="formRef">
				<up-form-item :label="t('code')" borderBottom>
					{{formData.code}}
				</up-form-item>
				<up-form-item :label="t('name')" borderBottom>
					{{formData.name}}
				</up-form-item>
				<up-form-item :label="t('contact')" borderBottom>
					{{formData.contact}}
				</up-form-item>
				<up-form-item :label="t('phone')" borderBottom>
					{{formData.phone}}
				</up-form-item>
				<up-form-item :label="t('city')" borderBottom>
					{{formData.cityName}}
				</up-form-item>
				<up-form-item :label="t('address')" borderBottom>
					{{formData.address}}
				</up-form-item>
				<up-form-item :label="t('term')" borderBottom>
					{{formData.term}}
				</up-form-item>
				<up-form-item :label="t('description')" borderBottom>
					{{formData.description}}
				</up-form-item>
			</up-form>
		</view>

	</view>
</template>

<script setup lang="ts">
	import { ref, reactive, computed, onMounted } from 'vue'
	import { t } from '@/locale'
	import { onLoad } from '@dcloudio/uni-app';
	import { getSupplierInfo } from '@/addon/erp/api/base';

	const formRef : any = ref(null)

	const formData = reactive({
		code: "",
		name: '',
		contact: '',
		phone: '',
		term: '',
		city: '',
		cityName: '',
		address: '',
		description: ''
	})

	// 加载
	onLoad((data : any) => {
		getInfo(data.id);
	})

	const getInfo = async (id : number) => {
		const data = await (await getSupplierInfo(id)).data;
		Object.assign(formData, data);
	}
</script>

<style>
</style>