Default Changelist

Admin

2022-08-26 3333422b5b672c9c02a993cba43e272fd3bcf44b

Default Changelist

 src/api/specialWorkSystem/workApply/index.ts

@@ -108,5 +108,35 @@
                data: data
            });
        },

        // 获取图片上传路径
        getUploadUrl: (name: string) => {
            return request({
                url: import.meta.env.VITE_API_URL + `/specialWork/file/getPresignUrl`,
                method: 'post',
                data: { prefixName: name.split('.')[0], suffixName: name.split('.')[1] }
            });
        },

        // 上传图片
        uploadFile: (path: string, file: any) => {
            return request({
                headers: {
                    contentType: 'application/json;charset=UTF-8'
                },
                url: path,
                method: 'put',
                data: file
            });
        },

        // 删除图片
        deleteFile: (data: object) => {
            return request({
                url: import.meta.env.VITE_API_URL + `/specialWork/file/deleteFile`,
                method: 'post',
                data: data
            });
        }
    };
}

 src/views/specialWorkSystem/workTicket/workApply/components/broken.vue

@@ -97,12 +97,27 @@
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="24">
                    <el-form-item label="图片上传" prop="workDetail.bcPath">
                        <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-row>
            </div>
        </el-form>
        <div class="applyBtn">
            <el-button type="primary" size="large" plain @click="submitForm(ruleFormRef)">发起申请</el-button>
        </div>
    </div>
    <el-dialog v-model="dialogVisible">
        <img w-full :src="dialogImageUrl" alt="Preview Image" />
    </el-dialog>
    </div>
</template>

@@ -113,15 +128,23 @@
    import {useUserInfo} from "/@/stores/userInfo";
    import { Session } from '/@/utils/storage';
    import { Search } from '@element-plus/icons-vue'
    import { ElMessage } from 'element-plus'
    import type { FormInstance, FormRules } from 'element-plus'
    import { ElMessage, ElMessageBox } from 'element-plus'
    import type { FormInstance, FormRules, UploadProps, UploadUserFile } from 'element-plus'
    import { workApplyApi } from '/@/api/specialWorkSystem/workApply';

    import axios from 'axios';

    interface stateType {
        form: Object,
        csDepList: Array<any>,
        fileList: Array<file>,
        uploadUrl: string,
        dialogVisible: Boolean,
        dialogImageUrl: string | null,
        imgLimit: number,
        casProps: {}
    }
    interface file {
        url: string;
    }
    export default defineComponent({
        name: 'brokenForm',
@@ -141,13 +164,18 @@
                        operationDepId: null,
                        bcReason: '',
                        bcExplain: '',
                        bcPath: '',
                        bcPath: [],
                        involvedDepIds: []
                    },
                    workTimeLine: [],
                    expStartTime: '',
                    expEndTime: ''
                },
                fileList: [],
                imgLimit: 5,
                uploadUrl: '',
                dialogVisible: false,
                dialogImageUrl: null,
                csDepList: [
                    {
                        label: "单位一",
@@ -191,7 +219,7 @@
                "workDetail.operationDepId": [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
                "workDetail.bcReason": [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
                "workDetail.bcExplain": [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
                "workDetail.otherSpecialWork": [{ required: true, message: '该内容不能为空', trigger: 'blur' }]
                "workDetail.bcPath": [{ required: true, message: '该内容不能为空', trigger: 'blur' }]
            });
            const submitForm = async (formEl: FormInstance | undefined) => {
                if (!formEl) return
@@ -201,7 +229,7 @@
                        state.form.expEndTime = JSON.parse(JSON.stringify(state.form.workTimeLine))[1]
                        let { workTimeLine, ...data } = JSON.parse(JSON.stringify(state.form))
                        data.workDetail.involvedDepIds = data.workDetail.involvedDepIds.join(',')
                        console.log(data,'data')
                        data.workDetail.bcPath = data.workDetail.bcPath.join(',')
                        const res = await workApplyApi().postBrokenApply(data)
                        if (res.data.code === '200') {
                                ElMessage({
@@ -209,6 +237,8 @@
                                    message: '提交成功！'
                                });
                                formEl.resetFields()
                                state.form.workDetail.bcPath = []
                                state.fileList = []
                        } else {
                            ElMessage({
                                type: 'warning',
@@ -220,6 +250,93 @@
                    }
                })
            }

            const handlePreview: UploadProps['onPreview'] = (uploadFile) => {
                console.log(uploadFile);
            };

            const handlePictureCardPreview = (uploadFile: { url: string }) => {
                state.dialogImageUrl = uploadFile.url!;
                state.dialogVisible = true;
            };

            const getUploadUrl = async (rawFile: any) => {
                const res = await workApplyApi().getUploadUrl(rawFile.name);
                state.form.workDetail.bcPath.push(res.data.data.fileName)
                state.uploadUrl = res.data.data.uploadUrl;
                console.log(res.data.data.fileName,'name')
            };

            const upload = async (params: any) => {
                // const formData = new FormData();
                // formData.append('file', state.fileList[0].raw);
                let reader = new FileReader();
                reader.readAsArrayBuffer(params.file);
                reader.onload = async () => {
                    axios
                            .put(state.uploadUrl, reader.result, {
                                header: { 'Content-Type': 'multipart/form-data' }
                            })
                            .then(() => {
                                // if (state.fileList.length === 2) {
                                //     state.fileList.splice(0, 1);
                                // }
                                // console.log(state.form.workDetail.bcPath,'bcPath')
                            });
                };
            };

            const beforeRemove = (file: {}, fileList: []) => {
                const result = new Promise((resolve, reject) => {
                    ElMessageBox.confirm('此操作将删除该图片, 是否继续?', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    })
                            .then(() => {
                                // console.log(state.workDetail.bcPath,'path')
                                const list = JSON.parse(JSON.stringify(state.form.workDetail.bcPath))
                                fileList.map((item,index)=>{
                                    if(item.uid === file.uid){
                                        fileList.splice(index,1)
                                        state.form.workDetail.bcPath.splice(index,1)
                                        deletePic(list[index])
                                    }
                                })
                                // 请求删除接口
                            })
                            .catch(() => {
                                reject(false);
                            });
                });
                return result;
            };


            // 删除图片接口
            const deletePic = async(fileName)=>{
                console.log(fileName,'fileName')
                const res = await workApplyApi().deleteFile({fileName: fileName})
                if (res.data.code === '200') {
                    ElMessage({
                        type: 'success',
                        message: '删除成功！'
                    });
                } else {
                    ElMessage({
                        type: 'warning',
                        message: res.data.msg
                    });
                }
            }

            const showTip =()=>{
                ElMessage({
                    type: 'warning',
                    message: '超出文件上传数量'
                });
            }

            // 折线图
            const renderMenu = async (value: string) => {
                Session.set('projectId',value)
@@ -231,7 +348,13 @@
                Search,
                ruleFormRef,
                applyRules,
                handlePreview,
                getUploadUrl,
                beforeRemove,
                upload,
                showTip,
                submitForm,
                handlePictureCardPreview,
                ...toRefs(state),
            };
        },

 src/views/specialWorkSystem/workTicket/workApply/components/ground.vue

@@ -8,10 +8,10 @@
                    <el-form-item label="作业人" prop="operatorUids">
                        <el-select v-model="form.operatorUids" multiple>
                            <el-option
                                    v-for="item in workerList"
                                    :key="item.uid"
                                    :label="item.username"
                                    :value="item.uid"
                                v-for="item in workerList"
                                :key="item.uid"
                                :label="item.username"
                                :value="item.uid"
                            />
                        </el-select>
                    </el-form-item>
@@ -97,12 +97,27 @@
                    </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-row>
            </div>
        </el-form>
        <div class="applyBtn">
            <el-button type="primary" size="large" plain @click="submitForm(ruleFormRef)">发起申请</el-button>
        </div>
    </div>
    <el-dialog v-model="dialogVisible">
        <img w-full :src="dialogImageUrl" alt="Preview Image" />
    </el-dialog>
    </div>
</template>

@@ -112,22 +127,31 @@
    import { initBackEndControlRoutes } from '/@/router/backEnd';
    import {useUserInfo} from "/@/stores/userInfo";
    import { Session } from '/@/utils/storage';
    import { Search } from '@element-plus/icons-vue'
    import { ElMessage } from 'element-plus'
    import type { FormInstance, FormRules } from 'element-plus'
    import { Search,Plus } from '@element-plus/icons-vue'
    import { ElMessage, ElMessageBox } from 'element-plus'
    import type { FormInstance, FormRules, UploadProps, UploadUserFile } from 'element-plus'
    import { workApplyApi } from '/@/api/specialWorkSystem/workApply';
    import axios from 'axios';


    interface stateType {
        form: Object,
        csDepList: Array<any>,
        otherWorkList: Array<any>
        otherWorkList: Array<any>,
        fileList: Array<file>,
        uploadUrl: string,
        dialogVisible: Boolean,
        dialogImageUrl: string | null,
        imgLimit: number
    }
    export default defineComponent({
    interface file {
        url: string;
    }
    export default {
        name: 'groundForm',
        components: {},
        props:['workerList'],
        setup() {
        setup(props: any, context: any) {
            const userInfo = useUserInfo()
            const { userInfos } = storeToRefs(userInfo);
            const state  = reactive<stateType>({
@@ -141,13 +165,18 @@
                        operationDepId: null,
                        gbScope: '',
                        gbMethod: '',
                        gbPath: '',
                        gbPath: [],
                        otherSpecialWork: []
                    },
                    workTimeLine: [],
                    expStartTime: '',
                    expEndTime: ''
                },
                fileList: [],
                imgLimit: 5,
                uploadUrl: '',
                dialogVisible: false,
                dialogImageUrl: null,
                csDepList: [
                    {
                        label: "单位一",
@@ -218,7 +247,8 @@
                workTimeLine: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
                "workDetail.operationDepId": [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
                "workDetail.gbScope": [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
                "workDetail.gbMethod": [{ required: true, message: '该内容不能为空', trigger: 'blur' }]
                "workDetail.gbMethod": [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
                "workDetail.gbPath": [{ required: true, message: '该内容不能为空', trigger: 'blur' }]
            });
            const submitForm = async (formEl: FormInstance | undefined) => {
                if (!formEl) return
@@ -228,7 +258,7 @@
                        state.form.expEndTime = JSON.parse(JSON.stringify(state.form.workTimeLine))[1]
                        let { workTimeLine, ...data } = JSON.parse(JSON.stringify(state.form))
                        data.workDetail.otherSpecialWork = data.workDetail.otherSpecialWork.join(',')
                        console.log(data,'data')
                        data.workDetail.gbPath = data.workDetail.gbPath.join(',')
                        const res = await workApplyApi().postGroundApply(data)
                        if (res.data.code === '200') {
                                ElMessage({
@@ -236,6 +266,8 @@
                                    message: '提交成功！'
                                });
                                formEl.resetFields()
                                state.form.workDetail.gbPath = []
                                state.fileList = []
                        } else {
                            ElMessage({
                                type: 'warning',
@@ -247,6 +279,97 @@
                    }
                })
            }

            const handlePreview: UploadProps['onPreview'] = (uploadFile) => {
                console.log(uploadFile);
            };

            const handlePictureCardPreview = (uploadFile: { url: string }) => {
                state.dialogImageUrl = uploadFile.url!;
                state.dialogVisible = true;
            };

            const getUploadUrl = async (rawFile: any) => {
                const res = await workApplyApi().getUploadUrl(rawFile.name);
                state.form.workDetail.gbPath.push(res.data.data.fileName)
                state.uploadUrl = res.data.data.uploadUrl;
                console.log(res.data.data.fileName,'name')
            };

            const upload = async (params: any) => {
                // const formData = new FormData();
                // formData.append('file', state.fileList[0].raw);
                let reader = new FileReader();
                reader.readAsArrayBuffer(params.file);
                reader.onload = async () => {
                    axios
                            .put(state.uploadUrl, reader.result, {
                                header: { 'Content-Type': 'multipart/form-data' }
                            })
                            .then(() => {
                                // if (state.fileList.length === 2) {
                                //     state.fileList.splice(0, 1);
                                // }
                                // console.log(state.form.workDetail.gbPath,'gbpath')
                            });
                };
            };

            const beforeRemove = (file: {}, fileList: []) => {
                const result = new Promise((resolve, reject) => {
                    ElMessageBox.confirm('此操作将删除该图片, 是否继续?', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    })
                            .then(() => {
                                // console.log(state.workDetail.gbPath,'path')
                                const list = JSON.parse(JSON.stringify(state.form.workDetail.gbPath))
                                fileList.map((item,index)=>{
                                    if(item.uid === file.uid){
                                        fileList.splice(index,1)
                                        state.form.workDetail.gbPath.splice(index,1)
                                        deletePic(list[index])
                                    }
                                })
                                // 请求删除接口
                            })
                            .catch(() => {
                                reject(false);
                            });
                });
                return result;
            };


            // 删除图片接口
            const deletePic = async(fileName)=>{
                console.log(fileName,'fileName')
                const res = await workApplyApi().deleteFile({fileName: fileName})
                if (res.data.code === '200') {
                    ElMessage({
                        type: 'success',
                        message: '删除成功！'
                    });
                } else {
                    ElMessage({
                        type: 'warning',
                        message: res.data.msg
                    });
                }
            }

            const showTip =()=>{
                ElMessage({
                    type: 'warning',
                    message: '超出文件上传数量'
                });
            }

            // const handleRemove: UploadProps['onRemove'] = (uploadFile, uploadFiles) => {
            //     console.log('2111111111111')
            // };

            // 折线图
            const renderMenu = async (value: string) => {
                Session.set('projectId',value)
@@ -256,16 +379,28 @@
            return {
                renderMenu,
                Search,
                Plus,
                ruleFormRef,
                applyRules,
                handlePreview,
                getUploadUrl,
                beforeRemove,
                upload,
                showTip,
                submitForm,
                handlePictureCardPreview,
                ...toRefs(state),
            };
        },
    });
    };
</script>

<style scoped lang="scss">
    .avatar-uploader .avatar {
        width: 178px;
        height: 178px;
        display: block;
    }
    .home-container {
        height: 100%;
        overflow: hidden;
@@ -308,3 +443,25 @@
        }
    }
</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;
        color: #8c939d;
        width: 178px;
        height: 178px;
        text-align: center;
    }
</style>

 src/views/specialWorkSystem/workTicket/workApply/components/plate.vue

@@ -175,12 +175,27 @@
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="24">
                    <el-form-item label="盲板位置图" prop="workDetail.bpLocationMapPath">
                        <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-row>
            </div>
        </el-form>
        <div class="applyBtn">
            <el-button type="primary" size="large" plain @click="submitForm(ruleFormRef)">发起申请</el-button>
        </div>
    </div>
    <el-dialog v-model="dialogVisible">
        <img w-full :src="dialogImageUrl" alt="Preview Image" />
    </el-dialog>
    </div>
</template>

@@ -191,16 +206,24 @@
    import {useUserInfo} from "/@/stores/userInfo";
    import { Session } from '/@/utils/storage';
    import { Search } from '@element-plus/icons-vue'
    import { ElMessage } from 'element-plus'
    import type { FormInstance, FormRules } from 'element-plus'
    import { ElMessage, ElMessageBox } from 'element-plus'
    import type { FormInstance, FormRules, UploadProps, UploadUserFile } from 'element-plus'
    import { workApplyApi } from '/@/api/specialWorkSystem/workApply';

    import axios from 'axios';

    interface stateType {
        form: Object,
        csDepList: Array<any>,
        otherWorkList: Array<any>,
        workLevelList: Array<any>
        workLevelList: Array<any>,
        fileList: Array<file>,
        uploadUrl: string,
        dialogVisible: Boolean,
        dialogImageUrl: string | null,
        imgLimit: number,
    }
    interface file {
        url: string;
    }
    export default defineComponent({
        name: 'brokenForm',
@@ -224,7 +247,7 @@
                        bpMaterialQuality: '',
                        bpSpecification: '',
                        bpLocation: '',
                        bpLocationMapPath: '',
                        bpLocationMapPath: [],
                        installLine: [],
                        installBpTime: '',
                        uninstallBpTime: '',
@@ -234,6 +257,11 @@
                    expStartTime: '',
                    expEndTime: ''
                },
                fileList: [],
                imgLimit: 5,
                uploadUrl: '',
                dialogVisible: false,
                dialogImageUrl: null,
                workLevelList: [
                    {
                        label: "抽盲板作业",
@@ -321,6 +349,7 @@
                "workDetail.bpSpecification": [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
                "workDetail.installLine": [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
                "workDetail.bpLocation": [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
                "workDetail.bpLocationMapPath": [{ required: true, message: '该内容不能为空', trigger: 'blur' }]
            });
            const submitForm = async (formEl: FormInstance | undefined) => {
                if (!formEl) return
@@ -334,9 +363,9 @@
                        let { installLine, ...data2 } = JSON.parse(JSON.stringify(state.form.workDetail))
                        data.workDetail = data2
                        data.workDetail.otherSpecialWork = data.workDetail.otherSpecialWork.join(',')
                        data.workDetail.bpLocationMapPath = data.workDetail.bpLocationMapPath.join(',')
                        data.workDetail.temperature = Number(data.workDetail.temperature)
                        data.workDetail.pressure = Number(data.workDetail.pressure)
                        console.log(data,'data')
                        const res = await workApplyApi().postPlateApply(data)
                        if (res.data.code === '200') {
                                ElMessage({
@@ -344,6 +373,8 @@
                                    message: '提交成功！'
                                });
                                formEl.resetFields()
                                state.form.workDetail.bpLocationMapPath = []
                                state.fileList = []
                        } else {
                            ElMessage({
                                type: 'warning',
@@ -355,6 +386,91 @@
                    }
                })
            }
            const handlePreview: UploadProps['onPreview'] = (uploadFile) => {
                console.log(uploadFile);
            };

            const handlePictureCardPreview = (uploadFile: { url: string }) => {
                state.dialogImageUrl = uploadFile.url!;
                state.dialogVisible = true;
            };

            const getUploadUrl = async (rawFile: any) => {
                const res = await workApplyApi().getUploadUrl(rawFile.name);
                state.form.workDetail.bpLocationMapPath.push(res.data.data.fileName)
                state.uploadUrl = res.data.data.uploadUrl;
                console.log(res.data.data.fileName,'name')
            };

            const upload = async (params: any) => {
                // const formData = new FormData();
                // formData.append('file', state.fileList[0].raw);
                let reader = new FileReader();
                reader.readAsArrayBuffer(params.file);
                reader.onload = async () => {
                    axios
                            .put(state.uploadUrl, reader.result, {
                                header: { 'Content-Type': 'multipart/form-data' }
                            })
                            .then(() => {
                                // if (state.fileList.length === 2) {
                                //     state.fileList.splice(0, 1);
                                // }
                                // console.log(state.form.workDetail.bpLocationMapPath,'bpLocationMapPath')
                            });
                };
            };

            const beforeRemove = (file: {}, fileList: []) => {
                const result = new Promise((resolve, reject) => {
                    ElMessageBox.confirm('此操作将删除该图片, 是否继续?', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    })
                            .then(() => {
                                // console.log(state.workDetail.bpLocationMapPath,'path')
                                const list = JSON.parse(JSON.stringify(state.form.workDetail.bpLocationMapPath))
                                fileList.map((item,index)=>{
                                    if(item.uid === file.uid){
                                        fileList.splice(index,1)
                                        state.form.workDetail.bpLocationMapPath.splice(index,1)
                                        deletePic(list[index])
                                    }
                                })
                                // 请求删除接口
                            })
                            .catch(() => {
                                reject(false);
                            });
                });
                return result;
            };


            // 删除图片接口
            const deletePic = async(fileName)=>{
                console.log(fileName,'fileName')
                const res = await workApplyApi().deleteFile({fileName: fileName})
                if (res.data.code === '200') {
                    ElMessage({
                        type: 'success',
                        message: '删除成功！'
                    });
                } else {
                    ElMessage({
                        type: 'warning',
                        message: res.data.msg
                    });
                }
            }
            const showTip =()=>{
                ElMessage({
                    type: 'warning',
                    message: '超出文件上传数量'
                });
            }

            // 折线图
            const renderMenu = async (value: string) => {
                Session.set('projectId',value)
@@ -366,7 +482,13 @@
                Search,
                ruleFormRef,
                applyRules,
                handlePreview,
                getUploadUrl,
                beforeRemove,
                upload,
                showTip,
                submitForm,
                handlePictureCardPreview,
                ...toRefs(state),
            };
        },