@@ -51,12 +44,12 @@
v-model="selectedColumns[index]"
:options="columnType"
optionLabel="name"
- placeholder="Not Assigned"
- class="w-full !border-neutral-500"
+ placeholder=""
+ class="w-52 !border-neutral-500"
:data-type="item"
:inputId="index.toString()"
- :inputClass="selectedColumns[index]?.color"
- inputClass="!text-sm">
+ :inputClass="[selectedColumns[index]?.color, 'text-sm']"
+ >
{{ slotProps.option.name }}
@@ -122,8 +115,7 @@ export default {
{ name: 'Not Assigned', code: '', color: '!text-neutral-700', value: '', label: 'Not Assigned', required: false },
],
selectedColumns: [],
- isInform: true, // true: 藍字提示; false: 紅字提示
- informData: [], // 紅字提示,尚未選擇的 type
+ informData: [], // 藍字提示,尚未選擇的 type
repeatedData: [], // 紅字提示,重複選擇的 type
fileName: this.uploadFileName,
};
@@ -197,7 +189,7 @@ export default {
return width;
},
/**
- * 驗證,根據新的 selectedColumns 更新 isInform、informData 和 repeatedData
+ * 驗證,根據新的 selectedColumns 更新 informData 和 repeatedData
* @param {Array} data
*/
updateValidationData(data) {
@@ -225,7 +217,6 @@ export default {
this.informData = this.columnType.filter(item => item.required ? !selectedData.includes(item.name) : false);
}
});
- this.isInform = (this.informData.length === 0 && this.repeatedData.length === 0) ? true : false;
},
/**
* Reset Button
@@ -296,7 +287,7 @@ export default {
this.uploadConfirm(fetchData);
},
},
- mounted() {
+ async mounted() {
// 只監聽第一次
let unwatch = this.$watch('fileName', (newValue) => {
if (newValue) {
@@ -308,9 +299,9 @@ export default {
},
{ immediate: true }
);
- this.isInform = true; // 初始為藍字提示
this.showEdit = true;
- if(this.uploadId) this.filesStore.getUploadDetail();
+ if(this.uploadId) await this.filesStore.getUploadDetail();
+ this.selectedColumns = await Array.from({ length: this.uploadDetail.columns.length }, () => this.columnType[this.columnType.length - 1]); // 預設選 Not Assigned
unwatch();
this.isLoading = false;
},