From d441a339549da0e1280879333f0b22823a603443 Mon Sep 17 00:00:00 2001 From: fuliqi <fuliqi@qq.com> Date: 星期一, 02 十二月 2024 16:59:11 +0800 Subject: [PATCH] 合同积分的提示、地图样式调整 --- src/views/system/contract/contract/index.vue | 331 +++++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 258 insertions(+), 73 deletions(-) diff --git a/src/views/system/contract/contract/index.vue b/src/views/system/contract/contract/index.vue index f2e4eee..9d9757d 100644 --- a/src/views/system/contract/contract/index.vue +++ b/src/views/system/contract/contract/index.vue @@ -23,7 +23,6 @@ </el-form-item> </el-form> - <el-row :gutter="10" class="mb8" style="margin-top: 10px"> <el-col :span="1.5"> <el-button @@ -31,75 +30,113 @@ plain icon="el-icon-plus" size="mini" - v-hasPermi="['system:contract:import']" + v-hasPermi="['system:contract:add']" @click="handleImport" - >鏂板</el-button + >鏂板 + </el-button > </el-col> </el-row> - <el-row v-loading="loading" :gutter="20"> + <el-row v-if="contractList && contractList.length > 0" v-loading="loading" :gutter="20"> <el-col - :span="8" + :span="6" v-for="(item, index) in contractList" :key="index" style="margin-bottom: 10px" > <el-card :body-style="{ padding: '0px' }"> - <ImagePreview + <el-image style="width: 100%; height: 187px" fit="cover" - :src="item.attachment" + :src="require('../../../../assets/images/ht.jpg')" class="image" /> <div style="padding: 14px"> <span>{{ item.name }}</span> <span class="time" style="margin-left: 10px">{{ - item.unitName - }}</span> + item.unitName + }}</span> <div class="bottom clearfix"> <time class="time" - >{{ item.startTime }} 鈥� {{ item.endTime }}</time + >{{ item.startTime }} 鈥� {{ item.endTime }} + </time > <el-button type="text" class="button" @click="handleDetail(item)" - >鏌ョ湅璇︽儏</el-button + >鏌ョ湅璇︽儏 + </el-button > </div> </div> </el-card> </el-col> </el-row> + <el-empty v-else description="鏆傛棤鏁版嵁"></el-empty> <!-- 鍚堝悓璇︽儏 --> - <el-dialog - :title="detailName" - :visible.sync="detail" - width="800px" - append-to-body - > - <el-form label-position="left" inline class="table-expand"> - <el-collapse v-model="activeNames"> - <el-collapse-item - v-for="name, index in ruleName" - :key="index" - :title="name" - > - <div - class="inline-input-container" - v-for="item, index in ruleData" - :key="index" + <!-- <el-dialog--> + <!-- :title="detailName"--> + <!-- :visible.sync="detail"--> + <!-- width="800px"--> + <!-- append-to-body--> + <!-- >--> + + <el-drawer + title="鍚堝悓璇︽儏" + :visible.sync="drawer" + :direction="direction" + :before-close="handleClose" + size="40%"> + <div style="margin-left: 20px;"> + <el-form :inline = "true" :model="form" class="table-expand" > + <el-form-item label="鍚堝悓鍚嶇О" prop="name" > + <el-input v-model="form.name" style="width: 600px;"></el-input> + </el-form-item> + <el-form-item label="鍏徃鍚嶇О" prop="unitId"> + <el-select v-model="form.unitId" placeholder="璇烽�夋嫨"> + <el-option + v-for="item in unitList" + :key="item.id" + :label="item.value" + :value="item.id" + > + </el-option> + </el-select> + </el-form-item> + <el-form-item label="鍚堝悓鏃堕棿" prop="timezone"> + <el-date-picker + v-model="form.timezone" + type="daterange" + value-format="yyyy-MM-dd" + range-separator="鑷�" + start-placeholder="寮�濮嬫椂闂�" + end-placeholder="缁撴潫鏃堕棿" > - <el-tooltip :content=" + </el-date-picker> + </el-form-item> + <el-divider content-position="left">鍚堝悓瑙勫垯</el-divider> + <el-collapse v-model="activeNames"> + <el-collapse-item + v-for="(name, index) in ruleName" + :key="index" + :title="name" + > + <div + class="inline-input-container" + v-for="(item, index) in ruleData" + :key="index" + > + <el-tooltip :content=" item.deductCategory == '鍒嗘暟涔樹互鏁伴噺' ? '鎵�' + item.calcFraction + '鍒�*鏁伴噺 ' : item.deductCategory == '闄や互鏁伴噺鍚庝箻浠ュ垎鏁�' ? '鎵�' + item.calcFraction + '鍒�/' + item.calcUnit + '灏忔椂' : '鎵�' + item.calcFraction + '鍒�'"> - <b v-if="item.ruleName === name">{{ item.ruleCondition }}<br /></b> - </el-tooltip> - </div> - </el-collapse-item> - <el-collapse-item title="鑰冩牳缁撴灉搴旂敤瑙勫垯" :name="ruleData.length"> - <div class="inline-input-container"> + <b v-if="item.ruleName === name">{{ item.ruleCondition }}<br/></b> + </el-tooltip> + </div> + </el-collapse-item> + <el-collapse-item title="鑰冩牳缁撴灉搴旂敤瑙勫垯" :name="ruleData.length"> + <div class="inline-input-container"> <span v-for="(item, index) in moneyRules" :key="index"> <div> <span>{{ item.scoreCondition }}</span> @@ -110,33 +147,129 @@ placement="top" > <span style="margin-left: 20px">{{ - item.description - }}</span> + item.description + }}</span> </el-tooltip> </div> </span> - </div> - </el-collapse-item> - <el-form-item label="鍚堝悓闄勪欢" prop="attachment" class="top"> - <file-upload v-model="form.attachment" /> - </el-form-item> - <el-link - class="top" - v-for="item in contractInfo.attachment != null + <el-empty v-if="moneyRules.length == 0" :image-size="100"/> + </div> + </el-collapse-item> + <el-form-item label="鍚堝悓闄勪欢" prop="attachment" class="top"> + <file-upload v-model="form.attachment"/> + </el-form-item> + <el-link + class="top" + v-for="item in contractInfo.attachment != null ? contractInfo.attachment.split(',') : contractInfo.attachment" - :underline="false" - :key="item" - @click="handleDownload(item)" - >{{ item.substring(item.lastIndexOf("/") + 1) }}</el-link + :underline="false" + :key="item" + @click="handleDownload(item)" + >{{ item.substring(item.lastIndexOf("/") + 1) }} + </el-link + > + <div style="text-align: right; margin-top: 10px"> +<!-- <el-button type="primary" @click="handleImportRule">瀵煎叆瑙勫垯</el-button>--> + <el-button type="primary" @click="submitForm">鎻愪氦</el-button> + </div> + </el-collapse> + </el-form> + </div> + </el-drawer> + <!-- 瀵煎叆瑙勫垯瀵硅瘽妗� --> + <el-dialog + :title="importRule.title" + :visible.sync="importRule.open" + width="1000px" + append-to-body + > + <el-form ref="form" :model="upload" :rules="rules" label-width="80px"> + <div class="row-right" style="margin-left: 80px"> + <div class="margin-5"> + <el-upload + ref="upload" + :limit="1" + accept=".xlsx, .xls" + :headers="upload.headers" + :action="upload.url" + :disabled="upload.isUploading" + :on-progress="handleFileUploadProgress" + :on-success="handleFileSuccess" + :data="upload" + :auto-upload="false" + drag + style="text-align: center" + > + <i class="el-icon-upload"></i> + <div class="el-upload__text"> + 灏嗘枃浠舵嫋鍒版澶勶紝鎴�<em>鐐瑰嚮涓婁紶</em> + </div> + <div class="el-upload__tip text-center" slot="tip"> + <span>浠呭厑璁稿鍏ls銆亁lsx鏍煎紡鏂囦欢銆�</span> + <el-link + type="primary" + :underline="false" + style="font-size: 12px; vertical-align: baseline" + @click="importTemplate" + >涓嬭浇妯℃澘 + </el-link + > + </div> + </el-upload> + </div> + </div> + <el-divider content-position="left">鑰冩牳缁撴灉搴旂敤瑙勫垯</el-divider> + <div class="row-warp"> + <div + class="row" + v-for="(item, index) in upload.ruleList" + :key="index" > - <div style="text-align: right; margin-top: 10px"> - <el-button type="primary" @click="submitForm">鎻愪氦</el-button> + <div class="row-left" style="flex: 0.7"> + <div class="block"> + <el-form-item label="鑰冩牳鏉′欢" prop="ruleList"> + <el-input + v-model="item.scoreCondition" + style="width: 250px" + /> + </el-form-item> + </div> + </div> + <div class="row-right"> + <div class="margin-5"> + <el-form-item label="瑙勫垯鎻忚堪" prop="ruleList"> + <el-input + type="textarea" + v-model="item.description" + style="width: 300px" + /> + <el-button + style="margin-left: 50px" + type="danger" + icon="el-icon-delete" + circle + @click="deleteRule(index)" + ></el-button> + </el-form-item> + </div> + </div> </div> - </el-collapse> + </div> + <el-button + style="margin-left: 50px" + type="success" + icon="el-icon-plus" + circle + @click="addRule" + ></el-button> </el-form> - </el-dialog> + <div slot="footer" class="dialog-footer"> + <el-button @click="upload.open = false">鍙� 娑�</el-button> + <el-button type="primary" @click="submitFileForm">纭� 瀹�</el-button> + </div> + </el-dialog> <!-- 鍚堝悓瀵煎叆瀵硅瘽妗� --> <el-dialog :title="upload.title" @@ -151,7 +284,7 @@ <div class="row-left"> <div class="block"> <el-form-item label="鍚堝悓鍚嶇О" prop="name"> - <el-input v-model="upload.name" /> + <el-input v-model="upload.name"/> </el-form-item> <el-form-item label="鍏徃鍚嶇О" prop="unitId"> <el-select v-model="upload.unitId" placeholder="璇烽�夋嫨"> @@ -208,7 +341,8 @@ :underline="false" style="font-size: 12px; vertical-align: baseline" @click="importTemplate" - >涓嬭浇妯℃澘</el-link + >涓嬭浇妯℃澘 + </el-link > </div> </el-upload> @@ -276,22 +410,24 @@ getContract, updateContract, } from "@/api/platform/contract"; -import { getRuleListByContractId } from "../../../../api/platform/calculate-rule"; -import { getMoneyRulesByContractId } from "../../../../api/platform/calculate-money-rule"; -import { unitSelect } from "../../../../api/platform/unit"; -import { deptSelect } from "../../../../api/system/dept"; -import { getToken } from "@/utils/auth"; -import { ImagePreview } from "@/components/ImagePreview"; +import {getRuleListByContractId} from "../../../../api/platform/calculate-rule"; +import {getMoneyRulesByContractId} from "../../../../api/platform/calculate-money-rule"; +import {unitSelect} from "../../../../api/platform/unit"; +import {deptSelect} from "../../../../api/system/dept"; +import {getToken} from "@/utils/auth"; +import {ImagePreview} from "@/components/ImagePreview"; export default { name: "Contract", - comments: { ImagePreview }, + comments: {ImagePreview}, data() { return { queryParams: { name: '', status: '' }, + drawer: false, + direction: 'rtl', loading: false, contractInfo: {}, // 鍚堝悓瀵煎叆鍙傛暟 @@ -303,13 +439,27 @@ // 鏄惁绂佺敤涓婁紶 isUploading: false, // 璁剧疆涓婁紶鐨勮姹傚ご閮� - headers: { Authorization: "Bearer " + getToken() }, + headers: {Authorization: "Bearer " + getToken()}, // 涓婁紶鐨勫湴鍧� url: process.env.VUE_APP_BASE_API + "/system/contract/importData", ruleList: [], unitId: "", startTime: "", endTime: "", + }, + // 瑙勫垯瀵煎叆鍙傛暟 + importRule: { + // 鏄惁鏄剧ず寮瑰嚭灞傦紙鍚堝悓瀵煎叆锛� + open: false, + // 寮瑰嚭灞傛爣棰橈紙鍚堝悓瀵煎叆锛� + title: "", + // 鏄惁绂佺敤涓婁紶 + isUploading: false, + // 璁剧疆涓婁紶鐨勮姹傚ご閮� + headers: {Authorization: "Bearer " + getToken()}, + // 涓婁紶鐨勫湴鍧� + url: process.env.VUE_APP_BASE_API + "/system/contract/updateRule", + ruleList: [], }, dialogImageUrl: "", dialogVisible: false, @@ -344,14 +494,16 @@ ruleName: [], moneyRules: [], // 琛ㄥ崟鍙傛暟 - form: {}, + form: { + timezone: [] + }, // 琛ㄥ崟鏍¢獙 rules: { name: [ - { required: true, message: "鍚堝悓鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }, + {required: true, message: "鍚堝悓鍚嶇О涓嶈兘涓虹┖", trigger: "blur"}, ], unitId: [ - { required: true, message: "杩愮淮鍗曚綅涓嶈兘涓虹┖", trigger: "change" }, + {required: true, message: "杩愮淮鍗曚綅涓嶈兘涓虹┖", trigger: "change"}, ], timezone: [ { @@ -378,6 +530,14 @@ this.selectDept(); }, methods: { + handleClose(done) { + this.$confirm('纭鍏抽棴锛�') + .then(_ => { + done(); + }) + .catch(_ => { + }); + }, addRule() { this.upload.ruleList.push({ scoreCondition: "", @@ -388,11 +548,15 @@ this.upload.ruleList.splice(index, 1); }, submitForm() { + this.form.startTime = this.form.timezone[0] + this.form.endTime = this.form.timezone[1] updateContract(this.form).then((response) => { this.detail = false; if (response.code != 200) { this.$message.error("鎿嶄綔澶辫触"); } else { + this.drawer = false + this.getList() this.$message.success("鎿嶄綔鎴愬姛"); } }); @@ -401,6 +565,11 @@ handleImport() { this.upload.title = "鍚堝悓瀵煎叆"; this.upload.open = true; + }, + /** 瀵煎叆鎸夐挳鎿嶄綔 */ + handleImportRule() { + this.importRule.title = "瑙勫垯瀵煎叆"; + this.importRule.open = true; }, /** 涓嬭浇妯℃澘鎿嶄綔 */ importTemplate() { @@ -474,11 +643,13 @@ getRuleList(item) { getRuleListByContractId(item.id).then((response) => { this.ruleData = response.data; - this.ruleName = this.ruleData.map((item) => { - return item.ruleName; - }); - this.ruleName = [...new Set(this.ruleName)]; - console.log('this.ruleName', this.ruleName); + if (this.ruleData) { + this.ruleName = this.ruleData.map((item) => { + return item.ruleName; + }); + this.ruleName = [...new Set(this.ruleName)]; + console.log('this.ruleName', this.ruleName); + } this.form.id = item.id; this.contractInfo = item; }); @@ -494,7 +665,16 @@ }, /** 璇︽儏鎸夐挳鎿嶄綔 */ handleDetail(item) { - this.detail = true; + this.form = { + } + this.form.name = item.name + this.form.unitId = item.unitId + this.form.startTime = item.startTime + this.form.endTime = item.endTime + this.$set(this.form, 'timezone', [item.startTime, item.endTime]) + // 杩欐牱鏈塨ug鏀规垚涓婇潰鐨勬柟寮� + // this.form.timezone = [item.startTime,item.endTime] + this.drawer = true; this.detailName = item.name; this.getRuleList(item); }, @@ -532,7 +712,7 @@ } .table-expand { - width: 100%; + width: 95%; color: #99a9bf; } @@ -583,10 +763,12 @@ .margin-5 { margin-left: 5px; } + .row-warp { display: flex; flex-direction: column; } + .row { display: flex; flex-direction: row; @@ -594,11 +776,13 @@ justify-content: center; margin: 5px 0; } + .row-left { flex: 1; display: flex; flex-direction: row; } + .row-right { flex: 1; display: flex; @@ -609,6 +793,7 @@ .el-cascader-node { max-width: 300px; } + .el-divider--horizontal { margin-top: 50px; margin-bottom: 50px; -- Gitblit v1.8.0