| | |
| | | |
| | | <div class="flex m-t-2rem"> |
| | | <div class="label require">区域编号:</div> |
| | | <el-input v-model="areacode"></el-input> |
| | | <el-select v-model="areacode" placeholder="请选择区域编号" width="28rem"> |
| | | <el-option |
| | | v-for="item in areaCodes" |
| | | :key="item.id" |
| | | :label="item.name" |
| | | :value="item.id"> |
| | | </el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="flex m-t-2rem"> |
| | | <div class="label require">区域名称:</div> |
| | | <div class="label require">产线名称:</div> |
| | | <el-input v-model="areaName"></el-input> |
| | | </div> |
| | | <div class="flex m-t-2rem"> |
| | | <div class="label require">布局数量:</div> |
| | | <el-input v-model="areaConfigNum"></el-input> |
| | | <el-input-number size="medium" v-model="areaConfigNum" :min="500" label="最小是500"></el-input-number> |
| | | </div> |
| | | <div class="flex m-t-2rem"> |
| | | <div class="label require">首页背景:</div> |
| | | <el-upload |
| | | <div class="label require">产线背景:</div> |
| | | <el-upload v-if="open" |
| | | class="upload-demo" |
| | | action="http://localhost:44311/home/UploadFile" |
| | | :action="getUploadAction()" |
| | | :before-upload="beforeUpload" |
| | | :on-preview="handlePreview" |
| | | :on-remove="handleRemove" |
| | |
| | | </div> |
| | | <div class="flex m-t-2rem"> |
| | | <div class="label require">区域背景:</div> |
| | | <el-upload |
| | | <el-upload v-if="open" |
| | | class="upload-demo" |
| | | action="http://localhost:44311/home/UploadFile" |
| | | :action="getUploadAction()" |
| | | :before-upload="beforeUpload" |
| | | :on-preview="handlePreview" |
| | | :on-remove="handleRemove" |
| | |
| | | <div class="m-t-2rem flex"> |
| | | <div style="text-align: center;" class="flex"> |
| | | <div class="equ-form-add-button-confirm" @click="submit">确认</div> |
| | | <div class="equ-form-add-button-cancel" @click="open = false">取消</div> |
| | | <div class="equ-form-add-button-cancel" @click="cancel">取消</div> |
| | | </div> |
| | | |
| | | </div> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import {addAreaItemInfo} from "@/api/addareaitem"; |
| | | import {addAreaItemInfo, updateAreaModuleItem} from "@/api/addareaitem"; |
| | | import {getAreaCode} from "@/api/area"; |
| | | import service from '@/utils/request-api' |
| | | |
| | | export default { |
| | | props: { |
| | |
| | | editItemId: '', |
| | | filename1: '', |
| | | filename2: '', |
| | | areaCodes:[], |
| | | }; |
| | | }, |
| | | mounted() { |
| | | this.getAreaCode(); |
| | | }, |
| | | methods: { |
| | | async submit() { |
| | | |
| | | if (!this.uploadUrl || !this.areaBackGroudURL || !this.areacode || !this.areaConfigNum || !this.areacode) { |
| | | this.$message.warning("数据未填写完整"); |
| | | return; |
| | | } |
| | | await this.$modal.confirm("确定新增区域吗?"); |
| | | async submit() { |
| | | if (!this.uploadUrl || !this.areaBackGroudURL || !this.areacode || !this.areaConfigNum || !this.areacode) { |
| | | this.$message.warning("数据未填写完整"); |
| | | return; |
| | | } |
| | | if (this.editItemId != null && this.editItemId != '') { |
| | | await this.$modal.confirm("确定要编辑区域吗?"); |
| | | var dto = { |
| | | xVal: this.menuPositionx, |
| | | yVal: this.menuPositiony, |
| | | id: this.editItemId, |
| | | uRL: this.uploadUrl, |
| | | areaBackGroudURL: this.areaBackGroudURL, |
| | | areaConfigNum : this.areaConfigNum, |
| | | areaConfigNum: this.areaConfigNum, |
| | | areacode: this.areacode, |
| | | tVal: this.areaName, |
| | | moduleName : this.filename1, |
| | | areaBackGroudName : this.filename2, |
| | | moduleName: this.filename1, |
| | | areaBackGroudName: this.filename2, |
| | | }; |
| | | const re = await addAreaItemInfo(dto); |
| | | const re = await updateAreaModuleItem(dto); |
| | | if (re.isSuccess) { |
| | | this.$emit('update-area-list'); // 触发自定义事件 |
| | | this.$message.success("创建成功"); |
| | | this.open = false; |
| | | this.editItemId = ''; |
| | | this.$message.success("编辑成功"); |
| | | //this.open = false; |
| | | this.cancel(); |
| | | } |
| | | }, |
| | | } else { |
| | | await this.$modal.confirm("确定新增区域吗?"); |
| | | var dto = { |
| | | xVal: this.menuPositionx, |
| | | yVal: this.menuPositiony, |
| | | uRL: this.uploadUrl, |
| | | areaBackGroudURL: this.areaBackGroudURL, |
| | | areaConfigNum: this.areaConfigNum, |
| | | areacode: this.areacode, |
| | | tVal: this.areaName, |
| | | moduleName: this.filename1, |
| | | areaBackGroudName: this.filename2, |
| | | }; |
| | | const re = await addAreaItemInfo(dto); |
| | | if (re.isSuccess) { |
| | | this.$emit('update-area-list'); // 触发自定义事件 |
| | | this.$message.success("创建成功"); |
| | | //this.open = false; |
| | | this.cancel(); |
| | | } |
| | | } |
| | | }, |
| | | async cancel() { |
| | | this.editItemId = ''; |
| | | this.areacode = ''; |
| | | this.areaName = ''; |
| | | this.areaConfigNum = ''; |
| | | this.fileList = []; |
| | | this.fileList2 = []; |
| | | this.uploadUrl = ''; |
| | | this.areaBackGroudURL = ''; |
| | | this.open = false; |
| | | }, |
| | | openConfig() { |
| | | this.cancel(); |
| | | this.open = !this.open; |
| | | }, |
| | | editConfig(editItem) { |
| | |
| | | name : editItem.areaBackGroudName, |
| | | } |
| | | this.fileList[0] = fileInfo1; |
| | | this.fileList2[0].name = fileInfo2; |
| | | |
| | | console.log( " this.fileList",this.fileList) |
| | | this.fileList2[0] = fileInfo2; |
| | | console.log("this.fileList[0]",this.fileList[0]) |
| | | console.log("this.fileList2[0]",this.fileList2[0]) |
| | | this.uploadUrl = editItem.imgSrc; |
| | | this.areaBackGroudURL = editItem.areaBackGroudURL; |
| | | }, |
| | | handleRemove(file, fileList) { |
| | | console.log(file, fileList); |
| | |
| | | async beforeUpload(file) { |
| | | return true; |
| | | }, |
| | | getUploadAction(){ |
| | | this.baseURL = service.defaults.baseURL; |
| | | console.log("this.baseURL", this.baseURL) |
| | | return this.baseURL+"/home/UploadFile"; |
| | | }, |
| | | handleSuccess(response, file, fileList) { |
| | | // 在这里处理文件上传成功的逻辑,例如保存响应数据到组件的状态中。 |
| | | this.$message.success('文件上传成功'); |
| | |
| | | this.uploadUrl = response.result; |
| | | this.filename1 = file.name; |
| | | console.log('文件上传成功地址', this.uploadUrl); |
| | | console.log('file.name', this.filename1); |
| | | }, |
| | | handleError(err, file, fileList) { |
| | | // 在这里处理文件上传失败的逻辑,例如显示错误消息。 |
| | |
| | | this.filename2 = file.name; |
| | | console.log('文件上传成功地址', this.uploadUrl); |
| | | }, |
| | | getAreaCode(){ |
| | | getAreaCode().then((res) => { |
| | | this.areaCodes = res.cabinetList || []; |
| | | }); |
| | | }, |
| | | |
| | | }, |
| | | watch: {}, |
| | | }; |