| | |
| | | <div class="updateUser"> |
| | | <main> |
| | | <div class="mainContent"> |
| | | <el-form ref="user" style="width: 100%;"> |
| | | <el-form-item prop="code" label="所属事件编号" > |
| | | <el-form |
| | | label-position="right" |
| | | label-width="150px" |
| | | :model="imagedata" |
| | | :rules="rules" |
| | | :disabled="isDisabled" |
| | | ref="user" |
| | | style="width: 100%" |
| | | > |
| | | <!-- <el-form-item prop="belongToId" label="所属事件编号" v-if="true"> |
| | | <el-input v-model="imagedata.code"></el-input> |
| | | </el-form-item> |
| | | <el-form-item prop="code" label="大类名称" > |
| | | <el-input v-model="imagedata.questionType"></el-input> |
| | | <el-form-item prop="eventSource" label="事件来源"> |
| | | <el-input |
| | | v-model="getEventSource(imagedata.eventSource).label" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item prop="code" label="小类名称" > |
| | | <el-input v-model="imagedata.bigType"></el-input> |
| | | <el-form-item prop="category" label="问题类别"> |
| | | <el-input |
| | | v-model="getCategory(imagedata.category).label" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item prop="code" label="图片Id" > |
| | | <el-input v-model="imagedata.imagesId"></el-input> |
| | | |
| | | <el-form-item prop="regionName" label="社区名称"> |
| | | <el-input v-model="imagedata.regionName"></el-input> |
| | | </el-form-item> |
| | | <el-form-item prop="code" label="上传时间" > |
| | | <el-input v-model="imagedata.uploadTime"></el-input> |
| | | <el-form-item prop="id" label="图片Id"> |
| | | <el-input v-model="imagedata.id"></el-input> |
| | | </el-form-item> --> |
| | | <!-- <el-form-item prop="type" label="类型" v-show="false"> |
| | | <el-select v-model="imagedata.type"> |
| | | <el-option |
| | | v-for="item in getResourceType()" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> --> |
| | | <el-form-item prop="url" label="图片:" min-width="8"> |
| | | <my-upload |
| | | :picture-list="imageList" |
| | | :is-show-upload="dialogType !== 'view'" |
| | | @setPictureUrl="setPictureUrl" |
| | | @delPictureUrl="delPictureUrl" |
| | | ></my-upload> |
| | | </el-form-item> |
| | | <!-- <el-form-item prop="questionType" label="问题类型" min-width="8" v-model="imagedata.questionType"> |
| | | </el-form-item> |
| | | <el-form-item prop="bigType" label="大类名称" min-width="8" v-model="imagedata.bigType"> |
| | | </el-form-item> |
| | | <el-form-item prop="smallType" label="小类名称" min-width="8" v-model="imagedata.smallType"> |
| | | </el-form-item> |
| | | <el-form-item prop="imagesId" label="图片Id" min-width="8" v-model="imagedata.imagesId"> |
| | | </el-form-item> |
| | | <el-form-item prop="uploadTime" label="上传时间" min-width="15" v-model="imagedata.uploadTime"> --> |
| | | </el-form-item> |
| | | <!-- <el-form-item v-if="updateFlag"> --> |
| | | <div class="optionBtn"> |
| | | <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">提交 |
| | | </el-button> |
| | | <div v-if="!isDisabled" class="optionBtn"> |
| | | <el-button |
| | | type="primary" |
| | | class="btn submit" |
| | | @click.native.prevent="onSubmit" |
| | | >提交</el-button |
| | | > |
| | | </div> |
| | | <!-- </el-form-item> --> |
| | | </el-form> |
| | | </div> |
| | | </main> |
| | | </div> |
| | | </template> |
| | | <script> |
| | | import { getTypeList } from "@/utils/helper"; |
| | | import { |
| | | deepClone, |
| | | RESOURCE_TYPE, |
| | | CATEGOTY, |
| | | EVENT_SOURCE, |
| | | } from "@/utils/helper"; |
| | | import imageManagement from "@/api/operate/imageManagement"; |
| | | import { FILE_ORIGINAL_URL } from "@/utils"; |
| | | import MyUpload from "@/components/myUpload"; |
| | | |
| | | export default { |
| | | components: { MyUpload }, |
| | | data() { |
| | | |
| | | const validateImageUrl = (rule, value, callback) => { |
| | | if (this.imagedata.url) { |
| | | callback(); |
| | | } else { |
| | | callback(new Error("请上传图片")); |
| | | } |
| | | }; |
| | | return { |
| | | |
| | | imagedata: { |
| | | code: "SJ202211010001", |
| | | questionType: "违规", |
| | | bigType: "违反国家有关标准编制城乡规划", |
| | | smallType: "在居民住宅楼、未配套设立专用烟道的商住综合楼、商住综合楼内与居住层相邻的商业楼层内新建、改建、扩建产生油烟、异味、废气的餐饮服务项目", |
| | | imagesId: "1", |
| | | uploadTime: "2022-10-31 20:20:01" |
| | | belongToId: "", |
| | | eventSource: 1, |
| | | regionName: "", |
| | | category: 1, |
| | | id: "", |
| | | url: "", |
| | | type: "", |
| | | }, |
| | | } |
| | | rules: { |
| | | // belongToId: [ |
| | | // { required: true, trigger: "blur", message: "请输入所属事件编号" }, |
| | | // ], |
| | | // eventSource: [ |
| | | // { required: true, trigger: "blur", message: "请输入事件来源" }, |
| | | // ], |
| | | // regionName: [ |
| | | // { required: true, trigger: "blur", message: "请输入社区名称" }, |
| | | // ], |
| | | // id: [{ required: true, trigger: "blur", message: "请输入图片Id" }], |
| | | // category: [ |
| | | // { required: true, trigger: "blue", message: "请输入问题类型" }, |
| | | // ], |
| | | url: [{ required: true, validator: validateImageUrl }], |
| | | // type: [ |
| | | // { |
| | | // required: true, |
| | | // trigger: ["blur", "change"], |
| | | // message: "请选择类型", |
| | | // }, |
| | | // ], |
| | | }, |
| | | isDisabled: false, |
| | | imageList: [], |
| | | }; |
| | | }, |
| | | |
| | | created() { |
| | | // const that = this; |
| | | // this.user = JSON.parse(JSON.stringify(that.userInfo)); |
| | | // console.log(this.user); |
| | | // this.user.parentId = this.user.parentId === 0 ? '暂无上级部门' : this.user.parentId; |
| | | // this.checkedList = this.user.userInfoDTOS; |
| | | // this.checkedList.forEach((e) => { |
| | | // this.checkedUser.push(e.userId); |
| | | // }); |
| | | // console.log(this.checkedUser) |
| | | // this.$axios({ |
| | | // method: "get", |
| | | // url: "sccg/depart/tree", |
| | | // }).then((res) => { |
| | | // that.departList = res.data; |
| | | // }); |
| | | // this.getUserList(this.user.id); |
| | | // // 获取部门类型 |
| | | // this.getDepartType(); |
| | | if (this.originalData) { |
| | | this.imagedata = deepClone(this.originalData); |
| | | } |
| | | if (this.dialogType !== "create") { |
| | | this.imageList = this.imagedata.url.split(","); |
| | | } |
| | | this.isDisabled = this.dialogType === "view"; |
| | | }, |
| | | methods: { |
| | | // handleUser() { |
| | | // this.$refs["user"].validate((valid) => { |
| | | // if (valid) { |
| | | // const { user, checkedList } = this; |
| | | // const arr = []; |
| | | // checkedList.forEach((item) => { |
| | | // arr.push({ leader: item.leader, userId: item.id ? item.id : item.userId }); |
| | | // }); |
| | | // if (arr.length === 0) { |
| | | // this.$message({ |
| | | // type: 'warning', |
| | | // message: '请选择部门人员', |
| | | // }) |
| | | // } else { |
| | | // this.$axios |
| | | // .post("sccg/depart/update", { |
| | | // id: user.id, |
| | | // departName: user.departName, |
| | | // parentId: user.parentId === '暂无上级部门' ? 0 : user.parentId, |
| | | // departDes: user.departDes, |
| | | // departManagerList: arr, |
| | | // }) |
| | | // .then((res) => { |
| | | // this.$message({ |
| | | // message: res.message, |
| | | // type: res.code === 200 ? "success" : "warning", |
| | | // }); |
| | | // this.$emit("changeDialog", { flag: false }); |
| | | // this.getDepartList(); |
| | | // }); |
| | | // } |
| | | // } else { |
| | | // return false; |
| | | // } |
| | | // }); |
| | | // }, |
| | | // // 获取部门类型 |
| | | // async getDepartType() { |
| | | // this.typeList = await getTypeList(1, "08"); |
| | | // }, |
| | | onSubmit() { |
| | | this.$refs.user.validate((valid) => { |
| | | if (valid) { |
| | | this.imagedata.type="03"; |
| | | const params = Object.assign({}, this.imagedata); |
| | | delete params.regionName; |
| | | delete params.category; |
| | | delete params.eventSource; |
| | | delete params.id; |
| | | params.belongToId = +params.belongToId; |
| | | if (this.dialogType === "create") { |
| | | imageManagement |
| | | .addImageResource(params) |
| | | .then(() => { |
| | | this.$message.success("操作成功"); |
| | | this.$emit("closeDialog"); |
| | | }) |
| | | .catch((err) => this.$message.error(`${err}`)); |
| | | } else { |
| | | imageManagement |
| | | .updateImageResource(params) |
| | | .then(() => { |
| | | this.$message.success("操作成功"); |
| | | this.$emit("closeDialog"); |
| | | }) |
| | | .catch((err) => this.$message.error(`${err}`)); |
| | | } |
| | | } else { |
| | | this.$message.warning("请检查必填项"); |
| | | } |
| | | }); |
| | | }, |
| | | setPictureUrl({ url }) { |
| | | this.imageList.push(`${FILE_ORIGINAL_URL}${url}`); |
| | | this.imagedata.url = this.imageList.join(","); |
| | | }, |
| | | delPictureUrl({ url }) { |
| | | this.imageList = this.imageList.filter((item) => item !== url); |
| | | this.imagedata.url = this.imageList.join(","); |
| | | }, |
| | | getCategory(value) { |
| | | return CATEGOTY.find((item) => item.value === value); |
| | | }, |
| | | |
| | | // // 设置领导 |
| | | // setLeader(idx) { |
| | | // if (this.updateFlag) { |
| | | // this.checkedList.forEach((item, index) => { |
| | | // item.leader = index === idx; |
| | | // }); |
| | | // } |
| | | // }, |
| | | |
| | | // // 获取所有用户信息 |
| | | // getUserList(id) { |
| | | // // 获取所有用户信息、用户查询(暂时支持电话号码) |
| | | // this.$axios.get(`/sccg/depart/query_surplus_exist_user?id=`+id).then((res) => { |
| | | // if (res.code === 200) { |
| | | // this.userList = res.data; |
| | | // } |
| | | // }); |
| | | // }, |
| | | // addUser() { |
| | | // this.checkedList = []; |
| | | // this.userList.forEach((item) => { |
| | | // this.checkedUser.forEach((child) => { |
| | | // if (item.id == child) { |
| | | // this.checkedList.push({ |
| | | // id: item.id, |
| | | // username: item.username, |
| | | // leader: false, |
| | | // }); |
| | | // } |
| | | // }); |
| | | // }); |
| | | // this.checkedList[0].leader = true; |
| | | // console.log(this.checkedList); |
| | | // this.openUser = false; |
| | | // }, |
| | | // }, |
| | | // props: ["userInfo", "updateFlag", "getDepartList", "changeDialog"], |
| | | getEventSource(value) { |
| | | return EVENT_SOURCE.find((item) => item.value === value); |
| | | }, |
| | | getResourceType(value) { |
| | | return value |
| | | ? RESOURCE_TYPE.find((item) => item.value === value) |
| | | : RESOURCE_TYPE; |
| | | }, |
| | | }, |
| | | props:['updateFlag'] |
| | | props: { |
| | | originalData: { |
| | | type: Object, |
| | | default: () => null, |
| | | }, |
| | | dialogType: { |
| | | type: String, |
| | | default: () => "create", |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | <style lang="scss" scoped> |
| | | .updateUser { |
| | | border-radius: 1px; |
| | | background-color: #09152f; |
| | | // background-color: #09152f; |
| | | |
| | | main { |
| | | // border: 1px solid #fff; |
| | | text-align: left; |
| | | padding: 0 55px; |
| | | background-color: #09152f; |
| | | // background-color: #09152f; |
| | | padding-bottom: 50px; |
| | | |
| | | // .mainTitle { |
| | | // color: #4b9bb7; |
| | | // font-weight: 600; |
| | | // line-height: 100px; |
| | | // font-size: 14px; |
| | | // } |
| | | |
| | | .mainContent { |
| | | display: flex; |
| | |
| | | display: flex; |
| | | margin-top: 20px; |
| | | justify-content: center; |
| | | |
| | | .btn { |
| | | padding: 12px 50px; |
| | | } |
| | |
| | | } |
| | | |
| | | .updateUser::v-deep .el-input__inner { |
| | | background-color: #09152f; |
| | | // background-color: #09152f; |
| | | border: 1px solid #17324c; |
| | | } |
| | | |
| | |
| | | min-height: 240px; |
| | | max-height: 260px; |
| | | overflow: hidden; |
| | | background-color: #09152f; |
| | | // background-color: #09152f; |
| | | position: relative; |
| | | max-width: 220px; |
| | | |
| | |
| | | right: 20px; |
| | | width: 20px; |
| | | height: 180px; |
| | | background-color: #09152f; |
| | | // background-color: #09152f; |
| | | } |
| | | |
| | | .item { |
| | |
| | | color: red; |
| | | } |
| | | |
| | | .el-input { |
| | | .el-input, |
| | | .el-select { |
| | | width: 280px !important; |
| | | } |
| | | </style> |