hookehuyr

fix 文件上传控件新增文件数量和大小控制

...@@ -11,7 +11,13 @@ ...@@ -11,7 +11,13 @@
11 {{ item.component_props.label 11 {{ item.component_props.label
12 }}<span v-if="item.component_props.required">&nbsp;*</span> 12 }}<span v-if="item.component_props.required">&nbsp;*</span>
13 </div> 13 </div>
14 - <div style="font-size: 0.9rem; padding-top: 0.5rem"> 14 + <div
15 + v-if="item.component_props.note"
16 + style="font-size: 0.9rem; margin-left: 1rem; color: gray; padding-bottom: 0.5rem"
17 + >
18 + {{ item.component_props.note }}
19 + </div>
20 + <div style="font-size: 0.9rem">
15 <p 21 <p
16 v-for="file in fileList" 22 v-for="file in fileList"
17 :key="index" 23 :key="index"
...@@ -32,7 +38,6 @@ ...@@ -32,7 +38,6 @@
32 :before-read="beforeRead" 38 :before-read="beforeRead"
33 :after-read="afterRead" 39 :after-read="afterRead"
34 :before-delete="beforeDelete" 40 :before-delete="beforeDelete"
35 - :multiple="item.component_props.multiple"
36 > 41 >
37 <van-button icon="plus" type="primary">上传文件</van-button> 42 <van-button icon="plus" type="primary">上传文件</van-button>
38 </van-uploader> 43 </van-uploader>
...@@ -92,13 +97,25 @@ const fileList = ref([ ...@@ -92,13 +97,25 @@ const fileList = ref([
92 97
93 // 上传前置处理 98 // 上传前置处理
94 const beforeRead = (file) => { 99 const beforeRead = (file) => {
100 + // TODO: 需要file_type集合
95 // 类型限制 101 // 类型限制
96 // const file_types = _.map( 102 // const file_types = _.map(
97 // props.item.component_props.file_type.split("/"), 103 // props.item.component_props.file_type.split("/"),
98 // (item) => `video/${item}` 104 // (item) => `video/${item}`
99 // ); 105 // );
100 -
101 let flag = true; 106 let flag = true;
107 + if (fileList.value.length + 1 > props.item.component_props.max_count) {
108 + // 数量限制
109 + flag = false;
110 + showFailToast(`最大上传数量为${props.item.component_props.max_count}`);
111 + }
112 + if (file.size > props.item.component_props.max_size) {
113 + // 体积限制
114 + flag = false;
115 + showFailToast(
116 + `最大文件体积为${(props.item.component_props.max_size / 1024 / 1024).toFixed(2)}MB`
117 + );
118 + }
102 // if (_.isArray(file)) { 119 // if (_.isArray(file)) {
103 // // 多张文件 120 // // 多张文件
104 // const types = _.difference(_.uniq(_.map(file, (item) => item.type)), file_types); // 数组返回不能上传的类型 121 // const types = _.difference(_.uniq(_.map(file, (item) => item.type)), file_types); // 数组返回不能上传的类型
...@@ -152,7 +169,6 @@ const afterRead = async (files) => { ...@@ -152,7 +169,6 @@ const afterRead = async (files) => {
152 show_empty.value = false; 169 show_empty.value = false;
153 // 完整数据回调到表单上 170 // 完整数据回调到表单上
154 emit("active", props.item.value); 171 emit("active", props.item.value);
155 - console.warn(fileList.value);
156 }; 172 };
157 173
158 // 文件删除前的回调函数 174 // 文件删除前的回调函数
......
...@@ -136,7 +136,6 @@ const afterRead = async (files) => { ...@@ -136,7 +136,6 @@ const afterRead = async (files) => {
136 show_empty.value = false; 136 show_empty.value = false;
137 // 完整数据回调到表单上 137 // 完整数据回调到表单上
138 emit("active", props.item.value); 138 emit("active", props.item.value);
139 - console.warn(fileList.value);
140 }; 139 };
141 140
142 // 文件删除前的回调函数 141 // 文件删除前的回调函数
......