From 7298d5354963a88643a543b51b90192dc9fc934c Mon Sep 17 00:00:00 2001 From: doum <doum> Date: 星期四, 11 九月 2025 18:43:14 +0800 Subject: [PATCH] 最新版本541200007 --- admin/src/views/operation/serviceCar/apprConfig.vue | 307 ++++++++++++++++++++++++++------------------------ 1 files changed, 160 insertions(+), 147 deletions(-) diff --git a/admin/src/views/operation/serviceCar/apprConfig.vue b/admin/src/views/operation/serviceCar/apprConfig.vue index e977f26..8ce067b 100644 --- a/admin/src/views/operation/serviceCar/apprConfig.vue +++ b/admin/src/views/operation/serviceCar/apprConfig.vue @@ -1,11 +1,11 @@ <template> - <TableLayout> + <TableLayout :style="'overflow: auto;height: 100%;'"> <template v-slot:table-wrap> <el-tabs v-model="activeType" @tab-click="handleClick"> - <el-tab-pane label="瀹ゅ唴鐢ㄨ溅" name="3"></el-tab-pane> - <el-tab-pane label="瀹ゅ鐢ㄨ溅" name="4"></el-tab-pane> + <el-tab-pane label="甯傚唴鐢ㄨ溅" name="3"></el-tab-pane> + <el-tab-pane label="甯傚鐢ㄨ溅" name="4"></el-tab-pane> </el-tabs> - <div class="config"> + <div class="config" > <div class="config_list"> <div class="config_list_head"> <span>閰嶇疆娴佺▼</span> @@ -20,28 +20,49 @@ <img src="@/assets/images/peizhi_ar@2x.png" alt="" /> </div> <div v-for="(item, index) in apprList" :key="index"> - <div - class="item yellow" - :class="{ - active: activeIndex == index, - blue: item.type == '1', - }" - @click="flowClick(index)" - > + <div class="item yellow" :class="{ + active: activeIndex == index, + blue: item.type == '1', + }" @click="flowClick(index)"> <div class="head">{{ item.remark }}</div> <div class="content"> - <div v-if="item.objIds && item.objIds.length === 1 "> - <span>{{ item.objIds[0].name }} {{ item.objIds[0].companyName }}</span> - <span v-if="item.approveType == 0 && item.type == '0'"> 鎴栫</span> - <span v-if="item.approveType == 1 && item.type == '0'"> 浼氱</span> - </div> - <div v-else-if="item.objIds && item.objIds.length > 1"> - <span>{{ item.objIds[0].name }} 绛�</span> - <span v-if="item.approveType == 0 && item.type == '0'"> 鎴栫</span> - <span v-if="item.approveType == 1 && item.type == '0'"> 浼氱</span> - </div> - <div v-else>璇烽�夋嫨</div> - <i class="el-icon-arrow-right"></i> + <!-- 瀹℃壒 --> + <template v-if="item.type == 0"> + <template v-if="item.memberType == '2'"> + <div>閮ㄩ棬涓荤</div> + </template> + <template v-if="item.memberType == '1'"> + <div v-if="item.objIds && item.objIds.length === 1"> + <span>{{ item.objIds[0].name }} + {{ item.objIds[0].companyName }}</span> + <span v-if="item.approveType == 0 && item.type == '0'"> + 鎴栫</span> + <span v-if="item.approveType == 1 && item.type == '0'"> + 浼氱</span> + </div> + <div v-else-if="item.objIds && item.objIds.length > 1"> + <span>{{ item.objIds[0].name }} 绛�</span> + <span v-if="item.approveType == 0 && item.type == '0'"> + 鎴栫</span> + <span v-if="item.approveType == 1 && item.type == '0'"> + 浼氱</span> + </div> + <div v-else>璇烽�夋嫨</div> + <i class="el-icon-arrow-right"></i> + </template> + </template> + <!-- 鎶勯�� --> + <template v-if="item.type == 1"> + <div v-if="item.objIds && item.objIds.length === 1"> + <span>{{ item.objIds[0].name }} + {{ item.objIds[0].companyName }}</span> + </div> + <div v-else-if="item.objIds && item.objIds.length > 1"> + <span>{{ item.objIds[0].name }} 绛�</span> + </div> + <div v-else>璇烽�夋嫨</div> + <i v-if="item.memberType == '1'" class="el-icon-arrow-right"></i> + </template> </div> </div> <div class="arrows"> @@ -49,11 +70,7 @@ <div class="line"></div> <img src="@/assets/images/peizhi_ar@2x.png" alt="" /> </template> - <i - v-if="apprList.length - 2 === index" - @click="handleAddAppr()" - class="el-icon-circle-plus add" - ></i> + <i v-if="apprList.length - 2 === index" @click="handleAddAppr()" class="el-icon-circle-plus add"></i> </div> </div> </div> @@ -63,126 +80,79 @@ <div class="config_data_item_label">閫夋嫨璇ヨ妭鐐圭殑瀹℃壒浜�</div> <div class="df_ac mb10"> <div>瀹℃壒鑺傜偣鍚嶇О</div> - <el-input - class="w200 ml10" - v-model="apprList[activeIndex].remark" - ></el-input> + <el-input class="w200 ml10" v-model="apprList[activeIndex].remark"></el-input> </div> <!-- 鎶勯�佷汉 --> <template v-if="apprList[activeIndex].type == '1'"> <div class="config_data_item_reviewed_content"> - <div - v-for="mem in apprList[activeIndex].objIds" - :key="mem.id" - class="config_data_item_reviewed_content_item" - > + <div v-for="mem, memIndex in apprList[activeIndex].objIds" :key="mem.id" + class="config_data_item_reviewed_content_item"> <span>{{ mem.name }}</span> - <i class="el-icon-close"></i> + <i @click="memDel(memIndex)" class="el-icon-close"></i> </div> <span class="add" @click="selStaff">+娣诲姞</span> </div> </template> - <el-radio-group - v-if="apprList[activeIndex].type == '0'" - v-model="apprList[activeIndex].memberType" - > + <el-radio-group v-if="apprList[activeIndex].type == '0'" v-model="apprList[activeIndex].memberType"> <!-- <el-radio :label="0">琚浜�</el-radio> --> <el-radio :label="1">鎸囧畾浜哄憳</el-radio> <el-radio :label="2">閮ㄩ棬涓荤</el-radio> </el-radio-group> - <div - class="config_data_item_reviewed" - v-if="apprList[activeIndex].memberType == 1" - > + <div class="config_data_item_reviewed" v-if="apprList[activeIndex].memberType == 1"> <div class="config_data_item_reviewed_label"> <span>鎸囧畾瀹℃牳浜�</span> <span>涓嶈秴杩�20浜�</span> </div> <div class="config_data_item_reviewed_content"> - <div - v-for="(mem, memIndex) in apprList[activeIndex].objIds" - :key="mem.id" - class="config_data_item_reviewed_content_item" - > + <div v-for="(mem, memIndex) in apprList[activeIndex].objIds" :key="mem.id" + class="config_data_item_reviewed_content_item"> <span>{{ mem.name }}</span> <i class="el-icon-close" @click="memDel(memIndex)"></i> </div> <span class="add" @click="selStaff">+娣诲姞</span> </div> </div> - <div - class="config_data_item_reviewed" - v-if="apprList[activeIndex].memberType == 2" - > + <div class="config_data_item_reviewed" v-if="apprList[activeIndex].memberType == 2"> <div class="config_data_item_reviewed_label"> <span>閮ㄩ棬涓荤</span> </div> <div class="config_data_item_reviewed_r"> - <span>琚浜虹殑</span> - <el-select - v-model="apprList[activeIndex].level" - placeholder="璇烽�夋嫨" - style="margin: 0 20px 0 10px" - > + <span>鐢宠浜虹殑</span> + <el-select v-model="apprList[activeIndex].objLevel" placeholder="璇烽�夋嫨" style="margin: 0 20px 0 10px"> <el-option label="鐩存帴涓荤" :value="0" /> <el-option label="浜岀骇涓荤" :value="1" /> <el-option label="涓夌骇涓荤" :value="2" /> <el-option label="鍥涚骇涓荤" :value="4" /> </el-select> - <el-checkbox - v-model="apprList[activeIndex].noleaderOpt" - :true-label="1" - :false-label="0" - >鎵句笉鍒颁富绠℃椂锛岀敱涓婄骇涓荤浠e鏍�</el-checkbox - > + <el-checkbox v-model="apprList[activeIndex].noleaderOpt" :true-label="1" + :false-label="0">鎵句笉鍒颁富绠℃椂锛岀敱涓婄骇涓荤浠e鏍�</el-checkbox> </div> </div> </div> - <div - class="config_data_item" - v-if=" - (apprList[activeIndex].memberType == 1 || - apprList[activeIndex].memberType == 2) && - apprList[activeIndex].type == '0' - " - > + <div class="config_data_item" v-if=" + (apprList[activeIndex].memberType == 1 || + apprList[activeIndex].memberType == 2) && + apprList[activeIndex].type == '0' + "> <div class="config_data_item_label"> 瀹℃壒鏂瑰紡 <span>瀹℃壒浜轰负澶氫釜鏃讹紝閲囩敤鐨勫鎵规柟寮�</span> </div> - <el-radio-group - v-model="apprList[activeIndex].approveType" - style="display: flex; flex-direction: column" - > - <el-radio :label="0" style="margin-bottom: 20px" - >鎴栫锛堝叾涓竴鍚嶅鎵逛汉鍚屾剰鎴栨嫆缁濆嵆鍙級</el-radio - > + <el-radio-group v-model="apprList[activeIndex].approveType" style="display: flex; flex-direction: column"> + <el-radio :label="0" style="margin-bottom: 20px">鎴栫锛堝叾涓竴鍚嶅鎵逛汉鍚屾剰鎴栨嫆缁濆嵆鍙級</el-radio> <el-radio :label="1">浼氱锛堟墍鏈夊鎵逛汉閮藉悓鎰忔墠鍙�氳繃锛�</el-radio> </el-radio-group> </div> <div v-if="apprList[activeIndex].type == '0'" class="df_ac mb10"> <div>鍏佽淇敼"椹鹃┒鍛�"</div> - <el-switch - class="ml10" - active-value="0" - inactive-value="1" - v-model="apprList[activeIndex].driverParam" - ></el-switch> + <el-switch class="ml10" :active-value="1" :inactive-value="0" + v-model="apprList[activeIndex].driverParam"></el-switch> </div> <div class="config_data_submit"> - <el-button - @click="onSubmit" - style="background: #435ebe" - type="primary" - >淇濆瓨閰嶇疆椤�</el-button - > - <el-button - v-if="activeIndex !== 0 && activeIndex !== apprList.length - 1" - type="danger" - plain - @click="handleDel" - >鍒犻櫎鑺傜偣</el-button - > + <el-button @click="onSubmit" :loading="subLoading" style="background: #435ebe" + type="primary">淇濆瓨閰嶇疆椤�</el-button> + <el-button v-if="activeIndex !== 0 && activeIndex !== apprList.length - 1" type="danger" plain + @click="handleDel">鍒犻櫎鑺傜偣</el-button> </div> </div> </div> @@ -191,41 +161,27 @@ <el-dialog title="閫夋嫨鍛樺伐" :visible.sync="isShowTransfer" width="1000px"> <div class="staff_modal"> <div class="left"> - <div - style=" + <div style=" width: 100%; height: 50px; background: rgba(242, 242, 242, 1); line-height: 50px; text-align: center; font-size: 14px; - " - > + "> 浼佷笟缁勭粐鏋舵瀯 </div> - <div style="width: 100%; height: 100%; overflow-y: scroll"> - <Tree - :list="companyTree" - :defaultProps="{ - name: 'name', - status: 'fsStatus', - children: 'childList', - id: 'id', - }" - @callback="callback" - /> + <div style="width: 100%; max-height: 560px; overflow-y: scroll"> + <Tree :list="companyTree" :defaultProps="{ + name: 'name', + status: 'fsStatus', + children: 'childList', + id: 'id', + }" @callback="callback" /> </div> </div> - <el-transfer - filterable - :title="['鏈��', '宸查��']" - openAll - :props="{ label: 'name', key: 'keyTemp' }" - filter-placeholder="鎼滅储鍛樺伐" - v-model="searchForm.objIds" - :data="memberList" - class="transfer" - > + <el-transfer filterable :title="['鏈��', '宸查��']" openAll :props="{ label: 'name', key: 'keyTemp' }" + filter-placeholder="鎼滅储鍛樺伐" v-model="searchForm.objIds" :data="memberList" class="transfer"> </el-transfer> </div> <span slot="footer" class="dialog-footer"> @@ -249,9 +205,11 @@ TableLayout, Tree }, - data () { + data() { return { + height: 500, activeType: '3', + subLoading: false, apprList: [ { remark: '瀹℃壒浜�', active: false, type: '0', objIds: [] }, { remark: '鎶勯�佷汉', active: false, type: '1', objIds: [] } @@ -265,12 +223,13 @@ companyTree: [] } }, - created () { + created() { this.getfindCompanyTreePage() this.initDate() + this.height = window.innerHeight -300 }, methods: { - handleClick () { + handleClick() { this.apprList = [] const arr = [ { remark: '瀹℃壒浜�', active: false, type: 0, objIds: [] }, @@ -279,7 +238,7 @@ this.apprList = [...arr] this.initDate() }, - flowClick (i) { + flowClick(i) { this.activeIndex = i this.apprList.forEach((item, index) => { if (i === index) { @@ -297,7 +256,7 @@ } }) }, - initDate () { + initDate() { const { activeType } = this approveTemplByType(activeType).then(res => { if (res && res.paramList) { @@ -311,6 +270,8 @@ companyName: i.companyName } }) + } else { + item.objIds = [] } }) this.apprList = arr @@ -321,7 +282,7 @@ // console.log(res); }) }, - onSubmit () { + onSubmit() { const { apprList, activeType } = this const temp = JSON.parse(JSON.stringify(apprList)) temp.forEach((item, index) => { @@ -332,27 +293,29 @@ item.objIds = '' } }) + this.subLoading = true approveTemplSave({ type: activeType, paramList: temp }).then(res => { - // if (res.code === 200) { + this.subLoading = false this.$tip.success('淇濆瓨鎴愬姛') - // } + }, () => { + this.subLoading = false }) }, - handleDel () { + handleDel() { const { activeIndex } = this this.apprList.splice(activeIndex, 1) this.activeIndex = 0 }, - handleAddAppr () { - this.apprList.splice(this.apprList.length - 1, 0, { remark: '瀹℃壒浜�', active: false, type: 0, objIds: [] }) + handleAddAppr() { + this.apprList.splice(this.apprList.length - 1, 0, { remark: '瀹℃壒浜�', approveType: 0, active: false, type: 0, objIds: [] }) // this.apprList.push({ remark: '瀹℃壒浜�', active: false, type: '0' }) }, // 鑾峰彇缁勭粐鏍� - getfindCompanyTreePage () { + getfindCompanyTreePage() { fetchList() .then(res => { if (res && res.length > 0) { @@ -364,7 +327,7 @@ } }) }, - getMemberList () { + getMemberList() { memberListPost({ model: { companyId: this.searchForm.companyId || '', @@ -373,11 +336,11 @@ erpOrgId: '', hasFace: '', hkStatus: '', - includeChild: false, + includeChild: true, type: 2 }, page: 1, - capacity: 30 + capacity: 300 }).then(res => { this.memberList = res.records || [] this.memberList.forEach(item => { @@ -386,13 +349,13 @@ // console.log('defaultProps', res) }) }, - callback (row) { + callback(row) { console.log(row) this.$set(this.searchForm, 'companyId', row.id) this.$set(this.searchForm, 'erpOrgId', row.erpId) this.getMemberList() }, - TransferSub () { + TransferSub() { const { activeIndex } = this if (this.searchForm.objIds && this.searchForm.objIds.length > 0) { if (this.searchForm.objIds.length > 20) return this.$message.warning('鏈�澶氶�夋嫨20浜�') @@ -413,7 +376,7 @@ this.isShowTransfer = false console.log(this.searchForm.objIds) }, - memDel (memIndex) { + memDel(memIndex) { const { activeIndex } = this this.apprList.forEach((item, index) => { if (activeIndex === index) { @@ -425,11 +388,11 @@ } }) }, - selStaff () { + selStaff() { this.isShowTransfer = true this.getMemberList() }, - seleItem (i) { + seleItem(i) { this.list.forEach((item, index) => { item.active = index === i }) @@ -439,6 +402,9 @@ </script> <style lang="scss" scoped> + .el-container .el-main{ + overflow: auto !important; +} .config { width: 100%; padding-bottom: 20px; @@ -447,6 +413,7 @@ display: flex; align-items: center; justify-content: space-between; + .config_list { width: 543px; height: 100%; @@ -456,18 +423,21 @@ box-sizing: border-box; border: 1px solid #eeeeee; background: #f7f7f7; + .config_list_head { width: 100%; height: 40px; display: flex; align-items: center; justify-content: space-between; + span { font-size: 18px; font-weight: 500; color: #222222; } } + .config_content { width: 100%; height: calc(100% - 40px); @@ -477,28 +447,35 @@ display: flex; align-items: center; flex-direction: column; + &::-webkit-scrollbar { width: 0; } + .active { border: 2px solid #4456ac !important; } + .yellow { background: #e89e42 !important; } + .blue { background: #5094f3 !important; } + .arrows { display: flex; flex-direction: column; align-items: center; position: relative; + .line { width: 1px; height: 60px; background-color: #ccc; } + .add { font-size: 40px; color: #2080f7; @@ -507,10 +484,12 @@ z-index: 999; top: 10px; } + img { width: 12px; } } + .item { width: 200px; cursor: pointer; @@ -521,12 +500,14 @@ position: relative; display: flex; flex-direction: column; + .head { height: 32px; line-height: 32px; padding: 2px 12px; color: #fff; } + .content { flex: 1; background-color: #fff; @@ -535,32 +516,39 @@ padding: 0 12px; justify-content: space-between; } + &:last-child { margin: 0 !important; } } } } + .config_data { flex: 1; height: 100%; margin-left: 20px; + .config_data_submit { margin-top: 50px; } + .config_data_item { width: 100%; display: flex; flex-direction: column; margin-bottom: 30px; + &:last-child { margin: 0 !important; } + .config_data_item_label { font-size: 16px; font-weight: 500; color: #222222; margin-bottom: 20px; + span { font-size: 12px; font-weight: 400; @@ -568,14 +556,17 @@ margin-left: 10px; } } + .config_data_item_reviewed { width: 100%; margin-top: 20px; + .config_data_item_reviewed_r { margin-top: 10px; width: 100%; display: flex; align-items: center; + span { flex-shrink: 0; font-size: 14px; @@ -583,15 +574,18 @@ color: #666666; } } + .config_data_item_reviewed_label { display: flex; align-items: center; + span { &:nth-child(1) { font-size: 14px; font-weight: 400; color: #222222; } + &:nth-child(2) { font-size: 12px; font-weight: 400; @@ -604,6 +598,7 @@ } } } + .config_data_item_reviewed_content { width: 400px; margin-top: 10px; @@ -615,6 +610,7 @@ display: flex; align-items: flex-start; flex-wrap: wrap; + .add { font-size: 12px; font-weight: 400; @@ -622,6 +618,7 @@ cursor: pointer; margin-top: 3px; } + .config_data_item_reviewed_content_item { padding: 3px 5px; background: #f4f7fc; @@ -629,11 +626,13 @@ box-sizing: border-box; margin-right: 10px; margin-bottom: 10px; + span { font-size: 12px; font-weight: 400; color: #333333; } + i { color: #949ba2; margin-left: 10px; @@ -641,17 +640,31 @@ } } } + .staff_modal { display: flex; + .left { width: 300px; margin-right: 20px; } + .transfer { height: 600px; + width: 100%; + display: flex; + justify-content: center; + align-items: center; + + ::v-deep .el-transfer-panel { + flex: 1; + height: 100%; + } + ::v-deep .el-transfer-panel__body { height: 500px; } + ::v-deep .el-transfer-panel__list.is-filterable { height: 480px; } -- Gitblit v1.9.3