From 91ccfa3ebdc7a68b6f632c3e59757ec03b15ac1f Mon Sep 17 00:00:00 2001 From: Your Name <123456> Date: 星期五, 02 九月 2022 15:15:01 +0800 Subject: [PATCH] lct --- src/views/specialWorkManage/workTicket/workApply/components/ground.vue | 273 ++++++++++++++++++++++++++++++++++++------------------ 1 files changed, 183 insertions(+), 90 deletions(-) diff --git a/src/views/specialWorkManage/workTicket/workApply/components/ground.vue b/src/views/specialWorkManage/workTicket/workApply/components/ground.vue index c449429..b2bbabe 100644 --- a/src/views/specialWorkManage/workTicket/workApply/components/ground.vue +++ b/src/views/specialWorkManage/workTicket/workApply/components/ground.vue @@ -9,21 +9,30 @@ <el-select v-model="form.operatorUids" multiple> <el-option v-for="item in workerList" - :key="item.uid" - :label="item.username" - :value="item.uid" + :key="item.id" + :label="item.realname" + :value="item.id" /> </el-select> </el-form-item> </el-col> + <el-col :span="12"> + <el-form-item label="作业内容" prop="workContent"> + <el-input + v-model="form.workContent" + autosize + type="textarea" + placeholder="请输入作业内容" + /> + </el-form-item> + </el-col> </el-row> <el-row> <el-col :span="12"> <el-form-item label="作业时间" prop="workTimeLine"> <el-date-picker v-model="form.workTimeLine" - format="YYYY-MM-DD HH:mm" - value-format="YYYY-MM-DD HH:mm:00" + value-format="yyyy-MM-dd HH:mm:ss" type="datetimerange" range-separator="至" start-placeholder="开始时间" @@ -31,38 +40,27 @@ /> </el-form-item> </el-col> - </el-row> - <el-row> - <el-col :span="12"> - <el-form-item label="作业内容" prop="workContent"> - <el-input - v-model="form.workContent" - autosize - type="textarea" - placeholder="请输入作业内容" - /> - </el-form-item> - </el-col> - <el-col :span="12"> - <el-form-item label="作业地址" prop="workLocation"> - <el-input - v-model="form.workLocation" - autosize - type="textarea" - placeholder="请输入作业地址" - /> - </el-form-item> - </el-col> + + <el-col :span="12"> + <el-form-item label="作业地址" prop="workLocation"> + <el-input + v-model="form.workLocation" + autosize + type="textarea" + placeholder="请输入作业地址" + /> + </el-form-item> + </el-col> </el-row> <el-row> <el-col :span="12"> <el-form-item label="作业单位" prop="workDetail.operationDepId"> <el-select v-model="form.workDetail.operationDepId"> <el-option - v-for="item in csDepList" - :key="item.value" - :label="item.label" - :value="item.value" + v-for="item in departList" + :key="item.id" + :label="item.department" + :value="item.id" /> </el-select> </el-form-item> @@ -77,42 +75,88 @@ /> </el-form-item> </el-col> + </el-row> + + <el-row> + <el-col :span="12"> + <el-form-item label="动土方式" prop="workDetail.gbMethod"> + <el-input + v-model="form.workDetail.gbMethod" + autosize + type="textarea" + placeholder="请输入" + /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="危险辨识" prop="hazardIdentification"> + <el-input + v-model="form.hazardIdentification" + autosize + type="textarea" + placeholder="请输入危险辨识" + /> + </el-form-item> + </el-col> + </el-row> + <el-row> + + <el-col :span="12"> + <el-form-item label="关联作业" prop="workDetail.otherSpecialWork"> + <el-select v-model="form.workDetail.otherSpecialWork" multiple> + <el-option v-for="item in otherWorkList" :key="item.value" :label="item.label" :value="item.value" /> + </el-select> + </el-form-item> + </el-col> + </el-row> <el-row> - <el-col :span="12"> - <el-form-item label="动土方式" prop="workDetail.gbMethod"> - <el-input - v-model="form.workDetail.gbMethod" - autosize - type="textarea" - placeholder="请输入" - /> - </el-form-item> - </el-col> - <el-col :span="12"> - <el-form-item label="关联作业" prop="workDetail.otherSpecialWork"> - <el-select v-model="form.workDetail.otherSpecialWork" multiple> - <el-option v-for="item in otherWorkList" :key="item.value" :label="item.label" :value="item.value" /> - </el-select> - </el-form-item> - </el-col> - </el-row> - <el-row> - <el-col :span="24"> - <el-form-item label="图片上传" prop="workDetail.gbPath"> - <el-upload accept="image/*" :on-exceed="showTip" :on-preview="handlePictureCardPreview" :limit='imgLimit' v-model:file-list="fileList" :http-request="upload" :action="uploadUrl" list-type="picture-card" :on-remove="handleRemove" :before-remove="beforeRemove" :before-upload="getUploadUrl"> - <el-icon><Plus /></el-icon> - <template #tip> - <div class="el-upload__tip">上传jpg/png图片尺寸小于500KB,最多可上传5张</div> - </template> - </el-upload> - </el-form-item> - </el-col> + <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24"> + <el-form-item label="隐患上报图" prop="img"> + <el-upload + accept=".pdf,.jpg,.png" + :action="fileRoad" + class="upload-demo" + ref="upload" + :headers="header" + :data="uploadForm" + list-type="picture-card" + :file-list="fileList" + v-model="form.workDetail.gbPath" + :on-change="handleChangeFile" + :on-success="onFileSuccess" + :multiple="false" + :auto-upload="true"> + <i slot="default" class="el-icon-plus"></i> + <div slot="file" slot-scope="{file}"> + <img + class="el-upload-list__item-thumbnail" + :src="file.url" alt="" + > + <span class="el-upload-list__item-actions"> + <span + class="el-upload-list__item-preview" + @click="handleFile(file)" + > + <i class="el-icon-zoom-in"></i> + </span> + <span + v-if="!disabled" + class="el-upload-list__item-delete" + @click="handleRemove(file,file.$index)" + > + <i class="el-icon-delete"></i> + </span> + </span> + </div> + </el-upload> + </el-form-item> + </el-col> </el-row> </div> </el-form> <div class="applyBtn"> - <el-button type="primary" size="large" plain @click="submitForm(ruleFormRef)">发起申请</el-button> + <el-button type="primary" size="large" plain @click="submitForm()">发起申请</el-button> </div> </div> <el-dialog v-model="dialogVisible"> @@ -122,12 +166,21 @@ </template> <script> - export default { + import Cookies from "_js-cookie@2.2.0@js-cookie"; + import {workApplyApi} from "../../../../../api/workApply"; + + export default { name: 'groundForm', components: {}, - props:['workerList'], + props:['workerList','departList'], data(){ return{ + fileRoad:process.env.BASE_API + '/task/web/upload', + uploadForm:{ + }, + header:{Authorization:''}, + fileList:[], + disabled:false, form: { operatorUids: [], workType: 4, @@ -145,7 +198,6 @@ expStartTime: '', expEndTime: '' }, - fileList: [], imgLimit: 5, uploadUrl: '', dialogVisible: false, @@ -211,9 +263,10 @@ } ], applyRules:{ - operatorUids: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], + operatorUids: [{ required: true, message: '该内容不能为空', trigger: 'change' }], workType: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], workContent: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], + hazardIdentification: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], workLocation: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], workTimeLine: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], "workDetail.operationDepId": [{ required: true, message: '该内容不能为空', trigger: 'blur' }], @@ -224,26 +277,41 @@ } }, methods:{ - async submitForm(formEl) { - if (!formEl) return - await formEl.validate(async (valid, fields) => { + submitForm() { + this.$refs["ruleFormRef"].validate(async (valid, fields) => { if (valid) { - state.form.expStartTime = JSON.parse(JSON.stringify(state.form.workTimeLine))[0] - state.form.expEndTime = JSON.parse(JSON.stringify(state.form.workTimeLine))[1] - let { workTimeLine, ...data } = JSON.parse(JSON.stringify(state.form)) + this.form.expStartTime = JSON.parse(JSON.stringify(this.form.workTimeLine))[0] + this.form.expEndTime = JSON.parse(JSON.stringify(this.form.workTimeLine))[1] + let { workTimeLine, ...data } = JSON.parse(JSON.stringify(this.form)) data.workDetail.otherSpecialWork = data.workDetail.otherSpecialWork.join(',') - data.workDetail.gbPath = data.workDetail.gbPath.join(',') + data.workDetail.gbPath = JSON.stringify(this.fileList.map(item => { return item.url.substring(process.env.IMG_API.length) })) const res = await workApplyApi().postGroundApply(data) if (res.data.code === '200') { - ElMessage({ + this.$message({ type: 'success', message: '提交成功!' }); - formEl.resetFields() - state.form.workDetail.gbPath = [] - state.fileList = [] + this.$refs["ruleFormRef"].clearValidate() + this.form = { + operatorUids: [], + workType: 2, + workLevel: 0, + workContent: '', + workLocation: '', + workDetail:{ + csDepId: null, + csName: '', + csOriginalName: '', + otherSpecialWork: [] + }, + workTimeLine: [], + expStartTime: '', + hazardIdentification: '', + expEndTime: '' + } + this.fileList = [] } else { - ElMessage({ + this.$message({ type: 'warning', message: res.data.msg }); @@ -252,7 +320,44 @@ console.log('error submit!', fields) } }) - } + }, + + + handleChangeFile(){ + this.header.Authorization = Cookies.get('token') + }, + onFileSuccess(response){ + if(response.code === '200'){ + this.fileList.push({url:process.env.IMG_API + response.result.path}) + this.$notify({ + type:'success', + duration:2000, + message:'上传成功', + title:'成功', + }) + }else{ + this.$message({ + message:res.data.message, + type:'warning' + }) + } + }, + handleFile(file){ + this.dialogImageUrl = file.url; + this.dialogVisible = true; + }, + showImg(file){ + window.open(file, '_blank') + }, + handleRemove(file,value){ + return this.$confirm(`确定移除 ${ file.uid }?`,'提示',{ + confirmButtonText:'确定', + cancelButtonText:'取消', + type:'warning', + }).then(()=> { + this.fileList.splice(value,1) + }) + }, }, }; @@ -307,18 +412,6 @@ } </style> <style> - .avatar-uploader .el-upload { - border: 1px dashed var(--el-border-color); - border-radius: 6px; - cursor: pointer; - position: relative; - overflow: hidden; - transition: var(--el-transition-duration-fast); - } - - .avatar-uploader .el-upload:hover { - border-color: var(--el-color-primary); - } .el-icon.avatar-uploader-icon { font-size: 28px; -- Gitblit v1.9.2