style:申请材料目录
Showing
2 changed files
with
363 additions
and
373 deletions
| 1 | <!-- | 1 | <!-- |
| 2 | * @Description: | 2 | * @Description: |
| 3 | * @Autor: renchao | 3 | * @Autor: renchao |
| 4 | * @LastEditTime: 2023-08-01 15:19:13 | 4 | * @LastEditTime: 2023-08-15 09:43:21 |
| 5 | --> | 5 | --> |
| 6 | <template> | 6 | <template> |
| 7 | <div class="clxx"> | 7 | <div class="clxx"> |
| ... | @@ -13,9 +13,7 @@ | ... | @@ -13,9 +13,7 @@ |
| 13 | type="primary" | 13 | type="primary" |
| 14 | native-type="submit" | 14 | native-type="submit" |
| 15 | @click="viewDetail" | 15 | @click="viewDetail" |
| 16 | style="width: 100%; margin-top: 10px" | 16 | style="width: 100%; margin-top: 10px">申请材料目录</el-button> |
| 17 | >查看明细</el-button | ||
| 18 | > | ||
| 19 | <div class="item"> | 17 | <div class="item"> |
| 20 | 材料目录({{ tableData.length }}) | 18 | 材料目录({{ tableData.length }}) |
| 21 | <div style="margin-top: 10px"> | 19 | <div style="margin-top: 10px"> |
| ... | @@ -26,21 +24,17 @@ | ... | @@ -26,21 +24,17 @@ |
| 26 | color: black; | 24 | color: black; |
| 27 | font-size: 14px; | 25 | font-size: 14px; |
| 28 | " | 26 | " |
| 29 | v-if="tableData.length == 0" | 27 | v-if="tableData.length == 0"> |
| 30 | > | ||
| 31 | 暂无数据 | 28 | 暂无数据 |
| 32 | </div> | 29 | </div> |
| 33 | <div | 30 | <div |
| 34 | v-for="(item, index) in tableData" | 31 | v-for="(item, index) in tableData" |
| 35 | :key="item.bsmSj" | 32 | :key="item.bsmSj" |
| 36 | :class="['child', treeCheckId == item.bsmSj ? 'checked' : '']" | 33 | :class="['child', treeCheckId == item.bsmSj ? 'checked' : '']" |
| 37 | @click="treeClick(item, index)" | 34 | @click="treeClick(item, index)"> |
| 38 | > | ||
| 39 | <span v-if="item.isrequired == 1" class="required">必选</span> | 35 | <span v-if="item.isrequired == 1" class="required">必选</span> |
| 40 | {{ item.sjmc }} | 36 | {{ item.sjmc }} |
| 41 | <span class="cl_number" | 37 | <span class="cl_number">({{ item.children ? item.children.length : 0 }})</span> |
| 42 | >({{ item.children ? item.children.length : 0 }})</span | ||
| 43 | > | ||
| 44 | </div> | 38 | </div> |
| 45 | </div> | 39 | </div> |
| 46 | </div> | 40 | </div> |
| ... | @@ -49,9 +43,7 @@ | ... | @@ -49,9 +43,7 @@ |
| 49 | native-type="submit" | 43 | native-type="submit" |
| 50 | style="width: 100%" | 44 | style="width: 100%" |
| 51 | @click="handleAdd()" | 45 | @click="handleAdd()" |
| 52 | v-if="ableOperation" | 46 | v-if="ableOperation">新增</el-button> |
| 53 | >新增</el-button | ||
| 54 | > | ||
| 55 | </div> | 47 | </div> |
| 56 | <image-preview | 48 | <image-preview |
| 57 | ref="imageRef" | 49 | ref="imageRef" |
| ... | @@ -60,402 +52,401 @@ | ... | @@ -60,402 +52,401 @@ |
| 60 | :ableOperation="ableOperation" | 52 | :ableOperation="ableOperation" |
| 61 | @updateList="updateList" | 53 | @updateList="updateList" |
| 62 | @nextPriview="nextPriview" | 54 | @nextPriview="nextPriview" |
| 63 | @prevPriview="prevPriview" | 55 | @prevPriview="prevPriview" /> |
| 64 | /> | ||
| 65 | </div> | 56 | </div> |
| 66 | </div> | 57 | </div> |
| 67 | <clxxAddDialog v-model="isDialog" /> | 58 | <clxxAddDialog v-model="isDialog" /> |
| 68 | </div> | 59 | </div> |
| 69 | </template> | 60 | </template> |
| 70 | <script> | 61 | <script> |
| 71 | import { mapGetters } from "vuex"; | 62 | import { mapGetters } from "vuex"; |
| 72 | import clxxAddDialog from "../dialog/clxxAddDialog.vue"; | 63 | import clxxAddDialog from "../dialog/clxxAddDialog.vue"; |
| 73 | import clxxDetailDialog from "../dialog/clxxDetailDialog.vue"; | 64 | import clxxDetailDialog from "../dialog/clxxDetailDialog.vue"; |
| 74 | import imagePreview from "@/views/components/imagePreview.vue"; | 65 | import imagePreview from "@/views/components/imagePreview.vue"; |
| 75 | import { InitClml, saveClml } from "@/api/clxx.js"; | 66 | import { InitClml, saveClml } from "@/api/clxx.js"; |
| 76 | export default { | 67 | export default { |
| 77 | components: { clxxAddDialog, imagePreview, clxxDetailDialog }, | 68 | components: { clxxAddDialog, imagePreview, clxxDetailDialog }, |
| 78 | data() { | 69 | data () { |
| 79 | return { | 70 | return { |
| 80 | //表单是否可操作 | 71 | //表单是否可操作 |
| 81 | ableOperation: true, | 72 | ableOperation: true, |
| 82 | isDialog: false, | 73 | isDialog: false, |
| 83 | iclass: "", | 74 | iclass: "", |
| 84 | // 材料目录选中 | 75 | // 材料目录选中 |
| 85 | treeCheckIndex: 0, | 76 | treeCheckIndex: 0, |
| 86 | treeCheckId: "", | 77 | treeCheckId: "", |
| 87 | key: 0, | 78 | key: 0, |
| 88 | tableData: [], | 79 | tableData: [], |
| 89 | previewImg: { | 80 | previewImg: { |
| 90 | // 收件标识码 | 81 | // 收件标识码 |
| 91 | bsmSj: "", | 82 | bsmSj: "", |
| 92 | bsmSlsq: this.$parent.bsmSlsq, | 83 | bsmSlsq: this.$parent.bsmSlsq, |
| 93 | index: 0, | 84 | index: 0, |
| 94 | selectedIndex: 0, | 85 | selectedIndex: 0, |
| 95 | imgList: [], | 86 | imgList: [], |
| 96 | }, | 87 | }, |
| 97 | }; | 88 | }; |
| 98 | }, | ||
| 99 | computed: { | ||
| 100 | ...mapGetters(["dictData"]), | ||
| 101 | }, | ||
| 102 | created() { | ||
| 103 | this.clmlInitList(1); | ||
| 104 | }, | ||
| 105 | computed: { | ||
| 106 | ...mapGetters(["workFresh"]), | ||
| 107 | }, | ||
| 108 | watch: { | ||
| 109 | workFresh: { | ||
| 110 | handler(newVal, oldVal) { | ||
| 111 | if (newVal) this.clmlInitList(1); | ||
| 112 | }, | ||
| 113 | }, | 89 | }, |
| 114 | }, | 90 | computed: { |
| 115 | mounted() { | 91 | ...mapGetters(["dictData"]), |
| 116 | this.ableOperation = this.$parent.ableOperation; | ||
| 117 | }, | ||
| 118 | methods: { | ||
| 119 | // 自动预览 | ||
| 120 | /** | ||
| 121 | * @description: 自动预览 | ||
| 122 | * @author: renchao | ||
| 123 | */ | ||
| 124 | nextPriview() { | ||
| 125 | if (this.treeCheckIndex < this.tableData.length) { | ||
| 126 | this.treeCheckIndex++; | ||
| 127 | this.treeCheckId = this.tableData[this.treeCheckIndex].bsmSj; | ||
| 128 | this.previewImg.index = 0; | ||
| 129 | this.previewImg.imgList = this.tableData[this.treeCheckIndex].children; | ||
| 130 | this.previewImg.bsmSj = this.tableData[this.treeCheckIndex].bsmSj; | ||
| 131 | } | ||
| 132 | }, | 92 | }, |
| 133 | /** | 93 | created () { |
| 134 | * @description: prevPriview | 94 | this.clmlInitList(1); |
| 135 | * @author: renchao | ||
| 136 | */ | ||
| 137 | prevPriview() { | ||
| 138 | if (this.treeCheckIndex >= 1) { | ||
| 139 | this.treeCheckIndex--; | ||
| 140 | this.treeCheckId = this.tableData[this.treeCheckIndex].bsmSj; | ||
| 141 | this.previewImg.index = this.previewImg.imgList.length; | ||
| 142 | this.previewImg.imgList = this.tableData[this.treeCheckIndex].children; | ||
| 143 | this.previewImg.bsmSj = this.tableData[this.treeCheckIndex].bsmSj; | ||
| 144 | } | ||
| 145 | }, | 95 | }, |
| 146 | // 材料目录明细初始化 | 96 | computed: { |
| 147 | /** | 97 | ...mapGetters(["workFresh"]), |
| 148 | * @description: 材料目录明细初始化 | 98 | }, |
| 149 | * @param {*} type | 99 | watch: { |
| 150 | * @author: renchao | 100 | workFresh: { |
| 151 | */ | 101 | handler (newVal, oldVal) { |
| 152 | clmlInitList(type) { | 102 | if (newVal) this.clmlInitList(1); |
| 153 | //type 1:列表初始化 2:新增材料 | 103 | }, |
| 154 | return new Promise((resolve) => { | 104 | }, |
| 155 | this.unitData = this.$parent.unitData; | 105 | }, |
| 156 | var formdata = new FormData(); | 106 | mounted () { |
| 157 | formdata.append("bsmSlsq", this.$parent.bsmSlsq); | 107 | this.ableOperation = this.$parent.ableOperation; |
| 158 | if (this.$route.query.sqywbm == "DJBBL") { | 108 | }, |
| 159 | formdata.append("bsmSldy", this.$parent.bsmRepair); | 109 | methods: { |
| 160 | formdata.append("clfl", 3); | 110 | // 自动预览 |
| 161 | } else { | 111 | /** |
| 162 | formdata.append("bsmSldy", this.unitData[0]?.bsmSldy); | 112 | * @description: 自动预览 |
| 163 | formdata.append("clfl", 2); | 113 | * @author: renchao |
| 114 | */ | ||
| 115 | nextPriview () { | ||
| 116 | if (this.treeCheckIndex < this.tableData.length) { | ||
| 117 | this.treeCheckIndex++; | ||
| 118 | this.treeCheckId = this.tableData[this.treeCheckIndex].bsmSj; | ||
| 119 | this.previewImg.index = 0; | ||
| 120 | this.previewImg.imgList = this.tableData[this.treeCheckIndex].children; | ||
| 121 | this.previewImg.bsmSj = this.tableData[this.treeCheckIndex].bsmSj; | ||
| 122 | } | ||
| 123 | }, | ||
| 124 | /** | ||
| 125 | * @description: prevPriview | ||
| 126 | * @author: renchao | ||
| 127 | */ | ||
| 128 | prevPriview () { | ||
| 129 | if (this.treeCheckIndex >= 1) { | ||
| 130 | this.treeCheckIndex--; | ||
| 131 | this.treeCheckId = this.tableData[this.treeCheckIndex].bsmSj; | ||
| 132 | this.previewImg.index = this.previewImg.imgList.length; | ||
| 133 | this.previewImg.imgList = this.tableData[this.treeCheckIndex].children; | ||
| 134 | this.previewImg.bsmSj = this.tableData[this.treeCheckIndex].bsmSj; | ||
| 164 | } | 135 | } |
| 136 | }, | ||
| 137 | // 材料目录明细初始化 | ||
| 138 | /** | ||
| 139 | * @description: 材料目录明细初始化 | ||
| 140 | * @param {*} type | ||
| 141 | * @author: renchao | ||
| 142 | */ | ||
| 143 | clmlInitList (type) { | ||
| 144 | //type 1:列表初始化 2:新增材料 | ||
| 145 | return new Promise((resolve) => { | ||
| 146 | this.unitData = this.$parent.unitData; | ||
| 147 | var formdata = new FormData(); | ||
| 148 | formdata.append("bsmSlsq", this.$parent.bsmSlsq); | ||
| 149 | if (this.$route.query.sqywbm == "DJBBL") { | ||
| 150 | formdata.append("bsmSldy", this.$parent.bsmRepair); | ||
| 151 | formdata.append("clfl", 3); | ||
| 152 | } else { | ||
| 153 | formdata.append("bsmSldy", this.unitData[0]?.bsmSldy); | ||
| 154 | formdata.append("clfl", 2); | ||
| 155 | } | ||
| 165 | 156 | ||
| 166 | InitClml(formdata).then((res) => { | 157 | InitClml(formdata).then((res) => { |
| 167 | if (res.code == 200) { | 158 | if (res.code == 200) { |
| 168 | resolve(res.code); | 159 | resolve(res.code); |
| 169 | if (res.result && res.result.length > 0) { | 160 | if (res.result && res.result.length > 0) { |
| 170 | this.tableData = res.result; | 161 | this.tableData = res.result; |
| 171 | if (type == 1) { | 162 | if (type == 1) { |
| 172 | this.treeClick(this.tableData[0], 0); | 163 | this.treeClick(this.tableData[0], 0); |
| 173 | } else { | 164 | } else { |
| 174 | //新增材料后刷新列表焦点置于新增的对象上 | 165 | //新增材料后刷新列表焦点置于新增的对象上 |
| 175 | this.treeClick( | 166 | this.treeClick( |
| 176 | this.tableData[this.tableData.length - 1], | 167 | this.tableData[this.tableData.length - 1], |
| 177 | this.tableData.length - 1 | 168 | this.tableData.length - 1 |
| 178 | ); | 169 | ); |
| 170 | } | ||
| 179 | } | 171 | } |
| 172 | } else { | ||
| 173 | this.$message.error(res.message); | ||
| 180 | } | 174 | } |
| 181 | } else { | 175 | }); |
| 182 | this.$message.error(res.message); | ||
| 183 | } | ||
| 184 | }); | 176 | }); |
| 185 | }); | 177 | }, |
| 186 | }, | 178 | /** |
| 187 | /** | 179 | * @description: setChecked |
| 188 | * @description: setChecked | 180 | * @param {*} item |
| 189 | * @param {*} item | 181 | * @author: renchao |
| 190 | * @author: renchao | 182 | */ |
| 191 | */ | 183 | setChecked (item) { |
| 192 | setChecked(item) { | 184 | this.treeCheckId = item.bsmSj; |
| 193 | this.treeCheckId = item.bsmSj; | 185 | this.title = item.sjmc; |
| 194 | this.title = item.sjmc; | 186 | this.titleYs = 1; |
| 195 | this.titleYs = 1; | 187 | this.titleNum = item.children.length; |
| 196 | this.titleNum = item.children.length; | 188 | this.previewImg.imgList = item.children; |
| 197 | this.previewImg.imgList = item.children; | 189 | this.previewImg.bsmSj = item.bsmSj; |
| 198 | this.previewImg.bsmSj = item.bsmSj; | 190 | }, |
| 199 | }, | 191 | /** |
| 200 | /** | 192 | * @description: updateList |
| 201 | * @description: updateList | 193 | * @param {*} val |
| 202 | * @param {*} val | 194 | * @author: renchao |
| 203 | * @author: renchao | 195 | */ |
| 204 | */ | 196 | updateList (val) { |
| 205 | updateList(val) { | 197 | let that = this; |
| 206 | let that = this; | 198 | if (val.children.length != 0) { |
| 207 | if (val.children.length != 0) { | 199 | //删除最后一张图片时 val=null |
| 208 | //删除最后一张图片时 val=null | 200 | this.tableData.forEach((item) => { |
| 209 | this.tableData.forEach((item) => { | 201 | if (item.bsmSj === val.bsmSj) { |
| 210 | if (item.bsmSj === val.bsmSj) { | 202 | item.children = val.children; |
| 211 | item.children = val.children; | 203 | } |
| 204 | }); | ||
| 205 | this.previewImg.imgList = _.cloneDeep(val.children); | ||
| 206 | if (this.previewImg.index == this.previewImg.imgList.length) { | ||
| 207 | this.previewImg.index = this.previewImg.index - 1; | ||
| 212 | } | 208 | } |
| 213 | }); | 209 | } else { |
| 214 | this.previewImg.imgList = _.cloneDeep(val.children); | 210 | this.previewImg.imgList = []; |
| 215 | if (this.previewImg.index == this.previewImg.imgList.length) { | 211 | this.tableData.forEach((item, index) => { |
| 216 | this.previewImg.index = this.previewImg.index - 1; | 212 | if (this.treeCheckId == item.bsmSj) { |
| 213 | item.children = []; | ||
| 214 | that.treeCheckIndex = index; | ||
| 215 | } | ||
| 216 | }); | ||
| 217 | } | ||
| 218 | }, | ||
| 219 | // 添加材料目录 | ||
| 220 | /** | ||
| 221 | * @description: 添加材料目录 | ||
| 222 | * @author: renchao | ||
| 223 | */ | ||
| 224 | handleAdd () { | ||
| 225 | this.isDialog = true; | ||
| 226 | }, | ||
| 227 | // 新增弹窗保存 | ||
| 228 | /** | ||
| 229 | * @description: 新增弹窗保存 | ||
| 230 | * @param {*} data | ||
| 231 | * @author: renchao | ||
| 232 | */ | ||
| 233 | addSave (data) { | ||
| 234 | let obj = { | ||
| 235 | bsmSlsq: this.$parent.bsmSlsq, | ||
| 236 | isrequired: "1", | ||
| 237 | sjmc: data.clmc, | ||
| 238 | sjsl: 0, | ||
| 239 | smzt: "", | ||
| 240 | ys: 0, | ||
| 241 | sjlx: data.cllx, | ||
| 242 | sfxjcl: "1", // 是否必选 | ||
| 243 | }; | ||
| 244 | if (this.$route.query.sqywbm == "DJBBL") { | ||
| 245 | obj.bsmSldy = this.$parent.bsmRepair | ||
| 217 | } | 246 | } |
| 218 | } else { | 247 | saveClml(obj).then(async (res) => { |
| 219 | this.previewImg.imgList = []; | 248 | if (res.code == 200) { |
| 220 | this.tableData.forEach((item, index) => { | 249 | let res = await this.clmlInitList(2); |
| 221 | if (this.treeCheckId == item.bsmSj) { | 250 | if (res == 200) |
| 222 | item.children = []; | 251 | this.$message({ |
| 223 | that.treeCheckIndex = index; | 252 | message: "新增成功", |
| 253 | type: "success", | ||
| 254 | }); | ||
| 224 | } | 255 | } |
| 225 | }); | 256 | }); |
| 226 | } | 257 | }, |
| 227 | }, | 258 | // 材料目录点击选中 |
| 228 | // 添加材料目录 | 259 | /** |
| 229 | /** | 260 | * @description: 材料目录点击选中 |
| 230 | * @description: 添加材料目录 | 261 | * @param {*} item |
| 231 | * @author: renchao | 262 | * @param {*} index |
| 232 | */ | 263 | * @author: renchao |
| 233 | handleAdd() { | 264 | */ |
| 234 | this.isDialog = true; | 265 | treeClick (item, index) { |
| 235 | }, | 266 | this.previewImg.index = 0; |
| 236 | // 新增弹窗保存 | 267 | this.treeCheckId = item?.bsmSj; |
| 237 | /** | 268 | this.treeCheckIndex = index; |
| 238 | * @description: 新增弹窗保存 | 269 | this.previewImg.imgList = item.children ? item.children : []; |
| 239 | * @param {*} data | 270 | this.previewImg.bsmSj = item?.bsmSj; |
| 240 | * @author: renchao | 271 | }, |
| 241 | */ | 272 | // 小图片点击 |
| 242 | addSave(data) { | 273 | /** |
| 243 | let obj = { | 274 | * @description: 小图片点击 |
| 244 | bsmSlsq: this.$parent.bsmSlsq, | 275 | * @param {*} item |
| 245 | isrequired: "1", | 276 | * @param {*} index |
| 246 | sjmc: data.clmc, | 277 | * @author: renchao |
| 247 | sjsl: 0, | 278 | */ |
| 248 | smzt: "", | 279 | imgClick (item, index) { |
| 249 | ys: 0, | 280 | this.showImg = item; |
| 250 | sjlx: data.cllx, | 281 | this.titleYs = index + 1; |
| 251 | sfxjcl: "1", // 是否必选 | 282 | }, |
| 252 | }; | 283 | // 字典 |
| 253 | if (this.$route.query.sqywbm == "DJBBL") { | 284 | /** |
| 254 | obj.bsmSldy=this.$parent.bsmRepair | 285 | * @description: 字典 |
| 255 | } | 286 | * @param {*} val |
| 256 | saveClml(obj).then(async (res) => { | 287 | * @param {*} code |
| 257 | if (res.code == 200) { | 288 | * @author: renchao |
| 258 | let res = await this.clmlInitList(2); | 289 | */ |
| 259 | if (res == 200) | 290 | dicStatus (val, code) { |
| 260 | this.$message({ | 291 | let data = this.$store.getters.dictData[code], |
| 261 | message: "新增成功", | 292 | name = "暂无"; |
| 262 | type: "success", | 293 | if (data) { |
| 263 | }); | 294 | data.map((item) => { |
| 295 | if (item.dcode == val) { | ||
| 296 | name = item.dname; | ||
| 297 | } | ||
| 298 | }); | ||
| 299 | return name; | ||
| 264 | } | 300 | } |
| 265 | }); | 301 | }, |
| 266 | }, | 302 | //查看明细 |
| 267 | // 材料目录点击选中 | 303 | viewDetail () { |
| 268 | /** | 304 | this.$store.dispatch("user/reWorkFresh", false); |
| 269 | * @description: 材料目录点击选中 | 305 | this.$popupDialog( |
| 270 | * @param {*} item | 306 | "申请材料目录", |
| 271 | * @param {*} index | 307 | "workflow/components/dialog/clxxDetailDialog", |
| 272 | * @author: renchao | 308 | { |
| 273 | */ | 309 | data: this.tableData, |
| 274 | treeClick(item, index) { | 310 | unitData: this.$parent.unitData, |
| 275 | this.previewImg.index = 0; | 311 | ableOperation: this.$parent.ableOperation, |
| 276 | this.treeCheckId = item?.bsmSj; | 312 | bsmRepair: this.$parent.bsmRepair |
| 277 | this.treeCheckIndex = index; | 313 | }, |
| 278 | this.previewImg.imgList = item.children ? item.children : []; | 314 | "60%", |
| 279 | this.previewImg.bsmSj = item?.bsmSj; | 315 | true |
| 280 | }, | 316 | ); |
| 281 | // 小图片点击 | 317 | }, |
| 282 | /** | 318 | //设置tableData |
| 283 | * @description: 小图片点击 | 319 | setTableData (tableData) { |
| 284 | * @param {*} item | 320 | this.$nextTick((res) => { |
| 285 | * @param {*} index | 321 | this.tableData = tableData; |
| 286 | * @author: renchao | ||
| 287 | */ | ||
| 288 | imgClick(item, index) { | ||
| 289 | this.showImg = item; | ||
| 290 | this.titleYs = index + 1; | ||
| 291 | }, | ||
| 292 | // 字典 | ||
| 293 | /** | ||
| 294 | * @description: 字典 | ||
| 295 | * @param {*} val | ||
| 296 | * @param {*} code | ||
| 297 | * @author: renchao | ||
| 298 | */ | ||
| 299 | dicStatus(val, code) { | ||
| 300 | let data = this.$store.getters.dictData[code], | ||
| 301 | name = "暂无"; | ||
| 302 | if (data) { | ||
| 303 | data.map((item) => { | ||
| 304 | if (item.dcode == val) { | ||
| 305 | name = item.dname; | ||
| 306 | } | ||
| 307 | }); | 322 | }); |
| 308 | return name; | 323 | }, |
| 309 | } | ||
| 310 | }, | ||
| 311 | //查看明细 | ||
| 312 | viewDetail() { | ||
| 313 | this.$store.dispatch("user/reWorkFresh", false); | ||
| 314 | this.$popupDialog( | ||
| 315 | "查看明细", | ||
| 316 | "workflow/components/dialog/clxxDetailDialog", | ||
| 317 | { | ||
| 318 | data: this.tableData, | ||
| 319 | unitData: this.$parent.unitData, | ||
| 320 | ableOperation: this.$parent.ableOperation, | ||
| 321 | bsmRepair:this.$parent.bsmRepair | ||
| 322 | }, | ||
| 323 | "60%", | ||
| 324 | true | ||
| 325 | ); | ||
| 326 | }, | ||
| 327 | //设置tableData | ||
| 328 | setTableData(tableData) { | ||
| 329 | this.$nextTick((res) => { | ||
| 330 | this.tableData = tableData; | ||
| 331 | }); | ||
| 332 | }, | 324 | }, |
| 333 | }, | 325 | }; |
| 334 | }; | ||
| 335 | </script> | 326 | </script> |
| 336 | <style scoped lang="scss"> | 327 | <style scoped lang="scss"> |
| 337 | @import "~@/styles/mixin.scss"; | 328 | @import "~@/styles/mixin.scss"; |
| 338 | |||
| 339 | .active { | ||
| 340 | background: $light-blue !important; | ||
| 341 | color: #fff; | ||
| 342 | } | ||
| 343 | |||
| 344 | .required { | ||
| 345 | font-size: 12px; | ||
| 346 | color: $pink; | ||
| 347 | float: left; | ||
| 348 | } | ||
| 349 | 329 | ||
| 350 | .cl_number { | 330 | .active { |
| 351 | float: right; | 331 | background: $light-blue !important; |
| 352 | } | 332 | color: #fff; |
| 353 | 333 | } | |
| 354 | .clxx { | ||
| 355 | width: 100%; | ||
| 356 | display: flex; | ||
| 357 | padding-left: 5px; | ||
| 358 | height: calc(100vh - 125px); | ||
| 359 | |||
| 360 | .left { | ||
| 361 | display: flex; | ||
| 362 | flex-direction: column; | ||
| 363 | justify-content: space-between; | ||
| 364 | 334 | ||
| 365 | .item { | 335 | .required { |
| 366 | width: 28px; | 336 | font-size: 12px; |
| 367 | height: 49%; | 337 | color: $pink; |
| 368 | @include flex-center; | 338 | float: left; |
| 369 | background-color: #e4e7ed; | 339 | } |
| 370 | border-bottom-right-radius: 10px; | ||
| 371 | padding: 5px; | ||
| 372 | cursor: pointer; | ||
| 373 | transition: all 0.3s; | ||
| 374 | 340 | ||
| 375 | &:hover { | 341 | .cl_number { |
| 376 | @extend .active; | 342 | float: right; |
| 377 | } | ||
| 378 | } | ||
| 379 | } | 343 | } |
| 380 | 344 | ||
| 381 | .right { | 345 | .clxx { |
| 382 | width: 100%; | 346 | width: 100%; |
| 383 | height: 100%; | 347 | display: flex; |
| 348 | padding-left: 5px; | ||
| 349 | height: calc(100vh - 125px); | ||
| 384 | 350 | ||
| 385 | .clmlmx-box { | 351 | .left { |
| 386 | margin: 0 auto; | 352 | display: flex; |
| 353 | flex-direction: column; | ||
| 354 | justify-content: space-between; | ||
| 387 | 355 | ||
| 388 | .title { | 356 | .item { |
| 389 | text-align: center; | 357 | width: 28px; |
| 390 | height: 60px; | 358 | height: 49%; |
| 391 | line-height: 60px; | 359 | @include flex-center; |
| 392 | border: 1px solid #dfe6ec; | 360 | background-color: #e4e7ed; |
| 393 | font-size: 20px; | 361 | border-bottom-right-radius: 10px; |
| 394 | background: #81d3f81a; | 362 | padding: 5px; |
| 395 | margin-bottom: -1px; | 363 | cursor: pointer; |
| 364 | transition: all 0.3s; | ||
| 365 | |||
| 366 | &:hover { | ||
| 367 | @extend .active; | ||
| 368 | } | ||
| 396 | } | 369 | } |
| 397 | } | 370 | } |
| 398 | 371 | ||
| 399 | .clyl-box { | 372 | .right { |
| 400 | width: 100%; | 373 | width: 100%; |
| 401 | height: 100%; | 374 | height: 100%; |
| 402 | display: flex; | ||
| 403 | 375 | ||
| 404 | .menu-tree { | 376 | .clmlmx-box { |
| 405 | width: 20%; | 377 | margin: 0 auto; |
| 406 | min-width: 160px; | ||
| 407 | height: 100%; | ||
| 408 | margin-right: 10px; | ||
| 409 | border-right: 1px dotted #d9d9d9; | ||
| 410 | padding: 0 15px; | ||
| 411 | 378 | ||
| 412 | .item { | 379 | .title { |
| 413 | line-height: 30px; | ||
| 414 | padding-top: 5px; | ||
| 415 | border-bottom: 1px solid #e8e8e8; | ||
| 416 | font-size: 16px; | ||
| 417 | text-align: center; | 380 | text-align: center; |
| 418 | color: $light-blue; | 381 | height: 60px; |
| 382 | line-height: 60px; | ||
| 383 | border: 1px solid #dfe6ec; | ||
| 384 | font-size: 20px; | ||
| 385 | background: #81d3f81a; | ||
| 386 | margin-bottom: -1px; | ||
| 387 | } | ||
| 388 | } | ||
| 419 | 389 | ||
| 420 | .itemIcon { | 390 | .clyl-box { |
| 421 | float: right; | 391 | width: 100%; |
| 422 | line-height: 60px; | 392 | height: 100%; |
| 423 | cursor: pointer; | 393 | display: flex; |
| 424 | } | ||
| 425 | 394 | ||
| 426 | .child { | 395 | .menu-tree { |
| 427 | line-height: 32px; | 396 | width: 20%; |
| 428 | border-bottom: 1px solid #e8e8e8; | 397 | min-width: 160px; |
| 429 | padding-left: 10px; | 398 | height: 100%; |
| 430 | color: #6b6b6b; | 399 | margin-right: 10px; |
| 431 | cursor: pointer; | 400 | border-right: 1px dotted #d9d9d9; |
| 432 | box-sizing: border-box; | 401 | padding: 0 15px; |
| 433 | border-radius: 6px; | ||
| 434 | line-height: 20px; | ||
| 435 | transition: all 0.3s; | ||
| 436 | padding: 8px 0; | ||
| 437 | } | ||
| 438 | 402 | ||
| 439 | .child:hover { | 403 | .item { |
| 404 | line-height: 30px; | ||
| 405 | padding-top: 5px; | ||
| 406 | border-bottom: 1px solid #e8e8e8; | ||
| 407 | font-size: 16px; | ||
| 408 | text-align: center; | ||
| 440 | color: $light-blue; | 409 | color: $light-blue; |
| 441 | transform: scale(1.1); | ||
| 442 | } | ||
| 443 | 410 | ||
| 444 | .checked { | 411 | .itemIcon { |
| 445 | border: 1px solid $light-blue; | 412 | float: right; |
| 446 | color: $light-blue; | 413 | line-height: 60px; |
| 414 | cursor: pointer; | ||
| 415 | } | ||
| 416 | |||
| 417 | .child { | ||
| 418 | line-height: 32px; | ||
| 419 | border-bottom: 1px solid #e8e8e8; | ||
| 420 | padding-left: 10px; | ||
| 421 | color: #6b6b6b; | ||
| 422 | cursor: pointer; | ||
| 423 | box-sizing: border-box; | ||
| 424 | border-radius: 6px; | ||
| 425 | line-height: 20px; | ||
| 426 | transition: all 0.3s; | ||
| 427 | padding: 8px 0; | ||
| 428 | } | ||
| 429 | |||
| 430 | .child:hover { | ||
| 431 | color: $light-blue; | ||
| 432 | transform: scale(1.1); | ||
| 433 | } | ||
| 434 | |||
| 435 | .checked { | ||
| 436 | border: 1px solid $light-blue; | ||
| 437 | color: $light-blue; | ||
| 438 | } | ||
| 447 | } | 439 | } |
| 448 | } | 440 | } |
| 449 | } | ||
| 450 | 441 | ||
| 451 | .clyl-img { | 442 | .clyl-img { |
| 452 | width: 75%; | 443 | width: 75%; |
| 453 | height: 100%; | 444 | height: 100%; |
| 454 | background: #f3f4f7; | 445 | background: #f3f4f7; |
| 455 | margin: 0 auto; | 446 | margin: 0 auto; |
| 456 | position: relative; | 447 | position: relative; |
| 448 | } | ||
| 457 | } | 449 | } |
| 458 | } | 450 | } |
| 459 | } | 451 | } |
| 460 | } | ||
| 461 | </style> | 452 | </style> | ... | ... |
| 1 | <!-- | 1 | <!-- |
| 2 | * @Description: | 2 | * @Description: |
| 3 | * @Autor: renchao | 3 | * @Autor: renchao |
| 4 | * @LastEditTime: 2023-08-02 09:53:05 | 4 | * @LastEditTime: 2023-08-15 09:43:46 |
| 5 | --> | 5 | --> |
| 6 | <template> | 6 | <template> |
| 7 | <div class="clmlmx-box"> | 7 | <div class="clmlmx-box"> |
| 8 | <div class="title">申请材料目录</div> | ||
| 9 | <lb-table :column="column" :key="key" :heightNumSetting="true" :calcHeight="600" :pagination="false" :data="tableData"> | 8 | <lb-table :column="column" :key="key" :heightNumSetting="true" :calcHeight="600" :pagination="false" :data="tableData"> |
| 10 | </lb-table> | 9 | </lb-table> |
| 11 | <div class="text-center"> | 10 | <div class="text-center"> |
| ... | @@ -61,7 +60,7 @@ | ... | @@ -61,7 +60,7 @@ |
| 61 | label: "材料名称", | 60 | label: "材料名称", |
| 62 | render: (h, scope) => { | 61 | render: (h, scope) => { |
| 63 | return ( | 62 | return ( |
| 64 | this.formData.ableOperation ? | 63 | (this.formData.ableOperation && scope.row.isrequired != '1') ? |
| 65 | <el-input value={scope.row.sjmc} onInput={(val) => { scope.row.sjmc = val }}></el-input> : <span>{scope.row.sjmc}</span> | 64 | <el-input value={scope.row.sjmc} onInput={(val) => { scope.row.sjmc = val }}></el-input> : <span>{scope.row.sjmc}</span> |
| 66 | ) | 65 | ) |
| 67 | } | 66 | } |
| ... | @@ -209,14 +208,14 @@ | ... | @@ -209,14 +208,14 @@ |
| 209 | return new Promise(resolve => { | 208 | return new Promise(resolve => { |
| 210 | this.unitData = this.$parent.unitData; | 209 | this.unitData = this.$parent.unitData; |
| 211 | var formdata = new FormData(); | 210 | var formdata = new FormData(); |
| 212 | formdata.append("bsmSlsq", Vue.prototype.$currentRoute.query.bsmSlsq); | 211 | formdata.append("bsmSlsq", Vue.prototype.$currentRoute.query.bsmSlsq); |
| 213 | if (Vue.prototype.$currentRoute.query.sqywbm == "DJBBL") { | 212 | if (Vue.prototype.$currentRoute.query.sqywbm == "DJBBL") { |
| 214 | formdata.append("bsmSldy", this.formData.bsmRepair); | 213 | formdata.append("bsmSldy", this.formData.bsmRepair); |
| 215 | formdata.append("clfl", 3); | 214 | formdata.append("clfl", 3); |
| 216 | } else { | 215 | } else { |
| 217 | formdata.append("bsmSldy", this.formData.unitData[0]?.bsmSldy); | 216 | formdata.append("bsmSldy", this.formData.unitData[0]?.bsmSldy); |
| 218 | formdata.append("clfl", 2); | 217 | formdata.append("clfl", 2); |
| 219 | } | 218 | } |
| 220 | InitClml(formdata).then((res) => { | 219 | InitClml(formdata).then((res) => { |
| 221 | if (res.code == 200) { | 220 | if (res.code == 200) { |
| 222 | resolve(res.code) | 221 | resolve(res.code) | ... | ... |
-
Please register or sign in to post a comment