af-mobile-client-vue3 1.0.71 → 1.0.72

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "af-mobile-client-vue3",
   "type": "module",
-  "version": "1.0.71",
+  "version": "1.0.72",
   "description": "Vue + Vite component lib",
   "license": "MIT",
   "engines": {

package/src/components/core/XSelect/index.vue

@@ -4,7 +4,7 @@ import {
   Picker as VanPicker,
   Popup as VanPopup,
 } from 'vant'
-import { computed, defineEmits, defineModel, defineProps, ref, watch } from 'vue'
+import { computed, defineEmits, defineModel, defineProps, onBeforeMount, ref, watch } from 'vue'
 
 const props = defineProps({
   columns: {
@@ -36,13 +36,34 @@ const emits = defineEmits(['confirm', 'change', 'cancel', 'input'])
 const show = ref(false)
 const searchVal = ref('')
 const resultValue = defineModel()
-const columnsData = ref([])
+let columnsData = ref([])
+const selectedOption = ref([])
+
+// 转换空children为空字符串
+function transformColumns(data) {
+  return data.map(item => {
+    if (item.children && item.children.length === 0) {
+      return {
+        ...item,
+        children: ''
+      }
+    } else if (item.children && item.children.length !== 0) {
+      return { ...item, children:transformColumns(item.children) }
+    } else {
+      return { ...item }
+    }
+  })
+}
+
+onBeforeMount(() => {
+  columnsData.value = transformColumns(props.columns)
+})
 
 const resultLabel = computed({
   get() {
     const res = props.columns.filter((item) => {
       const data = props.offOption ? item : item[props.option.value]
-      return data === resultValue.value
+      return data === resultValue.value[0]
     })
     return res.length ? (props.offOption ? res[0] : res[0][props.option.text]) : ''
   },
@@ -50,44 +71,45 @@ const resultLabel = computed({
 
   },
 })
+
 function search(val) {
   if (val) {
-    columnsData.value = columnsData.value.filter((item) => {
+    columnsData.value = transformColumns(columnsData.value).filter((item) => {
       const data = props.offOption ? item : item[props.option.text]
-
       return data.includes(val)
     })
-  }
-  else {
-    columnsData.value = JSON.parse(JSON.stringify(props.columns))
+  } else {
+    columnsData.value = transformColumns(props.columns)
   }
 }
+
 function onConfirm(value, _index) {
-  resultValue.value = props.offOption ? value.selectedValues : value.selectedValues[0]
+  // resultValue.value = props.offOption ? value.selectedValues : value.selectedValues[0]
+  resultValue.value = value.selectedValues
+  selectedOption.value = value.selectedOptions
   show.value = !show.value
   emits('confirm', value.selectedValues[0], value.selectedOptions)
 }
+
 function change(val, index) {
   emits('change', val, index, resultValue.value)
 }
+
 function cancel(val, index) {
   show.value = !show.value
   emits('cancel', val, index, resultValue.value)
 }
+
 function showPopu(disabled) {
-  // resultValue.value = `${selectValue}`
   if (disabled !== undefined && disabled !== false)
     return false
-  columnsData.value = JSON.parse(JSON.stringify(props.columns))
+  columnsData.value = transformColumns(props.columns)
   show.value = !show.value
 }
 
-// watch(() => selectValue, (newVal, _oldVal) => {
-//   resultValue.value = `${newVal}`
-// })
 watch(() => resultValue, (newVal, _oldVal) => {
   searchVal.value = ''
-  columnsData.value = JSON.parse(JSON.stringify(props.columns))
+  columnsData.value = transformColumns(props.columns)
   emits('input', newVal)
 })
 </script>
@@ -118,5 +140,5 @@ watch(() => resultValue, (newVal, _oldVal) => {
 </template>
 
 <style lang="scss" scoped>
-
-</style>
+/* 样式定义 */
+</style>