hookehuyr

fix 上传文件和图片组件,非只读模式有默认值时,显示存在的数据方便操作

1 <!-- 1 <!--
2 * @Date: 2022-08-31 16:16:49 2 * @Date: 2022-08-31 16:16:49
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-06-13 16:07:24 4 + * @LastEditTime: 2024-06-17 09:57:29
5 * @FilePath: /data-table/src/components/FileUploaderField/index.vue 5 * @FilePath: /data-table/src/components/FileUploaderField/index.vue
6 * @Description: 文件上传控件 6 * @Description: 文件上传控件
7 --> 7 -->
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
24 style="padding-left: 1rem; margin-bottom: 0.5rem" 24 style="padding-left: 1rem; margin-bottom: 0.5rem"
25 > 25 >
26 <p style="font-size: 1rem; word-break: break-all; margin-right: 0.75rem;"> 26 <p style="font-size: 1rem; word-break: break-all; margin-right: 0.75rem;">
27 - <span>{{ index + 1 }}.&nbsp;{{ file.filename }}&nbsp;&nbsp;{{ (file.size / 1024 / 1024).toFixed(2) }}MB</span> 27 + <span>{{ index + 1 }}.&nbsp;{{ file.name }}&nbsp;&nbsp;{{ (file.size / 1024 / 1024).toFixed(2) }}MB</span>
28 &nbsp;&nbsp; 28 &nbsp;&nbsp;
29 <span style="color: #e32525; font-size: 0.85rem" @click="beforeDelete(file)">移除</span> 29 <span style="color: #e32525; font-size: 0.85rem" @click="beforeDelete(file)">移除</span>
30 </p> 30 </p>
...@@ -98,7 +98,14 @@ const HideShow = computed(() => { ...@@ -98,7 +98,14 @@ const HideShow = computed(() => {
98 }) 98 })
99 const emit = defineEmits(["active"]); 99 const emit = defineEmits(["active"]);
100 const show_empty = ref(false); 100 const show_empty = ref(false);
101 -const default_file = ref(props.item.component_props.default) 101 +const default_file = ref(props.item.component_props.default);
102 +
103 +onMounted(() => {
104 + // 非只读模式并且有默认值时
105 + if (!props.item.component_props.readonly && props.item.component_props.default) {
106 + fileList.value = default_file.value;
107 + }
108 +})
102 109
103 // 文件类型中文页面显示 110 // 文件类型中文页面显示
104 const type_text = computed(() => { 111 const type_text = computed(() => {
......
1 <!-- 1 <!--
2 * @Date: 2022-08-31 16:16:49 2 * @Date: 2022-08-31 16:16:49
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-06-17 09:31:57 4 + * @LastEditTime: 2024-06-17 10:04:35
5 * @FilePath: /data-table/src/components/ImageUploaderField/index.vue 5 * @FilePath: /data-table/src/components/ImageUploaderField/index.vue
6 * @Description: 图片上传控件 6 * @Description: 图片上传控件
7 --> 7 -->
...@@ -93,9 +93,17 @@ const default_tmp = ref(props.item.component_props.default) ...@@ -93,9 +93,17 @@ const default_tmp = ref(props.item.component_props.default)
93 const default_list = ref([]); 93 const default_list = ref([]);
94 94
95 onMounted(() => { 95 onMounted(() => {
96 - // 默认图片显示 96 + // 非只读模式并且有默认值时
97 - if (default_tmp.value && default_tmp.value.length) { 97 + if (!props.item.component_props.readonly) {
98 - default_list.value = default_tmp.value.map(item => item.url) 98 + // 默认图片显示
99 + if (default_tmp.value && default_tmp.value.length) {
100 + fileList.value = default_tmp.value
101 + }
102 + } else {
103 + // 默认图片显示
104 + if (default_tmp.value && default_tmp.value.length) {
105 + default_list.value = default_tmp.value.map(item => item.url)
106 + }
99 } 107 }
100 }) 108 })
101 109
......