feat: 选择字典 自定义表单嵌入 m

src/components/packages/formEditor/components/FormTypes/SelectDict/mobile.vue

@@ -7,12 +7,45 @@ export default {
 }
 </script>
 <script setup>
+import { watch, ref } from 'vue'
+import dict from '@/api/system/dict'
 const props = defineProps(['data', 'params'])
 const ns = hooks.useNamespace('FormTypesSelectDict_mobile')
+// type Option = { title: string; content: string }
+const optionKey = { label: 'title', value: 'content' }
+const loadOptions = ref({ list: [], loading: false })
+const queryDictOptions = dictCode => {
+	// {title, content}[]
+	if (!dictCode) {
+		loadOptions.value = {
+			loading: false,
+			list: []
+		}
+		return
+	}
+	loadOptions.value.loading = true
+	dict.dictListSelectOptionApi(dictCode).then(list => {
+		loadOptions.value = {
+			loading: false,
+			list
+		}
+	})
+}
+
+watch(
+	() => props.params?.dictCode,
+	dictCode => {
+		queryDictOptions(dictCode)
+		// console.error(dictCode, 'SelectDict params')
+	},
+	{
+		immediate: true
+	}
+)
 </script>
 <template>
-	<el-select v-model="data.options.defaultValue" :class="[ns.b()]" v-bind="params">
-		<el-option v-for="item in params.options" :key="item.value" :label="item.label" :value="item.value" />
+	<el-select v-model="data.options.defaultValue" :loading="loadOptions.loading" :class="[ns.b()]" v-bind="params">
+		<el-option v-for="item in loadOptions.list" :key="item[optionKey.value]" :label="item[optionKey.label]" :value="item[optionKey.value]" />
 	</el-select>
 </template>