Merge branch 'zqq' of http://47.92.168.204:3000/VoRDM/vordm-admin into zqq
This commit is contained in:
commit
83fbd59ade
|
@ -2,17 +2,8 @@
|
||||||
<el-dialog title="upload" v-model="state.isShowDialog" width="700px">
|
<el-dialog title="upload" v-model="state.isShowDialog" width="700px">
|
||||||
<el-form :model="state.ruleForm" size="default" label-width="120px" :rules="rules" ref="adminAddFormRef">
|
<el-form :model="state.ruleForm" size="default" label-width="120px" :rules="rules" ref="adminAddFormRef">
|
||||||
<el-form-item label="upload picture" prop="img">
|
<el-form-item label="upload picture" prop="img">
|
||||||
<el-upload
|
<el-upload ref="upFileRef" class="upload-demo" drag accept="image/*" action="#" multiple :http-request="uploadPic"
|
||||||
ref="upFileRef"
|
:on-remove="removePic" :before-upload="beforeUpload">
|
||||||
class="upload-demo"
|
|
||||||
drag
|
|
||||||
accept="image/*"
|
|
||||||
action="#"
|
|
||||||
multiple
|
|
||||||
:http-request="uploadPic"
|
|
||||||
:on-remove="removePic"
|
|
||||||
:before-upload="beforeUpload"
|
|
||||||
>
|
|
||||||
<el-icon class="el-icon--upload"><upload-filled /></el-icon>
|
<el-icon class="el-icon--upload"><upload-filled /></el-icon>
|
||||||
<div class="el-upload__text">
|
<div class="el-upload__text">
|
||||||
Drop file here or <em>click to upload</em>
|
Drop file here or <em>click to upload</em>
|
||||||
|
@ -26,31 +17,33 @@
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item prop="type" label="data type">
|
<el-form-item prop="type" label="data type">
|
||||||
<el-select v-model="state.ruleForm.type" class="m-2" placeholder="please select data type">
|
<el-select v-model="state.ruleForm.type" class="m-2" placeholder="please select data type">
|
||||||
<el-option
|
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
v-for="item in options"
|
</el-select>
|
||||||
:key="item.value"
|
</el-form-item>
|
||||||
:label="item.label"
|
<el-form-item prop="visualFlag" label="data visualFlag">
|
||||||
:value="item.value"
|
<el-select v-model="state.ruleForm.visualFlag" placeholder="please select data visualFlag" size="default" >
|
||||||
/>
|
<el-option label="Visualization" value= 1></el-option>
|
||||||
|
<el-option label="B Visualization" value= 0></el-option>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item prop="remark" label="data details">
|
<el-form-item prop="remark" label="data details">
|
||||||
<el-input v-model="state.ruleForm.remark" class="m-2" placeholder="please enter data details" :rows="3" type="textarea" style="width:220px;"/>
|
<el-input v-model="state.ruleForm.remark" class="m-2" placeholder="please enter data details" :rows="3"
|
||||||
|
type="textarea" style="width:220px;" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<span class="dialog-footer">
|
<span class="dialog-footer">
|
||||||
<el-button @click="onCancel" size="default">cancel</el-button>
|
<el-button @click="onCancel" size="default">cancel</el-button>
|
||||||
<el-button type="primary" @click="onSubmit" size="default" :loading="state.isLoading">upload</el-button>
|
<el-button type="primary" @click="onSubmit" size="default" :loading="state.isLoading">upload</el-button>
|
||||||
</span>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import {reactive, ref} from "vue";
|
import { reactive, ref } from "vue";
|
||||||
import {uploadData} from '/@/api/data/otherData.js';
|
import { uploadData } from '/@/api/data/otherData.js';
|
||||||
import {ElMessage} from "element-plus";
|
import { ElMessage } from "element-plus";
|
||||||
import { UploadFilled } from '@element-plus/icons-vue'
|
import { UploadFilled } from '@element-plus/icons-vue'
|
||||||
const upFileRef = ref();
|
const upFileRef = ref();
|
||||||
const options = [
|
const options = [
|
||||||
|
@ -71,37 +64,37 @@ const emit = defineEmits(['callback']);
|
||||||
const adminAddFormRef = ref();
|
const adminAddFormRef = ref();
|
||||||
const state = reactive({
|
const state = reactive({
|
||||||
isShowDialog: false,
|
isShowDialog: false,
|
||||||
isLoading:false,
|
isLoading: false,
|
||||||
ruleForm: {
|
ruleForm: {
|
||||||
},
|
},
|
||||||
tableData: [],
|
tableData: [],
|
||||||
//字典值
|
//字典值
|
||||||
dictData: [],
|
dictData: [],
|
||||||
unitData:[],
|
unitData: [],
|
||||||
standardId: '',
|
standardId: '',
|
||||||
detectionData: [],
|
detectionData: [],
|
||||||
disasterId:null,
|
disasterId: null,
|
||||||
dataForm:new FormData(),
|
dataForm: new FormData(),
|
||||||
fileArray:[],
|
fileArray: [],
|
||||||
})
|
})
|
||||||
const validImg = (rule, value, callback) => {
|
const validImg = (rule, value, callback) => {
|
||||||
if(state.fileArray.length>0){
|
if (state.fileArray.length > 0) {
|
||||||
adminAddFormRef.value.clearValidate('img')
|
adminAddFormRef.value.clearValidate('img')
|
||||||
callback();
|
callback();
|
||||||
}else{
|
} else {
|
||||||
return callback(new Error('please upload image'));
|
return callback(new Error('please upload image'));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
//校验规则
|
//校验规则
|
||||||
const rules = reactive({
|
const rules = reactive({
|
||||||
img: [
|
img: [
|
||||||
{required: true,trigger: 'change',validator:validImg}
|
{ required: true, trigger: 'change', validator: validImg }
|
||||||
],
|
],
|
||||||
type: [
|
type: [
|
||||||
{required: true, message: 'please select data type', trigger: 'change'}
|
{ required: true, message: 'please select data type', trigger: 'change' }
|
||||||
],
|
],
|
||||||
remark:[
|
remark: [
|
||||||
{required: true, message: 'please select data details', trigger: 'blur'}
|
{ required: true, message: 'please select data details', trigger: 'blur' }
|
||||||
],
|
],
|
||||||
})
|
})
|
||||||
//图片上传之前
|
//图片上传之前
|
||||||
|
@ -118,7 +111,7 @@ const uploadPic = (data) => {
|
||||||
}
|
}
|
||||||
//移除时
|
//移除时
|
||||||
const removePic = (data) => {
|
const removePic = (data) => {
|
||||||
state.fileArray.splice(state.fileArray.findIndex(item=>item.uid===data.raw.uid), 1)
|
state.fileArray.splice(state.fileArray.findIndex(item => item.uid === data.raw.uid), 1)
|
||||||
console.log(state.fileArray)
|
console.log(state.fileArray)
|
||||||
}
|
}
|
||||||
//重置表单
|
//重置表单
|
||||||
|
@ -149,19 +142,20 @@ const onSubmit = () => {
|
||||||
adminAddFormRef.value.validate((valid, fields) => {
|
adminAddFormRef.value.validate((valid, fields) => {
|
||||||
if (valid) {
|
if (valid) {
|
||||||
state.isLoading = true;
|
state.isLoading = true;
|
||||||
state.fileArray.forEach(item=>{
|
state.fileArray.forEach(item => {
|
||||||
state.dataForm.append('file',item);
|
state.dataForm.append('file', item);
|
||||||
})
|
})
|
||||||
state.dataForm.append('type',state.ruleForm.type);
|
state.dataForm.append('type', state.ruleForm.type);
|
||||||
state.dataForm.append('remark',state.ruleForm.remark);
|
state.dataForm.append('remark', state.ruleForm.remark);
|
||||||
state.dataForm.append('disasterId',state.disasterId);
|
state.dataForm.append('disasterId', state.disasterId);
|
||||||
for(let [a, b] of state.dataForm.entries()){
|
state.dataForm.append('visualFlag', state.ruleForm.visualFlag);
|
||||||
console.log(a, b, '--------------');
|
for (let [a, b] of state.dataForm.entries()) {
|
||||||
}
|
console.log(a, b, '--------------');
|
||||||
|
}
|
||||||
uploadData(state.dataForm).then(res => {
|
uploadData(state.dataForm).then(res => {
|
||||||
ElMessage.success("Upload successfully");
|
ElMessage.success("Upload successfully");
|
||||||
emit('callback');
|
emit('callback');
|
||||||
}).finally(()=>{
|
}).finally(() => {
|
||||||
state.isLoading = false;
|
state.isLoading = false;
|
||||||
})
|
})
|
||||||
closeDialog();
|
closeDialog();
|
||||||
|
@ -176,6 +170,4 @@ defineExpose({
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped></style>
|
||||||
|
|
||||||
</style>
|
|
Loading…
Reference in New Issue