| @@ -2,3 +2,4 @@ | |||
| /ext.json | |||
| /project.config.json | |||
| /.vscode/** | |||
| node_modules | |||
| @@ -0,0 +1,23 @@ | |||
| export let ContractUrl={ | |||
| workflowStart:'/api/workflow/start',//开启审批 | |||
| buildBill:'/api/wxPropertyContract/buildBill',//物业合同生成预账单 | |||
| businessList:"/api/wxBusiness/listAll",//经营业态 | |||
| getPayAccountInfo:'/api/wxRentContract/getPayAccountInfo',//获取商场收银信息 | |||
| savePayAccountInfo:'/api/wxRentContract/savePayAccountInfo',//保存商场收银信息 | |||
| getDateDiff:"/api/wxRentContract/getDateDiff",//获取总租期(时间差 --月--天) | |||
| endContract:"/api/wxRentContract/endContract",//终止合同 | |||
| endPropertyContract:"/api/wxPropertyContract/endContract",//终止物业合同 | |||
| rentPropertyContractFindById:"/api/wxRentPropertyContract/findById", //租金+物业合同详情 | |||
| rentPropertyContractList:"/api/wxRentPropertyContract/list", //租金+物业合同列表 | |||
| updateRentContractStatus:"/api/wxRentContract/updateRentContractStatus",//更改合同状态 | |||
| updatePropertyContractStatus:"/api/wxPropertyContract/updatePropertyContractStatus",//更改合同状态 | |||
| buildBillPriceList:"/api/wxRentContract/buildBillPriceList",//更改周期时间返回账单金额 | |||
| buildPropertyBillPriceList:"/api/wxPropertyContract/buildBillPriceList",//更改周期时间返回账单金额 | |||
| // getContractList:"/api/wxRentContractExtension/getAllContractInfo",//获取所有合同信息 | |||
| getContractList:"/api/wxRentContract/getRentContractList",//获取所有合同信息 | |||
| getContractInfo:"/api/wxRentContract/getXuQianRentContract",//获取合同信息详情 | |||
| // getMerchantIdFromName:"/api/wxRentContractExtension/searchMerchant",//根据搜索词来获取商户id | |||
| getMerchantIdFromName:"/api/wxMerchant//IdAndNamelist",//根据搜索词来获取商户id | |||
| getMerchantShops:"/api/wxRentContract/merchantShops",//根据搜索词来获取商户id | |||
| } | |||
| @@ -0,0 +1,993 @@ | |||
| <template> | |||
| <div class="shop-select"> | |||
| <el-form ref="form" :model="formData" :rules="rules" label-width="130px"> | |||
| <div class="public_part_Box"> | |||
| <el-form-item label="选择计算方式" prop="type" class="fx_send"> | |||
| <el-select | |||
| v-model="formData.type" | |||
| @input="changeFormData('type', $event)" | |||
| placeholder="请先选择计算方式" | |||
| class="select-method" | |||
| > | |||
| <el-option | |||
| v-for="index in computedTypes" | |||
| :key="index.value" | |||
| :value="index.value" | |||
| :label="index.label" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="计租面积" prop="rentArea" class="fx_title numberInputBox"> | |||
| <span>共计</span> | |||
| <span>{{getTotleRentArea+'㎡'}}</span> | |||
| </el-form-item> | |||
| <el-form-item label="" prop="" class="fx_title numberInputBox" style="margin-bottom:0;"> | |||
| <div class="price-list" style="padding-left:0;"> | |||
| <div class="p-list" style="margin-left:0;" v-for="(item,index) in rentInfo" :key="index"> | |||
| <div class="price-items" style="margin-left:0;"> | |||
| <div class="price-title">{{item.shopNumber+"号商铺"}}</div> | |||
| <div class="price-input"> | |||
| <el-input | |||
| :value="item.rentArea" | |||
| @input="changeArea(index, 'rentArea', $event)" | |||
| placeholder="请输入" | |||
| maxlength="10" | |||
| clearable | |||
| ></el-input> | |||
| </div> | |||
| </div> | |||
| <div class="price-unit">㎡</div> | |||
| </div> | |||
| </div> | |||
| </el-form-item> | |||
| <el-form-item | |||
| label="租金录入" | |||
| prop | |||
| class="fx_title numberInputBox" | |||
| v-if="rentInfo.length>1&&formData.type!=2" | |||
| > | |||
| <el-radio-group | |||
| size="small" | |||
| :value="formData.rentInputWay" | |||
| @input="changeFormData('rentInputWay', $event)" | |||
| style="" | |||
| > | |||
| <el-radio-button label="1" value="1">合铺录入</el-radio-button> | |||
| <el-radio-button label="2" value="2">分铺录入</el-radio-button> | |||
| </el-radio-group> | |||
| </el-form-item> | |||
| <div v-if="formData.type==1||formData.type==3"> | |||
| <div v-if="formData.rentInputWay==2"> | |||
| <el-form-item label="租赁单价" prop="priceUnit" class="fx_title numberInputBox"> | |||
| <el-radio-group | |||
| style="margin-left:20px;" | |||
| :value="formData.priceUnit" | |||
| @input="changeFormData('priceUnit', $event)" | |||
| size="small" | |||
| > | |||
| <el-radio-button | |||
| v-for="(item,index) in priceUnitOption" | |||
| :key="index" | |||
| :label="item.value" | |||
| >{{item.name}}</el-radio-button> | |||
| </el-radio-group> | |||
| </el-form-item> | |||
| <el-form-item label prop="priceUnit" class="fx_title numberInputBox"> | |||
| <div class="p-list" v-for="(item,index) in rentInfo" :key="index"> | |||
| <div class="price-items"> | |||
| <div class="price-title">{{item.shopNumber+"号商铺"}}</div> | |||
| <div class="price-input"> | |||
| <el-input | |||
| :value="item.rentPrice" | |||
| @input="changeArea(index, 'rentPrice', $event)" | |||
| placeholder="请输入" | |||
| maxlength="10" | |||
| clearable | |||
| ></el-input> | |||
| </div> | |||
| </div> | |||
| <div class="price-unit"> 元/㎡ </div> | |||
| </div> | |||
| </el-form-item> | |||
| </div> | |||
| <!-- 合铺 --> | |||
| <div v-else> | |||
| <el-form-item | |||
| label="租赁单价" | |||
| v-if="formData.type==1||formData.type==3" | |||
| prop="priceUnit" | |||
| class="fx_title numberInputBox" | |||
| > | |||
| <el-input | |||
| style="width:160px" | |||
| :value="formData.rentPrice" | |||
| @input="changeAllArea('rentPrice', $event)" | |||
| placeholder="请输入" | |||
| maxlength="10" | |||
| clearable | |||
| ></el-input> 元/㎡ | |||
| <el-radio-group | |||
| :value="formData.priceUnit" | |||
| @input="changeFormData('priceUnit', $event)" | |||
| size="small" | |||
| > | |||
| <el-radio-button | |||
| v-for="(item,index) in priceUnitOption" | |||
| :key="index" | |||
| :label="item.value" | |||
| >{{item.name}}</el-radio-button> | |||
| </el-radio-group> | |||
| </el-form-item> | |||
| </div> | |||
| </div> | |||
| <div v-if="formData.rentInputWay==2"> | |||
| <el-form-item | |||
| label="租金" | |||
| prop="price" | |||
| v-if="formData.type==1||formData.type==3" | |||
| class="fx_send" | |||
| > | |||
| <span>共计</span> | |||
| <span>{{getTotlePrice+'元'}}</span> | |||
| </el-form-item> | |||
| <div class="price-list" v-if="formData.type==1||formData.type==3"> | |||
| <div class="p-list" v-for="(item,index) in rentInfo" :key="index"> | |||
| <div class="price-items"> | |||
| <div class="price-title">{{item.shopNumber+"号商铺"}}</div> | |||
| <div class="price-input"> | |||
| <el-input | |||
| :value="item.price" | |||
| @input="changePrice(index, 'price', $event)" | |||
| placeholder="请输入" | |||
| maxlength="10" | |||
| clearable | |||
| ></el-input> | |||
| </div> | |||
| </div> | |||
| <div class="price-unit">元/{{changeUnitType}}</div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| <div v-else> | |||
| <el-form-item | |||
| label="租金" | |||
| prop | |||
| v-if="formData.type==1||formData.type==3" | |||
| class="fx_send reprice" | |||
| > | |||
| <el-input | |||
| style="width:160px" | |||
| :value="formData.price" | |||
| @input="changeAllPrice('price', $event)" | |||
| placeholder="请输入" | |||
| maxlength="10" | |||
| clearable | |||
| ></el-input> | |||
| 元/{{changeUnitType}} | |||
| </el-form-item> | |||
| </div> | |||
| <el-form-item label="保底营业额" v-if="formData.type==2" prop="revenue" class="fx_title"> | |||
| <el-input | |||
| :value="formData.revenue" | |||
| @input="changeFormData('revenue', $event)" | |||
| placeholder="请输入保底营业额金额" | |||
| maxlength="10" | |||
| clearable | |||
| ></el-input> | |||
| <span class="per"> 元/{{changeUnitType}}</span> | |||
| </el-form-item> | |||
| <el-form-item | |||
| label="联营扣点率" | |||
| v-if="formData.type==2||formData.type==3" | |||
| prop="payRatio" | |||
| class="fx_title numberInputBox"> | |||
| <el-input | |||
| type="number" | |||
| v-if="formData.busDiscountRatio==''" | |||
| v-model="formData.payRatio" | |||
| @input="changeFormData('payRatio', $event)" | |||
| placeholder="请输入" | |||
| maxlength="10" | |||
| clearable | |||
| ></el-input> | |||
| <span v-show="formData.busDiscountRatio==''" class="per" style="margin-right:30px;"> %</span> | |||
| <el-button @click="jumpRateSet" size="small" class="jump-rate-set" type="primary">跳点设置</el-button> | |||
| <!-- ul --> | |||
| <show-rate-list v-show="formData.busDiscountRatio!=''"></show-rate-list> | |||
| </el-form-item> | |||
| <div v-if="formData.rentInputWay==2"> | |||
| <el-form-item label="押金" prop="deposit" class="fx_send"> | |||
| <span>共计</span> | |||
| <span> {{getTotleDeposit+'元'}}</span> | |||
| </el-form-item> | |||
| <div class="price-list"> | |||
| <div class="p-list" v-for="(item,index) in rentInfo" :key="index"> | |||
| <div class="price-items"> | |||
| <div class="price-title">{{item.shopNumber+"号商铺"}}</div> | |||
| <div class="price-input"> | |||
| <el-input | |||
| :value="item.deposit" | |||
| @input="changePrice(index, 'deposit', $event)" | |||
| placeholder="请输入" | |||
| maxlength="10" | |||
| clearable | |||
| ></el-input> | |||
| </div> | |||
| </div> | |||
| <!-- <div class="price-unit">元</div> --> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| <div v-else> | |||
| <el-form-item label="押金" prop class="fx_send reprice"> | |||
| <el-input | |||
| style="width:160px" | |||
| :value="formData.deposit" | |||
| @input="changeAllPrice('deposit', $event)" | |||
| placeholder="请输入" | |||
| maxlength="10" | |||
| clearable | |||
| ></el-input> 元 | |||
| </el-form-item> | |||
| </div> | |||
| <el-form-item label="年租金调整" prop class="fx_send" v-if="rentInfo[0]&&rentInfo[0].adjustRatio&&rentInfo[0].adjustRatio.length>0"> | |||
| <el-radio-group | |||
| :value="formData.adjustRatioWay" | |||
| @input="changeFormData('adjustRatioWay', $event)" | |||
| size="small" | |||
| style="" | |||
| > | |||
| <el-radio-button label="1" value="1">比例上调</el-radio-button> | |||
| <el-radio-button label="2" value="2">固定上调</el-radio-button> | |||
| <el-radio-button label="3" value="3">自定义</el-radio-button> | |||
| </el-radio-group> | |||
| <!-- <help title content="年租金调整为固定上调,请在输入框中输入需要上调的比例或金额"></help> --> | |||
| </el-form-item> | |||
| <div class="price-list" v-for="(items,indexs) in rentInfo" :key="indexs" v-if="(formData.type==1||formData.type==3)&&rentInfo[0].adjustRatio.length>0&&formData.rentInputWay==2"> | |||
| <div class="pss">{{items.shopNumber+"号商铺"}}</div> | |||
| <div class="pss-c"> | |||
| <div class="p-list" v-for="(item,index) in items.adjustRatio" :key="index"> | |||
| <div class="price-items"> | |||
| <div class="price-title">{{'第'+(index+2)+'年'}}</div> | |||
| <div class="price-input"> | |||
| <el-input | |||
| :value="item" | |||
| @input="changePer(indexs, index, $event)" | |||
| placeholder="请输入" | |||
| maxlength="10" | |||
| clearable | |||
| ></el-input> | |||
| </div> | |||
| </div> | |||
| <div class="price-unit" v-if="formData.adjustRatioWay==1">%</div> | |||
| <div class="price-unit" v-else>元/{{changeUnitType}}</div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| <div class="price-list" v-if="formData.type==2||formData.rentInputWay==1"> | |||
| <div class="pss-c"> | |||
| <div class="p-list" style="margin-left:0;" v-for="(item,index) in formData.adjustRatio" :key="index"> | |||
| <div class="price-items" style="margin-left:0;"> | |||
| <div class="price-title">{{'第'+(index+2)+'年'}}</div> | |||
| <div class="price-input"> | |||
| <el-input | |||
| :value="item" | |||
| @input="changePer02(index, $event)" | |||
| placeholder="请输入" | |||
| maxlength="10" | |||
| clearable | |||
| ></el-input> | |||
| </div> | |||
| </div> | |||
| <div class="price-unit" v-if="formData.adjustRatioWay==1">%</div> | |||
| <div class="price-unit" v-else>元/{{changeUnitType}}</div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| <el-form-item label="付款周期" prop="receivePeriod" class="paydata"> | |||
| <el-select | |||
| :value="formData.receivePeriod" | |||
| filterable | |||
| @input="changeFormData('receivePeriod', $event)" | |||
| class="select-method innerinput" | |||
| style="width:150px" | |||
| > | |||
| <el-option | |||
| v-for="index in cycles" | |||
| :key="index.value" | |||
| :value="index.value" | |||
| :label="index.label" | |||
| ></el-option> | |||
| </el-select> | |||
| <!-- <el-input-number v-if="formData.priceUnit==1" :value="formData.receivePeriod" @input="changeFormData('receivePeriod', $event)" controls-position="right" :min="1" :max="365"></el-input-number> --> | |||
| <span class="per">月</span> | |||
| </el-form-item> | |||
| <el-form-item | |||
| label="滞纳金费率" | |||
| prop='latePayRatio' | |||
| > | |||
| <el-input | |||
| style="width:160px" | |||
| :value="formData.latePayRatio" | |||
| @input="changeAllPrice('latePayRatio', $event)" | |||
| placeholder="请输入" | |||
| maxlength="10" | |||
| clearable | |||
| ></el-input> | |||
| % | |||
| <span style="margin-left:50px;"> | |||
| 欠缴后 <el-input | |||
| style="width:160px" | |||
| :value="formData.latePayDay" | |||
| @input="changeAllPrice('latePayDay', $event)" | |||
| placeholder="请输入" | |||
| maxlength="10" | |||
| clearable | |||
| ></el-input> | |||
| 日开始计费 | |||
| </span> | |||
| <help title content="例如:“0”为欠缴当天开始计滞纳金"></help> | |||
| </el-form-item> | |||
| </div> | |||
| </el-form> | |||
| <!-- --> | |||
| <jump-rate-set ref="jumpRateSetDialog"></jump-rate-set> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import help from "../../help.vue"; | |||
| import TableList from "../../../core/comps/table/tableList.vue"; | |||
| import commonUtil from "../../../core/tool/commonUtil.js"; | |||
| import { ContractData } from "../../../service/contract/data.js"; | |||
| import jumpRateSet from '../rent/jumpRateSet.vue'; | |||
| import showRateList from '../rent/showRateList.vue'; | |||
| // import {CouponUrl} from "./UrlEnum.js"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import moment from "moment"; | |||
| export default { | |||
| name: "shopListDg", | |||
| props: ["tKey", "cb", "formDataList"], | |||
| components: { | |||
| TableList, | |||
| help, | |||
| jumpRateSet, | |||
| showRateList, | |||
| }, | |||
| data() { | |||
| return { | |||
| ...mapActions(["setRentInfo", "setFormData"]), | |||
| //跳点数据对象 | |||
| rentInfos: [], | |||
| activeType: 1, | |||
| formDataLists: this.formDataList, | |||
| totlePrice: 0, | |||
| totleRentPrice: 0, | |||
| totleDeposit: 0, | |||
| priceUnitOption: ContractData.priceUnitOption, | |||
| //计租计算方式 | |||
| computedTypes: ContractData.computedTypes, | |||
| cycles: ContractData.cycles, | |||
| rules: { | |||
| rentArea: [ | |||
| { | |||
| required: true, | |||
| message: "抱歉,计租面积为必填项", | |||
| trigger: "blur" | |||
| }, | |||
| ], | |||
| revenue: [ | |||
| { | |||
| required: true, | |||
| pattern: /.+/, | |||
| message: "抱歉,不能识别您输入的营业额", | |||
| trigger: "blur" | |||
| }, | |||
| { | |||
| validator(rule, value, callback, source, options) { | |||
| var errors = []; | |||
| const reg = /(^[0-9]\d*(\.\d{1,2})?$)|(^1(\.\d{1,2})?$)/; | |||
| if (!reg.test(value)) { | |||
| callback("抱歉,营业额限制为数字"); | |||
| } else { | |||
| if (typeof value == "string") { | |||
| if (value.split(".")[0].length > 7) { | |||
| callback("最大金额为9999999.99"); | |||
| } | |||
| } | |||
| } | |||
| callback(errors); | |||
| } | |||
| } | |||
| ], | |||
| receivePeriod: [ | |||
| { | |||
| required: true, | |||
| trigger: "change", | |||
| message: "抱歉,不能识别您输入的付款周期" | |||
| } | |||
| ], | |||
| price: [ | |||
| { | |||
| required: true, | |||
| message: "抱歉,不能识别您选择的计算方式", | |||
| trigger: "change" | |||
| } | |||
| ], | |||
| deposit: [ | |||
| { | |||
| required: true, | |||
| message: "抱歉,不能识别您选择的计算方式", | |||
| trigger: "change" | |||
| } | |||
| ], | |||
| payRatio: [ | |||
| { | |||
| required: true, | |||
| message: "抱歉,不能识别您输入的联营扣点比例", | |||
| trigger: "change" | |||
| }, | |||
| { | |||
| validator(rule, value, callback, source, options) { | |||
| var errors = []; | |||
| if (value < 0 || value > 100) { | |||
| callback('抱歉,不能识别您输入的联营扣点比例'); | |||
| } | |||
| callback(errors); | |||
| } | |||
| } | |||
| ], | |||
| type: [ | |||
| { | |||
| required: true, | |||
| message: "抱歉,不能识别您选择的计算方式", | |||
| trigger: "change" | |||
| } | |||
| ] | |||
| } | |||
| }; | |||
| }, | |||
| computed: { | |||
| ...mapState({ | |||
| rentInfo: state => state.setRentInfo.rentInfo, | |||
| formData: state => state.setRentInfo.formData | |||
| }), | |||
| getFreceveperiodUnit() { | |||
| return this.formData.priceUnit == 1 ? "日" : "月"; | |||
| }, | |||
| changeUnitType() { | |||
| console.log(this.priceUnitOption) | |||
| console.log(this.formData) | |||
| return this.priceUnitOption.filter( | |||
| e => e.value == this.formData.priceUnit | |||
| )[0].name; | |||
| }, | |||
| getTotlePrice() { | |||
| this.totlePrice = 0; | |||
| this.rentInfo.map((item, index) => { | |||
| this.totlePrice += Number(item.price) * 100; | |||
| }); | |||
| return this.totlePrice ? (this.totlePrice / 100).toFixed(2) : "--"; | |||
| }, | |||
| getTotleDeposit() { | |||
| this.totleDeposit = 0; | |||
| this.rentInfo.map((item, index) => { | |||
| this.totleDeposit += Number(item.deposit); | |||
| }); | |||
| return this.totleDeposit ? this.totleDeposit.toFixed("2") : "--"; | |||
| }, | |||
| getTotleRentArea() { | |||
| this.rentArea = 0; | |||
| this.rentInfo.map((item, index) => { | |||
| this.rentArea += Number(item.rentArea); | |||
| }); | |||
| this.rentArea = this.rentArea ? this.rentArea.toFixed("2") : "--"; | |||
| return this.rentArea; | |||
| }, | |||
| //获取租金单价的集合 | |||
| total() { | |||
| let total = null; | |||
| this.rentInfo.map(item => { | |||
| if (item.rentPrice == undefined) { | |||
| total = null; | |||
| } else { | |||
| total += Number(item.rentPrice); | |||
| } | |||
| }); | |||
| return total; | |||
| }, | |||
| deposit() { | |||
| let total = null; | |||
| this.rentInfo.map(item => { | |||
| total += Number(item.deposit); | |||
| }); | |||
| return total; | |||
| }, | |||
| price() { | |||
| let total = null; | |||
| this.rentInfo.map(item => { | |||
| total += Number(item.price); | |||
| }); | |||
| return total; | |||
| } | |||
| }, | |||
| methods: { | |||
| // 打开jumpRateSet 跳点设置弹框组件 | |||
| jumpRateSet() { | |||
| this.$refs['jumpRateSetDialog'].openDialog(); | |||
| }, | |||
| /** | |||
| * 分铺修改租赁面积 | |||
| */ | |||
| changeArea(index, type, val) { | |||
| let arr = JSON.parse(JSON.stringify(this.rentInfo)); | |||
| arr[index][type] = val; | |||
| arr[index].price = ( | |||
| (Number(arr[index]["rentPrice"] * 100) * | |||
| Number(arr[index]["rentArea"] * 100)) / | |||
| 10000 | |||
| ).toFixed(2); | |||
| this.setRentInfo(arr); | |||
| }, | |||
| /** | |||
| * 合铺修改租赁面积 | |||
| */ | |||
| changeAllArea(type, val) { | |||
| let formData = JSON.parse(JSON.stringify(this.formData)); | |||
| formData[type] = val; | |||
| if (type == "rentPrice") { | |||
| let price = 0; | |||
| this.rentInfo.map((item, index) => { | |||
| price += Number(item.rentArea) * Number(val); | |||
| }); | |||
| formData.price = price.toFixed(2); | |||
| } | |||
| this.setFormData(formData); | |||
| }, | |||
| /** | |||
| * 表单校验 | |||
| */ | |||
| checkFormRule(editType) { | |||
| let errorMessage = ""; | |||
| let haveError = false; | |||
| let indexs01 = 0; | |||
| let indexs02 = 0; | |||
| const reg = /(^[1-9]\d*(\.\d{1,2})?$)|(^0(\.\d{1,2})?$)/; | |||
| const regInt = /^[0-9]+$/; | |||
| this.rentInfo.map((item, index) => { | |||
| if ( | |||
| !reg.test(item.rentArea) || | |||
| Number(item.rentArea) >= 10000000 || | |||
| Number(item.rentArea) < 0 | |||
| ) { | |||
| haveError = true; | |||
| errorMessage = | |||
| "抱歉,商铺号为" + | |||
| item.shopNumber + | |||
| "的商铺计租面积限制为大于等于0且小于10000000的数字且最多保留两位小数!"; | |||
| } | |||
| }); | |||
| if (haveError) { | |||
| this.$message.error(errorMessage); | |||
| return true; | |||
| } | |||
| if(!this.formData.deposit && this.formData.deposit !== 0 && (this.formData.rentInputWay == 1||this.formData.type ==2)){ | |||
| this.$message.error('抱歉,押金为必填项!') | |||
| return true; | |||
| } | |||
| //年租金调整限制 | |||
| if (this.formData.rentInputWay == 1 &&this.formData.adjustRatioWay == 1) { | |||
| this.formData.adjustRatio.map((item, index) => { | |||
| if (!reg.test(item) || Number(item) > 50 || Number(item) < 0) { | |||
| haveError = true; | |||
| errorMessage = "抱歉,租金调整比例限制为0%~50%且最多保留两位小数!"; | |||
| } | |||
| }); | |||
| } else if (this.formData.rentInputWay == 1 &&(this.formData.adjustRatioWay == 2||this.formData.adjustRatioWay == 3)) { | |||
| this.formData.adjustRatio.map((item, index) => { | |||
| if (!reg.test(item)||Number(item)>=10000000) { | |||
| haveError = true; | |||
| errorMessage = this.formData.adjustRatioWay == 2?"抱歉,租金调整金额限制为大于0小于10000000的数字且最多保留两位小数!":"抱歉,租金调整自定义金额限制为大于0小于10000000的数字且最多保留两位小数!"; | |||
| } | |||
| }); | |||
| } | |||
| if (haveError) { | |||
| this.$message.error(errorMessage); | |||
| return true; | |||
| } | |||
| //分铺租金验证 | |||
| if ( | |||
| (this.formData.type == "1" || this.formData.type == "3") && this.formData.rentInputWay == 2 | |||
| ) { | |||
| this.rentInfo.map((item, index) => { | |||
| if ( | |||
| !reg.test(item.price) || | |||
| Number(item.price) >= 10000000 || | |||
| (editType === 1 ? Number(item.price) < 0 : Number(item.price) <= 0) | |||
| ) { | |||
| haveError = true; | |||
| errorMessage = | |||
| "抱歉,商铺号为" + | |||
| item.shopNumber + | |||
| (editType === 1 | |||
| ? "的商铺租金金额不合法!" | |||
| : "的商铺租金金额限制为大于0且小于10000000的数字且最多保留两位小数!"); | |||
| } | |||
| }); | |||
| if (haveError) { | |||
| this.$message.error(errorMessage); | |||
| return true; | |||
| } | |||
| if (this.formData.rentInputWay == 2&&this.formData.type!=2) { | |||
| this.rentInfo.map((item, index) => { | |||
| if ( | |||
| !reg.test(item.rentPrice) || | |||
| Number(item.rentPrice) >= 10000000 || | |||
| Number(item.rentPrice) < 0 | |||
| ) { | |||
| haveError = true; | |||
| errorMessage = | |||
| "抱歉,商铺号为" + | |||
| item.shopNumber + | |||
| "的商铺租金单价限制为大于等于0且小于10000000的数字且最多保留两位小数!"; | |||
| } | |||
| }); | |||
| } | |||
| } else if (this.formData.rentInputWay == 1 && this.formData.type != 2) { | |||
| if ( | |||
| !reg.test(this.formData.rentPrice) || | |||
| Number(this.formData.rentPrice) >= 10000000 || | |||
| Number(this.formData.rentPrice) < 0 | |||
| ) { | |||
| haveError = true; | |||
| errorMessage = | |||
| "抱歉,商铺租金单价限制为大于等于0且小于10000000的数字且最多保留两位小数!"; | |||
| } | |||
| } | |||
| if (haveError) { | |||
| this.$message.error(errorMessage); | |||
| return true; | |||
| } | |||
| //合铺租金验证 | |||
| if((this.formData.type == "1" || this.formData.type == "3") && this.formData.rentInputWay == 1){ | |||
| if ( | |||
| !reg.test(this.formData.price) || | |||
| Number(this.formData.price) >= 10000000 || | |||
| Number(this.formData.price) <= 0 | |||
| ) { | |||
| haveError = true; | |||
| errorMessage = | |||
| "抱歉,商铺租金限制为大于0且小于10000000的数字且最多保留两位小数!"; | |||
| } | |||
| } | |||
| if (this.formData.type == 2 && | |||
| (!reg.test(this.formData.revenue) || | |||
| Number(this.formData.revenue) >= 10000000 || | |||
| Number(this.formData.revenue) < 0) | |||
| ) { | |||
| this.$message.error( | |||
| "抱歉,保底营业额大于等于0且小于10000000的数字且最多保留两位小数!" | |||
| ); | |||
| return true; | |||
| } | |||
| if (this.formData.type == "2" || this.formData.type == "3") { | |||
| if (this.formData.busDiscountRatio == '') { | |||
| if ( | |||
| !reg.test(this.formData.payRatio) || | |||
| Number(this.formData.payRatio) > 100 | |||
| ) { | |||
| this.$message.error( | |||
| "抱歉,联营扣点数值限制为大于0%~100%且最多保留两位小数!" | |||
| ); | |||
| return true; | |||
| } | |||
| } else { | |||
| this.formData.payRatio = 0; | |||
| } | |||
| } | |||
| console.log(this.formData.deposit) | |||
| console.log(this.rentInfo); | |||
| this.rentInfo.map((item, index) => { | |||
| console.log(item.deposit) | |||
| if ( | |||
| !reg.test(item.deposit) || | |||
| Number(item.deposit) >= 10000000 || | |||
| Number(item.deposit) < 0 | |||
| ) { | |||
| haveError = true; | |||
| errorMessage = | |||
| "抱歉,商铺号为" + | |||
| item.shopNumber + | |||
| "押金金额限制为大于等于0且小于10000000的数字且最多保留两位小数!"; | |||
| } | |||
| }); | |||
| if (haveError) { | |||
| this.$message.error(errorMessage); | |||
| return true; | |||
| } | |||
| if ( | |||
| this.formData.adjustRatioWay == 1 && | |||
| this.formData.rentInputWay == 2 | |||
| ) { | |||
| this.rentInfo.map((item, index) => { | |||
| console.log(item) | |||
| item.adjustRatio.map((item01, index01) => { | |||
| if (!reg.test(item01) || Number(item01) > 50) { | |||
| haveError = true; | |||
| errorMessage = | |||
| "抱歉,商铺号为" + | |||
| item.shopNumber + | |||
| "的第" + | |||
| (index01 + 2) + | |||
| "年" + | |||
| "租金调整比例限制为0%~50%且最多保留两位小数!"; | |||
| } | |||
| }); | |||
| }); | |||
| } else if ( | |||
| (this.formData.adjustRatioWay == 2||this.formData.adjustRatioWay == 3) && | |||
| this.formData.rentInputWay == 2 | |||
| ) { | |||
| this.rentInfo.map((item, index) => { | |||
| item.adjustRatio.map((item01, index01) => { | |||
| if (!reg.test(item01)||Number(item01)>=10000000) { | |||
| haveError = true; | |||
| errorMessage = | |||
| "抱歉,商铺号为" + | |||
| item.shopNumber + | |||
| "的第" + | |||
| (index01 + 2) + | |||
| "年" + | |||
| (this.formData.adjustRatioWay == 2?"租金":"自定义租金")+"调整限制大于0小于10000000的数字且最多保留两位小数!"; | |||
| } | |||
| }); | |||
| }); | |||
| } | |||
| if (haveError) { | |||
| this.$message.error(errorMessage); | |||
| return true; | |||
| } | |||
| if (!this.formData.receivePeriod) { | |||
| this.$message.error("抱歉,付款周期为必填项!"); | |||
| return true; | |||
| } | |||
| if ((!reg.test(this.formData.latePayRatio)||Number(this.formData.latePayRatio)>100)&&this.formData.latePayRatio!='') { | |||
| this.$message.error("抱歉,滞纳金费率限制为大于等于0%小于100%且最多保留两位小数!"); | |||
| return true; | |||
| } | |||
| if ((!regInt.test(this.formData.latePayDay)||Number(this.formData.latePayDay)>1000)&&this.formData.latePayDay!='') { | |||
| this.$message.error("抱歉,滞纳金费率计算开始时间限制为限制为0~1000的整数!"); | |||
| return true; | |||
| } | |||
| this.postRentinfo(); | |||
| }, | |||
| changeFormData(type, val) { | |||
| let formData = JSON.parse(JSON.stringify(this.formData)); | |||
| formData[type] = val; | |||
| if (type == "type" && val == 2) { | |||
| formData.priceUnit = 2; | |||
| } | |||
| this.setFormData(formData); | |||
| }, | |||
| changePrice(index, type, val) { | |||
| let arr = JSON.parse(JSON.stringify(this.rentInfo)); | |||
| arr[index][type] = val; | |||
| this.setRentInfo(arr); | |||
| }, | |||
| //合铺租金 | |||
| // changeAllPrice(type, val) { | |||
| // let formData = JSON.parse(JSON.stringify(this.formData)); | |||
| // formData[type] = val; | |||
| // if (type == "type" && val == 2) { | |||
| // formData.priceUnit = 2; | |||
| // } | |||
| // this.setFormData(formData); | |||
| // }, | |||
| //合铺租金 | |||
| changeAllPrice(type, val) { | |||
| let formData = JSON.parse(JSON.stringify(this.formData)); | |||
| formData[type] = val; | |||
| if (type == "type" && val == 2) { | |||
| formData.priceUnit = 2; | |||
| } | |||
| this.setFormData(formData); | |||
| if (type == 'deposit') { | |||
| let curRentInfo = Object.assign([],this.rentInfo); | |||
| curRentInfo.forEach(item => { | |||
| item.deposit = formData.deposit; | |||
| }) | |||
| this.setRentInfo(curRentInfo); | |||
| } | |||
| }, | |||
| changePer02(index02, val) { | |||
| let formData = JSON.parse(JSON.stringify(this.formData)); | |||
| formData.adjustRatio[index02] = val; | |||
| this.setFormData(formData); | |||
| }, | |||
| changePer(index01, index02, val) { | |||
| const reg = /(^[1-9]\d*(\.\d{1,2})?$)|(^0(\.\d{1,2})?$)/; | |||
| if (this.formData.adjustRatioWay == 1) { | |||
| if (Number(val) > 100 || Number(val) < 0) { | |||
| return; | |||
| } else { | |||
| let arr = JSON.parse(JSON.stringify(this.rentInfo)); | |||
| arr[index01]["adjustRatio"][index02] = val; | |||
| this.setRentInfo(arr); | |||
| } | |||
| } else { | |||
| if (Number(val) < 0) { | |||
| return; | |||
| } else { | |||
| let arr = JSON.parse(JSON.stringify(this.rentInfo)); | |||
| arr[index01]["adjustRatio"][index02] = val; | |||
| this.setRentInfo(arr); | |||
| } | |||
| } | |||
| }, | |||
| //按计租和联营扣点显示不同内容 | |||
| computedChange(item) { | |||
| this.formData.type = item; | |||
| }, | |||
| //合铺将年租金调整比例加入rentinfo | |||
| postRentinfo() { | |||
| if (this.formData.rentInputWay == 1) { | |||
| let formData = JSON.parse(JSON.stringify(this.formData)); | |||
| let arr = JSON.parse(JSON.stringify(this.rentInfo)); | |||
| arr.map((item, index) => { | |||
| item.adjustRatio = formData.adjustRatio; | |||
| }); | |||
| this.setRentInfo(arr); | |||
| } | |||
| } | |||
| }, | |||
| created() { | |||
| console.log(this.formData); | |||
| console.log(this.rentInfo); | |||
| console.log(this.formDataList,"formDataList"); | |||
| if (!this.formData.rentInputWay) { | |||
| this.formData.rentInputWay = 1; | |||
| } | |||
| if (!this.formData.adjustRatioWay) { | |||
| this.formData.adjustRatioWay = 1; | |||
| } | |||
| } | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| ul { | |||
| list-style-type: none; | |||
| } | |||
| .price-list { | |||
| width: 100%; | |||
| height: auto; | |||
| overflow: hidden; | |||
| padding-left: 130px; | |||
| margin-bottom: 22px; | |||
| } | |||
| .pss { | |||
| width: 100px; | |||
| height: auto; | |||
| float: left; | |||
| line-height: 60px; | |||
| } | |||
| .pss-c { | |||
| width: calc(100%-160px); | |||
| height: auto; | |||
| float: left; | |||
| } | |||
| .p-list { | |||
| width: auto; | |||
| float: left; | |||
| overflow: hidden; | |||
| margin: 0 10px; | |||
| } | |||
| .price-items { | |||
| float: left; | |||
| height: 40px; | |||
| overflow: hidden; | |||
| border: 1px solid #dcdfe6; | |||
| border-radius: 4px; | |||
| margin: 10px; | |||
| } | |||
| .price-title { | |||
| width: auto; | |||
| padding: 0 10px; | |||
| line-height: 40px; | |||
| float: left; | |||
| background: #f5f7fa; | |||
| color: #909399; | |||
| border-right: 1px solid #dcdfe6; | |||
| } | |||
| .price-unit { | |||
| width: auto; | |||
| /* padding: 0 10px; */ | |||
| line-height: 60px; | |||
| float: left; | |||
| color: #909399; | |||
| } | |||
| .price-input { | |||
| float: left; | |||
| width: 130px; | |||
| } | |||
| .fx_title .el-input { | |||
| width: 211px; | |||
| } | |||
| .el-dialog { | |||
| width: 565px !important; | |||
| } | |||
| .fx_dialog_list_chooseSH .el-dialog .el-dialog__footer .dialog-footer .draftBtn, | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .putinBtn { | |||
| width: 76px; | |||
| height: 35px; | |||
| font-size: 14px; | |||
| padding: 10px 20px; | |||
| } | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .draftBtn { | |||
| margin-right: 7.5px; | |||
| background: RGBA(255, 255, 255, 1); | |||
| color: #555555; | |||
| border: 1px solid #e1e6ea; | |||
| } | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .putinBtn { | |||
| margin-left: 7.5px; | |||
| background: rgba(90, 118, 191, 1); | |||
| color: #ffffff; | |||
| } | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .draftBtn:hover { | |||
| background: RGBA(255, 255, 255, 0.88); | |||
| } | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .putinBtn:hover { | |||
| background: rgba(90, 118, 191, 0.88); | |||
| } | |||
| .shop-select /deep/ .el-form-item { | |||
| margin-bottom: 18px; | |||
| } | |||
| </style> | |||
| <style> | |||
| .reprice > .el-form-item__label:before { | |||
| content: "*"; | |||
| color: #f56c6c; | |||
| margin-right: 4px; | |||
| } | |||
| .price-input .el-input__inner { | |||
| height: 40px; | |||
| border: 0; | |||
| } | |||
| .div { | |||
| overflow: hidden; | |||
| } | |||
| .shop-select .el-dialog__title { | |||
| padding-left: 10px; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,217 @@ | |||
| <template> | |||
| <div> | |||
| <el-dialog | |||
| title="选择商户" | |||
| :visible="dialogVisible" | |||
| width="800px" | |||
| :before-close="handleClose" | |||
| :modal-append-to-body="false" | |||
| class="fx_dialog_list_chooseSH" | |||
| > | |||
| <div style="width:100%"> | |||
| <!-- aaa 添加搜索功能 --> | |||
| <el-form | |||
| :inline="true" | |||
| :model="curRuleForm" | |||
| ref="curRuleForm" | |||
| class="demo-form-inline" | |||
| label-position="right" | |||
| > | |||
| <el-form-item label="商户名" prop="merchantName" class="fx_title" style="float:left;"> | |||
| <el-input v-model.trim="curRuleForm.merchantName" placeholder="请输入商户名" clearable></el-input> | |||
| </el-form-item> | |||
| <el-form-item style="float:left;"> | |||
| <el-button | |||
| class="hoverBtn" | |||
| type="primary" | |||
| icon="el-icon-search" | |||
| :style="'border:0;background:'+navigationInfo.moduleColor" | |||
| size="medium" | |||
| @click="search" | |||
| ></el-button> | |||
| </el-form-item> | |||
| </el-form> | |||
| <table-list :ref="tKeynew" :options="optionsTable"></table-list> | |||
| </div> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button class="draftBtn" @click="dialogVisible = false">取 消</el-button> | |||
| <el-button class="putinBtn" @click="getSelectedShop()">确 定</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import TableList from "../../../core/comps/table/tableList.vue"; | |||
| import commonUtil from "../../../core/tool/commonUtil.js"; | |||
| import { CouponCacheData } from "../../../service/couponData/data.js"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| export default { | |||
| name: "shopListDgnew", | |||
| props: ["tKeynew", "cbnew", "shopsType"], | |||
| components: { | |||
| TableList | |||
| }, | |||
| data() { | |||
| return { | |||
| dialogVisible: false, | |||
| curRuleForm: { | |||
| building: "", | |||
| floor: "", | |||
| merchantName: "", | |||
| }, | |||
| floorArr: [], | |||
| buildingArr: [], | |||
| optionsTable: { | |||
| singleSelected: true, | |||
| showCk: true, | |||
| map: [ | |||
| { | |||
| key: "name", | |||
| val: "商户名" | |||
| }, | |||
| { | |||
| key: "linkPerson", | |||
| val: "联系人" | |||
| }, | |||
| { | |||
| key: "linkPhone", | |||
| val: "联系方式" | |||
| }, | |||
| { | |||
| key: "shoplist", | |||
| val: "商铺号", | |||
| convert: this.changeShop | |||
| } | |||
| ], | |||
| getUrl: () => { | |||
| return "/api/wxMerchant/listVo?rentShopType=1&type=1&status=1" | |||
| + "&name=" + this.curRuleForm.merchantName | |||
| }, | |||
| pageOption: { | |||
| sizeKey: "pageSize", | |||
| indexKey: "pageNum", | |||
| index: 1, | |||
| size: 10 | |||
| }, | |||
| analysis: data => { | |||
| return { | |||
| data: data.data.list, | |||
| count: data.data.total | |||
| }; | |||
| } | |||
| } | |||
| }; | |||
| }, | |||
| //新增computed属性 | |||
| computed: { | |||
| ...mapState({ | |||
| navigationInfo: state => state.topNav.navigationInfo | |||
| }), | |||
| }, | |||
| methods: { | |||
| search: function() { | |||
| let tKey = this.$refs[this.tKeynew]; | |||
| tKey.search(tKey.getParams().index); | |||
| }, | |||
| openDialog() { | |||
| this.dialogVisible = true; | |||
| }, | |||
| changeShop(col, item) { | |||
| let str = ""; | |||
| item.shoplist.map((item, index) => { | |||
| str = str != "" ? str + "," + item.shopNumber : item.shopNumber; | |||
| }); | |||
| return str; | |||
| }, | |||
| handleClose() { | |||
| this.dialogVisible = false; | |||
| }, | |||
| getSelectedShop() { | |||
| let items = this.$refs[this.tKeynew].getCheckedItems("id"); | |||
| if (items.data.length < 1) { | |||
| this.$message({ | |||
| type: "error", | |||
| message: "抱歉,不能识别您选择的商铺" | |||
| }); | |||
| return; | |||
| } else { | |||
| this.cbnew(items); | |||
| } | |||
| this.dialogVisible = false; | |||
| } | |||
| }, | |||
| mounted: function() { | |||
| }, | |||
| created() {} | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| .el-dialog { | |||
| width: 565px !important; | |||
| } | |||
| .el-dialog { | |||
| width: 565px !important; | |||
| } | |||
| .fx_dialog_list_chooseSH .el-dialog .el-dialog__footer .dialog-footer .draftBtn, | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .putinBtn { | |||
| width: 76px; | |||
| height: 35px; | |||
| font-size: 14px; | |||
| padding: 10px 20px; | |||
| } | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .draftBtn { | |||
| margin-right: 7.5px; | |||
| background: RGBA(255, 255, 255, 1); | |||
| color: #555555; | |||
| border: 1px solid #e1e6ea; | |||
| } | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .putinBtn { | |||
| margin-left: 7.5px; | |||
| background: rgba(90, 118, 191, 1); | |||
| color: #ffffff; | |||
| } | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .draftBtn:hover { | |||
| background: RGBA(255, 255, 255, 0.88); | |||
| } | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .putinBtn:hover { | |||
| background: rgba(90, 118, 191, 0.88); | |||
| } | |||
| </style> | |||
| <style> | |||
| /* .el-dialog { | |||
| width: 800px !important; | |||
| } */ | |||
| .div { | |||
| over-flow: hidden; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,262 @@ | |||
| <template> | |||
| <div v-if="dialogVisible" class="shop-select"> | |||
| <el-dialog | |||
| :title="shopsType==1?'选择商铺':'选择多经点位商铺'" | |||
| :visible="dialogVisible" | |||
| width="800px" | |||
| :before-close="handleClose" | |||
| :modal-append-to-body="false" | |||
| class="fx_dialog_list_chooseSH" | |||
| > | |||
| <div style="width:100%"> | |||
| <!-- aaa 添加搜索功能 --> | |||
| <el-form | |||
| :inline="true" | |||
| :model="curRuleForm" | |||
| ref="curRuleForm" | |||
| class="demo-form-inline" | |||
| label-position="right" | |||
| > | |||
| <el-form-item label="楼座" prop="building" class="fx_send pl_10"> | |||
| <el-select | |||
| style="width:130px;" | |||
| v-model="curRuleForm.building" | |||
| placeholder="请选择" | |||
| @change="changeBuilding" | |||
| clearable | |||
| > | |||
| <el-option | |||
| v-for="(item,index) in buildingArr" | |||
| :key="index" | |||
| :value="item.id" | |||
| :label="item.name" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="楼层" prop="floor" class="fx_send"> | |||
| <el-select v-model="curRuleForm.floor" placeholder="请选择" clearable style="width:130px;"> | |||
| <el-option | |||
| v-for="(item,index) in floorArr" | |||
| :key="index" | |||
| :value="item.id" | |||
| :label="item.floorName" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="" prop="shopNumber" class="fx_title"> | |||
| <el-input v-model.trim="curRuleForm.shopNumber" placeholder="请输入商铺号" clearable></el-input> | |||
| </el-form-item> | |||
| <el-form-item> | |||
| <el-button | |||
| class="hoverBtn" | |||
| type="primary" | |||
| icon="el-icon-search" | |||
| :style="'border:0;background:'+navigationInfo.moduleColor" | |||
| size="medium" | |||
| @click="search" | |||
| ></el-button> | |||
| </el-form-item> | |||
| </el-form> | |||
| <table-list :ref="tKey" :options="optionsTable"></table-list> | |||
| </div> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button class="draftBtn" @click="dialogVisible = false">取 消</el-button> | |||
| <el-button class="putinBtn" @click="getSelectedShop()">确 定</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import TableList from "../../../core/comps/table/tableList.vue"; | |||
| import commonUtil from "../../../core/tool/commonUtil.js"; | |||
| import { CouponCacheData } from "../../../service/couponData/data.js"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| // import {CouponUrl} from "./UrlEnum.js"; | |||
| export default { | |||
| name: "shopListDg", | |||
| props: ["tKey", "cb", "shopsType"], | |||
| components: { | |||
| TableList | |||
| }, | |||
| data() { | |||
| return { | |||
| dialogVisible: false, | |||
| curRuleForm: { | |||
| building: "", | |||
| floor: "", | |||
| shopNumber: "", | |||
| }, | |||
| floorArr: [], | |||
| buildingArr: [], | |||
| optionsTable: { | |||
| singleSelected: false, | |||
| showCk: true, | |||
| map: [ | |||
| { | |||
| key: "shopNumber", | |||
| val: "商铺号" | |||
| }, | |||
| { | |||
| key: "floor", | |||
| val: "楼层号" | |||
| }, | |||
| { | |||
| key: "building", | |||
| val: "楼座号" | |||
| }, | |||
| { | |||
| key: "status", | |||
| val: "商铺状态", | |||
| convert: this.cStatus | |||
| } | |||
| ], | |||
| getUrl: () => { | |||
| return "/api/wxShop/list" + "?status=0" | |||
| + "&type=" + this.shopsType | |||
| + "&building=" + this.curRuleForm.building | |||
| + "&floor=" + this.curRuleForm.floor | |||
| + "&shopNumber=" + this.curRuleForm.shopNumber | |||
| }, | |||
| pageOption: { | |||
| sizeKey: "pageSize", | |||
| indexKey: "pageNum", | |||
| index: 1, | |||
| size: 10 | |||
| }, | |||
| analysis: data => { | |||
| return { | |||
| data: data.data.list, | |||
| count: data.data.total | |||
| }; | |||
| } | |||
| } | |||
| }; | |||
| }, | |||
| //新增computed属性 | |||
| computed: { | |||
| ...mapState({ | |||
| navigationInfo: state => state.topNav.navigationInfo | |||
| }), | |||
| }, | |||
| methods: { | |||
| search: function() { | |||
| let tKey = this.$refs[this.tKey]; | |||
| tKey.search(tKey.getParams().index); | |||
| }, | |||
| //获取楼座信息 | |||
| getBuilding: function() { | |||
| this.getFetch("/api/wxMallBuilding/getbuildingfloorlist").then(d => { | |||
| this.buildingArr = d.data; | |||
| }); | |||
| }, | |||
| //选择楼座 | |||
| changeBuilding: function(item) { | |||
| for (let building of this.buildingArr) { | |||
| if (item == building.id) { | |||
| this.floorArr = building.floors; | |||
| } | |||
| } | |||
| this.curRuleForm.floor = ""; | |||
| //this.search() | |||
| }, | |||
| openDialog() { | |||
| this.dialogVisible = true; | |||
| }, | |||
| cStatus(col, item) { | |||
| return "未出租"; | |||
| }, | |||
| handleClose() { | |||
| this.dialogVisible = false; | |||
| }, | |||
| getSelectedShop() { | |||
| let items = this.$refs[this.tKey].getCheckedItems("id"); | |||
| if (items.data.length < 1) { | |||
| this.$message({ | |||
| type: "error", | |||
| message: "抱歉,不能识别您选择的商铺" | |||
| }); | |||
| return; | |||
| } else { | |||
| this.cb(items); | |||
| } | |||
| this.dialogVisible = false; | |||
| } | |||
| }, | |||
| mounted: function() { | |||
| //获取楼座信息 | |||
| this.getBuilding(); | |||
| }, | |||
| created() {} | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| .el-dialog { | |||
| width: 565px !important; | |||
| } | |||
| .fx_dialog_list_chooseSH .el-dialog .el-dialog__footer .dialog-footer .draftBtn, | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .putinBtn { | |||
| width: 76px; | |||
| height: 35px; | |||
| font-size: 14px; | |||
| padding: 10px 20px; | |||
| } | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .draftBtn { | |||
| margin-right: 7.5px; | |||
| background: RGBA(255, 255, 255, 1); | |||
| color: #555555; | |||
| border: 1px solid #e1e6ea; | |||
| } | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .putinBtn { | |||
| margin-left: 7.5px; | |||
| background: rgba(90, 118, 191, 1); | |||
| color: #ffffff; | |||
| } | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .draftBtn:hover { | |||
| background: RGBA(255, 255, 255, 0.88); | |||
| } | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .putinBtn:hover { | |||
| background: rgba(90, 118, 191, 0.88); | |||
| } | |||
| .shop-select /deep/ .el-dialog__header { | |||
| text-align: center; | |||
| } | |||
| </style> | |||
| <style> | |||
| /* .el-dialog { | |||
| width: 800px !important; | |||
| } */ | |||
| .div { | |||
| over-flow: hidden; | |||
| } | |||
| .shop-select .el-dialog__title { | |||
| padding-left: 10px; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,266 @@ | |||
| <template> | |||
| <div> | |||
| <el-dialog | |||
| :title="shopsType==1?'选择商铺':'选择多经点位商铺'" | |||
| :visible="dialogVisible" | |||
| width="800px" | |||
| :before-close="handleClose" | |||
| :modal-append-to-body="false" | |||
| class="fx_dialog_list_chooseSH" | |||
| > | |||
| <div style="width:100%"> | |||
| <!-- aaa 添加搜索功能 --> | |||
| <el-form | |||
| :inline="true" | |||
| :model="curRuleForm" | |||
| ref="curRuleForm" | |||
| class="demo-form-inline clearfix" | |||
| label-position="right" | |||
| > | |||
| <el-form-item label="楼座" prop="building" class="fx_send pl_10 floatL"> | |||
| <el-select | |||
| style="width:130px;" | |||
| v-model="curRuleForm.building" | |||
| placeholder="请选择" | |||
| @change="changeBuilding" | |||
| clearable | |||
| > | |||
| <el-option | |||
| v-for="(item,index) in buildingArr" | |||
| :key="index" | |||
| :value="item.id" | |||
| :label="item.name" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="楼层" prop="floor" class="fx_send floatL"> | |||
| <el-select v-model="curRuleForm.floor" placeholder="请选择" clearable style="width:130px;"> | |||
| <el-option | |||
| v-for="(item,index) in floorArr" | |||
| :key="index" | |||
| :value="item.id" | |||
| :label="item.floorName" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="" prop="shopNumber" class="fx_title floatL"> | |||
| <el-input v-model.trim="curRuleForm.shopNumber" placeholder="请输入商铺号" clearable></el-input> | |||
| </el-form-item> | |||
| <el-form-item class="floatL"> | |||
| <el-button | |||
| class="hoverBtn" | |||
| type="primary" | |||
| icon="el-icon-search" | |||
| :style="'border:0;background:'+navigationInfo.moduleColor" | |||
| size="medium" | |||
| @click="search" | |||
| ></el-button> | |||
| </el-form-item> | |||
| </el-form> | |||
| <table-list :ref="tKey" :options="optionsTable"></table-list> | |||
| </div> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button class="draftBtn" @click="dialogVisible = false">取 消</el-button> | |||
| <el-button class="putinBtn" @click="getSelectedShop()">确 定</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import TableList from "../../../core/comps/table/tableList.vue"; | |||
| import commonUtil from "../../../core/tool/commonUtil.js"; | |||
| import { CouponCacheData } from "../../../service/couponData/data.js"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| // import {CouponUrl} from "./UrlEnum.js"; | |||
| export default { | |||
| name: "shopListDg", | |||
| props: ["tKey", "cb", "shopsType"], | |||
| components: { | |||
| TableList | |||
| }, | |||
| data() { | |||
| return { | |||
| dialogVisible: false, | |||
| curRuleForm: { | |||
| building: "", | |||
| floor: "", | |||
| shopNumber: "", | |||
| }, | |||
| floorArr: [], | |||
| buildingArr: [], | |||
| optionsTable: { | |||
| singleSelected: true, | |||
| showCk: true, | |||
| map: [ | |||
| // {key:"id",val:"商户id"}, | |||
| { | |||
| key: "shopNumber", | |||
| val: "商铺号" | |||
| }, | |||
| { | |||
| key: "floor", | |||
| val: "楼层号" | |||
| }, | |||
| { | |||
| key: "building", | |||
| val: "楼座号" | |||
| }, | |||
| { | |||
| key: "status", | |||
| val: "商铺状态", | |||
| convert: this.cStatus | |||
| } | |||
| ], | |||
| getUrl: () => { | |||
| if(this.shopsType== 'all'){ | |||
| return "/api/wxShop/list" + "?status=" + "&type=" | |||
| + "&building=" + this.curRuleForm.building | |||
| + "&floor=" + this.curRuleForm.floor | |||
| + "&shopNumber=" + this.curRuleForm.shopNumber | |||
| }else{ | |||
| return "/api/wxShop/list" + "?status=0" + "&type="+this.shopsType | |||
| + "&building=" + this.curRuleForm.building | |||
| + "&floor=" + this.curRuleForm.floor | |||
| + "&shopNumber=" + this.curRuleForm.shopNumber | |||
| } | |||
| }, | |||
| pageOption: { | |||
| sizeKey: "pageSize", | |||
| indexKey: "pageNum", | |||
| index: 1, | |||
| size: 10 | |||
| }, | |||
| analysis: data => { | |||
| return { | |||
| data: data.data.list, | |||
| count: data.data.total | |||
| }; | |||
| } | |||
| } | |||
| }; | |||
| }, | |||
| //新增computed属性 | |||
| computed: { | |||
| ...mapState({ | |||
| navigationInfo: state => state.topNav.navigationInfo | |||
| }), | |||
| }, | |||
| methods: { | |||
| search: function() { | |||
| let tKey = this.$refs[this.tKey]; | |||
| tKey.search(tKey.getParams().index); | |||
| }, | |||
| //获取楼座信息 | |||
| getBuilding: function() { | |||
| this.getFetch("/api/wxMallBuilding/getbuildingfloorlist").then(d => { | |||
| this.buildingArr = d.data; | |||
| }); | |||
| }, | |||
| //选择楼座 | |||
| changeBuilding: function(item) { | |||
| for (let building of this.buildingArr) { | |||
| if (item == building.id) { | |||
| this.floorArr = building.floors; | |||
| } | |||
| } | |||
| this.curRuleForm.floor = ""; | |||
| //this.search() | |||
| }, | |||
| openDialog() { | |||
| this.dialogVisible = true; | |||
| }, | |||
| cStatus(col, item) { | |||
| if(item.status == 0){ | |||
| return "未出租"; | |||
| }else{ | |||
| return "已出租"; | |||
| } | |||
| }, | |||
| handleClose() { | |||
| this.dialogVisible = false; | |||
| }, | |||
| getSelectedShop() { | |||
| let items = this.$refs[this.tKey].getCheckedItems("id"); | |||
| if (items.data.length < 1) { | |||
| this.$message({ | |||
| type: "error", | |||
| message: "抱歉,不能识别您选择的商铺" | |||
| }); | |||
| return; | |||
| } else { | |||
| this.cb(items); | |||
| } | |||
| this.dialogVisible = false; | |||
| } | |||
| }, | |||
| mounted: function() { | |||
| //获取楼座信息 | |||
| this.getBuilding(); | |||
| }, | |||
| created() {} | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| .el-dialog { | |||
| width: 565px !important; | |||
| } | |||
| .fx_dialog_list_chooseSH .el-dialog .el-dialog__footer .dialog-footer .draftBtn, | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .putinBtn { | |||
| width: 76px; | |||
| height: 35px; | |||
| font-size: 14px; | |||
| padding: 10px 20px; | |||
| } | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .draftBtn { | |||
| margin-right: 7.5px; | |||
| background: RGBA(255, 255, 255, 1); | |||
| color: #555555; | |||
| border: 1px solid #e1e6ea; | |||
| } | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .putinBtn { | |||
| margin-left: 7.5px; | |||
| background: rgba(90, 118, 191, 1); | |||
| color: #ffffff; | |||
| } | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .draftBtn:hover { | |||
| background: RGBA(255, 255, 255, 0.88); | |||
| } | |||
| .fx_dialog_list_chooseSH | |||
| .el-dialog | |||
| .el-dialog__footer | |||
| .dialog-footer | |||
| .putinBtn:hover { | |||
| background: rgba(90, 118, 191, 0.88); | |||
| } | |||
| </style> | |||
| <style> | |||
| /* .el-dialog { | |||
| width: 800px !important; | |||
| } */ | |||
| .div { | |||
| over-flow: hidden; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,254 @@ | |||
| <template> | |||
| <div> | |||
| <!-- :title="shopsType==1?'选择商铺':'选择点位商铺'" --> | |||
| <el-dialog | |||
| title="选择商户" | |||
| :visible="dialogVisible" | |||
| width="800px" | |||
| :before-close="handleClose" | |||
| :modal-append-to-body="false" | |||
| class="fx_dialog_list_chooseSH"> | |||
| <div style="width:100%"> | |||
| <el-form | |||
| :inline="true" | |||
| :model="curRuleForm" | |||
| ref="curRuleForm" | |||
| class="demo-form-inline" | |||
| label-position="right" | |||
| > | |||
| <!-- <el-form-item label="楼座" prop="building" class="fx_send pl_10 floatL"> | |||
| <el-select | |||
| style="width:130px;" | |||
| v-model="curRuleForm.building" | |||
| placeholder="请选择" | |||
| @change="changeBuilding" | |||
| clearable | |||
| > | |||
| <el-option | |||
| v-for="(item,index) in buildingArr" | |||
| :key="index" | |||
| :value="item.id" | |||
| :label="item.name" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="楼层" prop="floor" class="fx_send floatL"> | |||
| <el-select v-model="curRuleForm.floor" placeholder="请选择" clearable style="width:130px;"> | |||
| <el-option | |||
| v-for="(item,index) in floorArr" | |||
| :key="index" | |||
| :value="item.id" | |||
| :label="item.floorName" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="" prop="shopNumber" class="fx_title floatL"> | |||
| <el-input v-model.trim="curRuleForm.shopNumber" placeholder="请输入点位号" clearable></el-input> | |||
| </el-form-item> --> | |||
| <el-form-item label="商户名" prop="merchantName" class="fx_title floatL"> | |||
| <el-input v-model.trim="curRuleForm.merchantName" placeholder="请输入商户名" clearable></el-input> | |||
| </el-form-item> | |||
| <el-form-item class="floatL"> | |||
| <el-button | |||
| class="hoverBtn" | |||
| type="primary" | |||
| icon="el-icon-search" | |||
| :style="'border:0;background:'+navigationInfo.moduleColor" | |||
| size="medium" | |||
| @click="search" | |||
| ></el-button> | |||
| </el-form-item> | |||
| </el-form> | |||
| <table-list :ref="tKeynew" :options="optionsTable"></table-list> | |||
| </div> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button class="draftBtn" @click="dialogVisible = false">取 消</el-button> | |||
| <el-button class="putinBtn" @click="getSelectedShop()">确 定</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import TableList from "../../../core/comps/table/tableList.vue"; | |||
| import commonUtil from '../../../core/tool/commonUtil.js'; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import { | |||
| CouponCacheData | |||
| } from "../../../service/couponData/data.js"; | |||
| // import {CouponUrl} from "./UrlEnum.js"; | |||
| export default { | |||
| name: 'shopListDgnew', | |||
| props: ["tKeynew", "cbnew","shopsType"], | |||
| components: { | |||
| TableList | |||
| }, | |||
| data() { | |||
| return { | |||
| dialogVisible: false, | |||
| curRuleForm: { | |||
| /* building: "", | |||
| floor: "", | |||
| shopNumber: "", */ | |||
| merchantName: '', | |||
| }, | |||
| floorArr: [], | |||
| buildingArr: [], | |||
| optionsTable: { | |||
| singleSelected: true, | |||
| showCk: true, | |||
| map: [ | |||
| // {key:"id",val:"商户id"}, | |||
| { | |||
| key: "merchantName", | |||
| val: "商户名" | |||
| }, | |||
| { | |||
| key: "linkPerson", | |||
| val: "联系人" | |||
| }, | |||
| { | |||
| key: "linkPhone", | |||
| val: "联系方式" | |||
| }, | |||
| { | |||
| key: "shopNumber", | |||
| val: "商铺号" | |||
| }, | |||
| /* { | |||
| key: "status", | |||
| val: "商铺状态", | |||
| convert: this.cStatus | |||
| } */ | |||
| ], | |||
| getUrl: () => { | |||
| return "/api/wxShop/listShopFromContract?status=1" | |||
| + "&type=" + this.shopsType | |||
| + "&merchantName=" + this.curRuleForm.merchantName | |||
| /* + "&building=" + this.curRuleForm.building | |||
| + "&floor=" + this.curRuleForm.floor | |||
| + "&shopNumber=" + this.curRuleForm.shopNumber */ | |||
| }, | |||
| pageOption: { | |||
| sizeKey: "pageSize", | |||
| indexKey: "pageNum", | |||
| index: 1, | |||
| size: 10 | |||
| }, | |||
| analysis: (data) => { | |||
| return { | |||
| data: data.data.list, | |||
| count: data.data.total, | |||
| }; | |||
| } | |||
| }, | |||
| } | |||
| }, | |||
| //新增computed属性 | |||
| computed: { | |||
| ...mapState({ | |||
| navigationInfo: state => state.topNav.navigationInfo | |||
| }), | |||
| }, | |||
| methods: { | |||
| search: function() { | |||
| let tKey = this.$refs[this.tKeynew]; | |||
| tKey.search(tKey.getParams().index); | |||
| }, | |||
| //获取楼座信息 | |||
| getBuilding: function() { | |||
| this.getFetch("/api/wxMallBuilding/getbuildingfloorlist").then(d => { | |||
| this.buildingArr = d.data; | |||
| }); | |||
| }, | |||
| //选择楼座 | |||
| changeBuilding: function(item) { | |||
| for (let building of this.buildingArr) { | |||
| if (item == building.id) { | |||
| this.floorArr = building.floors; | |||
| } | |||
| } | |||
| this.curRuleForm.floor = ""; | |||
| //this.search() | |||
| }, | |||
| openDialog() { | |||
| this.dialogVisible = true; | |||
| }, | |||
| cStatus(col,item){ | |||
| return "已出租"; | |||
| }, | |||
| handleClose() { | |||
| this.dialogVisible = false; | |||
| }, | |||
| getSelectedShop() { | |||
| let items = this.$refs[this.tKeynew].getCheckedItems("id"); | |||
| if (items.data.length < 1) { | |||
| this.$message({ | |||
| type: 'error', | |||
| message: '抱歉,不能识别您选择的商铺' | |||
| }); | |||
| return; | |||
| } else { | |||
| this.cbnew(items); | |||
| } | |||
| this.dialogVisible = false; | |||
| } | |||
| }, | |||
| mounted: function () { | |||
| //获取楼座信息 | |||
| this.getBuilding(); | |||
| }, | |||
| created() { | |||
| } | |||
| } | |||
| </script> | |||
| <style scoped> | |||
| .el-dialog { | |||
| width: 565px!important; | |||
| } | |||
| .el-dialog { | |||
| width: 565px!important; | |||
| } | |||
| .fx_dialog_list_chooseSH .el-dialog .el-dialog__footer .dialog-footer .draftBtn,.fx_dialog_list_chooseSH .el-dialog .el-dialog__footer .dialog-footer .putinBtn{ | |||
| width:76px; | |||
| height: 35px; | |||
| font-size:14px; | |||
| padding: 10px 20px; | |||
| } | |||
| .fx_dialog_list_chooseSH .el-dialog .el-dialog__footer .dialog-footer .draftBtn{ | |||
| margin-right: 7.5px; | |||
| background:RGBA(255, 255, 255, 1); | |||
| color:#555555; | |||
| border:1px solid #E1E6EA; | |||
| } | |||
| .fx_dialog_list_chooseSH .el-dialog .el-dialog__footer .dialog-footer .putinBtn{ | |||
| margin-left: 7.5px; | |||
| background:rgba(90, 118, 191,1); | |||
| color:#FFFFFF; | |||
| } | |||
| .fx_dialog_list_chooseSH .el-dialog .el-dialog__footer .dialog-footer .draftBtn:hover{ | |||
| background:RGBA(255, 255, 255, .88); | |||
| } | |||
| .fx_dialog_list_chooseSH .el-dialog .el-dialog__footer .dialog-footer .putinBtn:hover{ | |||
| background:rgba(90, 118, 191,.88); | |||
| } | |||
| </style> | |||
| <style> | |||
| /* .el-dialog { | |||
| width: 800px !important; | |||
| } */ | |||
| .div { | |||
| over-flow: hidden; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,272 @@ | |||
| <template> | |||
| <div class="rentshop"> | |||
| <el-table | |||
| ref="filterTable1" | |||
| :data="contractList" | |||
| tooltip-effect="dark" | |||
| border | |||
| :height="getHeight" | |||
| style="width: 100%;" | |||
| > | |||
| <el-table-column prop="contractNumber" label="商户关联合同"></el-table-column> | |||
| <el-table-column label="商铺号"> | |||
| <template slot-scope="scope"> | |||
| <span>{{changeShopNum(scope.row,'shopNumber')}}</span> | |||
| </template> | |||
| </el-table-column> | |||
| <el-table-column prop="merchantName" label="商户名称"></el-table-column> | |||
| <el-table-column label="租赁开始日期"> | |||
| <template slot-scope="scope"> | |||
| <span>{{dealTime(scope.row,'rentalStartDate')}}</span> | |||
| </template> | |||
| </el-table-column> | |||
| <el-table-column label="租赁结束日期"> | |||
| <template slot-scope="scope"> | |||
| <span>{{dealTime(scope.row,'rentalEndDate')}}</span> | |||
| </template> | |||
| </el-table-column> | |||
| <el-table-column label="租金"> | |||
| <template slot-scope="scope"> | |||
| <span>{{divide(scope.row)}}</span> | |||
| </template> | |||
| </el-table-column> | |||
| <el-table-column label="计租方式"> | |||
| <template slot-scope="scope"> | |||
| <span>{{ctype(scope.row)}}</span> | |||
| </template> | |||
| </el-table-column> | |||
| <el-table-column label="合同状态"> | |||
| <template slot-scope="scope"> | |||
| <span>{{cStatus(scope.row)}}</span> | |||
| </template> | |||
| </el-table-column> | |||
| <el-table-column label="审批状态"> | |||
| <template slot-scope="scope"> | |||
| <span>{{cStatus(scope.row)}}</span> | |||
| </template> | |||
| </el-table-column> | |||
| <el-table-column label="操作"> | |||
| <template slot-scope="scope"> | |||
| <el-button @click="previewDetail(scope.row,scope.$index)" type="text" size="small">查看</el-button> | |||
| <el-button @click="downloadContract(scope.row,scope.$index)" type="text" size="small">下载</el-button> | |||
| </template> | |||
| </el-table-column> | |||
| </el-table> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import shopListDg from "../contractComp/multishopListDg.vue"; | |||
| import commonUtil from "../../../core/tool/commonUtil"; | |||
| import alertDialog from "../../../core/comps/input/alertDialog.vue"; | |||
| import moment, { months } from "moment"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import { ContractData } from "../../../service/contract/data.js"; | |||
| import { ContractUrl } from "../businessComp/UrlEnum.js"; | |||
| import { CouponCacheData } from "../../../service/couponData/data.js"; | |||
| export default { | |||
| components: { | |||
| }, | |||
| props: ["merchantId","contractType", ], | |||
| data() { | |||
| return { | |||
| ...mapActions([ | |||
| ]), | |||
| tk: "contractTable", | |||
| tKey: "shoplist", | |||
| contractList: [], | |||
| }; | |||
| }, | |||
| computed: { | |||
| ...mapState({ | |||
| }), | |||
| getHeight() { | |||
| let num = 110; | |||
| if (this.contractList.length > 1 && this.contractList.length <= 10) { | |||
| num = 110+67.5*(this.contractList.length-1); | |||
| } else if (this.contractList.length > 10) { | |||
| num = 450; | |||
| } | |||
| return num; | |||
| } | |||
| }, | |||
| watch: { | |||
| 'merchantId': function(newVal,oldVal) { | |||
| console.log(newVal) | |||
| console.log(oldVal) | |||
| if (newVal) { | |||
| this.getAllContractList(newVal); | |||
| } | |||
| } | |||
| }, | |||
| methods: { | |||
| changeShopNum(row) { | |||
| let rentInfo = []; | |||
| if (row.rentInfo) { | |||
| rentInfo = JSON.parse(row.rentInfo); | |||
| } | |||
| let str = ""; | |||
| rentInfo.map((items, indexs) => { | |||
| str = str != "" ? str + " ," + items.shopNumber : items.shopNumber; | |||
| }); | |||
| return str; | |||
| }, | |||
| divide(item) { | |||
| if (item.bus_discount_ratio != undefined && item.bus_discount_time != 0 && item.bus_discount_ratio !='') { | |||
| return Number(item.price) / 100 +(item.bus_discount_time==1?'元/年':item.bus_discount_time==2?'元/月':'元/周期'); | |||
| } else { | |||
| return Number(item.price) / 100 +(item.price_unit==1?'元/日':item.price_unit==2?'元/月':'元/年'); | |||
| } | |||
| }, | |||
| ctype(item) { | |||
| if (item.type == 1) { | |||
| return "按租赁面积"; | |||
| } else if (item.type == 2) { | |||
| return "联营扣点"; | |||
| } else { | |||
| return "面积计租、联营取高"; | |||
| } | |||
| }, | |||
| cStatus(item) { | |||
| return CouponCacheData.rentStatus.filter(e => { | |||
| return e.value == item.status.toString(); | |||
| })[0].name; | |||
| }, | |||
| cApplyStatus(item) { | |||
| if (item.applyStatus) { | |||
| return ( | |||
| (item.businessType != 6 ? "签约" : "终止") + | |||
| ContractData.applyStatus.filter(e => e.value == item.applyStatus)[0] | |||
| .name | |||
| ); | |||
| } else if (item.applyStatus === 0) { | |||
| return "未提交审核"; | |||
| } | |||
| }, | |||
| getAllContractList(merchantId) { | |||
| this.getFetch(`${ContractUrl.getContractList}?merchantId=${merchantId}&validStatus=1&pageNum=1&pageSize=100000`) | |||
| .then(res=>{ | |||
| console.log(res) | |||
| this.contractList = res.data.list; | |||
| }) | |||
| .catch(err=>{ | |||
| this.$message.error(err.data); | |||
| }) | |||
| }, | |||
| dealTime(row,key) { | |||
| return moment(row[key]).format('YYYY-MM-DD'); | |||
| }, | |||
| //查看 | |||
| previewDetail(row,index) { | |||
| /** | |||
| contractType合同类型:1租金合同,2多经合同,3物业合同,4多经物业合同 | |||
| businessType操作类型:1合同审批,2账单审批,3终止合同审批 | |||
| id为合同id | |||
| */ | |||
| this.$router.push({ | |||
| path: `rentsCheck?id=${row.id}&contractType=${this.contractType}&businessType=1` | |||
| }); | |||
| }, | |||
| //下载 | |||
| downloadContract(row,index) { | |||
| location.href = "/api/wxRentContract/exportContract?id=" + row.id; | |||
| }, | |||
| }, | |||
| created() { | |||
| // this.getAllContractList(this.merchantId); | |||
| } | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| .s-add { | |||
| width: 100%; | |||
| background: #fff; | |||
| height: 59px; | |||
| text-align: center; | |||
| line-height: 59px; | |||
| z-index: 1000; | |||
| position: relative; | |||
| opacity: 1; | |||
| } | |||
| .s-add-box { | |||
| background: rgb(90, 118, 191, 0.1); | |||
| height: 60px; | |||
| padding-top: 12px; | |||
| box-sizing: border-box; | |||
| } | |||
| .add-button { | |||
| margin: 0 auto; | |||
| width: 95px; | |||
| height: 36px; | |||
| line-height: 36px; | |||
| background: rgba(255, 255, 255, 1); | |||
| border: 1px solid rgba(81, 169, 201, 1); | |||
| border-radius: 3px; | |||
| cursor: pointer; | |||
| box-sizing: border-box; | |||
| color: #51a9c9; | |||
| } | |||
| </style> | |||
| <style> | |||
| .marketing-list .line .el-form-item__content { | |||
| margin-left: 0 !important; | |||
| } | |||
| .marketing-list .outer_time_item01 .el-form-item__content { | |||
| margin-left: 0 !important; | |||
| } | |||
| .el-select-dropdown { | |||
| max-width: 222px !important; | |||
| } | |||
| .jiedan-button { | |||
| width: auto !important; | |||
| margin-top: 20px; | |||
| } | |||
| .rentshop { | |||
| background: #fff; | |||
| position: relative; | |||
| } | |||
| .rentshop .el-table { | |||
| border: none !important; | |||
| } | |||
| .rentshop .el-table thead { | |||
| background: #5976bf !important; | |||
| } | |||
| .rentshop .el-table th { | |||
| background: #5976bf !important; | |||
| color: #fff !important; | |||
| border: none !important; | |||
| text-align: center !important; | |||
| height: 40px !important; | |||
| line-height: 40px !important; | |||
| padding: 0 !important; | |||
| font-weight: 400; | |||
| font-size: 14px; | |||
| font-family: "Avenir", Helvetica, Arial, sans-serif; | |||
| } | |||
| .rentshop .el-table__header-wrapper { | |||
| height: 40px; | |||
| } | |||
| .rentshop .el-table td { | |||
| border: none !important; | |||
| text-align: center !important; | |||
| height: 46.2px !important; | |||
| } | |||
| .outer_time_item .el-form-item__content { | |||
| display: inline-block !important; | |||
| } | |||
| .outer_time_item .el-form-item__label { | |||
| padding: 0 12px 0 0px; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,94 @@ | |||
| <template> | |||
| <div> | |||
| <div class="lists" style="float:left;width:auto;margin-bottom:20px;"> | |||
| <div style="float:left;width:auto;"> | |||
| <div> | |||
| <el-tag style="cursor:pointer;" :disable-transitions="false">发起审批</el-tag> | |||
| </div> | |||
| <div style="text-align:center;line-height:24px;">我</div> | |||
| </div> | |||
| <div | |||
| style="display:block;float:left;padding-left:15px;width:60px;text-align:center;line-height:32px;" | |||
| > | |||
| <i :class="'iconfont icon-cs-jt-xy-1-1 iconBox'"></i> | |||
| </div> | |||
| </div> | |||
| <div | |||
| class="lists" | |||
| v-if="processData&&processData.length>0" | |||
| :key="index" | |||
| v-for="(item,index) in processData" | |||
| style="float:left;width:auto;margin-bottom:20px;" | |||
| > | |||
| <div style="float:left;width:auto;"> | |||
| <div> | |||
| <el-tag style="cursor:pointer;" :disable-transitions="false">{{getName(item.userList)}}</el-tag> | |||
| </div> | |||
| <div style="text-align:center;line-height:24px;">{{getLevel01(index,item.type)}}</div> | |||
| <div style="text-align:center;line-height:24px;">{{getLevel02(index,item.type)}}</div> | |||
| </div> | |||
| <div | |||
| style="display:block;float:left;padding-left:15px;width:60px;text-align:center;line-height:32px;" | |||
| v-if="index!=(processData.length-1)" | |||
| > | |||
| <!-- <i class="el-icon-right"></i> --> | |||
| <i :class="'iconfont icon-cs-jt-xy-1-1 iconBox'"></i> | |||
| </div> | |||
| </div> | |||
| <div class="lists" style="float:left;width:auto;margin-bottom:20px;"> | |||
| <div | |||
| style="display:block;float:left;padding-left:15px;width:60px;text-align:center;line-height:32px;" | |||
| > | |||
| <!-- <i class="el-icon-right"></i> --> | |||
| <i :class="'iconfont icon-cs-jt-xy-1-1 iconBox'"></i> | |||
| </div> | |||
| <div style="float:left;width:auto;"> | |||
| <div> | |||
| <el-tag style="cursor:pointer;" :disable-transitions="false">结束</el-tag> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import { PromissionCacheData } from "../../../service/promission/data.js"; | |||
| export default { | |||
| components: {}, | |||
| props: ["processData"], | |||
| data() { | |||
| return {}; | |||
| }, | |||
| computed: {}, | |||
| methods: { | |||
| getName(name) { | |||
| let str = ""; | |||
| name.map((item, index) => { | |||
| str = str + item.name + (index == name.length - 1 ? "" : ","); | |||
| }); | |||
| return str; | |||
| }, | |||
| getLevel01(index, type) { | |||
| return PromissionCacheData.processLevel.filter(e => e.value == index)[0].name | |||
| }, | |||
| getLevel02(index, type) { | |||
| return ( | |||
| "(" + | |||
| PromissionCacheData.processTypes.filter(e => e.value == type)[0].name + | |||
| ")" | |||
| ); | |||
| } | |||
| }, | |||
| created() { | |||
| console.log(this.processData, 3333333333333333); | |||
| } | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| .iconBox { | |||
| font-size: 30px !important; | |||
| color: #0b6ef3 !important; | |||
| margin-right: 16px !important; | |||
| text-shadow: 0 1px 1px #1a2734 !important; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,434 @@ | |||
| <template> | |||
| <div> | |||
| <el-table :data="tableData" max-height="450" align="center" border style="width: 100%" :row-class-name="tableRowClassName" show-summary :summary-method="getSummaries"> | |||
| <el-table-column prop="period" label="周期" align="center" width="60"></el-table-column> | |||
| <el-table-column label="周期时间" width="200" align="center" v-if="!showEditButton"> | |||
| <template slot-scope="scope"> | |||
| <span>{{changeDateRange(scope.row)}}</span> | |||
| </template> | |||
| </el-table-column> | |||
| <el-table-column label="周期时间" width="200" align="center" v-if="showEditButton"> | |||
| <template slot-scope="scope"> | |||
| <span style="color:#409eff;cursor:pointer;" v-if="(tableData.length-1)!=scope.$index" @click="goEndDate(scope)">{{changeDateRange(scope.row)}}<i class="el-icon-edit"></i></span> | |||
| <span v-if="(tableData.length-1)==scope.$index">{{changeDateRange(scope.row)}}</span> | |||
| </template> | |||
| </el-table-column> | |||
| <el-table-column label="账单日" v-if="!showEditButton" align="center"> | |||
| <template slot-scope="scope"> | |||
| <span>{{changeDate(scope.row.receiveDate)}}</span> | |||
| </template> | |||
| </el-table-column> | |||
| <el-table-column v-if="showEditButton" align="center"> | |||
| <template slot="header" slot-scope="scope"> | |||
| <div style="color:#409eff;cursor:pointer;" @click="goEditReceiveDate(1,'')"> | |||
| <span>账单日</span> | |||
| <i class="el-icon-edit"></i> | |||
| </div> | |||
| </template> | |||
| <template slot-scope="scope"> | |||
| <span | |||
| v-if="showEditButton" | |||
| @click="goEditReceiveDate(2,scope)" | |||
| style="color:#409eff;cursor:pointer;" | |||
| > | |||
| {{changeDate(scope.row.receiveDate)}} | |||
| <i class="el-icon-edit"></i> | |||
| </span> | |||
| </template> | |||
| </el-table-column> | |||
| <el-table-column prop="needPay" label="合同金额(元)" width="180" align="center"> | |||
| <template slot-scope="scope"> | |||
| <span>{{getNeedPay(scope.row.needPay)}}</span> | |||
| </template> | |||
| </el-table-column> | |||
| <el-table-column prop="receivePay" label="实际金额(元)" width="180" align="center"></el-table-column> | |||
| <el-table-column label="调整金额(元)" v-if="showEditButton" align="center"> | |||
| <template slot-scope="scope"> | |||
| <el-input placeholder="请输入内容" maxlength="10" v-model="scope.row.receivePay" clearable></el-input> | |||
| </template> | |||
| </el-table-column> | |||
| <el-table-column label="金额变更原因" align="center"> | |||
| <template slot-scope="scope"> | |||
| <el-input | |||
| placeholder="请输入内容" | |||
| type="textarea" | |||
| v-if="(scope.row.receivePay!=scope.row.needPay||(scope.row.needPay==0&&scope.row.receivePay==scope.row.needPay))&&showEditButton" | |||
| maxlength="100" | |||
| v-model="scope.row.comments" | |||
| clearable | |||
| ></el-input> | |||
| <span v-if="!showEditButton">{{scope.row.comments}}</span> | |||
| </template> | |||
| </el-table-column> | |||
| </el-table> | |||
| <el-dialog | |||
| title="账单日编辑" | |||
| :visible.sync="dialogVisible" | |||
| :modal-append-to-body="false" | |||
| width="30%" | |||
| > | |||
| <div style="padding-left:50px;" v-if="editType==1"> | |||
| <el-radio-group v-model="receiveDateUpdateType"> | |||
| <el-radio :label="0">全部提前</el-radio> | |||
| <el-radio :label="1">全部置后</el-radio> | |||
| </el-radio-group> | |||
| </div> | |||
| <div v-if="editType!=1"> | |||
| <el-date-picker | |||
| v-model="receiveDateUpdateVal02" | |||
| :picker-options="pickerOptions" | |||
| :clearable="false" | |||
| type="date" | |||
| placeholder="选择日期" | |||
| ></el-date-picker> | |||
| </div> | |||
| <div style="padding:30px 0 0 50px;" v-if="editType==1"> | |||
| <el-input-number | |||
| v-model="receiveDateUpdateVal" | |||
| controls-position="right" | |||
| :min="0" | |||
| :max="365" | |||
| ></el-input-number>天 | |||
| </div> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button @click="dialogVisible = false">取 消</el-button> | |||
| <el-button type="primary" @click="submitDateChange">确 定</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| <el-dialog | |||
| title="周期时间" | |||
| :visible.sync="dateVisible" | |||
| :modal-append-to-body="false" | |||
| width="30%" | |||
| > | |||
| {{starttime + ' - '}} | |||
| <el-date-picker | |||
| v-model="endtime" | |||
| :picker-options="pickerOptions02" | |||
| :clearable="false" | |||
| type="date" | |||
| placeholder="选择日期" | |||
| ></el-date-picker> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button @click="dateVisible = false">取 消</el-button> | |||
| <el-button type="primary" @click="submitEndDateChange">确 定</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import commonUtil from "../../../core/tool/commonUtil"; | |||
| import shopListDg from "../contractComp/shopListDg.vue"; | |||
| import moment, { months } from "moment"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import { deepcopy } from "../../../utils/validate"; | |||
| import { ContractUrl } from "../businessComp/UrlEnum.js" | |||
| import Vue from 'vue'; | |||
| export default { | |||
| components: {}, | |||
| props: ["editIf","id","type"], | |||
| data() { | |||
| return { | |||
| receivePeriod:'', | |||
| tableData: [], | |||
| dialogVisible: false, | |||
| dateVisible: false, | |||
| selectIndex: 0, | |||
| editType: 1, | |||
| receiveDateUpdateType: 0, | |||
| receiveDateUpdateVal: "", | |||
| receiveDateUpdateVal02: "", | |||
| showEditButton: this.editIf ? false : true, //默认展示编辑操作 | |||
| starttime: "", | |||
| endtime: "" | |||
| }; | |||
| }, | |||
| computed: { | |||
| getHeight() { | |||
| return this.tableData.length > 10 ? 450 : null; | |||
| }, | |||
| pickerOptions02: function() { | |||
| return { | |||
| disabledDate: time => { | |||
| let beginDateVal = moment(this.starttime); | |||
| let endTime = moment(this.starttime).add(1, "years").subtract(1,'days'); | |||
| let endDate = this.tableData[this.tableData.length-1].endtime; | |||
| if (beginDateVal && endTime) { | |||
| return ( | |||
| moment(time) < moment(beginDateVal) || | |||
| moment(time) > moment(endTime) || moment(time).valueOf()>moment(endDate).valueOf() | |||
| ); | |||
| } | |||
| } | |||
| }; | |||
| }, | |||
| pickerOptions: function() { | |||
| return { | |||
| disabledDate: time => { | |||
| let diffDay = moment(this.endtime).diff( | |||
| moment(this.starttime), | |||
| "days" | |||
| )+1; | |||
| let beginDateVal = moment(this.starttime).subtract(diffDay+1, "days"); | |||
| let endTime = moment(this.starttime).add(diffDay-1, "days"); | |||
| if (beginDateVal && endTime) { | |||
| return ( | |||
| moment(time) < moment(beginDateVal) || | |||
| moment(time) > moment(endTime) | |||
| ); | |||
| } | |||
| } | |||
| }; | |||
| } | |||
| }, | |||
| methods: { | |||
| tableRowClassName({row, rowIndex}) { | |||
| if (rowIndex%2!==0) { | |||
| return 'success-row'; | |||
| } | |||
| return ''; | |||
| }, | |||
| getSummaries(param) { | |||
| const { columns, data } = param; | |||
| const sums = []; | |||
| columns.forEach((column, index) => { | |||
| if (index === 0) { | |||
| sums[index] = '总价'; | |||
| return; | |||
| } | |||
| const values = data.map(item => Number(item[column.property])); | |||
| if (!values.every(value => isNaN(value))) { | |||
| sums[index] = values.reduce((prev, curr) => { | |||
| const value = Number(curr); | |||
| if (!isNaN(value)) { | |||
| return prev + curr; | |||
| } else { | |||
| return prev; | |||
| } | |||
| }, 0); | |||
| sums[index] = sums[index].toFixed(2); | |||
| } else { | |||
| sums[index] = ''; | |||
| } | |||
| }); | |||
| return sums; | |||
| }, | |||
| getNeedPay(needPay){ | |||
| return Number(needPay)!=0?needPay:'--' | |||
| }, | |||
| goEditReceiveDate(type, row) { | |||
| this.dialogVisible = true; | |||
| this.editType = type; | |||
| if (type == 2) { | |||
| this.selectIndex = row.$index; | |||
| this.receiveDateUpdateVal02 = row.row.receiveDate; | |||
| this.starttime = row.row.starttime; | |||
| this.endtime = row.row.endtime; | |||
| } | |||
| }, | |||
| goEndDate(row){ | |||
| this.dateVisible = true; | |||
| this.selectIndex = row.$index; | |||
| this.starttime = moment(row.row.starttime).format('YYYY-MM-DD'); | |||
| this.endtime = row.row.endtime; | |||
| }, | |||
| changeDateRange(item) { | |||
| return ( | |||
| moment(item.starttime).format("YYYY.MM.DD") + | |||
| " - " + | |||
| moment(item.endtime).format("YYYY.MM.DD") | |||
| ); | |||
| }, | |||
| //编辑账单日 | |||
| editReceiveDate() {}, | |||
| getBill(endtime,endDate,tableData){ | |||
| if(moment(endtime)<moment(endDate)){ | |||
| let b = tableData[tableData.length-1]; | |||
| let a={}; | |||
| a.period = tableData.length; | |||
| a.starttime = moment(moment(b.starttime).format('YYYY-MM-DD')).add(this.receivePeriod,'months'); | |||
| a.endtime = moment(moment(b.endtime).format('YYYY-MM-DD')+' 23:59:59').add(this.receivePeriod,'months').subtract(1,'days')>moment(endDate)?moment(endDate):moment(moment(b.endtime).format('YYYY-MM-DD')+' 23:59:59').add(this.receivePeriod,'months'); | |||
| endtime = moment(moment(b.endtime).format('YYYY-MM-DD')+' 23:59:59').add(this.receivePeriod,'months').subtract(1,'days')>moment(endDate)?moment(endDate):moment(moment(b.endtime).format('YYYY-MM-DD')+' 23:59:59').add(this.receivePeriod,'months'); | |||
| a.receiveDate = moment(moment(a.starttime).subtract(1,'days')).valueOf(); | |||
| tableData.push(a); | |||
| return this.getBill(endtime,endDate,tableData) | |||
| }else{ | |||
| return tableData; | |||
| } | |||
| }, | |||
| //修改周期时间保存 | |||
| submitEndDateChange(){ | |||
| let tableData = []; | |||
| if(!this.endtime){ | |||
| this.$message.error('抱歉,日期不能为空!') | |||
| return; | |||
| } | |||
| let endDate = this.tableData[this.tableData.length-1].endtime; | |||
| this.tableData[this.selectIndex].endtime = moment(moment(this.endtime).format('YYYY-MM-DD')+' 23:59:59'); | |||
| let endIf = false; | |||
| this.tableData.map((item,index)=>{ | |||
| moment(item.endtime).format('YYYY-MM-DD') | |||
| if(this.selectIndex<index){ | |||
| if(moment(moment(endDate).format('YYYY-MM-DD')+' 00:00:00').valueOf()>moment(moment(this.tableData[index-1].endtime).format('YYYY-MM-DD')+' 00:00:00').valueOf()&&!endIf){ | |||
| item.period = index+1; | |||
| item.starttime = moment(moment(this.tableData[index-1].endtime).format('YYYY-MM-DD')).add(1,'days'); | |||
| item.endtime = moment(moment(item.starttime).format('YYYY-MM-DD')+' 23:59:59').add(this.receivePeriod,'months').subtract(1,'days')>moment(endDate)?moment(endDate):moment(moment(item.starttime).format('YYYY-MM-DD')+' 23:59:59').add(this.receivePeriod,'months').subtract(1,'days'); | |||
| item.receiveDate = moment(moment(item.starttime).subtract(1,'days')).valueOf(); | |||
| let a=item; | |||
| tableData.push(a); | |||
| }else{ | |||
| endIf = true; | |||
| } | |||
| }else{ | |||
| item.period = index+1; | |||
| tableData.push(item); | |||
| } | |||
| }) | |||
| tableData = this.getBill(tableData[tableData.length-1].endtime,endDate,tableData) | |||
| let param={ | |||
| previewBillRentList:[], | |||
| id:this.id | |||
| } | |||
| tableData.map((item,index)=>{ | |||
| let a={}; | |||
| a.starttime = moment(item.starttime).format('YYYY-MM-DD')+' 00:00:00'; | |||
| a.endtime = moment(item.endtime).format('YYYY-MM-DD')+' 23:59:59'; | |||
| param.previewBillRentList.push(a); | |||
| }) | |||
| let url = this.type==1? ContractUrl.buildBillPriceList : ContractUrl.buildPropertyBillPriceList; | |||
| this.postFetch(url,param) | |||
| .then(d=>{ | |||
| d.data.map((item,index)=>{ | |||
| tableData[index].needPay = (Number(item.needPay)/100).toFixed(2); | |||
| if(index>=this.selectIndex){ | |||
| tableData[index].receivePay = (item.receivePay/100).toFixed(2); | |||
| tableData[index].needPay = (item.needPay/100).toFixed(2); | |||
| } | |||
| }) | |||
| this.tableData = tableData; | |||
| this.$message.success('保存成功!') | |||
| }) | |||
| .catch(err=>{ | |||
| this.$message.error(err.data) | |||
| }) | |||
| this.dateVisible = false; | |||
| }, | |||
| //保存日期修改信息 | |||
| submitDateChange() { | |||
| let haveError = false; | |||
| let message = ""; | |||
| let tableData = JSON.parse(JSON.stringify(this.tableData)); | |||
| if (this.editType == 1) { | |||
| tableData.map((item, index) => { | |||
| item.receiveDate = | |||
| this.receiveDateUpdateType == 0 | |||
| ? moment(item.receiveDate).subtract( | |||
| this.receiveDateUpdateVal, | |||
| "days" | |||
| ) | |||
| : moment(item.receiveDate).add(this.receiveDateUpdateVal, "days"); | |||
| let diffDay = moment(item.endtime).diff( | |||
| moment(item.starttime), | |||
| "days" | |||
| ); | |||
| let diffDay02 = | |||
| this.receiveDateUpdateType == 0 | |||
| ? moment(item.starttime) | |||
| .subtract(1, "days") | |||
| .diff(moment(item.receiveDate), "days") | |||
| : moment(item.receiveDate) | |||
| .add(1, "days") | |||
| .diff(moment(item.endtime), "days"); | |||
| if (diffDay02 > diffDay) { | |||
| haveError = true; | |||
| message = | |||
| "周期" + | |||
| item.period + | |||
| (this.receiveDateUpdateType == 0 ? "提前" : "置后") + | |||
| "的天数不能大于付款周期"; | |||
| } | |||
| }); | |||
| if (haveError) { | |||
| this.$notify.error({ | |||
| title: "错误", | |||
| message: message | |||
| }); | |||
| } else { | |||
| this.tableData = tableData; | |||
| } | |||
| } else { | |||
| if(!this.receiveDateUpdateVal02){ | |||
| this.$message.error('抱歉,日期不能为空!') | |||
| return; | |||
| } | |||
| tableData[this.selectIndex].receiveDate = this.receiveDateUpdateVal02; | |||
| this.tableData = tableData; | |||
| } | |||
| this.dialogVisible = false; | |||
| }, | |||
| changeDate(date) { | |||
| return moment(date).format("YYYY-MM-DD"); | |||
| }, | |||
| /** | |||
| * 获取表格数据 | |||
| */ | |||
| setData(data,receivePeriod) { | |||
| let sData = []; | |||
| this.receivePeriod = receivePeriod; | |||
| console.log(receivePeriod,6666) | |||
| data.map((item, index) => { | |||
| item.needPay = (item.needPay / 100).toFixed(2); | |||
| item.receivePay = (item.receivePay / 100).toFixed(2); | |||
| }); | |||
| this.tableData = data; | |||
| }, | |||
| /** | |||
| * 父组件获取表格数据 | |||
| */ | |||
| getData() { | |||
| let data = JSON.parse(JSON.stringify(this.tableData)); | |||
| const reg = /(^[1-9]\d*(\.\d{1,2})?$)|(^0(\.\d{1,2})?$)/; | |||
| let haveError = false; | |||
| let message = ""; | |||
| data.map((item, index) => { | |||
| if ( | |||
| !(Number(item.receivePay) >= 0) || | |||
| Number(item.receivePay) > 200000000 | |||
| ) { | |||
| haveError = true; | |||
| message = "抱歉,金额不能为负且小于两亿!"; | |||
| } else if (!reg.test(item.receivePay)) { | |||
| haveError = true; | |||
| message = "抱歉,金额限制为最多两位小数!"; | |||
| } | |||
| }); | |||
| data.map((item, index) => { | |||
| item.needPay = Number((item.needPay * 100).toFixed(2)); | |||
| item.receivePay = Number((item.receivePay * 100).toFixed(2)); | |||
| item.receiveDate = | |||
| moment(item.receiveDate).format("YYYY-MM-DD") + " 00:00:00"; | |||
| }); | |||
| if (haveError) { | |||
| this.$message.error(message); | |||
| return false; | |||
| } else { | |||
| return data; | |||
| } | |||
| } | |||
| }, | |||
| created() {} | |||
| }; | |||
| </script> | |||
| <style> | |||
| .el-table .warning-row { | |||
| background: oldlace; | |||
| } | |||
| .el-table .success-row { | |||
| background: #f0f9eb; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,237 @@ | |||
| <template> | |||
| <div class="rentshop"> | |||
| <el-table | |||
| ref="filterTable" | |||
| :data="(rentInfo&&rentInfo.length>0?rentInfo:rentInfoData)" | |||
| tooltip-effect="dark" | |||
| border | |||
| :height="getHeight" | |||
| style="width: 100%;" | |||
| > | |||
| <el-table-column prop="shopNumber" label="商铺号"></el-table-column> | |||
| <el-table-column prop="building" label="楼座号"></el-table-column> | |||
| <el-table-column prop="floor" label="楼层号"></el-table-column> | |||
| <el-table-column prop="buildArea" label="建筑面积(㎡)"></el-table-column> | |||
| <el-table-column prop="operationArea" label="可用面积(㎡)"></el-table-column> | |||
| <el-table-column label="参考租金"> | |||
| <template slot-scope="scope"> | |||
| <span>{{getRent(scope.row)}}</span> | |||
| </template> | |||
| </el-table-column> | |||
| <el-table-column prop="status" label="商铺状态" width="100" v-if="showAddButton||showShopStatus"> | |||
| <template slot-scope="scope"> | |||
| <el-tag | |||
| :type="scope.row.status === '未出租' ? 'primary' : 'success'" | |||
| disable-transitions | |||
| >{{getshopStatus(scope.row.status)}}</el-tag> | |||
| </template> | |||
| </el-table-column> | |||
| <el-table-column label="操作" v-if="showAddButton"> | |||
| <template slot-scope="scope"> | |||
| <el-button @click="deleteShop(scope.row,scope.$index)" type="text" size="small">删除</el-button> | |||
| </template> | |||
| </el-table-column> | |||
| </el-table> | |||
| <div class="s-add" v-if="showAddButton" :style="'margin-top:'+(rentInfo.length>0?'0':'-60px')"> | |||
| <div class="s-add-box"> | |||
| <div class="add-button" style="display:inline-block" @click="openShopDialog">{{rentInfo.length>0?'+ 添加商铺':'+ 新增'}}</div> | |||
| <div class="add-button" style="display:inline-block;margin-left:30px;" @click="selOriginShop" v-if="fromRenew!=undefined">选择原商铺</div> | |||
| </div> | |||
| </div> | |||
| <shop-list-dg :ref="tKey" :t-key="tKey" :cb="getShopCb" :shops-type="shopsType"></shop-list-dg> | |||
| <alert-dialog ref="alertDialogKey"></alert-dialog> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import shopListDg from "../contractComp/multishopListDg.vue"; | |||
| import commonUtil from "../../../core/tool/commonUtil"; | |||
| import alertDialog from "../../../core/comps/input/alertDialog.vue"; | |||
| import moment, { months } from "moment"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import { ContractData } from "../../../service/contract/data.js"; | |||
| import {CouponCacheData} from '../../../service/couponData/data' | |||
| export default { | |||
| components: { | |||
| shopListDg, | |||
| alertDialog | |||
| }, | |||
| props: ["optionData", "merchentEditIf","rentInfoData","showShopStatus","fromRenew","curRentInfoList"], | |||
| data() { | |||
| return { | |||
| ...mapActions([ | |||
| "setFormData", | |||
| "setRentInfo" // 将this.setNavData 映射为 this.$store.dispatch('setNavData') | |||
| ]), | |||
| tk: "rentshop", | |||
| tKey: "shoplist", | |||
| shopsType: "1", | |||
| priceUnitOption: ContractData.priceUnitOption, | |||
| showAddButton: this.merchentEditIf ? false : true | |||
| }; | |||
| }, | |||
| computed: { | |||
| ...mapState({ | |||
| rentInfo: state => state.setRentInfo.rentInfo, | |||
| formData: state => state.setRentInfo.formData | |||
| }), | |||
| getHeight() { | |||
| return this.rentInfo.length > 10 ? 450 : null; | |||
| } | |||
| }, | |||
| methods: { | |||
| // 店铺弹框 | |||
| openShopDialog() { | |||
| this.$refs[this.tKey].openDialog(); | |||
| }, | |||
| selOriginShop() { | |||
| let obj = JSON.parse(JSON.stringify(this.curRentInfoList)); | |||
| console.log(obj) | |||
| this.setRentInfo(obj); | |||
| }, | |||
| getRent(item){ | |||
| return item.rent?item.rent+' 元/㎡/'+this.priceUnitOption.filter(e=>e.value==item.rent_unit)[0].name:'未设置'; | |||
| }, | |||
| getShopCb(items) { | |||
| let haveIndex = false; | |||
| items.data.map((item, index) => { | |||
| let haveIf = false; | |||
| this.rentInfo.map((item01, index01) => { | |||
| if (item.id == item01.id) { | |||
| haveIndex = true; | |||
| haveIf = true; | |||
| } | |||
| }); | |||
| if (haveIf == false) { | |||
| item.shopId = item.id; | |||
| item.price = 0; | |||
| item.rentPrice = 0; | |||
| item.deposit = 0; | |||
| item.rentArea = item.operationArea; | |||
| item.adjustRatio = []; | |||
| if (this.formData.months && this.formData.months.length > 0) { | |||
| this.formData.months.map((item01, index01) => { | |||
| item.adjustRatio.push(0); | |||
| }); | |||
| } | |||
| this.rentInfo.push(item); | |||
| } | |||
| }); | |||
| console.log(this.rentInfo) | |||
| this.setRentInfo(this.rentInfo); | |||
| if (haveIndex) { | |||
| this.$message("已帮您过滤重复商铺!"); | |||
| } | |||
| }, | |||
| /** | |||
| * 删除选中商铺 | |||
| */ | |||
| deleteShop(item, index) { | |||
| this.$refs["alertDialogKey"].openDialog( | |||
| "此操作删除该商铺,是否要继续?", | |||
| () => { | |||
| this.rentInfo.splice(index, 1); | |||
| } | |||
| ); | |||
| }, | |||
| /** | |||
| * 处理合同状态 | |||
| * value = 》合同状态 类型 int | |||
| */ | |||
| getshopStatus(value){ | |||
| let arr = CouponCacheData.shopStatus | |||
| arr = arr.filter(item=>{ | |||
| return item.value == value | |||
| }) | |||
| return arr[0].name | |||
| // console.log(arr[0].name,"||||||"); | |||
| } | |||
| }, | |||
| created() { | |||
| }, | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| .s-add { | |||
| width: 100%; | |||
| background: #fff; | |||
| height: 59px; | |||
| text-align: center; | |||
| line-height: 59px; | |||
| z-index: 1000; | |||
| position: relative; | |||
| opacity: 1; | |||
| } | |||
| .s-add-box { | |||
| background: rgb(90, 118, 191, 0.1); | |||
| height: 60px; | |||
| padding-top: 12px; | |||
| box-sizing: border-box; | |||
| } | |||
| .add-button { | |||
| margin: 0 auto; | |||
| width: 95px; | |||
| height: 36px; | |||
| line-height: 36px; | |||
| background: rgba(255, 255, 255, 1); | |||
| border: 1px solid rgba(81, 169, 201, 1); | |||
| border-radius: 3px; | |||
| cursor: pointer; | |||
| box-sizing: border-box; | |||
| color: #51a9c9; | |||
| } | |||
| </style> | |||
| <style> | |||
| .marketing-list .line .el-form-item__content { | |||
| margin-left: 0 !important; | |||
| } | |||
| .marketing-list .outer_time_item01 .el-form-item__content { | |||
| margin-left: 0 !important; | |||
| } | |||
| .el-select-dropdown { | |||
| max-width: 222px !important; | |||
| } | |||
| .jiedan-button { | |||
| width: auto !important; | |||
| margin-top: 20px; | |||
| } | |||
| .rentshop { | |||
| background: #fff; | |||
| position: relative; | |||
| } | |||
| .rentshop .el-table { | |||
| border: none !important; | |||
| } | |||
| .rentshop .el-table thead { | |||
| background: #5976bf !important; | |||
| } | |||
| .rentshop .el-table th { | |||
| background: #5976bf !important; | |||
| color: #fff !important; | |||
| border: none !important; | |||
| text-align: center !important; | |||
| height: 40px !important; | |||
| line-height: 40px !important; | |||
| padding: 0 !important; | |||
| font-weight: 400; | |||
| font-size: 14px; | |||
| font-family: "Avenir", Helvetica, Arial, sans-serif; | |||
| } | |||
| .rentshop .el-table__header-wrapper { | |||
| height: 40px; | |||
| } | |||
| .rentshop .el-table td { | |||
| border: none !important; | |||
| text-align: center !important; | |||
| height: 46.2px !important; | |||
| } | |||
| .outer_time_item .el-form-item__content { | |||
| display: inline-block !important; | |||
| } | |||
| .outer_time_item .el-form-item__label { | |||
| padding: 0 12px 0 0px; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,173 @@ | |||
| <template> | |||
| <div class="block"> | |||
| <el-dialog | |||
| title="提前终止合同" | |||
| :modal-append-to-body="false" | |||
| :visible.sync="dialogVisible" | |||
| width="48%" | |||
| :before-close="handleClose" | |||
| > | |||
| <el-form :model="formData" ref="form" :rules="rules" label-width="100px" class="demo-dynamic"> | |||
| <el-form-item label="审批流程" v-if="processData.length>0"> | |||
| <process-template :processData="processData"></process-template> | |||
| </el-form-item> | |||
| <el-form-item label="终止类型:" v-if="stopType!=2&&(type==6||type==7)" prop="endProperty"> | |||
| <el-radio | |||
| v-for="(item,index) in stopTypeOption" | |||
| :label="item.value" | |||
| :key="index" | |||
| v-model="formData.endProperty" | |||
| >{{item.name}}</el-radio> | |||
| </el-form-item> | |||
| <!-- <div style="text-align:center;" v-if="!(processData.length>0)"> | |||
| 您确定要提前终止此合同吗? | |||
| </div> --> | |||
| <el-form-item label="备注" prop="remark" v-if="processData.length>0"> | |||
| <el-input | |||
| type="textarea" | |||
| v-model="formData.remark" | |||
| placeholder="请填写备注!" | |||
| maxlength="150" | |||
| class="edit-item-input" | |||
| ></el-input> | |||
| </el-form-item> | |||
| </el-form> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button @click="dialogVisible = false">取 消</el-button> | |||
| <el-button type="primary" @click="saveForm">确 定</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import Vue from "vue"; | |||
| import { CouponUrl } from "../../../components/marketing/businessComp/UrlEnum.js"; | |||
| import { ContractUrl } from "../businessComp/UrlEnum.js"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import processTemplate from "./processTemplate.vue"; | |||
| export default { | |||
| props: ["options", "processData", "type"], | |||
| components: { | |||
| processTemplate | |||
| }, | |||
| data() { | |||
| return { | |||
| contractType: this.options.contractType, | |||
| stopType: this.options.stopType, | |||
| formData: { | |||
| firstTaskUser: "", | |||
| secondTaskUser: "", | |||
| remark: "", | |||
| endProperty: "" | |||
| }, | |||
| rules: { | |||
| firstTaskUser: [ | |||
| { required: true, message: "请选择初审人!", trigger: "change" } | |||
| ], | |||
| endProperty: [ | |||
| { required: true, message: "请选择终止类型!", trigger: "change" } | |||
| ] | |||
| }, | |||
| stopTypeOption: [ | |||
| { | |||
| name: "终止租金合同", | |||
| value: 1 | |||
| }, | |||
| { | |||
| name: "终止租金合同及物业合同", | |||
| value: 2 | |||
| } | |||
| ], | |||
| dialogVisible: false, | |||
| businessId: "", | |||
| contractNumber: "" | |||
| }; | |||
| }, | |||
| //新增的 | |||
| computed: { | |||
| ...mapState({ | |||
| navigationInfo: state => state.topNav.navigationInfo | |||
| }) | |||
| }, | |||
| methods: { | |||
| handleClose(done) { | |||
| this.$confirm("确认关闭?") | |||
| .then(_ => { | |||
| done(); | |||
| }) | |||
| .catch(_ => {}); | |||
| }, | |||
| showLog(businessId, contractNumber) { | |||
| this.businessId = businessId; | |||
| this.contractNumber = contractNumber; | |||
| this.dialogVisible = true; | |||
| this.formData = { | |||
| firstTaskUser: "", | |||
| secondTaskUser: "", | |||
| remark: "", | |||
| endProperty: "" | |||
| }; | |||
| }, | |||
| saveForm() { | |||
| let _this = this; | |||
| this.$refs["form"].validate(valid => { | |||
| if (valid) { | |||
| if (this.processData.length > 0) { | |||
| let param = { | |||
| businessId: this.businessId, | |||
| variables: [ | |||
| { | |||
| key: "contractType", | |||
| value: this.contractType | |||
| }, | |||
| { | |||
| key: "contractNumber", | |||
| value: this.contractNumber | |||
| }, | |||
| { | |||
| key: "endProperty", | |||
| value: this.stopType==2?'':(this.type==18||this.type==20) ? 2: this.formData.endProperty | |||
| } | |||
| ], | |||
| businessType: this.type, | |||
| remark: this.formData.remark | |||
| }; | |||
| this.postFetch(ContractUrl.workflowStart, param) | |||
| .then(d => { | |||
| _this.$message.success("提交成功"); | |||
| _this.dialogVisible = false; | |||
| _this.$parent.search(); | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| } else { | |||
| let param={ | |||
| id:this.businessId, | |||
| endProperty:this.stopType==2?'':(this.type==18||this.type==20) ? 2: this.formData.endProperty | |||
| } | |||
| this.postFetch(ContractUrl.endContract, param) | |||
| .then(d => { | |||
| _this.$message.success("提交成功"); | |||
| _this.dialogVisible = false; | |||
| _this.$parent.search(); | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| } | |||
| } else { | |||
| console.log("error submit!!"); | |||
| return false; | |||
| } | |||
| }); | |||
| } | |||
| }, | |||
| created() { | |||
| console.log(11111) | |||
| } | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| </style> | |||
| @@ -0,0 +1,726 @@ | |||
| <template> | |||
| <div> | |||
| <div class="layout-content"> | |||
| <div class="shopBox" style="margin-bottom:20px;" v-if="fromAddTask != 'fromAddTask'"> | |||
| <rent-shop :rentInfoData='wxShops' :merchentEditIf="merchentEditIf"></rent-shop> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">合同信息</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同编号:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.contractNumber}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同状态:</el-col> | |||
| <el-col :span="18" class="span-text">{{cStatus(wxRentContract.status)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同签约日:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeDate(wxRentContract.signDate)}}</el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <!-- 商户信息 --> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">商户信息</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">商户名称:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.merchantName}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同主体名称:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.subjectName}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">经营品牌:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeBrand(wxRentContract.brand)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">业态:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeBusiness(wxRentContract.businessId)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">店面类型:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeShopType(wxRentContract.shopType)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">负责人:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.linkPerson}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">联系电话:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.linkPhone}}</el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <!-- --> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">租赁信息</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">租赁开始日期:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeDate(wxRentContract.rentalStartDate)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">租赁截止日期:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeDate(wxRentContract.rentalEndDate)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">总租期:</el-col> | |||
| <el-col :span="18" class="span-text">{{totalPeriodMonth+'个月'+totalPeriodDay+"天"}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">装修期:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.fixStartDate+' 至 '+wxRentContract.fixEndDate}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">计租开始日期:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeDate(wxRentContract.startDate)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">账单生成方式:</el-col> | |||
| <el-col :span="18" class="span-text">{{getAdjustPeriod}}</el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">租金信息</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">计租面积:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.rentArea+'㎡'}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title" v-if="contractType!=3&&contractType!=4">计租方式:</el-col> | |||
| <el-col :span="18" class="span-text" v-if="contractType!=3&&contractType!=4">{{changeType(wxRentContract.type)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" v-if="wxRentContract.type==2&&contractType!=3&&contractType!=4" class="span-title">保底营业额:</el-col> | |||
| <el-col :span="18" v-if="wxRentContract.type==2&&contractType!=3&&contractType!=4" class="span-text">{{wxRentContract.revenue/100+'元'}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">租金单价:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.rentPrice+' ㎡/元/'+priceUnitType}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" v-if="wxRentContract.type!=2" class="span-title">租金</el-col> | |||
| <el-col :span="18" v-if="wxRentContract.type!=2" class="span-text">{{wxRentContract.price/100+' 元/'+priceUnitType}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" v-if="wxRentContract.type!=1&&contractType!=3&&contractType!=4" class="span-title">联营扣点:</el-col> | |||
| <el-col :span="18" v-if="wxRentContract.type!=1&&contractType!=3&&contractType!=4 && wxRentContract.busDiscountRatio!=undefined &&wxRentContract.busDiscountRatio!=''" class="span-text"> | |||
| <!-- aaa --> | |||
| <show-rate-list class="cur-rate-list"></show-rate-list> | |||
| </el-col> | |||
| <el-col :span="18" v-if="wxRentContract.type!=1&&contractType!=3&&contractType!=4 && wxRentContract.busDiscountRatio!=undefined &&wxRentContract.busDiscountRatio==''" class="span-text">{{wxRentContract.payRatio/100+'%'}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">押金:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.deposit/100+' 元'}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">付款周期:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.receivePeriod+' 月'}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.latePayRatio"> | |||
| <el-col :span="3" class="span-title">滞纳金费率:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.latePayRatio+ '%'}}<span style="margin-left:30px;">{{'欠缴后 '+wxRentContract.latePayDay+' 日开始计费'}}</span></el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.adjustRatio&&wxRentContract.adjustRatio.length>0"> | |||
| <el-col :span="3" class="span-title"> | |||
| 年租金调整: | |||
| </el-col> | |||
| <el-col v-if="wxRentContract.adjustRatioWay==1" :span="18" class="span-text"><span v-for="(item,index) in wxRentContract.adjustRatio" :key='index'>{{"第"+(index+2)+"年上浮"+item/100+'%'+(wxRentContract.adjustRatio.length>1&&wxRentContract.adjustRatio.length>index+1?', ':'')}}</span></el-col> | |||
| <el-col v-else :span="18" class="span-text"> | |||
| <span v-for="(item,index) in wxRentContract.adjustRatio" :key='index'> | |||
| {{"第"+(index+2)+"年上浮"+item/100+'元/'+priceUnitType+(wxRentContract.adjustRatio.length>1&&wxRentContract.adjustRatio.length>index+1?', ':'')}} | |||
| </span> | |||
| </el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">租金账单</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title"></el-col> | |||
| <el-col :span="18" class="span-text"> | |||
| <rent-bill :data="billData" :editIf='true' :ref="billTk"></rent-bill> | |||
| </el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">物业信息</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">计租面积:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.rentArea+'㎡'}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">物业费单价:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxPropertyContract.rentPrice/100+' ㎡/元/'+priceUnitType02}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" v-if="wxPropertyContract.type!=2" class="span-title">物业费</el-col> | |||
| <el-col :span="18" v-if="wxPropertyContract.type!=2" class="span-text">{{wxPropertyContract.price/100+' 元/'+priceUnitType02}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">物业押金:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxPropertyContract.deposit/100+' 元'}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">付款周期:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxPropertyContract.receivePeriod+' 月'}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxPropertyContract.latePayRatio"> | |||
| <el-col :span="3" class="span-title">滞纳金费率:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxPropertyContract.latePayRatio+ '%'}}<span style="margin-left:30px;">{{'欠缴后 '+wxPropertyContract.latePayDay+' 日开始计费'}}</span></el-col> | |||
| </el-row> | |||
| <el-row | |||
| v-if="wxPropertyContract.adjustRatio&&wxPropertyContract.adjustRatio.length>0" | |||
| > | |||
| <el-col :span="3" class="span-title">年物业费调整:</el-col> | |||
| <el-col :span="18" class="span-text"> | |||
| <div>{{getPricePer03(wxPropertyContract.adjustRatio)}}</div> | |||
| </el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">物业费账单</div> | |||
| <div class="text-box-content"> | |||
| <el-row > | |||
| <el-col :span="20" class="span-text"> | |||
| <rent-bill :data="billData" :editIf='true' :ref="billTk02"></rent-bill> | |||
| </el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同附件:</el-col> | |||
| <el-col :span="6" class="span-text" style="color:blue;" v-if="fileNames.length<=0">无</el-col> | |||
| <el-col :span="6" class="span-text" style="color:blue;" v-if="fileNames.length>0"><div class="download-file" v-for="(item,index) in fileNames" :key="index" @click.stop.prevent="download(index)">{{item.name}}</div></el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <el-row style="margin:20px 0 0;text-align:center;"> | |||
| <el-button @click.stop.prevent="cancel">返回</el-button> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import commonUtil from "../../../core/tool/commonUtil"; | |||
| import AjaxUtil from "../../../core/tool/ajaxService"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import { ContractUrl } from "../../contract/businessComp/UrlEnum.js"; | |||
| import { CouponCacheData } from "../../../service/couponData/data.js"; | |||
| import rentBill from "../../contract/contractutil/rentbill.vue"; | |||
| import { ContractData } from "../../../service/contract/data.js"; | |||
| import rentShop from "./../contractutil/rentshop.vue"; | |||
| import showRateList from "../rent/showRateList.vue"; | |||
| import moment from "moment"; | |||
| export default { | |||
| name: "pointLeaseCheck", | |||
| components: { | |||
| rentBill, | |||
| rentShop, | |||
| showRateList | |||
| }, | |||
| data() { | |||
| return { | |||
| brands: [], | |||
| merchentEditIf: true, | |||
| priceUnitType: "", | |||
| priceUnitType02: "", | |||
| fromAddTask:"", | |||
| priceUnitOption: ContractData.priceUnitOption, | |||
| totalPeriodMonth: 0, | |||
| totalPeriodDay: 0, | |||
| contractType: 0, | |||
| remark: "", | |||
| wxShops: [], | |||
| billData: [], | |||
| billTk: "rentbill", | |||
| billTk02: "rentbill02", | |||
| wxRentContract: "", | |||
| rentOweCount: "", | |||
| propertyOweCount: "", | |||
| depositOweCount: "", | |||
| sRemark: "", | |||
| wxMerchant: "", | |||
| businessIds: [], | |||
| progressData: [], | |||
| fileNames: [], | |||
| active: 0, | |||
| // 店铺类型 | |||
| shopTypes: ContractData.shopTypes, | |||
| //计租计算方式 | |||
| computedTypes: ContractData.computedTypes, | |||
| // 物业账单调整 | |||
| wxPropertyContract: { | |||
| adjustRatioWay: "1", //年物业费调整方式1、比例上调2、按固定上调 | |||
| rentStartType: 1, | |||
| rentShopType: 2, | |||
| signDate: "", //合同签约日 | |||
| rentalStartDate: "", //计租开始日期 | |||
| startDate: "", //起租日 | |||
| brand: "", //商铺经营品牌 | |||
| merchantName: "", //商户名称 | |||
| merchantId: "", //商户id | |||
| contractNumber: "", //合同编号 | |||
| status: "", //合同状态 | |||
| linkPerson: "", //联系人 | |||
| linkPhone: "", //联系人电话 | |||
| rentArea: "", //计租面积 | |||
| shopType: "", //店铺类型 | |||
| zuqi: "", //计租日期 | |||
| price: "", //租金 | |||
| deposit: "", //押金 | |||
| receivePeriod: 0, //付款周期 | |||
| payAccount: "", //支付账号 | |||
| payDate: "", //支付规则 | |||
| shopId: "", //商铺id | |||
| filepath: "", //文件路径 | |||
| filename: "", //文件名称 | |||
| merchantId: "", //商户id | |||
| businessId: "", //经营业态 | |||
| adjustRatio: "", //上浮比例 | |||
| adjustPeriod: "2", | |||
| id: "" | |||
| } | |||
| }; | |||
| }, | |||
| //新增computed属性 | |||
| computed: { | |||
| ...mapState({ | |||
| topNav: state => state.topNav.data, //将 this.topNav 映射为 this.$store.topNav.data | |||
| navigationInfo: state => state.topNav.navigationInfo, | |||
| formData: state => state.setRentInfo.formData | |||
| }), | |||
| getAdjustPeriod() { | |||
| return this.wxRentContract.adjustPeriod == 3 | |||
| ? "按自然月生成" | |||
| : "按计租日期"; | |||
| } | |||
| }, | |||
| methods: { | |||
| cStatus(item) { | |||
| return item != undefined | |||
| ? CouponCacheData.rentStatus.filter(e => { | |||
| return e.value == item.toString(); | |||
| })[0].name | |||
| : ""; | |||
| }, | |||
| changeBrand(brand) { | |||
| return this.brands.length > 0 && brand | |||
| ? this.brands.filter(e => e.id == brand)[0].value | |||
| : ""; | |||
| }, | |||
| changeBusiness(businessId) { | |||
| return this.businessIds.length > 0 && businessId != undefined | |||
| ? this.businessIds.filter(e => e.id == businessId)[0].title | |||
| : ""; | |||
| }, | |||
| changeShopType(id) { | |||
| return id != undefined | |||
| ? this.shopTypes.filter(e => e.value == id)[0].label | |||
| : ""; | |||
| }, | |||
| getPricePer02(items, indexs) { | |||
| let str = ""; | |||
| if ( | |||
| this.wxRentContract.adjustRatioWay == 1 || | |||
| this.wxPropertyContract.adjustRatioWay == 1 | |||
| ) { | |||
| items != undefined | |||
| ? items.map((item, index) => { | |||
| str = | |||
| index != 0 | |||
| ? str + ",第" + (index + 2) + "年上浮" + item + "%" | |||
| : str + "第" + (index + 2) + "年上浮" + item + "%"; | |||
| }) | |||
| : ""; | |||
| } else if ( | |||
| this.wxRentContract.adjustRatioWay == 2 || | |||
| this.wxPropertyContract.adjustRatioWay == 2 | |||
| ) { | |||
| items != undefined | |||
| ? items.map((item, index) => { | |||
| str = | |||
| index != 0 | |||
| ? str + | |||
| ",第" + | |||
| (index + 2) + | |||
| "年上浮" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType | |||
| : str + | |||
| "第" + | |||
| (index + 2) + | |||
| "年上浮" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType; | |||
| }) | |||
| : ""; | |||
| } else { | |||
| items != undefined | |||
| ? items.map((item, index) => { | |||
| str = | |||
| index != 0 | |||
| ? str + | |||
| ",第" + | |||
| (index + 2) + | |||
| "年" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType | |||
| : str + | |||
| "第" + | |||
| (index + 2) + | |||
| "年" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType; | |||
| }) | |||
| : ""; | |||
| } | |||
| return str; | |||
| }, | |||
| getPricePer03(items, indexs) { | |||
| let str = ""; | |||
| if (this.wxPropertyContract.adjustRatioWay == 1) { | |||
| items != undefined | |||
| ? items.map((item, index) => { | |||
| str = | |||
| index != 0 | |||
| ? str + ",第" + (index + 2) + "年上浮" + item + "%" | |||
| : str + "第" + (index + 2) + "年上浮" + item + "%"; | |||
| }) | |||
| : ""; | |||
| } else if (this.wxPropertyContract.adjustRatioWay == 2) { | |||
| items != undefined | |||
| ? items.map((item, index) => { | |||
| str = | |||
| index != 0 | |||
| ? str + | |||
| ",第" + | |||
| (index + 2) + | |||
| "年上浮" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType02 | |||
| : str + | |||
| "第" + | |||
| (index + 2) + | |||
| "年上浮" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType02; | |||
| }) | |||
| : ""; | |||
| } else { | |||
| items != undefined | |||
| ? items.map((item, index) => { | |||
| str = | |||
| index != 0 | |||
| ? str + | |||
| ",第" + | |||
| (index + 2) + | |||
| "年" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType02 | |||
| : str + | |||
| "第" + | |||
| (index + 2) + | |||
| "年" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType02; | |||
| }) | |||
| : ""; | |||
| } | |||
| return str; | |||
| }, | |||
| changeDate(date) { | |||
| return moment(date).format("YYYY-MM-DD"); | |||
| }, | |||
| changeType(type) { | |||
| return type != undefined | |||
| ? this.computedTypes.filter(e => e.value == type)[0].label | |||
| : ""; | |||
| }, | |||
| ...mapActions([ | |||
| "setFormData", | |||
| "setNavData" // 将this.setNavData 映射为 this.$store.dispatch('setNavData') | |||
| ]), | |||
| download: function(index) { | |||
| window.open(this.fileNames[index].url); | |||
| }, | |||
| cancel() { | |||
| this.$router.back(-1); | |||
| }, | |||
| getData() { | |||
| let _this = this; | |||
| this.contractType = this.$route.query.contractType; | |||
| // if(this.$route.query.contractType==3||this.$route.query.contractType==4){ | |||
| // this.getFetch( | |||
| // "/api/wxRentPropertyContract/findById?id=" + this.$route.query.id | |||
| // ).then(d => { | |||
| // if(d.data&&d.data.property){ | |||
| // this.wxPropertyContract = Object.assign(this.wxPropertyContract, d.data.property); | |||
| // _this.$refs[_this.billTk02].setData(d.data.property.previewBillRentList); | |||
| // } | |||
| // if(d.data&&d.data.rent){ | |||
| // debugger | |||
| // d.data.rent.wxPropertyContract.adjustRatio=d.data.rent.wxPropertyContract.adjustRatio?JSON.parse(d.data.rent.wxPropertyContract.adjustRatio):''; | |||
| // debugger | |||
| // _this.wxRentContract=d.data.wxPropertyContract; | |||
| // _this.wxRentContract.fixStartDate=_this.wxRentContract.fixStartDate?moment(_this.wxRentContract.fixStartDate).format('YYYY-MM-DD'):"" | |||
| // _this.wxRentContract.fixEndDate=_this.wxRentContract.fixEndDate?moment(_this.wxRentContract.fixEndDate).format('YYYY-MM-DD'):"" | |||
| // this.priceUnitType = this.wxRentContract.priceUnit?this.priceUnitOption.filter(e=>e.value==this.wxRentContract.priceUnit)[0].name:''; | |||
| // _this.totalPeriodMonth = d.data.rent.totalPeriodMonth | |||
| // _this.totalPeriodDay = d.data.rent.totalPeriodDay | |||
| // _this.fileNames = JSON.parse(d.data.rent.wxPropertyContract.fileNames); | |||
| // _this.wxShops=d.data.rent.wxShops | |||
| // _this.$refs[_this.billTk].setData(d.data.rent.previewBillRentList); | |||
| // } | |||
| // }); | |||
| // } | |||
| this.getFetch( | |||
| "/api/wxRentPropertyContract/findById?id=" + this.$route.query.id | |||
| ).then(d => { | |||
| if (d.data && d.data.property) { | |||
| this.wxPropertyContract = d.data.property; | |||
| this.wxPropertyContract = Object.assign( | |||
| this.wxPropertyContract, | |||
| d.data.property | |||
| ); | |||
| this.$refs[this.billTk02].setData( | |||
| d.data.property.previewBillRentList | |||
| ); | |||
| this.fileNames = JSON.parse(d.data.property.fileNames); | |||
| let adjustRatio02 = []; | |||
| JSON.parse(d.data.property.adjustRatio).map((item, index) => { | |||
| let a = item / 100; | |||
| adjustRatio02.push(a); | |||
| }); | |||
| this.wxPropertyContract.adjustRatio = adjustRatio02; | |||
| this.priceUnitType02 = this.wxPropertyContract.priceUnit | |||
| ? this.priceUnitOption.filter( | |||
| e => e.value == this.wxPropertyContract.priceUnit | |||
| )[0].name | |||
| : ""; | |||
| } | |||
| if (d.data && d.data.rent) { | |||
| d.data.rent.wxRentContract.adjustRatio = d.data.rent.wxRentContract | |||
| .adjustRatio | |||
| ? JSON.parse(d.data.rent.wxRentContract.adjustRatio) | |||
| : ""; | |||
| _this.wxRentContract = d.data.rent.wxRentContract; | |||
| _this.wxRentContract.fixStartDate = _this.wxRentContract.fixStartDate | |||
| ? moment(_this.wxRentContract.fixStartDate).format("YYYY-MM-DD") | |||
| : ""; | |||
| _this.wxRentContract.fixEndDate = _this.wxRentContract.fixEndDate | |||
| ? moment(_this.wxRentContract.fixEndDate).format("YYYY-MM-DD") | |||
| : ""; | |||
| this.priceUnitType = this.wxRentContract.priceUnit | |||
| ? this.priceUnitOption.filter( | |||
| e => e.value == this.wxRentContract.priceUnit | |||
| )[0].name | |||
| : ""; | |||
| _this.totalPeriodMonth = d.data.rent.totalPeriodMonth; | |||
| _this.totalPeriodDay = d.data.rent.totalPeriodDay; | |||
| // _this.fileNames = JSON.parse(d.data.rent.wxRentContract.fileNames); | |||
| _this.wxShops = d.data.rent.wxShops; | |||
| _this.$refs[_this.billTk].setData(d.data.rent.previewBillRentList); | |||
| //aaa | |||
| if ( | |||
| d.data.rent.wxRentContract.busDiscountRatio == undefined || | |||
| d.data.rent.wxRentContract.busDiscountTime == undefined | |||
| ) { | |||
| d.data.rent.wxRentContract.busDiscountRatio = ""; | |||
| d.data.rent.wxRentContract.busDiscountTime = 1; | |||
| } | |||
| let curObj = Object.assign({}, this.formData); | |||
| curObj.busDiscountRatio = d.data.rent.wxRentContract.busDiscountRatio; | |||
| curObj.busDiscountTime = d.data.rent.wxRentContract.busDiscountTime; | |||
| curObj.payRatio = d.data.rent.wxRentContract.payRatio; | |||
| this.setFormData(curObj); | |||
| } | |||
| }); | |||
| this.getFetch( | |||
| "/api/workflow/applyHistoryAndAssignee?businessId=" + | |||
| this.$route.query.id | |||
| ).then(d => { | |||
| let progressData = d.data; | |||
| progressData = d.data; | |||
| progressData.reverse(); | |||
| let indexs = 0; | |||
| _this.progressData = []; | |||
| progressData.map((item, index) => { | |||
| if (item.isLastStart) { | |||
| indexs = index; | |||
| } | |||
| }); | |||
| progressData.map((item, index) => { | |||
| if (index >= indexs) { | |||
| _this.progressData.push(item); | |||
| } | |||
| }); | |||
| _this.progressData.map((item, index) => { | |||
| if (item.status == 1) { | |||
| item.userName = item.userName + "( 发起审批)"; | |||
| } else if (item.status == 2) { | |||
| item.userName = item.userName + "( 已审批)"; | |||
| } else if (item.status == 3) { | |||
| item.userName = item.userName + "( 驳回)"; | |||
| } else if (item.status == 4) { | |||
| item.userName = item.userName + "( 待审批)"; | |||
| } | |||
| }); | |||
| for (var i = 1; _this.progressData.length <= 10; i++) { | |||
| if (_this.progressData[i].status == 4) { | |||
| _this.active = i; | |||
| break; | |||
| } | |||
| } | |||
| }); | |||
| } | |||
| }, | |||
| mounted: function() { | |||
| // this.getFetch("/api/at/list?describe=") | |||
| commonUtil.pvuv.setPVUV.apply(this, []); | |||
| }, | |||
| created() { | |||
| // this.reload() | |||
| if (this.$route.query.contractType == 2) { | |||
| this.setNavData(["合同管理", "多经点位", "租金合同", "查看"]); | |||
| } else { | |||
| this.setNavData(["合同管理", "多经点位", "物业合同", "查看"]); | |||
| } | |||
| this.getData(); | |||
| if(this.$route.query.flags){ | |||
| this.fromAddTask = this.$route.query.flags; | |||
| this.setNavData(["招商管理", "多经点位", "租金合同", "查看"]); | |||
| } | |||
| //获取品牌列表 | |||
| this.getFetch("/api/wxBrand/queryBrand") | |||
| .then(d => { | |||
| this.brands = d.data; | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| this.getFetch(ContractUrl.businessList) | |||
| .then(d => { | |||
| this.businessIds = d.data; | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| } | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| .text-box { | |||
| background: #fff; | |||
| margin-bottom: 20px; | |||
| } | |||
| .download-file { | |||
| cursor: pointer; | |||
| } | |||
| .text-box-title { | |||
| height: 42px; | |||
| line-height: 42px; | |||
| padding-left: 20px; | |||
| color: #fff; | |||
| font-weight: 400px; | |||
| font-size: 14px; | |||
| background: rgba(51, 153, 255, 1); | |||
| } | |||
| .text-box-content { | |||
| padding: 20px; | |||
| line-height: 36px; | |||
| font-size: 12px; | |||
| } | |||
| .span-title { | |||
| text-align: right; | |||
| padding-right: 15px; | |||
| } | |||
| .layout-content { | |||
| width: 100%; | |||
| height: auto; | |||
| min-height: 300px; | |||
| background: #141e29; | |||
| border-radius: 2px; | |||
| padding: 0 20px 20px 20px; | |||
| overflow: hidden; | |||
| text-align: left; | |||
| } | |||
| .el-form { | |||
| background: #f5f7f8; | |||
| text-align: left; | |||
| padding: 25px 22px 22px; | |||
| margin-bottom: 20px !important; | |||
| } | |||
| .el-form .el-form-item { | |||
| margin-bottom: 0 !important; | |||
| /* width: 200px; */ | |||
| } | |||
| /* .el-select{ | |||
| width:120px; | |||
| } */ | |||
| .tableContainer { | |||
| margin-top: 20px !important; | |||
| background: #fff; | |||
| } | |||
| .el-button { | |||
| /* width: 60px; */ | |||
| border: none !important; | |||
| margin: 0 10px; | |||
| height: 40px; | |||
| } | |||
| .builtBtn { | |||
| width: 100px; | |||
| height: 32px; | |||
| background: rgba(81, 169, 201, 1); | |||
| border: 0 !important; | |||
| line-height: 32px; | |||
| text-align: center; | |||
| margin: 0; | |||
| padding: 0 !important; | |||
| } | |||
| .builtBtn:hover { | |||
| background: rgba(81, 169, 201, 0.88); | |||
| } | |||
| .builtBtn i { | |||
| margin-right: 10px; | |||
| } | |||
| .fx_send .el-form-item__content .el-select { | |||
| width: 120px !important; | |||
| } | |||
| .fx_title .el-input { | |||
| width: 150px; | |||
| } | |||
| .approval-list .span-title { | |||
| padding-right: 0; | |||
| } | |||
| .cur-rate-list /deep/ .rate-show-list li { | |||
| margin-top: 6px; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,572 @@ | |||
| <template> | |||
| <div> | |||
| <div class="layout-content"> | |||
| <el-form | |||
| :inline="true" | |||
| :model="ruleForm" | |||
| ref="ruleForm" | |||
| class="demo-form-inline" | |||
| label-position="right" | |||
| > | |||
| <el-form-item label="商铺号" prop="name" class="fx_title"> | |||
| <el-input v-model.trim="ruleForm.shopNumber" placeholder="请输入" clearable></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="商户名称" prop="merchantName" class="fx_title"> | |||
| <el-input v-model.trim="ruleForm.merchantName" placeholder="请输入" clearable></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="合同状态" class="fx_send"> | |||
| <el-select v-model="ruleForm.status" placeholder="请选择" clearable class="select-method"> | |||
| <el-option | |||
| v-for="(item,index) in options" | |||
| :key="index" | |||
| :value="item.value" | |||
| :label="item.label" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="审批状态" class="fx_send"> | |||
| <el-select v-model="ruleForm.applyStatus" placeholder="请选择" clearable class="select-method"> | |||
| <el-option | |||
| v-for="(item,index) in applyStatusOptions" | |||
| :key="index" | |||
| :value="item.value" | |||
| :label="item.name" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="计租方式" class="fx_send"> | |||
| <el-select v-model="ruleForm.type" placeholder="请选择" clearable class="select-method"> | |||
| <el-option | |||
| v-for="(item,index) in types" | |||
| :key="index" | |||
| :value="item.value" | |||
| :label="item.label" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item> | |||
| <el-button | |||
| class="hoverBtn" | |||
| type="primary" | |||
| icon="el-icon-search" | |||
| :style="'border:0;background:'+navigationInfo.moduleColor" | |||
| size="medium" | |||
| @click="search" | |||
| ></el-button> | |||
| </el-form-item> | |||
| </el-form> | |||
| <el-button type="primary" class="builtBtn" @click="goSave" style="margin-right:4px;"> | |||
| <i>+</i>新建 | |||
| </el-button> | |||
| <el-button type="primary" class="builtBtn" @click="goBulu" style="margin-left:4px;"> | |||
| <i>+</i>补录 | |||
| </el-button> | |||
| <el-button type="primary" class="builtBtn" @click="goRenew" style="margin-left:4px;"> | |||
| <i>+</i>续签 | |||
| </el-button> | |||
| <table-list :ref="tk" :options="optionsTable"></table-list> | |||
| <!-- <stop-contract :ref="st" :options="stopOptions"></stop-contract> --> | |||
| <stop-contract :ref="st" :type='20' :processData="processData" :options="stopOptions"></stop-contract> | |||
| </div> | |||
| <div> | |||
| <el-dialog | |||
| title="提示" | |||
| :visible.sync="dialogVisible" | |||
| width="40%" | |||
| :modal-append-to-body="false" | |||
| :before-close="handleClose" | |||
| > | |||
| <span>当前有欠缴账单未结清,是否要继续终止合同?</span> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button @click="dialogVisible = false">取 消</el-button> | |||
| <el-button type="primary" @click="stopContract">确定</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import TableList from "../../../core/comps/table/tableList.vue"; | |||
| import StopContract from "../contractutil/stopcontract.vue"; | |||
| import commonUtil from "../../../core/tool/commonUtil"; | |||
| import AjaxUtil from "../../../core/tool/ajaxService"; | |||
| import reportTool from "../../../core/tool/report.js"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import { CouponCacheData } from "../../../service/couponData/data.js"; | |||
| import { ContractData } from "../../../service/contract/data.js"; | |||
| import { promissionUrl } from "../../../urlconfig/promission/url.js"; | |||
| import { ContractUrl } from "../businessComp/UrlEnum.js"; | |||
| let echarts = require("echarts"); | |||
| export default { | |||
| inject: ["reload"], | |||
| extends: AjaxUtil, | |||
| name: "pointrentlist", | |||
| components: { | |||
| TableList, | |||
| StopContract | |||
| }, | |||
| data() { | |||
| return { | |||
| processData:[], | |||
| waitSignCount: "", //待签约 | |||
| endSoonCount: "", //将到期合同 | |||
| dialogVisible: false, | |||
| rendPaidCount: "", //计租中合同 | |||
| shopcount: "", //空余商铺 | |||
| tk: "manjianTableKey", | |||
| st: "stopContract", | |||
| stopOptions: { | |||
| contractType: "6" | |||
| }, | |||
| buildingArr: [], | |||
| floorArr: [], | |||
| applyStatusOptions:ContractData.applyStatus, | |||
| ruleForm: { | |||
| building: "", | |||
| buildingId: "", | |||
| floor: "", | |||
| floorId: "", | |||
| shopNumber: "", | |||
| merchantName: "", | |||
| status: "", | |||
| type: "", | |||
| applyStatus:"" | |||
| }, | |||
| options: ContractData.statusOptions, | |||
| types: [ | |||
| { | |||
| value: "1", | |||
| label: "按租赁面积" | |||
| }, | |||
| { | |||
| value: "2", | |||
| label: "联营扣点" | |||
| }, | |||
| { | |||
| value: 3, | |||
| label: "面积计租、联营取高" | |||
| } | |||
| ], | |||
| optionsTable: { | |||
| actions: [ | |||
| { | |||
| key: "edit", | |||
| val: "编辑", | |||
| action: this.aCount, | |||
| show: item => { | |||
| return item.status == 0 || | |||
| ((item.status == 1 || item.status == 8) && | |||
| // ((item.applyStatus == 0 && item.merchantId) || | |||
| ( item.applyStatus == 0 || | |||
| item.applyStatus == 3 || | |||
| item.applyStatus == 5)) | |||
| ? true | |||
| : false; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "终止", | |||
| action: this.endcontract, | |||
| show: item => { | |||
| if ( | |||
| (item.status == 2 || item.status == 3 || item.status == 4) && | |||
| item.applyStatus != 1 | |||
| ) { | |||
| return true; | |||
| } else { | |||
| return false; | |||
| } | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "查看", | |||
| action: this.goCheck, | |||
| show: item => { | |||
| return true; | |||
| } | |||
| }, | |||
| { | |||
| key: "download", | |||
| val: "下载", | |||
| action: this.goDownload, | |||
| show: item => { | |||
| return true; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "审批进度", | |||
| action: this.checkCurrentStatus, | |||
| show: item => { | |||
| return item.applyStatus == 1 || | |||
| item.applyStatus == 2 || | |||
| item.applyStatus == 3 | |||
| ? true | |||
| : false; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "绑定商户", | |||
| action: this.goToEditShop, | |||
| show: item => { | |||
| return (item.applyStatus == 2||(item.applyStatus == 0 && !item.merchantId)) && item.propertyStatus == 1 &&item.status == 1 ? true : false; | |||
| } | |||
| } | |||
| ], | |||
| showCk: false, | |||
| map: [ | |||
| { | |||
| key: "contractNumber", | |||
| val: "合同编号" | |||
| }, | |||
| { | |||
| key: "shopNumber", | |||
| val: "商铺号", | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "merchantName", | |||
| val: "商户名称" | |||
| }, | |||
| { | |||
| key: "rentalStartDate", | |||
| val: "租赁开始日期", | |||
| type: "date", | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "rentalEndDate", | |||
| val: "租赁结束日期", | |||
| type: "date", | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "rentPrice", | |||
| val: "租金", | |||
| convert: this.divide, | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "propertyPrice", | |||
| val: "物业费", | |||
| convert: this.divide1, | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "type", | |||
| val: "计租方式", | |||
| convert: this.ctype | |||
| }, | |||
| { | |||
| key: "status", | |||
| val: "合同状态", | |||
| convert: this.cStatus | |||
| }, | |||
| { | |||
| key: "applyStatus", | |||
| val: "审批状态", | |||
| convert: this.cApplyStatus | |||
| } | |||
| ], | |||
| getUrl: () => { | |||
| return ( | |||
| "/api/wxRentPropertyContract/list?merchantName=" + | |||
| this.ruleForm.merchantName + | |||
| "&shopNumber=" + | |||
| this.ruleForm.shopNumber + | |||
| "&status=" + | |||
| this.ruleForm.status + | |||
| "&type=" + | |||
| this.ruleForm.type + | |||
| "&applyStatus=" + | |||
| this.ruleForm.applyStatus+ | |||
| "&rentShopType=2"+ | |||
| "&operationType=2" | |||
| ); | |||
| }, | |||
| pageOption: { | |||
| sizeKey: "pageSize", | |||
| indexKey: "pageNum", | |||
| index: 1, | |||
| size: 10 | |||
| }, | |||
| analysis: data => { | |||
| return { | |||
| data: data.data.list, | |||
| count: data.data.total | |||
| }; | |||
| } | |||
| } | |||
| }; | |||
| }, | |||
| computed: { | |||
| ...mapState({ | |||
| navigationInfo: state => state.topNav.navigationInfo | |||
| }) | |||
| }, | |||
| methods: { | |||
| ...mapActions([ | |||
| "setNavData" // 将this.setNavData 映射为 this.$store.dispatch('setNavData') | |||
| ]), | |||
| changeBuilding: function(item) { | |||
| for (let building of this.buildingArr) { | |||
| if (item == building.id) { | |||
| this.floorArr = building.floors; | |||
| } | |||
| } | |||
| this.ruleForm.floor = ""; | |||
| //this.search() | |||
| }, | |||
| getBuilding: function() { | |||
| this.getFetch("/api/wxMallBuilding/getbuildingfloorlist").then(d => { | |||
| this.buildingArr = d.data; | |||
| }); | |||
| }, | |||
| cApplyStatus(col, item) { | |||
| if (item.applyStatus) { | |||
| return ( | |||
| (item.businessType != 20 ? "签约" : "终止") + | |||
| ContractData.applyStatus.filter(e => e.value == item.applyStatus)[0] | |||
| .name | |||
| ); | |||
| } else if (item.applyStatus === 0) { | |||
| return "未提交审核"; | |||
| } | |||
| }, | |||
| goToEditShop(item) { | |||
| this.$router.push({ | |||
| path: "/pointsMerchant/pointmerchantAdd?contractId=" + item.id | |||
| }); | |||
| }, | |||
| checkCurrentStatus(item, row) { | |||
| this.$router.push({ | |||
| path: "rentApprovals?id=" + item.id | |||
| }); | |||
| }, | |||
| cStatus(col, item) { | |||
| return CouponCacheData.rentStatus.filter(e => { | |||
| return e.value == item.status.toString(); | |||
| })[0].name; | |||
| }, | |||
| divide(col, item) { | |||
| //aaa | |||
| if (item.busDiscountRatio != undefined && item.busDiscountTime != 0 && item.busDiscountRatio !='') { | |||
| return Number(item.rentPrice) / 100 +(item.busDiscountTime==1?'元/年':item.busDiscountTime==2?'元/月':'元/周期'); | |||
| } else { | |||
| return Number(item.rentPrice) / 100 +(item.rentPriceUnit==1?'元/日':item.rentPriceUnit==2?'元/月':'元/年'); | |||
| } | |||
| }, | |||
| divide1(col, item) { | |||
| return item.propertyPrice?Number(item.propertyPrice) / 100 +(item.propertyPriceUnit==1?'元/日':item.propertyPriceUnit==2?'元/月':'元/年'):'暂未设置'; | |||
| }, | |||
| ctype(col, item) { | |||
| if (item.type == 1) { | |||
| return "按租赁面积"; | |||
| } else if (item.type == 2) { | |||
| return "联营扣点"; | |||
| } else { | |||
| return "面积计租、联营取高"; | |||
| } | |||
| }, | |||
| aCount: function(item, row) { | |||
| if (item.merchantId) { | |||
| this.$router.push({ | |||
| path: "pointLeaseBulu?id=" + item.id | |||
| }); | |||
| } else { | |||
| this.$router.push({ | |||
| path: "pointLeaseEdit?id=" + item.id | |||
| }); | |||
| } | |||
| }, | |||
| goCheck: function(item, row) { | |||
| /** | |||
| contractType合同类型:1租金+物业合同,2多经合同,3物业合同,4多经物业合同 | |||
| businessType操作类型:1合同审批,2账单审批,3终止合同审批 | |||
| id为合同id | |||
| */ | |||
| this.$router.push({ | |||
| path: `/pointLeaseCheck?id=${item.id}&contractType=6&businessType=1` | |||
| }); | |||
| }, | |||
| handleClose(done) { | |||
| this.$confirm("确认关闭?") | |||
| .then(_ => { | |||
| done(); | |||
| }) | |||
| .catch(_ => {}); | |||
| }, | |||
| endcontract: function(item, row) { | |||
| let that = this; | |||
| this.getFetch("/api/wxBillAll/oweBillCount?type=1&contractId=" + item.id) | |||
| .then(d => { | |||
| that.contractId = item.id; | |||
| that.contractNumber = item.contractNumber; | |||
| if (Number(d.data) > 0) { | |||
| that.dialogVisible = true; | |||
| } else { | |||
| if(this.processData.length>0){ | |||
| this.dialogVisible = false; | |||
| this.$refs[this.st].showLog(item.id, item.contractNumber); | |||
| }else{ | |||
| this.makeSure(); | |||
| } | |||
| } | |||
| }) | |||
| .catch(err => { | |||
| this.$message.success(err.data); | |||
| }); | |||
| }, | |||
| makeSure(){ | |||
| this.$confirm('您确定要提前终止此合同吗?', '提示', { | |||
| confirmButtonText: '确定', | |||
| cancelButtonText: '取消', | |||
| type: 'warning' | |||
| }).then(() => { | |||
| this.endProperty(); | |||
| }).catch(() => { | |||
| this.$message({ | |||
| type: 'info', | |||
| message: '已取消删除' | |||
| }); | |||
| }); | |||
| }, | |||
| endProperty(){ | |||
| let _this=this; | |||
| let param={ | |||
| id:this.contractId, | |||
| endProperty:2 | |||
| } | |||
| this.postFetch(ContractUrl.endContract, param) | |||
| .then(d => { | |||
| _this.$message.success("操作成功"); | |||
| _this.dialogVisible = false; | |||
| _this.search(); | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| }, | |||
| stopContract() { | |||
| let _this=this; | |||
| if(this.processData.length>0){ | |||
| this.dialogVisible = false; | |||
| this.$refs[this.st].showLog(this.contractId, this.contractNumber); | |||
| }else{ | |||
| this.endProperty(); | |||
| } | |||
| }, | |||
| goSave: function() { | |||
| this.$router.push({ | |||
| path: "/pointLeaseEdit" | |||
| }); | |||
| }, | |||
| goBulu: function() { | |||
| this.$router.push({ | |||
| path: "/pointLeaseBulu" | |||
| }); | |||
| }, | |||
| goRenew(){ | |||
| this.$router.push({ | |||
| path: "/pointLeaseEdit", | |||
| query:{ | |||
| Renew:true | |||
| } | |||
| }); | |||
| }, | |||
| goDownload: function(item) { | |||
| location.href = "/api/wxRentContract/exportContract?id=" + item.id; | |||
| }, | |||
| search: function() { | |||
| let tk = this.$refs[this.tk]; | |||
| tk.search(tk.getParams().index); | |||
| }, | |||
| /** | |||
| * 根据业务查询模板 | |||
| */ | |||
| getModelBybusiness(){ | |||
| this.getFetch(`${promissionUrl.getModelBybusiness}?flowType=20`) | |||
| .then(d=>{ | |||
| if(d.data.length>0){ | |||
| this.processData = JSON.parse(d.data[0].flow).lists; | |||
| } | |||
| }) | |||
| .catch(err=>{ | |||
| this.$message.error(err.data); | |||
| }) | |||
| } | |||
| }, | |||
| created(){ | |||
| this.setNavData(["合同管理", "多经点位", "租金+物业合同"]); | |||
| }, | |||
| activated(){ | |||
| this.search() | |||
| this.setNavData(["合同管理", "多经点位", "租金+物业合同"]); | |||
| this.getBuilding(); | |||
| this.getModelBybusiness() | |||
| } | |||
| }; | |||
| </script> | |||
| <!-- Add "scoped" attribute to limit CSS to this component only --> | |||
| <style scoped> | |||
| .layout-content { | |||
| width: 100%; | |||
| background: #141e29; | |||
| height: auto; | |||
| border-radius: 2px; | |||
| min-height: 300px; | |||
| padding: 0 20px 20px 20px; | |||
| overflow: hidden; | |||
| text-align: left; | |||
| } | |||
| .el-form { | |||
| background: #f5f7f8; | |||
| text-align: left; | |||
| padding: 25px 22px 22px; | |||
| margin-bottom: 20px !important; | |||
| } | |||
| .el-form .el-form-item { | |||
| margin-bottom: 0 !important; | |||
| } | |||
| .tableContainer { | |||
| margin-top: 20px !important; | |||
| background: #fff; | |||
| } | |||
| .el-button { | |||
| /* width:60px; */ | |||
| height: 40px; | |||
| } | |||
| .builtBtn { | |||
| width: 80px; | |||
| height: 32px; | |||
| background: rgba(81, 169, 201, 1); | |||
| border: 0 !important; | |||
| line-height: 32px; | |||
| text-align: center; | |||
| margin: 0; | |||
| padding: 0 !important; | |||
| } | |||
| .builtBtn:hover { | |||
| background: rgba(81, 169, 201, 0.88); | |||
| } | |||
| .builtBtn i { | |||
| margin-right: 10px; | |||
| } | |||
| .el-form-item .el-form-item__content, | |||
| .el-form-item .el-form-item__content .el-date-editor, | |||
| .el-form-item .el-form-item__content .el-date-editor .el-input__inner { | |||
| width: 150px; | |||
| } | |||
| /* .fx_send .el-form-item__content .el-select { | |||
| width: 133px !important; | |||
| } */ | |||
| .fx_title .el-input { | |||
| width: 193px; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,187 @@ | |||
| <template> | |||
| <div> | |||
| <div class="layout-content"> | |||
| <div class="text-content"> | |||
| <el-row v-for="(item,index) in applyData" :key="index"> | |||
| <el-col :span="3" class="left"> | |||
| <div class="date">{{changeDate(item.updateDate,0)}}</div> | |||
| <div class="time">{{changeDate(item.updateDate,1)}}</div> | |||
| </el-col> | |||
| <el-col :span="1" class="center"> | |||
| <div class="img" v-if="index!=0"> | |||
| <div class="circle"></div> | |||
| </div> | |||
| <div class="icon-img" v-if="index==0"> | |||
| <i | |||
| :class="'iconfont iconBox '+changeIcon(item.status)" | |||
| style="color:rgba(200, 89, 98, 1);font-size:26px" | |||
| ></i> | |||
| </div> | |||
| <div | |||
| class="line" | |||
| :style="'height:'+(item.remark!=undefined?((((1519-308)*5)/6)/(((bodyWidth-308)*5)/6))*((item.remark.length/70))*32+58:'58')+'px'" | |||
| ></div> | |||
| </el-col> | |||
| <el-col :span="20" class="right"> | |||
| <div | |||
| class="right-title" | |||
| :style="'color:'+(index==0?'rgba(200, 89, 98, 1)':'rgba(51,51,51,1)')" | |||
| >{{changeApplyStatus(item.status)}}</div> | |||
| <div class="right-content">{{item.remark}}</div> | |||
| <div class="right-content">{{'审批人:'+item.userName}}</div> | |||
| </el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import TableList from "../../../core/comps/table/tableList.vue"; | |||
| import moment from "moment"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import { ContractData } from "../../../service/contract/data.js"; | |||
| let echarts = require("echarts"); | |||
| export default { | |||
| inject: ["reload"], | |||
| name: "pointrentApprovals", | |||
| components: { | |||
| TableList, | |||
| bodyWidth: 0 | |||
| }, | |||
| data() { | |||
| return { | |||
| applyData: [] | |||
| }; | |||
| }, | |||
| computed: { | |||
| ...mapState({ | |||
| navigationInfo: state => state.topNav.navigationInfo | |||
| }) | |||
| }, | |||
| methods: { | |||
| ...mapActions([ | |||
| "setNavData" // 将this.setNavData 映射为 this.$store.dispatch('setNavData') | |||
| ]), | |||
| changeIcon(status) { | |||
| return status | |||
| ? ContractData.applyHistoryStatus.filter(e => e.value == status)[0].icon | |||
| : ""; | |||
| }, | |||
| changeDate(date, index) { | |||
| if (index === 0) { | |||
| return moment(date).format("YYYY-MM-DD"); | |||
| } else { | |||
| return moment(date).format("HH:mm:ss"); | |||
| } | |||
| }, | |||
| changeApplyStatus(item) { | |||
| return item | |||
| ? ContractData.applyHistoryStatus.filter(e => e.value == item)[0].name | |||
| : ""; | |||
| }, | |||
| getData() { | |||
| this.getFetch( | |||
| "/api/workflow/applyHistory?businessId=" + this.$route.query.id | |||
| ) | |||
| .then(d => { | |||
| this.applyData = d.data; | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| } | |||
| }, | |||
| mounted() { | |||
| this.setNavData(["合同管理", "审批进度"]); | |||
| }, | |||
| created() { | |||
| this.getData(); | |||
| this.bodyWidth = document.body.offsetWidth; | |||
| } | |||
| }; | |||
| </script> | |||
| <!-- Add "scoped" attribute to limit CSS to this component only --> | |||
| <style scoped> | |||
| .layout-content { | |||
| width: 100%; | |||
| background: #141e29; | |||
| height: auto; | |||
| border-radius: 2px; | |||
| min-height: 300px; | |||
| padding: 0 20px 20px 20px; | |||
| overflow: hidden; | |||
| text-align: left; | |||
| } | |||
| .text-content { | |||
| padding: 30px 0; | |||
| width: 100%; | |||
| height: auto; | |||
| background: #fff; | |||
| } | |||
| .left { | |||
| text-align: right; | |||
| padding-right: 20px; | |||
| } | |||
| .date { | |||
| font-size: 14px; | |||
| font-family: MicrosoftYaHei; | |||
| font-weight: 400; | |||
| color: rgba(153, 153, 153, 1); | |||
| line-height: 32px; | |||
| } | |||
| .time { | |||
| font-size: 14px; | |||
| font-family: MicrosoftYaHei; | |||
| font-weight: 400; | |||
| color: rgba(51, 51, 51, 1); | |||
| line-height: 26px; | |||
| } | |||
| .img { | |||
| width: 26px; | |||
| height: 26px; | |||
| border-radius: 13px; | |||
| border: 1px solid rgba(234, 240, 254, 1); | |||
| box-sizing: border-box; | |||
| margin: 4px auto; | |||
| } | |||
| .icon-img { | |||
| width: 30px; | |||
| height: 30px; | |||
| margin: 4px auto; | |||
| } | |||
| .circle { | |||
| width: 20px; | |||
| height: 20px; | |||
| border-radius: 10px; | |||
| background: rgba(234, 240, 254, 1); | |||
| margin: 2px auto 0; | |||
| box-sizing: border-box; | |||
| } | |||
| .line { | |||
| /* height: 64px; */ | |||
| width: 2px; | |||
| background: rgba(234, 240, 254, 1); | |||
| border-radius: 1px; | |||
| margin: 0 auto; | |||
| box-sizing: border-box; | |||
| } | |||
| .right { | |||
| padding: 0 40px 0 20px; | |||
| } | |||
| .right-title { | |||
| font-size: 18px; | |||
| font-family: MicrosoftYaHei; | |||
| font-weight: 400; | |||
| color: rgba(51, 51, 51, 1); | |||
| line-height: 32px; | |||
| } | |||
| .right-content { | |||
| font-size: 14px; | |||
| font-family: MicrosoftYaHei; | |||
| font-weight: 400; | |||
| color: rgba(153, 153, 153, 1); | |||
| line-height: 26px; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,554 @@ | |||
| <template> | |||
| <div> | |||
| <div class="layout-content"> | |||
| <el-form | |||
| :inline="true" | |||
| :model="ruleForm" | |||
| ref="ruleForm" | |||
| class="demo-form-inline" | |||
| label-position="right" | |||
| > | |||
| <el-form-item label="商铺号" prop="name" class="fx_title"> | |||
| <el-input v-model.trim="ruleForm.shopNumber" placeholder="请输入" clearable></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="商户名称" prop="merchantName" class="fx_title"> | |||
| <el-input v-model.trim="ruleForm.merchantName" placeholder="请输入" clearable></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="楼座" prop="building" class="fx_send"> | |||
| <el-select | |||
| v-model="ruleForm.building" | |||
| placeholder="请选择" | |||
| @change="changeBuilding" | |||
| clearable | |||
| > | |||
| <el-option | |||
| v-for="(item,index) in buildingArr" | |||
| :key="index" | |||
| :value="item.id" | |||
| :label="item.name" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="楼层" prop="floor" class="fx_send"> | |||
| <el-select v-model="ruleForm.floor" placeholder="请选择" clearable> | |||
| <el-option | |||
| v-for="(item,index) in floorArr" | |||
| :key="index" | |||
| :value="item.id" | |||
| :label="item.floorName" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="合同状态" class="fx_send"> | |||
| <el-select v-model="ruleForm.status" placeholder="请选择" clearable class="select-method"> | |||
| <el-option | |||
| v-for="(item,index) in options" | |||
| :key="index" | |||
| :value="item.value" | |||
| :label="item.label" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="审批状态" class="fx_send"> | |||
| <el-select v-model="ruleForm.applyStatus" placeholder="请选择" clearable class="select-method"> | |||
| <el-option | |||
| v-for="(item,index) in applyStatusOptions" | |||
| :key="index" | |||
| :value="item.value" | |||
| :label="item.name" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="计租方式" class="fx_send"> | |||
| <el-select v-model="ruleForm.type" placeholder="请选择" clearable class="select-method"> | |||
| <el-option | |||
| v-for="(item,index) in types" | |||
| :key="index" | |||
| :value="item.value" | |||
| :label="item.label" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item> | |||
| <el-button | |||
| class="hoverBtn" | |||
| type="primary" | |||
| icon="el-icon-search" | |||
| :style="'border:0;background:'+navigationInfo.moduleColor" | |||
| size="medium" | |||
| @click="search" | |||
| ></el-button> | |||
| </el-form-item> | |||
| </el-form> | |||
| <el-button type="primary" class="builtBtn" @click="goSave" style="margin-right:4px;"> | |||
| <i>+</i>新建 | |||
| </el-button> | |||
| <el-button type="primary" class="builtBtn" @click="goBulu" style="margin-left:4px;"> | |||
| <i>+</i>补录 | |||
| </el-button> | |||
| <el-button type="primary" class="builtBtn" @click="goRenew" style="margin-left:4px;"> | |||
| <i>+</i>续签 | |||
| </el-button> | |||
| <table-list :ref="tk" :options="optionsTable"></table-list> | |||
| <stop-contract :ref="st" :type='7' :processData="processData" :options="stopOptions"></stop-contract> | |||
| </div> | |||
| <div> | |||
| <el-dialog | |||
| title="提示" | |||
| :visible.sync="dialogVisible" | |||
| width="40%" | |||
| :modal-append-to-body="false" | |||
| :before-close="handleClose" | |||
| > | |||
| <span>当前有欠缴账单未结清,是否要继续终止合同?</span> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button @click="dialogVisible = false">取 消</el-button> | |||
| <el-button type="primary" @click="stopContract">确定</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import TableList from "../../../core/comps/table/tableList.vue"; | |||
| import StopContract from "../contractutil/stopcontract.vue"; | |||
| import commonUtil from "../../../core/tool/commonUtil"; | |||
| import AjaxUtil from "../../../core/tool/ajaxService"; | |||
| import reportTool from "../../../core/tool/report.js"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import { CouponCacheData } from "../../../service/couponData/data.js"; | |||
| import { ContractData } from "../../../service/contract/data.js"; | |||
| import { promissionUrl } from "../../../urlconfig/promission/url.js"; | |||
| let echarts = require("echarts"); | |||
| export default { | |||
| inject: ["reload"], | |||
| extends: AjaxUtil, | |||
| name: "pointrentlist", | |||
| components: { | |||
| TableList, | |||
| StopContract | |||
| }, | |||
| data() { | |||
| return { | |||
| processData:[], | |||
| waitSignCount: "", //待签约 | |||
| endSoonCount: "", //将到期合同 | |||
| dialogVisible: false, | |||
| rendPaidCount: "", //计租中合同 | |||
| shopcount: "", //空余商铺 | |||
| tk: "manjianTableKey", | |||
| st: "stopContract", | |||
| stopOptions: { | |||
| contractType: "2" | |||
| }, | |||
| buildingArr: [], | |||
| floorArr: [], | |||
| applyStatusOptions:ContractData.applyStatus, | |||
| ruleForm: { | |||
| building: "", | |||
| buildingId: "", | |||
| floor: "", | |||
| floorId: "", | |||
| shopNumber: "", | |||
| merchantName: "", | |||
| status: "", | |||
| type: "", | |||
| applyStatus:"" | |||
| }, | |||
| options: ContractData.statusOptions, | |||
| types: [ | |||
| { | |||
| value: "1", | |||
| label: "按租赁面积" | |||
| }, | |||
| { | |||
| value: "2", | |||
| label: "联营扣点" | |||
| }, | |||
| { | |||
| value: 3, | |||
| label: "面积计租、联营取高" | |||
| } | |||
| ], | |||
| optionsTable: { | |||
| actions: [ | |||
| { | |||
| key: "edit", | |||
| val: "编辑", | |||
| action: this.aCount, | |||
| show: item => { | |||
| return item.status == 0 || | |||
| ((item.status == 1 || item.status == 8) && | |||
| // ((item.applyStatus == 0 && item.merchantId) || | |||
| ( item.applyStatus == 0 || | |||
| item.applyStatus == 3 || | |||
| item.applyStatus == 5)) | |||
| ? true | |||
| : false; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "终止", | |||
| action: this.endcontract, | |||
| show: item => { | |||
| if ( | |||
| (item.status == 2 || item.status == 3 || item.status == 4) && | |||
| item.applyStatus != 1 | |||
| ) { | |||
| return true; | |||
| } else { | |||
| return false; | |||
| } | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "查看", | |||
| action: this.goCheck, | |||
| show: item => { | |||
| return true; | |||
| } | |||
| }, | |||
| { | |||
| key: "download", | |||
| val: "下载", | |||
| action: this.goDownload, | |||
| show: item => { | |||
| return true; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "审批进度", | |||
| action: this.checkCurrentStatus, | |||
| show: item => { | |||
| return item.applyStatus == 1 || | |||
| item.applyStatus == 2 || | |||
| item.applyStatus == 3 | |||
| ? true | |||
| : false; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "绑定商户", | |||
| action: this.goToEditShop, | |||
| show: item => { | |||
| return (item.applyStatus == 2||(item.applyStatus == 0 && !item.merchantId)) && item.status == 1 ? true : false; | |||
| } | |||
| } | |||
| ], | |||
| showCk: false, | |||
| map: [ | |||
| { | |||
| key: "contractNumber", | |||
| val: "合同编号" | |||
| }, | |||
| { | |||
| key: "shopNumber", | |||
| val: "商铺号", | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "merchantName", | |||
| val: "商户名称" | |||
| }, | |||
| { | |||
| key: "buildingName", | |||
| val: "商户楼座" | |||
| }, | |||
| { | |||
| key: "floorName", | |||
| val: "商户楼层" | |||
| }, | |||
| { | |||
| key: "rentalStartDate", | |||
| val: "租赁开始日期", | |||
| type: "date", | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "rentalEndDate", | |||
| val: "租赁结束日期", | |||
| type: "date", | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "price", | |||
| val: "租金", | |||
| convert: this.divide, | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "type", | |||
| val: "计租方式", | |||
| convert: this.ctype | |||
| }, | |||
| { | |||
| key: "status", | |||
| val: "合同状态", | |||
| convert: this.cStatus | |||
| }, | |||
| { | |||
| key: "applyStatus", | |||
| val: "审批状态", | |||
| convert: this.cApplyStatus | |||
| } | |||
| ], | |||
| getUrl: () => { | |||
| return ( | |||
| "/api/wxRentContract/list?merchantName=" + | |||
| this.ruleForm.merchantName + | |||
| "&shopNumber=" + | |||
| this.ruleForm.shopNumber + | |||
| "&status=" + | |||
| this.ruleForm.status + | |||
| "&type=" + | |||
| this.ruleForm.type + | |||
| "&rentShopType=2&building="+ | |||
| this.ruleForm.building + | |||
| "&floor=" + | |||
| this.ruleForm.floor + | |||
| "&applyStatus=" + | |||
| this.ruleForm.applyStatus+ | |||
| "&operationType=1" | |||
| ); | |||
| }, | |||
| pageOption: { | |||
| sizeKey: "pageSize", | |||
| indexKey: "pageNum", | |||
| index: 1, | |||
| size: 10 | |||
| }, | |||
| analysis: data => { | |||
| return { | |||
| data: data.data.pageInfo.list, | |||
| count: data.data.pageInfo.total | |||
| }; | |||
| } | |||
| } | |||
| }; | |||
| }, | |||
| computed: { | |||
| ...mapState({ | |||
| navigationInfo: state => state.topNav.navigationInfo | |||
| }) | |||
| }, | |||
| methods: { | |||
| ...mapActions([ | |||
| "setNavData" // 将this.setNavData 映射为 this.$store.dispatch('setNavData') | |||
| ]), | |||
| changeBuilding: function(item) { | |||
| for (let building of this.buildingArr) { | |||
| if (item == building.id) { | |||
| this.floorArr = building.floors; | |||
| } | |||
| } | |||
| this.ruleForm.floor = ""; | |||
| //this.search() | |||
| }, | |||
| getBuilding: function() { | |||
| this.getFetch("/api/wxMallBuilding/getbuildingfloorlist").then(d => { | |||
| this.buildingArr = d.data; | |||
| }); | |||
| }, | |||
| cApplyStatus(col, item) { | |||
| if (item.applyStatus) { | |||
| return ( | |||
| (item.businessType != 7 ? "签约" : "终止") + | |||
| ContractData.applyStatus.filter(e => e.value == item.applyStatus)[0] | |||
| .name | |||
| ); | |||
| } else if (item.applyStatus === 0) { | |||
| return "未提交审核"; | |||
| } | |||
| }, | |||
| goToEditShop(item) { | |||
| this.$router.push({ | |||
| path: "/pointsMerchant/pointmerchantAdd?contractId=" + item.id | |||
| }); | |||
| }, | |||
| checkCurrentStatus(item, row) { | |||
| this.$router.push({ | |||
| path: "rentApprovals?id=" + item.id | |||
| }); | |||
| }, | |||
| cStatus(col, item) { | |||
| return CouponCacheData.rentStatus.filter(e => { | |||
| return e.value == item.status.toString(); | |||
| })[0].name; | |||
| }, | |||
| divide(col, item) { | |||
| if (item.bus_discount_ratio != undefined && item.bus_discount_time != 0 && item.bus_discount_ratio !='') { | |||
| return Number(item.price) / 100 +(item.bus_discount_time==1?'元/年':item.bus_discount_time==2?'元/月':'元/周期'); | |||
| } else { | |||
| return Number(item.price) / 100 +(item.price_unit==1?'元/日':item.price_unit==2?'元/月':'元/年'); | |||
| } | |||
| }, | |||
| ctype(col, item) { | |||
| if (item.type == 1) { | |||
| return "按租赁面积"; | |||
| } else if (item.type == 2) { | |||
| return "联营扣点"; | |||
| } else { | |||
| return "面积计租、联营取高"; | |||
| } | |||
| }, | |||
| aCount: function(item, row) { | |||
| if (item.merchantId) { | |||
| this.$router.push({ | |||
| path: "pointrentBulu?id=" + item.id | |||
| }); | |||
| } else { | |||
| this.$router.push({ | |||
| path: "pointrentEdit?id=" + item.id | |||
| }); | |||
| } | |||
| }, | |||
| goCheck: function(item, row) { | |||
| /** | |||
| contractType合同类型:1租金合同,2多经合同,3物业合同,4多经物业合同 | |||
| businessType操作类型:1合同审批,2账单审批,3终止合同审批 | |||
| id为合同id | |||
| */ | |||
| this.$router.push({ | |||
| path: `/pointsCheck?id=${item.id}&contractType=2&businessType=1` | |||
| }); | |||
| }, | |||
| handleClose(done) { | |||
| this.$confirm("确认关闭?") | |||
| .then(_ => { | |||
| done(); | |||
| }) | |||
| .catch(_ => {}); | |||
| }, | |||
| endcontract: function(item, row) { | |||
| let that = this; | |||
| this.getFetch("/api/wxBillAll/oweBillCount?type=1&contractId=" + item.id) | |||
| .then(d => { | |||
| if (Number(d.data) > 0) { | |||
| that.dialogVisible = true; | |||
| that.contractId = item.id; | |||
| that.contractNumber = item.contractNumber; | |||
| } else { | |||
| this.$refs[this.st].showLog(item.id, item.contractNumber); | |||
| } | |||
| }) | |||
| .catch(err => { | |||
| this.$message.success(err.data); | |||
| }); | |||
| }, | |||
| stopContract() { | |||
| this.dialogVisible = false; | |||
| this.$refs[this.st].showLog(this.contractId, this.contractNumber); | |||
| }, | |||
| goSave: function() { | |||
| this.$router.push({ | |||
| path: "/pointrentEdit" | |||
| }); | |||
| }, | |||
| goBulu: function() { | |||
| this.$router.push({ | |||
| path: "/pointrentBulu" | |||
| }); | |||
| }, | |||
| goRenew(){ | |||
| this.$router.push({ | |||
| path: "/pointrentEdit", | |||
| query:{ | |||
| Renew:true | |||
| } | |||
| }); | |||
| }, | |||
| goDownload: function(item) { | |||
| location.href = "/api/wxRentContract/exportContract?id=" + item.id; | |||
| }, | |||
| search: function() { | |||
| let tk = this.$refs[this.tk]; | |||
| tk.search(tk.getParams().index); | |||
| }, | |||
| /** | |||
| * 根据业务查询模板 | |||
| */ | |||
| getModelBybusiness(){ | |||
| this.getFetch(`${promissionUrl.getModelBybusiness}?flowType=7`) | |||
| .then(d=>{ | |||
| if(d.data.length>0){ | |||
| this.processData = JSON.parse(d.data[0].flow).lists; | |||
| } | |||
| }) | |||
| .catch(err=>{ | |||
| this.$message.error(err.data); | |||
| }) | |||
| } | |||
| }, | |||
| activated(){ | |||
| this.search() | |||
| this.getBuilding(); | |||
| this.getModelBybusiness() | |||
| this.setNavData(["合同管理", "多经点位", "租金合同"]); | |||
| } | |||
| }; | |||
| </script> | |||
| <!-- Add "scoped" attribute to limit CSS to this component only --> | |||
| <style scoped> | |||
| .layout-content { | |||
| width: 100%; | |||
| background: #141e29; | |||
| height: auto; | |||
| border-radius: 2px; | |||
| min-height: 300px; | |||
| padding: 0 20px 20px 20px; | |||
| overflow: hidden; | |||
| text-align: left; | |||
| } | |||
| .el-form { | |||
| background: #f5f7f8; | |||
| text-align: left; | |||
| padding: 25px 22px 22px; | |||
| margin-bottom: 20px !important; | |||
| } | |||
| .el-form .el-form-item { | |||
| margin-bottom: 0 !important; | |||
| } | |||
| .tableContainer { | |||
| margin-top: 20px !important; | |||
| background: #fff; | |||
| } | |||
| .el-button { | |||
| /* width:60px; */ | |||
| height: 40px; | |||
| } | |||
| .builtBtn { | |||
| width: 80px; | |||
| height: 32px; | |||
| background: rgba(81, 169, 201, 1); | |||
| border: 0 !important; | |||
| line-height: 32px; | |||
| text-align: center; | |||
| margin: 0; | |||
| padding: 0 !important; | |||
| } | |||
| .builtBtn:hover { | |||
| background: rgba(81, 169, 201, 0.88); | |||
| } | |||
| .builtBtn i { | |||
| margin-right: 10px; | |||
| } | |||
| .el-form-item .el-form-item__content, | |||
| .el-form-item .el-form-item__content .el-date-editor, | |||
| .el-form-item .el-form-item__content .el-date-editor .el-input__inner { | |||
| width: 150px; | |||
| } | |||
| /* .fx_send .el-form-item__content .el-select { | |||
| width: 133px !important; | |||
| } */ | |||
| .fx_title .el-input { | |||
| width: 193px; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,525 @@ | |||
| <template> | |||
| <div> | |||
| <div class="layout-content"> | |||
| <el-form | |||
| :inline="true" | |||
| :model="ruleForm" | |||
| ref="ruleForm" | |||
| class="demo-form-inline" | |||
| label-position="right" | |||
| > | |||
| <el-form-item label="商铺号" prop="name" class="fx_title"> | |||
| <el-input v-model.trim="ruleForm.shopNumber" placeholder="请输入" clearable></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="商户名称" prop="merchantName" class="fx_title"> | |||
| <el-input v-model.trim="ruleForm.merchantName" placeholder="请输入" clearable></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="合同状态" class="fx_send"> | |||
| <el-select v-model="ruleForm.status" placeholder="请选择" clearable class="select-method"> | |||
| <el-option | |||
| v-for="(item,index) in options" | |||
| :key="index" | |||
| :value="item.value" | |||
| :label="item.label" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="审批状态" class="fx_send"> | |||
| <el-select v-model="ruleForm.applyStatus" placeholder="请选择" clearable class="select-method"> | |||
| <el-option | |||
| v-for="(item,index) in applyStatusOptions" | |||
| :key="index" | |||
| :value="item.value" | |||
| :label="item.name" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="楼座" prop="building" class="fx_send"> | |||
| <el-select | |||
| v-model="ruleForm.building" | |||
| placeholder="请选择" | |||
| @change="changeBuilding" | |||
| clearable | |||
| > | |||
| <el-option | |||
| v-for="(item,index) in buildingArr" | |||
| :key="index" | |||
| :value="item.id" | |||
| :label="item.name" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="楼层" prop="floor" class="fx_send"> | |||
| <el-select v-model="ruleForm.floor" placeholder="请选择" clearable> | |||
| <el-option | |||
| v-for="(item,index) in floorArr" | |||
| :key="index" | |||
| :value="item.id" | |||
| :label="item.floorName" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item> | |||
| <el-button | |||
| class="hoverBtn" | |||
| type="primary" | |||
| icon="el-icon-search" | |||
| :style="'border:0;background:'+navigationInfo.moduleColor" | |||
| @click="search" | |||
| ></el-button> | |||
| </el-form-item> | |||
| </el-form> | |||
| <el-button type="primary" class="builtBtn" @click="goSave"> | |||
| <i>+</i>新建 | |||
| </el-button> | |||
| <el-button type="primary" class="builtBtn" @click="goRenew" style="margin-left:4px;"> | |||
| <i>+</i>续签 | |||
| </el-button> | |||
| <table-list :ref="tk" :options="optionsTable"></table-list> | |||
| <stop-contract :ref="st" :type='16' :processData="processData" :options="stopOptions"></stop-contract> | |||
| </div> | |||
| <el-dialog title="提示" :visible.sync="dialogVisible" width="40%" :modal-append-to-body="false"> | |||
| <span>当前有欠缴账单未结清,是否要继续终止物业合同?</span> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button @click="dialogVisible = false">取 消</el-button> | |||
| <el-button type="primary" @click="stopContract">确定</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import TableList from "../../../core/comps/table/tableList.vue"; | |||
| import StopContract from "../contractutil/stopcontract.vue"; | |||
| import reportTool from "../../../core/tool/report.js"; | |||
| import commonUtil from "../../../core/tool/commonUtil"; | |||
| import AjaxUtil from "../../../core/tool/ajaxService"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import { CouponCacheData } from "../../../service/couponData/data.js"; | |||
| import { ContractData } from "../../../service/contract/data.js"; | |||
| import { promissionUrl } from "../../../urlconfig/promission/url.js"; | |||
| import { ContractUrl } from "../businessComp/UrlEnum.js" | |||
| let echarts = require("echarts"); | |||
| export default { | |||
| inject: ["reload"], | |||
| extends: AjaxUtil, | |||
| name: "pointtenementlist", | |||
| components: { | |||
| TableList, | |||
| StopContract | |||
| }, | |||
| data() { | |||
| return { | |||
| processData:[], | |||
| waitSignCount: "", //待签约 | |||
| endSoonCount: "", //将到期合同 | |||
| rendPaidCount: "", //计租中合同 | |||
| shopcount: "", //空余商铺 | |||
| area: "", //商铺总面积 | |||
| tk: "manjianTableKey", | |||
| st: "stopContract", | |||
| businessId: "", | |||
| stopOptions: { | |||
| contractType: "4", | |||
| stopType: 2 //物业合同 | |||
| }, | |||
| dialogVisible: false, | |||
| buildingArr: [], | |||
| floorArr: [], | |||
| applyStatusOptions:ContractData.applyStatus, | |||
| options: ContractData.statusOptions, | |||
| ruleForm: { | |||
| building: "", | |||
| buildingId: "", | |||
| floor: "", | |||
| floorId: "", | |||
| shopNumber: "", | |||
| merchantName: "", | |||
| status:"", | |||
| applyStatus:"" | |||
| }, | |||
| navInfo: { | |||
| name: "满减券", | |||
| index: "0" | |||
| }, | |||
| optionsTable: { | |||
| actions: [ | |||
| { | |||
| key: "edit", | |||
| val: "编辑", | |||
| action: this.goEdit, | |||
| show: item => { | |||
| return item.status == 1 && | |||
| (item.applyStatus == 0 || | |||
| item.applyStatus == 3 || | |||
| item.applyStatus == 5) | |||
| ? true | |||
| : false; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "终止", | |||
| action: this.endcontract, | |||
| // show: this.isendcontract(item), | |||
| show: item => { | |||
| if ( | |||
| (item.status == 2 || item.status == 3 || item.status == 4) && | |||
| item.applyStatus != 1 | |||
| ) { | |||
| return true; | |||
| } else { | |||
| return false; | |||
| } | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "查看", | |||
| action: this.goCheck, | |||
| show: item => { | |||
| return true; | |||
| } | |||
| }, | |||
| { | |||
| key: "download", | |||
| val: "下载", | |||
| action: this.goDownload, | |||
| show: item => { | |||
| return true; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "审批进度", | |||
| action: this.checkCurrentStatus, | |||
| show: item => { | |||
| return item.applyStatus == 1 || | |||
| item.applyStatus == 2 || | |||
| item.applyStatus == 3 | |||
| ? true | |||
| : false; | |||
| } | |||
| } | |||
| ], | |||
| showCk: false, | |||
| map: [ | |||
| { | |||
| key: "contractNumber", | |||
| val: "合同编号" | |||
| }, | |||
| { | |||
| key: "shopNumber", | |||
| val: "商铺号", | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "merchantName", | |||
| val: "商户名称" | |||
| }, | |||
| { | |||
| key: "buildingName", | |||
| val: "商户楼座" | |||
| }, | |||
| { | |||
| key: "floorName", | |||
| val: "商户楼层" | |||
| }, | |||
| { | |||
| key: "rentalStartDate", | |||
| val: "租赁开始日期", | |||
| type: "date", | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "rentalEndDate", | |||
| val: "计租结束日期", | |||
| type: "date", | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "price", | |||
| val: "物业费", | |||
| convert: this.divide, | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "status", | |||
| val: "合同状态", | |||
| convert: this.cStatus | |||
| }, | |||
| { | |||
| key: "applyStatus", | |||
| val: "审批状态", | |||
| convert: this.cApplyStatus | |||
| } | |||
| ], | |||
| getUrl: () => { | |||
| return ( | |||
| "/api/wxPropertyContract/list?merchantName=" + | |||
| this.ruleForm.merchantName + | |||
| "&shopNumber=" + | |||
| this.ruleForm.shopNumber + | |||
| "&rentShopType=2&building="+ | |||
| this.ruleForm.building + | |||
| "&floor=" + | |||
| this.ruleForm.floor + | |||
| "&applyStatus=" + | |||
| this.ruleForm.applyStatus + | |||
| "&status=" + | |||
| this.ruleForm.status+ | |||
| "&operationType=1" | |||
| ); | |||
| }, | |||
| pageOption: { | |||
| sizeKey: "pageSize", | |||
| indexKey: "pageNum", | |||
| index: 1, | |||
| size: 10 | |||
| }, | |||
| analysis: data => { | |||
| return { | |||
| data: data.data.pageInfo.list, | |||
| count: data.data.pageInfo.total | |||
| }; | |||
| } | |||
| } | |||
| }; | |||
| }, | |||
| computed: { | |||
| ...mapState({ | |||
| navigationInfo: state => state.topNav.navigationInfo | |||
| }) | |||
| }, | |||
| methods: { | |||
| ...mapActions([ | |||
| "setNavData" // 将this.setNavData 映射为 this.$store.dispatch('setNavData') | |||
| ]), | |||
| changeBuilding: function(item) { | |||
| for (let building of this.buildingArr) { | |||
| if (item == building.id) { | |||
| this.floorArr = building.floors; | |||
| } | |||
| } | |||
| this.ruleForm.floor = ""; | |||
| //this.search() | |||
| }, | |||
| getBuilding: function() { | |||
| this.getFetch("/api/wxMallBuilding/getbuildingfloorlist").then(d => { | |||
| this.buildingArr = d.data; | |||
| }); | |||
| }, | |||
| cApplyStatus(col, item) { | |||
| if (item.applyStatus) { | |||
| return ( | |||
| (item.businessType != 16 ? "签约" : "终止") + | |||
| ContractData.applyStatus.filter(e => e.value == item.applyStatus)[0] | |||
| .name | |||
| ); | |||
| } else if (item.applyStatus === 0) { | |||
| return "未提交审核"; | |||
| } | |||
| }, | |||
| goToEditShop(item) { | |||
| this.$router.push({ | |||
| path: "/merchant/merchantAdd?contractId=" + item.id | |||
| }); | |||
| }, | |||
| checkCurrentStatus(item, row) { | |||
| this.$router.push({ | |||
| path: "rentApprovals?id=" + item.id | |||
| }); | |||
| }, | |||
| cStatus(col, item) { | |||
| return CouponCacheData.rentStatus.filter(e => { | |||
| return e.value == item.status.toString(); | |||
| })[0].name; | |||
| }, | |||
| goEdit: function(item, row) { | |||
| this.$router.push({ | |||
| path: "pointtenementAdd?id=" + item.id | |||
| }); | |||
| }, | |||
| divide(col, item) { | |||
| return Number(item.price) / 100 +(item.price_unit==1?'元/日':item.price_unit==2?'元/月':'元/年'); | |||
| }, | |||
| endcontract: function(item, row) { | |||
| let that = this; | |||
| that.contractId = item.id; | |||
| that.contractNumber = item.contractNumber; | |||
| this.getFetch("/api/wxBillAll/oweBillCount?type=2&contractId=" + item.id) | |||
| .then(d => { | |||
| if (Number(d.data) > 0) { | |||
| that.dialogVisible = true; | |||
| } else { | |||
| if(this.processData.length>0){ | |||
| this.dialogVisible = false; | |||
| this.$refs[this.st].showLog(this.contractId, this.contractNumber); | |||
| }else{ | |||
| this.makeSure(); | |||
| } | |||
| } | |||
| }) | |||
| .catch(err => { | |||
| this.$message.success(err.data); | |||
| }); | |||
| }, | |||
| stopContract() { | |||
| // this.$refs[this.st].showLog(this.contractId, this.contractNumber); | |||
| if(this.processData.length>0){ | |||
| this.dialogVisible = false; | |||
| this.$refs[this.st].showLog(this.contractId, this.contractNumber); | |||
| }else{ | |||
| this.endProperty(); | |||
| } | |||
| }, | |||
| makeSure(){ | |||
| this.$confirm('您确定要提前终止此合同吗?', '提示', { | |||
| confirmButtonText: '确定', | |||
| cancelButtonText: '取消', | |||
| type: 'warning' | |||
| }).then(() => { | |||
| this.endProperty(); | |||
| }).catch(() => { | |||
| this.$message({ | |||
| type: 'info', | |||
| message: '已取消删除' | |||
| }); | |||
| }); | |||
| }, | |||
| endProperty(){ | |||
| let _this=this; | |||
| let param={ | |||
| id:this.contractId | |||
| } | |||
| this.postFetch(ContractUrl.endPropertyContract, param) | |||
| .then(d => { | |||
| _this.$message.success("操作成功"); | |||
| _this.dialogVisible = false; | |||
| _this.search(); | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| }, | |||
| bCount: function(item, row, cellValue) { | |||
| if (cellValue === 1) { | |||
| return "已出租"; | |||
| } else if (cellValue === 0) { | |||
| return "未出租"; | |||
| } | |||
| }, | |||
| goSave: function() { | |||
| this.$router.push({ | |||
| path: "/pointtenementAdd" | |||
| }); | |||
| }, | |||
| goRenew(){ | |||
| this.$router.push({ | |||
| path: "/pointtenementAdd", | |||
| query:{ | |||
| Renew:true | |||
| } | |||
| }); | |||
| }, | |||
| goCheck: function(item, row) { | |||
| /** | |||
| contractType合同类型:1租金合同,2多经合同,3物业合同,4多经物业合同 | |||
| businessType操作类型:1合同审批,2账单审批,3终止合同审批 | |||
| id为合同id | |||
| */ | |||
| this.$router.push({ | |||
| path: `/pointsCheck?id=${item.id}&contractType=4&businessType=1` | |||
| }); | |||
| }, | |||
| search: function() { | |||
| let tk = this.$refs[this.tk]; | |||
| tk.search(tk.getParams().index); | |||
| }, | |||
| goDownload: function(item) { | |||
| location.href = | |||
| "/api/wxRentContract/exportContract?id=" + item.rentContractId; | |||
| }, | |||
| /** | |||
| * 根据业务查询模板 | |||
| */ | |||
| getModelBybusiness(){ | |||
| this.getFetch(`${promissionUrl.getModelBybusiness}?flowType=16`) | |||
| .then(d=>{ | |||
| if(d.data.length>0){ | |||
| this.processData = JSON.parse(d.data[0].flow).lists; | |||
| } | |||
| }) | |||
| .catch(err=>{ | |||
| this.$message.error(err.data); | |||
| }) | |||
| } | |||
| }, | |||
| activated(){ | |||
| this.search() | |||
| this.getBuilding(); | |||
| this.getModelBybusiness(); | |||
| this.setNavData(["合同管理", "多经点位", "物业合同"]); | |||
| } | |||
| }; | |||
| </script> | |||
| <!-- Add "scoped" attribute to limit CSS to this component only --> | |||
| <style scoped> | |||
| .layout-content { | |||
| width: 100%; | |||
| background: #141e29; | |||
| height: auto; | |||
| border-radius: 2px; | |||
| min-height: 300px; | |||
| padding: 0 20px 20px 20px; | |||
| overflow: hidden; | |||
| text-align: left; | |||
| } | |||
| .el-form { | |||
| background: #f5f7f8; | |||
| text-align: left; | |||
| padding: 25px 22px 22px; | |||
| margin-bottom: 20px !important; | |||
| } | |||
| .el-form .el-form-item { | |||
| margin-bottom: 0 !important; | |||
| } | |||
| .tableContainer { | |||
| margin-top: 20px !important; | |||
| background: #fff; | |||
| } | |||
| .el-button { | |||
| width: 60px; | |||
| height: 40px; | |||
| } | |||
| .builtBtn { | |||
| width: 100px; | |||
| height: 32px; | |||
| background: rgba(81, 169, 201, 1); | |||
| border: 0 !important; | |||
| line-height: 32px; | |||
| text-align: center; | |||
| margin: 0; | |||
| padding: 0 !important; | |||
| } | |||
| .builtBtn:hover { | |||
| background: rgba(81, 169, 201, 0.88); | |||
| } | |||
| .builtBtn i { | |||
| margin-right: 10px; | |||
| } | |||
| .el-form-item .el-form-item__content, | |||
| .el-form-item .el-form-item__content .el-date-editor, | |||
| .el-form-item .el-form-item__content .el-date-editor .el-input__inner { | |||
| width: 150px; | |||
| } | |||
| .fx_title .el-input { | |||
| width: 193px; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,515 @@ | |||
| <template> | |||
| <div> | |||
| <div class="layout-content"> | |||
| <div class="shopBox" style="margin-bottom:20px;" v-if="fromAddTask != 'fromAddTask'"> | |||
| <rent-shop :rentInfoData='wxShops' :merchentEditIf="merchentEditIf"></rent-shop> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">合同信息</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同编号:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.contractNumber}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同状态:</el-col> | |||
| <el-col :span="18" class="span-text">{{cStatus(wxRentContract.status)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同签约日:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeDate(wxRentContract.signDate)}}</el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">乙方信息</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">商户名称:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.merchantName}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同主体名称:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.subjectName}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">经营品牌:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeBrand(wxRentContract.brand)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">业态:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeBusiness(wxRentContract.businessId)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">店面类型:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeShopType(wxRentContract.shopType)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">负责人:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.linkPerson}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">联系电话:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.linkPhone}}</el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">签约信息</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">租赁开始日期:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeDate(wxRentContract.rentalStartDate)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">租赁截止日期:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeDate(wxRentContract.rentalEndDate)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">总租期:</el-col> | |||
| <el-col :span="18" class="span-text">{{totalPeriodMonth+'个月'+totalPeriodDay+"天"}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">装修期:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.fixStartDate+' 至 '+wxRentContract.fixEndDate}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">计租开始日期:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeDate(wxRentContract.startDate)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">账单生成方式:</el-col> | |||
| <el-col :span="18" class="span-text">{{getAdjustPeriod}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title" v-if="contractType!=3&&contractType!=4">计租方式:</el-col> | |||
| <el-col :span="18" class="span-text" v-if="contractType!=3&&contractType!=4">{{changeType(wxRentContract.type)}}</el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">费用明细</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">计租面积:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.rentArea+'㎡'}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title" v-if="contractType!=3&&contractType!=4">计租方式:</el-col> | |||
| <el-col :span="18" class="span-text" v-if="contractType!=3&&contractType!=4">{{changeType(wxRentContract.type)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" v-if="wxRentContract.type==2&&contractType!=3&&contractType!=4" class="span-title">保底营业额:</el-col> | |||
| <el-col :span="18" v-if="wxRentContract.type==2&&contractType!=3&&contractType!=4" class="span-text">{{wxRentContract.revenue/100+'元'}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.type!=2&&contractType==2"> | |||
| <el-col :span="3" class="span-title">租金单价:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.rentPrice+' ㎡/元/'+priceUnitType}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.type!=2&&contractType==4"> | |||
| <el-col :span="3" class="span-title">物业费单价:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.rentPrice/100+' ㎡/元/'+priceUnitType}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" v-if="wxRentContract.type!=2" class="span-title">{{contractType==2?"租金:":"物业费:"}}</el-col> | |||
| <el-col :span="18" v-if="wxRentContract.type!=2" class="span-text">{{wxRentContract.price/100+' 元/'+priceUnitType}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" v-if="wxRentContract.type!=1&&contractType!=3&&contractType!=4" class="span-title">联营扣点:</el-col> | |||
| <el-col :span="18" v-if="wxRentContract.type!=1&&contractType!=3&&contractType!=4 && wxRentContract.busDiscountRatio!=undefined &&wxRentContract.busDiscountRatio!=''" class="span-text"> | |||
| <!-- aaa --> | |||
| <show-rate-list class="cur-rate-list"></show-rate-list> | |||
| </el-col> | |||
| <el-col :span="18" v-if="wxRentContract.type!=1&&contractType!=3&&contractType!=4 && wxRentContract.busDiscountRatio!=undefined &&wxRentContract.busDiscountRatio==''" class="span-text">{{wxRentContract.payRatio/100+'%'}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">押金:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.deposit/100+' 元'}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">付款周期:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.receivePeriod+' 月'}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.latePayRatio"> | |||
| <el-col :span="3" class="span-title">滞纳金费率:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.latePayRatio+ '%'}}<span style="margin-left:30px;">{{'欠缴后 '+wxRentContract.latePayDay+' 日开始计费'}}</span></el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.adjustRatio&&wxRentContract.adjustRatio.length>0"> | |||
| <el-col :span="3" class="span-title"> | |||
| 年租金调整: | |||
| </el-col> | |||
| <el-col v-if="wxRentContract.adjustRatioWay==1" :span="18" class="span-text"><span v-for="(item,index) in wxRentContract.adjustRatio" :key='index'>{{"第"+(index+2)+"年上浮"+item/100+'%'+(wxRentContract.adjustRatio.length>1&&wxRentContract.adjustRatio.length>index+1?', ':'')}}</span></el-col> | |||
| <el-col v-if="wxRentContract.adjustRatioWay==2" :span="18" class="span-text"><span v-for="(item,index) in wxRentContract.adjustRatio" :key='index'>{{"第"+(index+2)+"年上浮"+item/100+'元/'+priceUnitType+(wxRentContract.adjustRatio.length>1&&wxRentContract.adjustRatio.length>index+1?', ':'')}}</span></el-col> | |||
| <el-col v-if="wxRentContract.adjustRatioWay==3" :span="18" class="span-text"><span v-for="(item,index) in wxRentContract.adjustRatio" :key='index'>{{"第"+(index+2)+"年"+item/100+'元/'+priceUnitType+(wxRentContract.adjustRatio.length>1&&wxRentContract.adjustRatio.length>index+1?', ':'')}}</span></el-col> | |||
| </el-row> | |||
| <el-row v-show="businessType!='3'"> | |||
| <el-col :span="3" class="span-title">合同账单:</el-col> | |||
| <el-col :span="18" class="span-text"> | |||
| <rent-bill :data="billData" :editIf='true' :ref="billTk"></rent-bill> | |||
| </el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box" v-if="businessType==3"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">租赁信息</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="2" class="span-title">租赁费用:</el-col> | |||
| <el-col :span="6" class="span-text">{{Number(rentOweCount)>0?'有欠缴':'无欠缴'}}</el-col> | |||
| <el-col :span="2" class="span-title">物业费用:</el-col> | |||
| <el-col :span="6" class="span-text">{{Number(propertyOweCount)>0?'有欠缴':'无欠缴'}}</el-col> | |||
| <el-col :span="2" class="span-title">押金情况:</el-col> | |||
| <el-col :span="6" class="span-text">{{Number(depositOweCount)>0?'有欠缴':'无欠缴'}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="2" class="span-title">其他:</el-col> | |||
| <el-col :span="6" class="span-text">{{sRemark}}</el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <!-- <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">审批意见</div> --> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同附件:</el-col> | |||
| <el-col :span="6" class="span-text" style="color:blue;" v-if="fileNames.length<=0">无</el-col> | |||
| <el-col :span="6" class="span-text" style="color:blue;" v-if="fileNames.length>0"><div class="download-file" v-for="(item,index) in fileNames" :key="index" @click.stop.prevent="download(index)">{{item.name}}</div></el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <el-row style="margin:20px 0 0;text-align:center;"> | |||
| <el-button @click.stop.prevent="cancel">返回</el-button> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import commonUtil from "../../core/tool/commonUtil"; | |||
| import AjaxUtil from "../../core/tool/ajaxService"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import{ ContractUrl } from "../contract/businessComp/UrlEnum.js" | |||
| import { CouponCacheData } from "../../service/couponData/data.js"; | |||
| import rentBill from "../contract/contractutil/rentbill.vue"; | |||
| import { ContractData } from "../../service/contract/data.js"; | |||
| import rentShop from "./contractutil/rentshop.vue"; | |||
| import showRateList from './rent/showRateList.vue'; | |||
| import moment from "moment"; | |||
| export default { | |||
| name: "pointsCheck", | |||
| components: { | |||
| rentBill, | |||
| rentShop, | |||
| showRateList, | |||
| }, | |||
| data() { | |||
| return { | |||
| brands:[], | |||
| fromAddTask:"", | |||
| merchentEditIf: true, | |||
| priceUnitType:'', | |||
| priceUnitOption:ContractData.priceUnitOption, | |||
| totalPeriodMonth: 0, | |||
| totalPeriodDay: 0, | |||
| contractType:0, | |||
| remark: "", | |||
| wxShops:[], | |||
| billData:[], | |||
| billTk: "rentbill", | |||
| wxRentContract:'', | |||
| rentOweCount:'', | |||
| propertyOweCount :'', | |||
| businessType:'', | |||
| depositOweCount:'', | |||
| sRemark:'', | |||
| wxMerchant:'', | |||
| businessIds:[], | |||
| progressData:[], | |||
| fileNames:[], | |||
| active:0, | |||
| // 店铺类型 | |||
| shopTypes: ContractData.shopTypes, | |||
| //计租计算方式 | |||
| computedTypes: ContractData.computedTypes, | |||
| }; | |||
| }, | |||
| //新增computed属性 | |||
| computed: { | |||
| ...mapState({ | |||
| topNav: state => state.topNav.data, //将 this.topNav 映射为 this.$store.topNav.data | |||
| navigationInfo: state => state.topNav.navigationInfo, | |||
| formData: state => state.setRentInfo.formData, | |||
| }), | |||
| getAdjustPeriod() { | |||
| return this.wxRentContract.adjustPeriod == 3 | |||
| ? "按自然月生成" | |||
| : "按计租日期生成"; | |||
| }, | |||
| }, | |||
| methods: { | |||
| cStatus(item) { | |||
| return item!=undefined?CouponCacheData.rentStatus.filter(e => { | |||
| return e.value == item.toString(); | |||
| })[0].name:''; | |||
| }, | |||
| changeBrand(brand){ | |||
| return this.brands.length>0&&brand?this.brands.filter(e=>e.id==brand)[0].value:'' | |||
| }, | |||
| changeBusiness(businessId){ | |||
| return this.businessIds.length>0&&businessId!=undefined?this.businessIds.filter(e=>e.id==businessId)[0].title:'' | |||
| }, | |||
| changeShopType(id){ | |||
| return id!=undefined?this.shopTypes.filter(e=>e.value==id)[0].label:''; | |||
| }, | |||
| changeDate(date) { | |||
| return moment(date).format("YYYY-MM-DD"); | |||
| }, | |||
| changeType(type){ | |||
| return type!=undefined?this.computedTypes.filter(e=>e.value==type)[0].label:''; | |||
| }, | |||
| ...mapActions([ | |||
| "setNavData", // 将this.setNavData 映射为 this.$store.dispatch('setNavData') | |||
| "setFormData", | |||
| ]), | |||
| download:function(index){ | |||
| window.open(this.fileNames[index].url) | |||
| }, | |||
| cancel(){ | |||
| this.$router.back(-1); | |||
| }, | |||
| getData() { | |||
| let _this=this; | |||
| this.contractType=this.$route.query.contractType; | |||
| if(this.$route.query.contractType==3||this.$route.query.contractType==4){ | |||
| this.getFetch( | |||
| "/api/wxPropertyContract/findById?id=" + this.$route.query.id | |||
| ).then(d => { | |||
| d.data.wxPropertyContract.adjustRatio=d.data.wxPropertyContract.adjustRatio?JSON.parse(d.data.wxPropertyContract.adjustRatio):''; | |||
| _this.wxRentContract=d.data.wxPropertyContract; | |||
| _this.wxRentContract.fixStartDate=_this.wxRentContract.fixStartDate?moment(_this.wxRentContract.fixStartDate).format('YYYY-MM-DD'):"" | |||
| _this.wxRentContract.fixEndDate=_this.wxRentContract.fixEndDate?moment(_this.wxRentContract.fixEndDate).format('YYYY-MM-DD'):"" | |||
| this.priceUnitType = this.wxRentContract.priceUnit?this.priceUnitOption.filter(e=>e.value==this.wxRentContract.priceUnit)[0].name:''; | |||
| _this.totalPeriodMonth = d.data.totalPeriodMonth | |||
| _this.totalPeriodDay = d.data.totalPeriodDay | |||
| _this.fileNames = JSON.parse(d.data.wxPropertyContract.fileNames); | |||
| _this.wxShops=d.data.wxShops | |||
| if(_this.$route.query.businessType==3){ | |||
| _this.rentOweCount=d.data.rentOweCount; | |||
| _this.propertyOweCount=d.data.propertyOweCount; | |||
| _this.depositOweCount=d.data.depositOweCount; | |||
| _this.sRemark=d.data.remark; | |||
| } | |||
| if(_this.businessType!=3){ | |||
| _this.$refs[_this.billTk].setData(d.data.previewBillRentList); | |||
| } | |||
| if (d.data.wxRentContract.busDiscountRatio == undefined || d.data.wxRentContract.busDiscountTime == undefined) { | |||
| d.data.wxRentContract.busDiscountRatio = ''; | |||
| d.data.wxRentContract.busDiscountTime = 1; | |||
| } | |||
| //aaa | |||
| this.formData.busDiscountRatio = d.data.wxRentContract.busDiscountRatio; | |||
| this.formData.busDiscountTime = d.data.wxRentContract.busDiscountTime; | |||
| this.formData.payRatio = d.data.wxRentContract.payRatio; | |||
| let curObj = Object.assign({},this.formData); | |||
| this.setFormData(curObj); | |||
| }); | |||
| }else{ | |||
| this.getFetch( | |||
| "/api/wxRentContract/findById?id=" + this.$route.query.id | |||
| ).then(d => { | |||
| d.data.wxRentContract.adjustRatio=d.data.wxRentContract.adjustRatio?JSON.parse(d.data.wxRentContract.adjustRatio):''; | |||
| _this.wxRentContract=d.data.wxRentContract; | |||
| _this.wxRentContract.fixStartDate=_this.wxRentContract.fixStartDate?moment(_this.wxRentContract.fixStartDate).format('YYYY-MM-DD'):"" | |||
| _this.wxRentContract.fixEndDate=_this.wxRentContract.fixEndDate?moment(_this.wxRentContract.fixEndDate).format('YYYY-MM-DD'):"" | |||
| this.priceUnitType = this.wxRentContract.priceUnit?this.priceUnitOption.filter(e=>e.value==this.wxRentContract.priceUnit)[0].name:''; | |||
| _this.totalPeriodMonth = d.data.totalPeriodMonth | |||
| _this.totalPeriodDay = d.data.totalPeriodDay | |||
| _this.fileNames = JSON.parse(d.data.wxRentContract.fileNames); | |||
| _this.wxShops=d.data.wxShops; | |||
| if(_this.$route.query.businessType==3){ | |||
| _this.rentOweCount=d.data.rentOweCount; | |||
| _this.propertyOweCount=d.data.propertyOweCount; | |||
| _this.depositOweCount=d.data.depositOweCount; | |||
| _this.sRemark=d.data.remark; | |||
| } | |||
| if(_this.businessType!=3){ | |||
| _this.$refs[_this.billTk].setData(d.data.previewBillRentList); | |||
| } | |||
| if (d.data.wxRentContract.busDiscountRatio == undefined || d.data.wxRentContract.busDiscountTime == undefined) { | |||
| d.data.wxRentContract.busDiscountRatio = ''; | |||
| d.data.wxRentContract.busDiscountTime = 1; | |||
| } | |||
| //aaa | |||
| this.formData.busDiscountRatio = d.data.wxRentContract.busDiscountRatio; | |||
| this.formData.busDiscountTime = d.data.wxRentContract.busDiscountTime; | |||
| this.formData.payRatio = d.data.wxRentContract.payRatio; | |||
| let curObj = Object.assign({},this.formData); | |||
| this.setFormData(curObj); | |||
| }); | |||
| } | |||
| this.getFetch( | |||
| "/api/workflow/applyHistoryAndAssignee?businessId=" + this.$route.query.id | |||
| ).then(d => { | |||
| let progressData=d.data; | |||
| progressData=d.data; | |||
| progressData.reverse(); | |||
| let indexs=0; | |||
| _this.progressData=[] | |||
| progressData.map((item,index)=>{ | |||
| if(item.isLastStart){ | |||
| indexs=index | |||
| } | |||
| }) | |||
| progressData.map((item,index)=>{ | |||
| if(index>=indexs){ | |||
| _this.progressData.push(item) | |||
| } | |||
| }) | |||
| _this.progressData.map((item,index)=>{ | |||
| if(item.status==1){ | |||
| item.userName=item.userName+'( 发起审批)' | |||
| }else if(item.status==2){ | |||
| item.userName=item.userName+'( 已审批)' | |||
| }else if(item.status==3){ | |||
| item.userName=item.userName+'( 驳回)' | |||
| }else if(item.status==4){ | |||
| item.userName=item.userName+'( 待审批)' | |||
| } | |||
| }) | |||
| for(var i=1;_this.progressData.length<=10;i++) { | |||
| if(_this.progressData[i].status==4) { | |||
| _this.active=i | |||
| break; | |||
| } | |||
| } | |||
| }); | |||
| } | |||
| }, | |||
| mounted: function() { | |||
| // this.getFetch("/api/at/list?describe=") | |||
| commonUtil.pvuv.setPVUV.apply(this, []); | |||
| }, | |||
| created() { | |||
| // this.reload() | |||
| this.businessType=this.$route.query.businessType; | |||
| if(this.$route.query.contractType==2){ | |||
| this.setNavData(["合同管理", "多经点位", "租金合同", "查看"]); | |||
| }else{ | |||
| this.setNavData(["合同管理", "多经点位", "物业合同", "查看"]); | |||
| } | |||
| if(this.$route.query.flags){ | |||
| this.fromAddTask = this.$route.query.flags; | |||
| this.setNavData(["招商管理", "多经点位", "租金合同", "查看"]); | |||
| } | |||
| this.getData(); | |||
| //获取品牌列表 | |||
| this.getFetch("/api/wxBrand/queryBrand") | |||
| .then(d => { | |||
| this.brands = d.data; | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| this.getFetch(ContractUrl.businessList) | |||
| .then(d => { | |||
| this.businessIds = d.data; | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| } | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| .text-box { | |||
| background: #fff; | |||
| margin-bottom: 20px; | |||
| } | |||
| .download-file{ | |||
| cursor: pointer; | |||
| } | |||
| .text-box-title { | |||
| height: 42px; | |||
| line-height: 42px; | |||
| padding-left: 20px; | |||
| color: #fff; | |||
| font-weight: 400px; | |||
| font-size: 14px; | |||
| background: rgba(51, 153, 255, 1); | |||
| } | |||
| .text-box-content { | |||
| padding: 20px; | |||
| line-height: 36px; | |||
| font-size: 12px; | |||
| } | |||
| .span-title { | |||
| text-align: right; | |||
| padding-right: 15px; | |||
| } | |||
| .layout-content { | |||
| width: 100%; | |||
| height: auto; | |||
| min-height: 300px; | |||
| background: #141e29; | |||
| border-radius: 2px; | |||
| padding: 0 20px 20px 20px; | |||
| overflow: hidden; | |||
| text-align: left; | |||
| } | |||
| .el-form { | |||
| background: #f5f7f8; | |||
| text-align: left; | |||
| padding: 25px 22px 22px; | |||
| margin-bottom: 20px !important; | |||
| } | |||
| .el-form .el-form-item { | |||
| margin-bottom: 0 !important; | |||
| /* width: 200px; */ | |||
| } | |||
| /* .el-select{ | |||
| width:120px; | |||
| } */ | |||
| .tableContainer { | |||
| margin-top: 20px !important; | |||
| background: #fff; | |||
| } | |||
| .el-button { | |||
| /* width: 60px; */ | |||
| border: none !important; | |||
| margin: 0 10px; | |||
| height: 40px; | |||
| } | |||
| .builtBtn { | |||
| width: 100px; | |||
| height: 32px; | |||
| background: rgba(81, 169, 201, 1); | |||
| border: 0 !important; | |||
| line-height: 32px; | |||
| text-align: center; | |||
| margin: 0; | |||
| padding: 0 !important; | |||
| } | |||
| .builtBtn:hover { | |||
| background: rgba(81, 169, 201, 0.88); | |||
| } | |||
| .builtBtn i { | |||
| margin-right: 10px; | |||
| } | |||
| .fx_send .el-form-item__content .el-select { | |||
| width: 120px !important; | |||
| } | |||
| .fx_title .el-input { | |||
| width: 150px; | |||
| } | |||
| .approval-list .span-title{ | |||
| padding-right: 0; | |||
| } | |||
| .cur-rate-list /deep/ .rate-show-list li { | |||
| margin-top: 6px; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,81 @@ | |||
| <template> | |||
| <div class="rate-set-wrap"> | |||
| <!-- 跳点比率设置 label-width="120px" :rules="editRateRules"--> | |||
| <el-dialog id="my-dialog-close" title="" :visible.sync="dialogVisible" width="450px" :modal-append-to-body='false'> | |||
| <div style="width:100%"> | |||
| <h4 class="title-text">清空跳点设置</h4> | |||
| <p class="tip-text">您将清空当前的所有配置信息</p> | |||
| </div> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button class="draftBtn" type="primary" @click="doClearJumpRate">清空</el-button> | |||
| <el-button class="putinBtn" @click="closeDialog">取消</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| inject: ["reload"], | |||
| name: "closeJumpRateSet", | |||
| props: [], | |||
| components: { | |||
| }, | |||
| data() { | |||
| return { | |||
| dialogVisible: false, | |||
| }; | |||
| }, | |||
| mounted: function() { | |||
| //初始化处理 | |||
| }, | |||
| watch: { | |||
| }, | |||
| computed:{ | |||
| }, | |||
| methods: { | |||
| openDialog() { | |||
| this.dialogVisible = true; | |||
| }, | |||
| // | |||
| doClearJumpRate() { | |||
| this.$emit('doClearRateSet'); | |||
| this.closeDialog(); | |||
| }, | |||
| closeDialog() { | |||
| this.dialogVisible = false; | |||
| } | |||
| } | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| .title-text { | |||
| height: 40px; | |||
| line-height: 40px; | |||
| text-align: center; | |||
| font-weight: 500; | |||
| } | |||
| .el-dialog__body { | |||
| padding-top: 0; | |||
| } | |||
| #my-dialog-close /deep/ .el-dialog__body { | |||
| padding-top: 0; | |||
| } | |||
| .tip-text { | |||
| line-height: 40px; | |||
| font-size: 16px; | |||
| text-align: center; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,629 @@ | |||
| <template> | |||
| <div class="rate-set-wrap"> | |||
| <!-- 跳点比率设置 label-width="120px" :rules="editRateRules"--> | |||
| <el-dialog id="my-dialog-title-left" title="自定义跳点设置 (注:营业额<=某区间金额,取该区间对应的扣点率)" :visible.sync="dialogVisible" width="900px" :modal-append-to-body='false'> | |||
| <div style="width:100%"> | |||
| <el-form ref="rateForm" :model="jumpRateObj" status-icon style="margin-top:15px;"> | |||
| <el-row :gutter="24" class=""> | |||
| <el-col :span="24"> | |||
| <el-form-item label-width="120px" label="时间范围" class="reprice"> | |||
| <el-select v-model="jumpRateObj.timeCycle" @change="changeTimeCycle" class="floatL ml_30"> | |||
| <el-option :value="item.value" :label="item.label" v-for="(item,index) in timeCycleList" :key="index"></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| </el-col> | |||
| <el-col :span="24" class="clearfix"> | |||
| <el-form-item label-width='120px' label="区间设置" class="reprice floatL"></el-form-item> | |||
| <!-- <el-form-item label="区间设置" prop="rateList"> --> | |||
| <ul class="pl_30 floatL clearfix"> | |||
| <li v-for="(item,index) in jumpRateObj.rateList" :key="index" class="rate-item clearfix"> | |||
| <el-form-item class="floatL numberInputBox"> | |||
| <el-input type="number" v-if="index==0" class="edit-rate-item mr_20" value="0" disabled></el-input> | |||
| </el-form-item> | |||
| <!-- <el-form-item class="floatL" :prop="'firstNum'+index" :rules="{required:true,message:'最多保留4位小数',trigger:'blur'}"> --> | |||
| <el-form-item class="floatL numberInputBox" :prop="'rateList.' + index + '.firstNum'" :rules="editRateRules.editFirstNum"> | |||
| <el-input type="number" @input="checkEditNum(item.firstNum,index)" v-if="index!=0" disabled class="edit-rate-item mr_20" v-model="item.firstNum"></el-input> | |||
| </el-form-item> | |||
| <span class="floatL mr_10 my-label-span">万元</span> <span class="floatL mr_10 my-label-span">— —</span> | |||
| <el-form-item class="floatL numberInputBox" :prop="'rateList.' + index + '.endNum'" :rules="editRateRules.editEndNum"> | |||
| <el-input :ref="'endNum'+index" @input="editNextItem(item,index)" type="number" class="edit-rate-item ml_20 mr_20" v-model="item.endNum"></el-input><span class="mr_10">万元</span> | |||
| </el-form-item> | |||
| <el-form-item class="floatL numberInputBox" :prop="'rateList.' + index + '.rateNum'" :rules="editRateRules.editRate"> | |||
| <el-input type="number" class="edit-rate-item-ratio mr_20" v-model="item.rateNum"></el-input><span class="mr_10">%</span> | |||
| </el-form-item> | |||
| <i v-show="index == jumpRateObj.rateList.length-1" @click="addRateLine" class="iconfont icon-jiahao ml-10 mr_20 add-rate-icon my-label-span"></i> | |||
| <i v-show="index == jumpRateObj.rateList.length-1 && index" @click="reduceRateLine" class="iconfont icon-jianhao mr_20 reduce-rate-icon my-label-span"></i> | |||
| </li> | |||
| </ul> | |||
| <!-- </el-form-item> --> | |||
| </el-col> | |||
| <el-col :span="24"> | |||
| <!-- <el-form-item label="上限设置" prop="rateList"> --> | |||
| <el-form-item label-width='120px' label="上限设置" class=""> | |||
| <el-switch class="ml_30" style="float:left;margin-top:8px;" v-model="addLimitType" active-color="#409EFF" inactive-color="#999"></el-switch> | |||
| </el-form-item> | |||
| <el-form-item label-width='120px' v-if="addLimitType" class=""> | |||
| <ul class="pl_30 floatL clearfix"> | |||
| <li> | |||
| <span class="floatL mr_10 my-label-span">超过</span> | |||
| <el-form-item class="floatL numberInputBox" prop="limitNum" :rules="editRateRules.editLimitNum"> | |||
| <el-input @input="checkLimitNum" type="number" class="edit-rate-item ml_20 mr_20" v-model="jumpRateObj.limitNum"></el-input> | |||
| </el-form-item> | |||
| <span class="floatL mr_10 my-label-span">万元时, 超出部分</span> | |||
| <el-form-item class="floatL numberInputBox" prop="limitRate" :rules="editRateRules.editLimitRate"> | |||
| <el-input type="number" class="edit-rate-item-ratio ml_20 mr_10" v-model="jumpRateObj.limitRate"></el-input> | |||
| </el-form-item> | |||
| <span class="floatL mr_10 my-label-span">%</span> | |||
| </li> | |||
| </ul> | |||
| </el-form-item> | |||
| <!-- </el-form-item> --> | |||
| </el-col> | |||
| </el-row> | |||
| </el-form> | |||
| </div> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button class="draftBtn" type="primary" @click="saveRateSet">保存设置</el-button> | |||
| <el-button class="putinBtn" @click="openJumpRateSetDialog">清空设置</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| <!-- --> | |||
| <close-jump-rate-set @doClearRateSet="clearRateSet" ref="closeJumpRateSetDialog"></close-jump-rate-set> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import { | |||
| deepcopy | |||
| } from "../../../utils/validate"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import closeJumpRateSet from './closeJumpRateSet.vue'; | |||
| var curEditRateList = []; | |||
| var curLimitNum = 0; | |||
| export default { | |||
| inject: ["reload"], | |||
| name: "jumpRateSet", | |||
| props: [], | |||
| components: { | |||
| closeJumpRateSet, | |||
| }, | |||
| data() { | |||
| return { | |||
| ...mapActions(["setRentInfo", "setFormData"]), | |||
| dialogVisible: false, | |||
| addLimitType: false, | |||
| timeCycleList: [ | |||
| { | |||
| label: '年', | |||
| value: 1, | |||
| }, | |||
| { | |||
| label: '月', | |||
| value: 2, | |||
| }, | |||
| { | |||
| label: '周期', | |||
| value: 3, | |||
| } | |||
| ], | |||
| //校验规则待完善 | |||
| editRateRules: { | |||
| editFirstNum: [ | |||
| { | |||
| required: true, | |||
| message: '最多保留4位小数', | |||
| trigger: 'blur' | |||
| }, | |||
| { | |||
| validator(rule, value, callback, source, options) { | |||
| value = Number(value); | |||
| let errors = []; | |||
| let numberReg = /^\d+$/; | |||
| let regPos = /^\d+(\.\d+)?$/; //非负浮点数 | |||
| if (!numberReg.test(value) && !regPos.test(value)) { | |||
| callback("最多保留4位小数"); | |||
| } | |||
| let str = value + ''; | |||
| if (str.indexOf('.') != -1) { | |||
| let arr = str.split('.'); | |||
| if (arr[1].length > 4) { | |||
| callback("最多保留4位小数"); | |||
| } | |||
| } | |||
| callback(errors); | |||
| } | |||
| } | |||
| ], | |||
| editEndNum: [ | |||
| { | |||
| required: true, | |||
| message: '最多保留4位小数', | |||
| trigger: 'blur' | |||
| }, | |||
| { | |||
| validator(rule, value, callback, source, options) { | |||
| value = Number(value); | |||
| let errors = []; | |||
| let numberReg = /^\d+$/; | |||
| let regPos = /^\d+(\.\d+)?$/; //非负浮点数 | |||
| if (!numberReg.test(value) && !regPos.test(value)) { | |||
| callback("请输入数字,最多保留4位小数"); | |||
| } | |||
| let str = value + ''; | |||
| if (str.indexOf('.') != -1) { | |||
| let arr = str.split('.'); | |||
| if (arr[1].length > 4) { | |||
| callback("最多保留4位小数"); | |||
| } | |||
| } | |||
| //判断从小到大输入 | |||
| /* let isOk = true; | |||
| curEditRateList.forEach((item, index) => { | |||
| item.firstNum = Number(item.firstNum); | |||
| item.endNum = Number(item.endNum); | |||
| if (index == 0) { | |||
| if (item.endNum <= 0) { | |||
| isOk = false; | |||
| } | |||
| } else { | |||
| if (item.firstNum < curEditRateList[index-1].endNum || item.firstNum >= item.endNum) { | |||
| isOk = false; | |||
| } | |||
| } | |||
| }) | |||
| if (!isOk) { | |||
| callback("请从小到大输入区间值"); | |||
| } */ | |||
| let dotStartNum = rule.field.indexOf('.'); | |||
| let dotEndNum = rule.field.indexOf('.',dotStartNum+1); | |||
| let curIndex = Number(rule.field.slice(dotStartNum+1,dotEndNum)); | |||
| for (let i=0;i<curEditRateList.length;i++) { | |||
| let item = curEditRateList[i]; | |||
| item.firstNum = Number(item.firstNum); | |||
| item.endNum = Number(item.endNum); | |||
| if (i <= curIndex) { | |||
| if (i == 0) { | |||
| if (item.endNum <= 0) { | |||
| callback("请输入正数"); | |||
| return; | |||
| } | |||
| } else { | |||
| if (item.firstNum < curEditRateList[i-1].endNum || item.firstNum >= item.endNum) { | |||
| callback("请从小到大输入区间值"); | |||
| return; | |||
| } | |||
| } | |||
| } | |||
| } | |||
| callback(errors); | |||
| } | |||
| } | |||
| ], | |||
| editLimitNum: [ | |||
| { | |||
| required: false, | |||
| message: '最多保留4位小数', | |||
| trigger: 'blur' | |||
| }, | |||
| { | |||
| validator(rule, value, callback, source, options) { | |||
| value = Number(value); | |||
| let errors = []; | |||
| curLimitNum = value; | |||
| if (value) { | |||
| let numberReg = /^\d+$/; | |||
| let regPos = /^\d+(\.\d+)?$/; //非负浮点数 | |||
| if (!numberReg.test(value) && !regPos.test(value)) { | |||
| callback("请输入数字,最多保留4位小数"); | |||
| } | |||
| let str = value + ''; | |||
| if (str.indexOf('.') != -1) { | |||
| let arr = str.split('.'); | |||
| if (arr[1].length > 4) { | |||
| callback("最多保留4位小数"); | |||
| } | |||
| } | |||
| //判断 | |||
| value = Number(value); | |||
| if (value != Number(curEditRateList[curEditRateList.length-1].endNum)) { | |||
| callback("请与区间值最大值保持一致"); | |||
| } else { | |||
| callback(errors); | |||
| } | |||
| } | |||
| callback(errors); | |||
| } | |||
| } | |||
| ], | |||
| editRate: [ | |||
| { | |||
| required: true, | |||
| message: '请输入0~100间的数', | |||
| trigger: 'blur' | |||
| }, | |||
| { | |||
| validator(rule, value, callback, source, options) { | |||
| let errors = []; | |||
| let numberReg = /^\d+$/; | |||
| let regPos = /^\d+(\.\d+)?$/; //非负浮点数 | |||
| if (!numberReg.test(value) && !regPos.test(value)) { | |||
| callback("请输入数字,最多保留2位小数"); | |||
| } | |||
| value = Number(value); | |||
| if (value < 0 || value >100) { | |||
| callback("请输入0~100间的数"); | |||
| } | |||
| let str = value + ''; | |||
| if (str.indexOf('.') != -1) { | |||
| let arr = str.split('.'); | |||
| if (arr[1].length > 2) { | |||
| callback("最多保留2位小数"); | |||
| } | |||
| } | |||
| callback(errors); | |||
| } | |||
| } | |||
| ], | |||
| editLimitRate: [ | |||
| { | |||
| required: false, | |||
| message: '请输入0~100间的数', | |||
| trigger: 'blur' | |||
| }, | |||
| { | |||
| validator(rule, value, callback, source, options) { | |||
| let errors = []; | |||
| if (!curLimitNum) { | |||
| if (value) { | |||
| callback("请先输入上限区间"); | |||
| } | |||
| callback(errors); | |||
| } else { | |||
| let numberReg = /^\d+$/; | |||
| let regPos = /^\d+(\.\d+)?$/; //非负浮点数 | |||
| if (!numberReg.test(value) && !regPos.test(value)) { | |||
| callback("请输入数字,最多保留2位小数"); | |||
| } | |||
| value = Number(value); | |||
| if (value < 0 || value >100) { | |||
| callback("请输入0~100间的数"); | |||
| } | |||
| let str = value + ''; | |||
| if (str.indexOf('.') != -1) { | |||
| let arr = str.split('.'); | |||
| if (arr[1].length > 2) { | |||
| callback("最多保留2位小数"); | |||
| } | |||
| } | |||
| } | |||
| callback(errors); | |||
| } | |||
| } | |||
| ], | |||
| }, | |||
| jumpRateObj:{ | |||
| timeCycle: 1, | |||
| limitNum: '', | |||
| limitRate: '', | |||
| rateList: [ | |||
| { | |||
| firstNum: 0, | |||
| endNum: '', | |||
| rateNum: '' | |||
| } | |||
| ] | |||
| }, | |||
| jumpRateBaseObj:{ | |||
| timeCycle: 1, | |||
| limitNum: '', | |||
| limitRate: '', | |||
| rateList: [ | |||
| { | |||
| firstNum: 0, | |||
| endNum: '', | |||
| rateNum: '' | |||
| } | |||
| ] | |||
| }, | |||
| }; | |||
| }, | |||
| mounted: function() { | |||
| //初始化处理 | |||
| this.dealRateInfo(); | |||
| // console.log(this.formData) | |||
| }, | |||
| watch: { | |||
| dialogVisible: function(newVal, oldVal) { | |||
| if (newVal) { | |||
| this.dealRateInfo(); | |||
| } | |||
| }, | |||
| 'jumpRateObj.rateList': function(newVal, oldVal) { | |||
| curEditRateList = newVal; | |||
| }, | |||
| addLimitType: function(newVal, oldVal) { | |||
| let val01 = ''; | |||
| let val02 = ''; | |||
| let arr = this.jumpRateObj.rateList; | |||
| if (arr[arr.length-1].endNum) { | |||
| val01 = arr[arr.length-1].endNum; | |||
| val02 = arr[arr.length-1].rateNum; | |||
| } | |||
| this.jumpRateObj.limitNum = val01; | |||
| this.jumpRateObj.limitRate = val02; | |||
| curLimitNum = val01; | |||
| } | |||
| }, | |||
| computed:{ | |||
| ...mapState({ | |||
| formData: state => state.setRentInfo.formData | |||
| }), | |||
| }, | |||
| methods: { | |||
| checkLimitNum() { | |||
| // umpRateObj.limitNum | |||
| }, | |||
| editNextItem(item,index) { | |||
| // | |||
| this.jumpRateObj.rateList.map((it,i) => { | |||
| if (index != i) { | |||
| console.log(this.$refs['endNum'+i]) | |||
| this.$refs['endNum'+i][0].blur(); | |||
| } | |||
| }) | |||
| // | |||
| if (index+1 < this.jumpRateObj.rateList.length) { | |||
| this.jumpRateObj.rateList[index+1].firstNum = item.endNum; | |||
| } | |||
| if (index+1 == this.jumpRateObj.rateList.length) { | |||
| this.jumpRateObj.limitNum = this.jumpRateObj.rateList[index].endNum; | |||
| this.jumpRateObj.limitRate = this.jumpRateObj.rateList[index].rateNum; | |||
| curLimitNum = this.jumpRateObj.rateList[index].endNum; | |||
| } | |||
| }, | |||
| //验证输入数字 | |||
| checkEditNum(val, index) { | |||
| // if (isNumber()) | |||
| }, | |||
| //添加rate行 | |||
| addRateLine() { | |||
| let curFirstStr = this.jumpRateObj.rateList[this.jumpRateObj.rateList.length-1].endNum; | |||
| curFirstStr = curFirstStr ? curFirstStr : ''; | |||
| let obj = { | |||
| firstNum: curFirstStr, | |||
| endNum: '', | |||
| rateNum: '' | |||
| } | |||
| this.jumpRateObj.rateList.push(obj); | |||
| }, | |||
| //删除rate行 | |||
| reduceRateLine() { | |||
| if (this.jumpRateObj.rateList.length > 1) { | |||
| this.jumpRateObj.rateList.pop(); | |||
| } | |||
| }, | |||
| //初始化处理 | |||
| dealRateInfo() { | |||
| if (this.formData.busDiscountRatio == undefined || this.formData.busDiscountTime == undefined || this.formData.payRatio == undefined) { | |||
| this.formData.busDiscountRatio = ''; | |||
| this.formData.busDiscountTime = 1; | |||
| this.formData.payRatio = 0; | |||
| } | |||
| let {busDiscountRatio, busDiscountTime} = this.formData; | |||
| this.jumpRateObj.timeCycle = busDiscountTime; | |||
| if (busDiscountRatio != '') { | |||
| let arr = JSON.parse(busDiscountRatio); | |||
| //如果有上限> | |||
| if (busDiscountRatio.indexOf('>') != -1) { | |||
| let curLastStr = arr.pop(); | |||
| let limitArr = []; | |||
| curLastStr = curLastStr.replace('>',','); | |||
| curLastStr = curLastStr.replace(':',','); | |||
| limitArr = curLastStr.split(','); | |||
| this.dealStrFormat(arr, busDiscountRatio); | |||
| this.jumpRateObj.limitNum = limitArr[1]; | |||
| this.jumpRateObj.limitRate = limitArr[2]/100; | |||
| this.addLimitType = true; | |||
| } else { | |||
| this.dealStrFormat(arr, busDiscountRatio); | |||
| } | |||
| } else { | |||
| // this.$set(this.jumpRateObj, this.jumpRateBaseObj); | |||
| // this.jumpRateObj = Object.assign({},this.jumpRateObj,this.jumpRateBaseObj); | |||
| this.jumpRateObj = deepcopy(this.jumpRateBaseObj); | |||
| } | |||
| }, | |||
| //deal | |||
| dealStrFormat(arr, busDiscountRatio) { | |||
| let curInfoArr = []; | |||
| //没有初始值-重置一个默认用于显示 | |||
| if (busDiscountRatio.indexOf('-') == -1) { | |||
| curInfoArr.push({ | |||
| firstNum: 0, | |||
| endNum: '', | |||
| }) | |||
| } else { | |||
| arr.map((item, index) => { | |||
| item = item.replace('-',','); | |||
| item = item.replace(':',','); | |||
| let curSplitArr = item.split(','); | |||
| let dealNum = Number(curSplitArr[2]); | |||
| //后端存储的时候要是三位正整数,保存的时候要*100,但是显示的时候要/100,在 | |||
| //往vuex存储的时候保存的是*100后的,提交保存的时候那步在其他页面也有,故在这里强制处理 | |||
| dealNum = this.dealNumFn(dealNum); | |||
| let obj = { | |||
| firstNum: curSplitArr[0], | |||
| endNum: curSplitArr[1], | |||
| rateNum: dealNum, | |||
| } | |||
| curInfoArr.push(obj); | |||
| }) | |||
| } | |||
| // this.jumpRateObj.rateList = curInfoArr; | |||
| this.$set(this.jumpRateObj,'rateList',curInfoArr) | |||
| // this.jumpRateObj.rateList = Object.assign({},this.jumpRateObj.rateList,curInfoArr); | |||
| }, | |||
| dealNumFn(dealNum) { | |||
| dealNum = dealNum+''; | |||
| let curNumLength = dealNum.length - 2; | |||
| curNumLength = curNumLength == 1 ? 2 : curNumLength; | |||
| dealNum = dealNum >= 100 ? dealNum/(Math.pow(10,curNumLength)) : dealNum; | |||
| dealNum = Number(dealNum); | |||
| return dealNum; | |||
| }, | |||
| // this.$refs["form"].clearValidate(); | |||
| //保存设置 | |||
| saveRateSet() { | |||
| this.$refs['rateForm'].validate((valid) => { | |||
| if (valid) { | |||
| let curReturnRateArr = []; | |||
| let turnArr = deepcopy(this.jumpRateObj.rateList); | |||
| for (let i=0;i<turnArr.length;i++) { | |||
| let item = turnArr[i]; | |||
| item.firstNum = Number(item.firstNum); | |||
| item.endNum = Number(item.endNum); | |||
| item.rateNum = Number(item.rateNum); | |||
| item.rateNum = (Number(item.rateNum) * 100).toFixed(0); | |||
| if (i != 0) { | |||
| if (item.endNum > item.firstNum && item.firstNum >= turnArr[i-1].endNum) { | |||
| let str = ''; | |||
| str = item.firstNum + '-' + item.endNum + ':' +item.rateNum; | |||
| curReturnRateArr.push(str); | |||
| } else { | |||
| continue; | |||
| } | |||
| } else { | |||
| if (item.firstNum < item.endNum && item.rateNum) { | |||
| let str = ''; | |||
| str = item.firstNum + '-' + item.endNum + ':' +item.rateNum; | |||
| curReturnRateArr.push(str); | |||
| } | |||
| } | |||
| } | |||
| //如果有上限 | |||
| if (this.addLimitType && this.jumpRateObj.limitNum && this.jumpRateObj.limitRate) { | |||
| curReturnRateArr.push(`>${this.jumpRateObj.limitNum}:${(Number(this.jumpRateObj.limitRate) * 100).toFixed(0)}`); | |||
| } | |||
| curReturnRateArr = JSON.stringify(curReturnRateArr); | |||
| let curObj = Object.assign({},this.formData); | |||
| curObj.busDiscountRatio = curReturnRateArr; | |||
| curObj.busDiscountTime = Number(this.jumpRateObj.timeCycle); | |||
| curObj.payRatio = 0; | |||
| this.setFormData(curObj); | |||
| this.$refs.rateForm.clearValidate(); | |||
| this.dialogVisible = false; | |||
| // this.jumpRateObj.rateList = []; | |||
| } | |||
| }) | |||
| }, | |||
| openJumpRateSetDialog() { | |||
| this.$refs['closeJumpRateSetDialog'].openDialog(); | |||
| }, | |||
| clearRateSet() { | |||
| let curObj = Object.assign({},this.formData); | |||
| curObj.busDiscountRatio = ''; | |||
| curObj.busDiscountTime = 1; | |||
| curObj.payRatio = 0; | |||
| this.setFormData(curObj); | |||
| this.$refs.rateForm.resetFields(); | |||
| this.dialogVisible = false; | |||
| this.dealRateInfo(); | |||
| }, | |||
| openDialog() { | |||
| this.dialogVisible = true; | |||
| }, | |||
| changeTimeCycle(val) { | |||
| this.formData.busDiscountTime = val; | |||
| this.setFormData(this.formData); | |||
| }, | |||
| } | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| li { | |||
| list-style-type: none; | |||
| } | |||
| .edit-rate-item { | |||
| width: 140px; | |||
| } | |||
| .edit-rate-item-ratio { | |||
| width: 80px; | |||
| } | |||
| .rate-item { | |||
| margin-top: 8px; | |||
| } | |||
| .rate-item:first-child { | |||
| margin-top: 0; | |||
| } | |||
| .my-label-span { | |||
| height: 40px; | |||
| line-height: 40px; | |||
| } | |||
| .el-dialog__title { | |||
| float: left!important; | |||
| } | |||
| #my-dialog-title-left /deep/ .el-dialog__title { | |||
| float: left; | |||
| } | |||
| #my-dialog-title-left /deep/ .el-dialog__body { | |||
| padding-bottom: 0; | |||
| } | |||
| #my-dialog-title-left /deep/ .el-input__validateIcon { | |||
| display: none; | |||
| } | |||
| .add-rate-icon { | |||
| font-size: 20px; | |||
| } | |||
| .reduce-rate-icon { | |||
| font-size: 20px; | |||
| } | |||
| #my-dialog-title-left /deep/ .el-form-item { | |||
| margin-bottom: 12px; | |||
| } | |||
| .label-item-span { | |||
| text-align: center; | |||
| } | |||
| .floatL { | |||
| float: left; | |||
| } | |||
| .draftBtn { | |||
| width: 104px; | |||
| height: 38px; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,214 @@ | |||
| <template> | |||
| <div> | |||
| <div class="layout-content"> | |||
| <div class="text-content"> | |||
| <el-row v-if="approvalType" style="margin-bottom:30px;"> | |||
| <el-col :span="3" class="title">审批类型:</el-col> | |||
| <el-col :span="21" class="title">{{getApproavl()}}</el-col> | |||
| </el-row> | |||
| <el-row v-for="(item,index) in applyData" :key="index"> | |||
| <el-col :span="3" class="left"> | |||
| <div class="date">{{changeDate(item.updateDate,0)}}</div> | |||
| <div class="time">{{changeDate(item.updateDate,1)}}</div> | |||
| </el-col> | |||
| <el-col :span="1" class="center"> | |||
| <div class="img" v-if="index!=0"> | |||
| <div class="circle"></div> | |||
| </div> | |||
| <div class="icon-img" v-if="index==0"> | |||
| <i | |||
| :class="'iconfont iconBox '+changeIcon(item.status)" | |||
| style="color:rgba(200, 89, 98, 1);font-size:26px" | |||
| ></i> | |||
| </div> | |||
| <div | |||
| class="line" | |||
| :style="'height:'+(item.remark!=undefined?((((1519-308)*5)/6)/(((bodyWidth-308)*5)/6))*((item.remark.length/70))*32+58:'58')+'px'" | |||
| ></div> | |||
| </el-col> | |||
| <el-col :span="20" class="right"> | |||
| <div | |||
| class="right-title" | |||
| :style="'color:'+(index==0?'rgba(200, 89, 98, 1)':'rgba(51,51,51,1)')" | |||
| >{{changeApplyStatus(item.status)}}</div> | |||
| <div class="right-content">{{item.remark}}</div> | |||
| <div class="right-content">{{'操作人:'+item.userName}}</div> | |||
| </el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="group-btn"> | |||
| <el-button class="quxiaoBtn" @click="cancel()">返回</el-button> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import TableList from "../../../core/comps/table/tableList.vue"; | |||
| import moment from "moment"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import { ContractData } from "../../../service/contract/data.js"; | |||
| import { CouponCacheData } from "../../../service/couponData/data.js"; | |||
| export default { | |||
| inject: ["reload"], | |||
| name: "rentApprovals", | |||
| components: { | |||
| TableList, | |||
| }, | |||
| data() { | |||
| return { | |||
| applyData: [], | |||
| bodyWidth: 0, | |||
| approvalType:''//券审批操作类型 | |||
| }; | |||
| }, | |||
| computed: { | |||
| ...mapState({ | |||
| navigationInfo: state => state.topNav.navigationInfo | |||
| }) | |||
| }, | |||
| methods: { | |||
| ...mapActions([ | |||
| "setNavData" // 将this.setNavData 映射为 this.$store.dispatch('setNavData') | |||
| ]), | |||
| changeIcon(status) { | |||
| return status | |||
| ? ContractData.applyHistoryStatus.filter(e => e.value == status)[0].icon | |||
| : ""; | |||
| }, | |||
| getApproavl(){ | |||
| return CouponCacheData.couponApplyType.filter(e=>e.value==this.approvalType)[0].name | |||
| }, | |||
| cancel: function() { | |||
| this.$router.back(-1); | |||
| }, | |||
| changeDate(date, index) { | |||
| if (index === 0) { | |||
| return moment(date).format("YYYY-MM-DD"); | |||
| } else { | |||
| return moment(date).format("HH:mm:ss"); | |||
| } | |||
| }, | |||
| changeApplyStatus(item) { | |||
| return item | |||
| ? ContractData.applyHistoryStatus.filter(e => e.value == item)[0].name | |||
| : ""; | |||
| }, | |||
| getData() { | |||
| this.getFetch( | |||
| "/api/workflow/applyHistory?businessId=" + this.$route.query.id | |||
| // "/api/wxRentPropertyContract/getContractApplyInfo?rentId=" + this.$route.query.id + '&propertyId='+this.$route.propertyId | |||
| ) | |||
| .then(d => { | |||
| this.applyData = d.data; | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| } | |||
| }, | |||
| mounted() { | |||
| this.setNavData(["合同管理", "审批进度"]); | |||
| if(this.$route.query.approvalType!=0&&this.$route.query.approvalType){ | |||
| this.approvalType = this.$route.query.approvalType | |||
| } | |||
| }, | |||
| created() { | |||
| this.getData(); | |||
| this.bodyWidth = document.body.offsetWidth; | |||
| } | |||
| }; | |||
| </script> | |||
| <!-- Add "scoped" attribute to limit CSS to this component only --> | |||
| <style scoped> | |||
| .title{ | |||
| font-size: 16px; | |||
| font-weight: 600; | |||
| padding-right: 20px; | |||
| text-align: left; | |||
| } | |||
| .title:first-child{ | |||
| text-align: right; | |||
| } | |||
| .layout-content { | |||
| width: 100%; | |||
| background: #141e29; | |||
| height: auto; | |||
| border-radius: 2px; | |||
| min-height: 300px; | |||
| padding: 0 20px 20px 20px; | |||
| overflow: hidden; | |||
| text-align: left; | |||
| } | |||
| .text-content { | |||
| padding: 30px 0; | |||
| width: 100%; | |||
| height: auto; | |||
| background: #fff; | |||
| } | |||
| .left { | |||
| text-align: right; | |||
| padding-right: 20px; | |||
| } | |||
| .date { | |||
| font-size: 14px; | |||
| font-family: MicrosoftYaHei; | |||
| font-weight: 400; | |||
| color: rgba(153, 153, 153, 1); | |||
| line-height: 32px; | |||
| } | |||
| .time { | |||
| font-size: 14px; | |||
| font-family: MicrosoftYaHei; | |||
| font-weight: 400; | |||
| color: rgba(51, 51, 51, 1); | |||
| line-height: 26px; | |||
| } | |||
| .img { | |||
| width: 26px; | |||
| height: 26px; | |||
| border-radius: 13px; | |||
| border: 1px solid rgba(234, 240, 254, 1); | |||
| box-sizing: border-box; | |||
| margin: 4px auto; | |||
| } | |||
| .icon-img { | |||
| width: 30px; | |||
| height: 30px; | |||
| margin: 4px auto; | |||
| } | |||
| .circle { | |||
| width: 20px; | |||
| height: 20px; | |||
| border-radius: 10px; | |||
| background: rgba(234, 240, 254, 1); | |||
| margin: 2px auto 0; | |||
| box-sizing: border-box; | |||
| } | |||
| .line { | |||
| /* height: 64px; */ | |||
| width: 2px; | |||
| background: rgba(234, 240, 254, 1); | |||
| border-radius: 1px; | |||
| margin: 0 auto; | |||
| box-sizing: border-box; | |||
| } | |||
| .right { | |||
| padding: 0 40px 0 20px; | |||
| } | |||
| .right-title { | |||
| font-size: 18px; | |||
| font-family: MicrosoftYaHei; | |||
| font-weight: 400; | |||
| color: rgba(51, 51, 51, 1); | |||
| line-height: 32px; | |||
| } | |||
| .right-content { | |||
| font-size: 14px; | |||
| font-family: MicrosoftYaHei; | |||
| font-weight: 400; | |||
| color: rgba(153, 153, 153, 1); | |||
| line-height: 26px; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,587 @@ | |||
| <template> | |||
| <div> | |||
| <div class="layout-content"> | |||
| <el-form | |||
| :inline="true" | |||
| :model="ruleForm" | |||
| ref="ruleForm" | |||
| class="demo-form-inline" | |||
| label-position="right" | |||
| > | |||
| <el-form-item label="商铺号" prop="name" class="fx_title"> | |||
| <el-input v-model.trim="ruleForm.shopNumber" placeholder="请输入" clearable></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="商户名称" prop="merchantName" class="fx_title"> | |||
| <el-input v-model.trim="ruleForm.merchantName" placeholder="请输入" clearable></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="合同状态" class="fx_send"> | |||
| <el-select v-model="ruleForm.status" placeholder="请选择" clearable class="select-method"> | |||
| <el-option | |||
| v-for="(item,index) in options" | |||
| :key="index" | |||
| :value="item.value" | |||
| :label="item.label" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="审批状态" class="fx_send"> | |||
| <el-select v-model="ruleForm.applyStatus" placeholder="请选择" clearable class="select-method"> | |||
| <el-option | |||
| v-for="(item,index) in applyStatusOptions" | |||
| :key="index" | |||
| :value="item.value" | |||
| :label="item.name" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="计租方式" class="fx_send"> | |||
| <el-select v-model="ruleForm.type" placeholder="请选择" clearable class="select-method"> | |||
| <el-option | |||
| v-for="(item,index) in types" | |||
| :key="index" | |||
| :value="item.value" | |||
| :label="item.label" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item> | |||
| <el-button | |||
| class="hoverBtn" | |||
| type="primary" | |||
| icon="el-icon-search" | |||
| :style="'border:0;background:'+navigationInfo.moduleColor" | |||
| size="medium" | |||
| @click="search" | |||
| ></el-button> | |||
| </el-form-item> | |||
| </el-form> | |||
| <el-button type="primary" class="builtBtn" @click="goSave" style="margin-right:4px;"> | |||
| <i>+</i>新建 | |||
| </el-button> | |||
| <!-- <el-button type="primary" class="builtBtn" @click="goBulu" style="margin-left:4px;"> | |||
| <i>+</i>补录 | |||
| </el-button> --> | |||
| <el-button type="primary" class="builtBtn" @click="goRenew" style="margin-left:4px;"> | |||
| <i>+</i>续签 | |||
| </el-button> | |||
| <table-list :ref="tk" :options="optionsTable"></table-list> | |||
| <stop-contract :ref="st" :type='6' :processData="processData" :options="stopOptions"></stop-contract> | |||
| </div> | |||
| <div> | |||
| <el-dialog | |||
| title="提示" | |||
| :visible.sync="dialogVisible" | |||
| width="40%" | |||
| :modal-append-to-body="false" | |||
| :before-close="handleClose" | |||
| > | |||
| <span>当前有欠缴账单未结清,是否要继续终止合同?</span> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button @click="dialogVisible = false">取 消</el-button> | |||
| <el-button type="primary" @click="stopContract">确定</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import TableList from "../../../core/comps/table/tableList.vue"; | |||
| import StopContract from "../contractutil/stopcontract.vue"; | |||
| import commonUtil from "../../../core/tool/commonUtil"; | |||
| import reportTool from "../../../core/tool/report.js"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import { CouponCacheData } from "../../../service/couponData/data.js"; | |||
| import { ContractData } from "../../../service/contract/data.js"; | |||
| import { promissionUrl } from "../../../urlconfig/promission/url.js"; | |||
| let echarts = require("echarts"); | |||
| export default { | |||
| inject: ["reload"], | |||
| name: "rentlist", | |||
| components: { | |||
| TableList, | |||
| StopContract | |||
| }, | |||
| data() { | |||
| return { | |||
| processData:[], | |||
| waitSignCount: "", //待签约 | |||
| endSoonCount: "", //将到期合同 | |||
| dialogVisible: false, | |||
| rendPaidCount: "", //计租中合同 | |||
| shopcount: "", //空余商铺 | |||
| tk: "manjianTableKey", | |||
| st: "stopContract", | |||
| stopOptions: { | |||
| contractType: "1" | |||
| }, | |||
| applyStatusOptions:ContractData.applyStatus, | |||
| ruleForm: { | |||
| shopNumber: "", | |||
| merchantName: "", | |||
| status: "", | |||
| type: "", | |||
| applyStatus:"" | |||
| }, | |||
| options: ContractData.statusOptions, | |||
| types: [ | |||
| { | |||
| value: "1", | |||
| label: "按租赁面积" | |||
| }, | |||
| { | |||
| value: "2", | |||
| label: "联营扣点" | |||
| }, | |||
| { | |||
| value: 3, | |||
| label: "面积计租、联营取高" | |||
| } | |||
| ], | |||
| optionsTable: { | |||
| actions: [ | |||
| { | |||
| key: "edit", | |||
| val: "提交审批", | |||
| action: this.doApply, | |||
| show: item => { | |||
| return item.status == 1 | |||
| ? true | |||
| : false; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "编辑", | |||
| action: this.aCount, | |||
| show: item => { | |||
| return item.status == 10 && (item.applyStatus == 3 || item.applyStatus == 5) | |||
| ? true | |||
| : false; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "终止", | |||
| action: this.endcontract, | |||
| show: item => { | |||
| if ( | |||
| (item.status == 2 || item.status == 3) | |||
| ) { | |||
| return true; | |||
| } else { | |||
| return false; | |||
| } | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "查看", | |||
| action: this.goCheck, | |||
| show: item => { | |||
| return true; | |||
| } | |||
| }, | |||
| { | |||
| key: "download", | |||
| val: "下载", | |||
| action: this.goDownload, | |||
| show: item => { | |||
| return true; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "审批进度", | |||
| action: this.checkCurrentStatus, | |||
| show: item => { | |||
| return item.applyStatus == 1 || | |||
| item.applyStatus == 2 || | |||
| item.applyStatus == 3 || | |||
| item.applyStatus == 5 | |||
| ? true | |||
| : false; | |||
| } | |||
| }, | |||
| // { | |||
| // key: "edit", | |||
| // val: "绑定商户", | |||
| // action: this.goToEditShop, | |||
| // show: item => { | |||
| // return (item.applyStatus == 2||(item.applyStatus == 0 && !item.merchantId)) && item.status == 1 ? true : false; | |||
| // } | |||
| // } | |||
| ], | |||
| showCk: false, | |||
| map: [ | |||
| { | |||
| key: "contractNumber", | |||
| val: "合同编号" | |||
| }, | |||
| { | |||
| key: "shopNumber", | |||
| val: "商铺号", | |||
| convert: this.changeShopNum, | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "merchantName", | |||
| val: "商户名称" | |||
| }, | |||
| { | |||
| key: "rentalStartDate", | |||
| val: "租赁开始日期", | |||
| type: "date", | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "rentalEndDate", | |||
| val: "租赁结束日期", | |||
| type: "date", | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "price", | |||
| val: "租金", | |||
| convert: this.divide, | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "type", | |||
| val: "计租方式", | |||
| convert: this.ctype | |||
| }, | |||
| { | |||
| key: "status", | |||
| val: "合同状态", | |||
| convert: this.cStatus | |||
| }, | |||
| { | |||
| key: "applyStatus", | |||
| val: "审批状态", | |||
| convert: this.cApplyStatus | |||
| } | |||
| ], | |||
| getUrl: () => { | |||
| return ( | |||
| "/api/wxRentContract/list?merchantName=" + | |||
| this.ruleForm.merchantName + | |||
| "&shopNumber=" + | |||
| this.ruleForm.shopNumber + | |||
| "&status=" + | |||
| this.ruleForm.status + | |||
| "&type=" + | |||
| this.ruleForm.type + | |||
| "&rentShopType=1&applyStatus=" + | |||
| this.ruleForm.applyStatus+ | |||
| "&operationType=1" | |||
| ); | |||
| }, | |||
| pageOption: { | |||
| sizeKey: "pageSize", | |||
| indexKey: "pageNum", | |||
| index: 1, | |||
| size: 10 | |||
| }, | |||
| analysis: data => { | |||
| return { | |||
| data: data.data.list, | |||
| count: data.data.total | |||
| }; | |||
| } | |||
| } | |||
| }; | |||
| }, | |||
| computed: { | |||
| ...mapState({ | |||
| navigationInfo: state => state.topNav.navigationInfo | |||
| }) | |||
| }, | |||
| methods: { | |||
| ...mapActions([ | |||
| "setNavData" // 将this.setNavData 映射为 this.$store.dispatch('setNavData') | |||
| ]), | |||
| doApply(item,row) { | |||
| console.log(item) | |||
| let params = { | |||
| remark: '', | |||
| id: item.id | |||
| } | |||
| this.postFetch("/api/wxRentContract/apply",params) | |||
| .then(d => { | |||
| }) | |||
| .catch(err => { | |||
| this.$message.success(err.data); | |||
| }); | |||
| }, | |||
| changeShopNum(item, row) { | |||
| let rentInfo = JSON.parse(row.rentInfo); | |||
| let str = ""; | |||
| rentInfo.map((items, indexs) => { | |||
| str = str != "" ? str + " ," + items.shopNumber : items.shopNumber; | |||
| }); | |||
| return str; | |||
| }, | |||
| cApplyStatus(col, item) { | |||
| if (item.applyStatus) { | |||
| return ( | |||
| (item.businessType != 6 ? "签约" : "终止") + | |||
| ContractData.applyStatus.filter(e => e.value == item.applyStatus)[0] | |||
| .name | |||
| ); | |||
| } else if (item.applyStatus === 0) { | |||
| return "未提交审核"; | |||
| } | |||
| }, | |||
| goToEditShop(item) { | |||
| this.$router.push({ | |||
| path: "/merchant/merchantAdd?contractId=" + item.id | |||
| }); | |||
| }, | |||
| checkCurrentStatus(item, row) { | |||
| this.$router.push({ | |||
| path: "rentApprovals?id=" + item.id + 'propertyId'+item.operationType | |||
| }); | |||
| }, | |||
| cStatus(col, item) { | |||
| return CouponCacheData.rentStatus.filter(e => { | |||
| return e.value == item.status.toString(); | |||
| })[0].name; | |||
| }, | |||
| divide(col, item) { | |||
| if (item.bus_discount_ratio != undefined && item.bus_discount_time != 0 && item.bus_discount_ratio !='') { | |||
| return Number(item.price) / 100 +(item.bus_discount_time==1?'元/年':item.bus_discount_time==2?'元/月':'元/周期'); | |||
| } else { | |||
| return Number(item.price) / 100 +(item.price_unit==1?'元/日':item.price_unit==2?'元/月':'元/年'); | |||
| } | |||
| }, | |||
| ctype(col, item) { | |||
| if (item.type == 1) { | |||
| return "按租赁面积"; | |||
| } else if (item.type == 2) { | |||
| return "联营扣点"; | |||
| } else { | |||
| return "面积计租、联营取高"; | |||
| } | |||
| }, | |||
| aCount: function(item, row) { | |||
| /* if (item.merchantId) { | |||
| this.$router.push({ | |||
| path: "rentBulu?id=" + item.id | |||
| }); | |||
| } else { | |||
| this.$router.push({ | |||
| path: "rentEdit?id=" + item.id | |||
| }); | |||
| } */ | |||
| this.$router.push({ | |||
| path: "rentEdit?id=" + item.id | |||
| }); | |||
| }, | |||
| goCheck: function(item, row) { | |||
| /** | |||
| contractType合同类型:1租金合同,2多经合同,3物业合同,4多经物业合同 | |||
| businessType操作类型:1合同审批,2账单审批,3终止合同审批 | |||
| id为合同id | |||
| */ | |||
| this.$router.push({ | |||
| path: `rentsCheck?id=${item.id}&contractType=1&businessType=1` | |||
| }); | |||
| }, | |||
| handleClose(done) { | |||
| this.$confirm("确认关闭?") | |||
| .then(_ => { | |||
| done(); | |||
| }) | |||
| .catch(_ => {}); | |||
| }, | |||
| endcontract: function(item, row) { | |||
| let that = this; | |||
| this.getFetch("/api/wxBillAll/oweBillCount?type=1&contractId=" + item.id) | |||
| .then(d => { | |||
| if (Number(d.data) > 0) { | |||
| that.dialogVisible = true; | |||
| that.contractId = item.id; | |||
| that.contractNumber = item.contractNumber; | |||
| } else { | |||
| this.$refs[this.st].showLog(item.id, item.contractNumber); | |||
| } | |||
| }) | |||
| .catch(err => { | |||
| this.$message.success(err.data); | |||
| }); | |||
| }, | |||
| stopContract() { | |||
| this.dialogVisible = false; | |||
| this.$refs[this.st].showLog(this.contractId, this.contractNumber); | |||
| }, | |||
| goSave: function() { | |||
| this.$router.push({ | |||
| path: "/rentEdit?" +'fromNew='+true | |||
| }); | |||
| }, | |||
| goBulu: function() { | |||
| this.$router.push({ | |||
| path: "/rentBulu" | |||
| }); | |||
| }, | |||
| goRenew(){ | |||
| this.$router.push({ | |||
| path: "/rentEdit", | |||
| query:{ | |||
| Renew:true | |||
| } | |||
| }); | |||
| }, | |||
| goDownload: function(item) { | |||
| location.href = "/api/wxRentContract/exportContract?id=" + item.id; | |||
| }, | |||
| getcount: function() { | |||
| this.getFetch( | |||
| "/api/wxRentContract/list?pageNum=1&pageSize=10&shopNumber=" + | |||
| this.ruleForm.shopNumber + | |||
| "&merchantName=" + | |||
| this.ruleForm.merchantName + | |||
| "&status=" + | |||
| this.ruleForm.status + | |||
| "&rentShopType=1" | |||
| ) | |||
| .then(d => { | |||
| /* this.waitSignCount = d.data.rentContractStatusInfo.waitSignCount; //带签约合同 | |||
| this.endSoonCount = d.data.rentContractStatusInfo.endSoonCount; //将到期合同 | |||
| this.rendPaidCount = d.data.rentContractStatusInfo.rendPaidCount; //计租中合同 | |||
| this.shopcount = | |||
| d.data.rentContractStatusInfo.shopCountInfo.unrentedCount; //空余商铺 | |||
| let allRentCount = | |||
| Number(d.data.rentContractStatusInfo.allCount) == 0 | |||
| ? 100 | |||
| : Number(d.data.rentContractStatusInfo.allCount); //合同总数 | |||
| let allShopCount = | |||
| Number(d.data.rentContractStatusInfo.shopCountInfo.allCount) == 0 | |||
| ? 100 | |||
| : Number(d.data.rentContractStatusInfo.shopCountInfo.allCount); //商铺总数 | |||
| let value_spare = Number(this.shopcount) || 0; | |||
| let myChart_spare = echarts.init(document.getElementById("spare")); | |||
| myChart_spare.setOption( | |||
| reportTool.myPie("空余商铺", "#5976BF", value_spare, allShopCount) | |||
| ); | |||
| let value_signed = Number(this.waitSignCount) || 0; | |||
| let myChart_signed = echarts.init(document.getElementById("signed")); | |||
| myChart_signed.setOption( | |||
| reportTool.myPie("待签约", "#C85963", value_signed, allRentCount) | |||
| ); | |||
| let value_expire = Number(this.endSoonCount) || 0; | |||
| let myChart_expire = echarts.init(document.getElementById("expire")); | |||
| myChart_expire.setOption( | |||
| reportTool.myPie("将到期", "#EE7653", value_expire, allRentCount) | |||
| ); | |||
| let value_planning = Number(this.rendPaidCount) || 0; | |||
| let myChart_planning = echarts.init( | |||
| document.getElementById("planning") | |||
| ); | |||
| myChart_planning.setOption( | |||
| reportTool.myPie("计租中", "#3FC496", value_planning, allRentCount) | |||
| ); */ | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| }, | |||
| search: function() { | |||
| let tk = this.$refs[this.tk]; | |||
| tk.search(tk.getParams().index); | |||
| }, | |||
| /** | |||
| * 根据业务查询模板 | |||
| */ | |||
| getModelBybusiness(){ | |||
| this.getFetch(`${promissionUrl.getModelBybusiness}?flowType=6`) | |||
| .then(d=>{ | |||
| if(d.data.length>0){ | |||
| this.processData = JSON.parse(d.data[0].flow).lists; | |||
| } | |||
| }) | |||
| .catch(err=>{ | |||
| this.$message.error(err.data); | |||
| }) | |||
| } | |||
| }, | |||
| activated(){ | |||
| this.search() | |||
| // this.getcount(); | |||
| this.getModelBybusiness(); | |||
| this.setNavData(["合同管理", "店铺", "租金合同"]); | |||
| }, | |||
| created() { | |||
| if (this.$route.query.status) { | |||
| this.ruleForm.status = this.$route.query.status.toString(); | |||
| }; | |||
| } | |||
| }; | |||
| </script> | |||
| <!-- Add "scoped" attribute to limit CSS to this component only --> | |||
| <style scoped> | |||
| .layout-content { | |||
| width: 100%; | |||
| background: #141e29; | |||
| height: auto; | |||
| border-radius: 2px; | |||
| min-height: 300px; | |||
| padding: 0 20px 20px 20px; | |||
| overflow: hidden; | |||
| text-align: left; | |||
| } | |||
| .el-form { | |||
| background: #f5f7f8; | |||
| text-align: left; | |||
| padding: 25px 22px 22px; | |||
| margin-bottom: 20px !important; | |||
| } | |||
| .el-form .el-form-item { | |||
| margin-bottom: 0 !important; | |||
| } | |||
| .tableContainer { | |||
| margin-top: 20px !important; | |||
| background: #fff; | |||
| } | |||
| .el-button { | |||
| /* width:60px; */ | |||
| height: 40px; | |||
| } | |||
| .builtBtn { | |||
| width: 80px; | |||
| height: 32px; | |||
| background: rgba(81, 169, 201, 1); | |||
| border: 0 !important; | |||
| line-height: 32px; | |||
| text-align: center; | |||
| margin: 0; | |||
| padding: 0 !important; | |||
| } | |||
| .builtBtn:hover { | |||
| background: rgba(81, 169, 201, 0.88); | |||
| } | |||
| .builtBtn i { | |||
| margin-right: 10px; | |||
| } | |||
| .el-form-item .el-form-item__content, | |||
| .el-form-item .el-form-item__content .el-date-editor, | |||
| .el-form-item .el-form-item__content .el-date-editor .el-input__inner { | |||
| width: 150px; | |||
| } | |||
| /* .fx_send .el-form-item__content .el-select { | |||
| width: 153px !important; | |||
| } */ | |||
| .fx_title .el-input { | |||
| width: 193px; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,173 @@ | |||
| <template> | |||
| <div class="show-rate-wrap"> | |||
| <ul class="rate-show-list clearfix"> | |||
| <li>{{computedCycleStr}}</li> | |||
| <li v-for="(item, index) in jumpRateObj.rateList" :key="index">{{`${item.firstNum}-${item.endNum}万 扣点 ${item.rateNum}%`}}</li> | |||
| <li v-if="jumpRateObj.limitNum && jumpRateObj.limitRate">{{`超过${jumpRateObj.limitNum}万时,超出部分扣点 ${jumpRateObj.limitRate}%`}}</li> | |||
| </ul> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import { | |||
| deepcopy | |||
| } from "../../../utils/validate"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import { promissionUrl } from "../../../urlconfig/promission/url.js"; | |||
| export default { | |||
| inject: ["reload"], | |||
| name: "jumpRateSet", | |||
| props: ['parentJumpRateObj'], | |||
| components: { | |||
| }, | |||
| data() { | |||
| return { | |||
| ...mapActions(["setRentInfo", "setFormData"]), | |||
| jumpRateObj:{ | |||
| timeCycle: 1, | |||
| limitNum: '', | |||
| limitRate: '', | |||
| rateList: [ | |||
| ] | |||
| }, | |||
| jumpRateBaseObj:{ | |||
| timeCycle: 1, | |||
| limitNum: '', | |||
| limitRate: '', | |||
| rateList: [ | |||
| ] | |||
| }, | |||
| }; | |||
| }, | |||
| mounted: function() { | |||
| //初始化处理 | |||
| this.dealRateInfo(); | |||
| }, | |||
| computed:{ | |||
| ...mapState({ | |||
| formData: state => state.setRentInfo.formData | |||
| }), | |||
| computedCycleStr() { | |||
| if (this.jumpRateObj.timeCycle == 1) { | |||
| return '年营业额'; | |||
| } else if (this.jumpRateObj.timeCycle == 2) { | |||
| return '月营业额'; | |||
| } else if (this.jumpRateObj.timeCycle == 3) { | |||
| return '周期营业额'; | |||
| } | |||
| }, | |||
| }, | |||
| watch: { | |||
| formData: { | |||
| handler(newVal, oldVal) { | |||
| this.dealRateInfo(); | |||
| }, | |||
| deep: true, | |||
| immediate: true | |||
| } | |||
| }, | |||
| methods: { | |||
| //初始化处理 | |||
| dealRateInfo() { | |||
| if (this.formData.busDiscountRatio == undefined || this.formData.busDiscountTime == undefined || this.formData.payRatio == undefined) { | |||
| this.formData.busDiscountRatio = ''; | |||
| this.formData.busDiscountTime = 1; | |||
| this.formData.payRatio = 0; | |||
| } | |||
| let {busDiscountRatio, busDiscountTime} = this.formData; | |||
| if (busDiscountRatio != '') { | |||
| let arr = JSON.parse(busDiscountRatio); | |||
| //如果有上限> | |||
| if (busDiscountRatio.indexOf('>') != -1) { | |||
| let curLastStr = arr.pop(); | |||
| let limitArr = []; | |||
| curLastStr = curLastStr.replace('>',','); | |||
| curLastStr = curLastStr.replace(':',','); | |||
| limitArr = curLastStr.split(','); | |||
| this.dealStrFormat(arr, busDiscountRatio); | |||
| this.jumpRateObj.limitNum = limitArr[1]; | |||
| this.jumpRateObj.limitRate = limitArr[2]/100; | |||
| } else { | |||
| this.dealStrFormat(arr, busDiscountRatio); | |||
| this.jumpRateObj.limitNum = ''; | |||
| this.jumpRateObj.limitRate = ''; | |||
| } | |||
| } else { | |||
| this.jumpRateObj = deepcopy(this.jumpRateBaseObj); | |||
| // this.jumpRateObj = Object.assign({},this.jumpRateObj,this.jumpRateBaseObj); | |||
| } | |||
| }, | |||
| //deal | |||
| dealStrFormat(arr, busDiscountRatio) { | |||
| let curInfoArr = []; | |||
| //没有初始值-重置一个默认用于显示 | |||
| if (busDiscountRatio.indexOf('-') == -1) { | |||
| curInfoArr.push({ | |||
| firstNum: 0, | |||
| endNum: '', | |||
| }) | |||
| } else { | |||
| arr.map((item, index) => { | |||
| item = item.replace('-',','); | |||
| item = item.replace(':',','); | |||
| let curSplitArr = item.split(','); | |||
| let dealNum = Number(curSplitArr[2]); | |||
| //后端存储的时候要是三位正整数,保存的时候要*100,但是显示的时候要/100,在 | |||
| //往vuex存储的时候保存的是*100后的,提交保存的时候那步在其他页面也有,故在这里强制处理 | |||
| dealNum = this.dealNumFn(dealNum); | |||
| let obj = { | |||
| firstNum: curSplitArr[0], | |||
| endNum: curSplitArr[1], | |||
| rateNum: dealNum, | |||
| } | |||
| curInfoArr.push(obj); | |||
| }) | |||
| } | |||
| this.$set(this.jumpRateObj,'rateList',curInfoArr); | |||
| this.$set(this.jumpRateObj,'timeCycle',this.formData.busDiscountTime); | |||
| }, | |||
| dealNumFn(dealNum) { | |||
| dealNum = dealNum+''; | |||
| let curNumLength = dealNum.length - 2; | |||
| curNumLength = curNumLength == 1 ? 2 : curNumLength; | |||
| dealNum = dealNum >= 100 ? dealNum/(Math.pow(10,curNumLength)) : dealNum; | |||
| return dealNum; | |||
| }, | |||
| } | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| li { | |||
| list-style-type: none; | |||
| } | |||
| .jump-rate-set { | |||
| /* margin-left: 30px; */ | |||
| } | |||
| .rate-show-list { | |||
| padding-left: 0; | |||
| } | |||
| .rate-show-list li { | |||
| float: left; | |||
| height: 24px; | |||
| line-height: 24px; | |||
| padding: 0 15px; | |||
| background: #eee; | |||
| border-radius: 14px; | |||
| text-align: center; | |||
| margin: 15px 15px 0 0; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,789 @@ | |||
| <template> | |||
| <div> | |||
| <div class="layout-content"> | |||
| <div class="shopBox" style="margin-bottom:20px;" v-if="fromAddTask != 'fromAddTask'"> | |||
| <rent-shop :rentInfoData="rentInfo" :merchentEditIf="merchentEditIf"></rent-shop> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">合同信息</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同编号:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.contractNumber}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同状态:</el-col> | |||
| <el-col :span="18" class="span-text">{{cStatus(wxRentContract.status)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同签约日:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeDate(wxRentContract.signDate)}}</el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">乙方信息</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">商户名称:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.merchantName}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同主体名称:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.subjectName}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">经营品牌:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeBrand(wxRentContract.brand)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">业态:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeBusiness(wxRentContract.businessId)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">店面类型:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeShopType(wxRentContract.shopType)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">负责人:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.linkPerson}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">联系电话:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.linkPhone}}</el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">签约信息</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">租赁开始日期:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeDate(wxRentContract.rentalStartDate)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">租赁截止日期:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeDate(wxRentContract.rentalEndDate)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">总租期:</el-col> | |||
| <el-col :span="18" class="span-text">{{totalPeriodMonth+'个月'+totalPeriodDay+"天"}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">装修期:</el-col> | |||
| <el-col | |||
| :span="18" | |||
| class="span-text" | |||
| >{{wxRentContract.fixStartDate+' 至 '+wxRentContract.fixEndDate}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">计租开始日期:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeDate(wxRentContract.startDate)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">账单生成方式:</el-col> | |||
| <el-col :span="18" class="span-text">{{getAdjustPeriod}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title" v-if="contractType!=3&&contractType!=4">计租方式:</el-col> | |||
| <el-col | |||
| :span="18" | |||
| class="span-text" | |||
| v-if="contractType!=3&&contractType!=4" | |||
| >{{changeType(wxRentContract.type)}}</el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">租金费用明细</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col | |||
| :span="3" | |||
| v-if="wxRentContract.type==2&&contractType!=3&&contractType!=4" | |||
| class="span-title" | |||
| >保底营业额:</el-col> | |||
| <el-col | |||
| :span="18" | |||
| v-if="wxRentContract.type==2&&contractType!=3&&contractType!=4" | |||
| class="span-text" | |||
| >{{wxRentContract.revenue/100+'元'}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col | |||
| :span="3" | |||
| v-if="wxRentContract.type!=1&&contractType!=3&&contractType!=4" | |||
| class="span-title" | |||
| >联营扣点:</el-col> | |||
| <el-col | |||
| :span="18" | |||
| v-if="wxRentContract.type!=1&&contractType!=3&&contractType!=4 && wxRentContract.busDiscountRatio!=undefined &&wxRentContract.busDiscountRatio==''" | |||
| class="span-text" | |||
| >{{wxRentContract.payRatio/100+'%'}}</el-col> | |||
| <el-col :span="18" v-if="wxRentContract.type!=1&&contractType!=3&&contractType!=4 && wxRentContract.busDiscountRatio!=undefined &&wxRentContract.busDiscountRatio!=''" class="span-text"> | |||
| <!-- aaa --> | |||
| <show-rate-list class="cur-rate-list"></show-rate-list> | |||
| </el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">总面积:</el-col> | |||
| <el-col :span="18" class="span-text">{{getTotleArea+'㎡'+' ('+getAreaList+')'}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.type!=2&&contractType==5"> | |||
| <el-col :span="3" class="span-title">租金单价:</el-col> | |||
| <el-col :span="18" class="span-text">{{getRentPrice}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.type!=2&&contractType==5"> | |||
| <el-col :span="3" class="span-title">租金:</el-col> | |||
| <el-col v-if="wxRentContract.rentInputWay==2" :span="18" class="span-text">{{getTotlePrice+' ('+getPriceList+')'}}</el-col> | |||
| <el-col v-else :span="18" class="span-text">{{getTotlePrice}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.type!=2&&contractType==5"> | |||
| <el-col :span="3" class="span-title">押金:</el-col> | |||
| <el-col v-if="wxRentContract.rentInputWay==2" :span="18" class="span-text">{{getTotleDeposit+' ('+getDepositList+')'}}</el-col> | |||
| <el-col v-else :span="18" class="span-text">{{getTotleDeposit}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">付款周期:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.receivePeriod+ ' 月'}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.latePayRatio"> | |||
| <el-col :span="3" class="span-title">滞纳金费率:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.latePayRatio+ '%'}}<span style="margin-left:30px;">{{'欠缴后 '+wxRentContract.latePayDay+' 日开始计费'}}</span></el-col> | |||
| </el-row> | |||
| <el-row | |||
| v-if="wxRentContract.type!=2&&rentInfo[0]&&rentInfo[0].adjustRatio.length>0&&wxRentContract.rentInputWay==2" | |||
| > | |||
| <el-col :span="3" class="span-title">年租金调整:</el-col> | |||
| <el-col :span="18" class="span-text"> | |||
| <div v-for="(item,index) in rentInfo" :key="index">{{getAdjustRatio(item)}}</div> | |||
| </el-col> | |||
| </el-row> | |||
| <el-row | |||
| v-if="(wxRentContract.type==2&&wxRentContract.adjustRatio&&wxRentContract.adjustRatio.length>0)||wxRentContract.rentInputWay==1" | |||
| > | |||
| <el-col :span="3" class="span-title">年租金调整:</el-col> | |||
| <el-col :span="18" class="span-text"> | |||
| <div>{{getPricePer02(wxRentContract.adjustRatio)}}</div> | |||
| </el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">租金账单:</el-col> | |||
| <el-col :span="18" class="span-text"> | |||
| <rent-bill :editIf="true" :ref="billTk"></rent-bill> | |||
| </el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box" v-show="wxRentContract02"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">物业费用明细</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">物业费单价:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract02.rentPrice/100+'㎡/元/'+priceUnitType02}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">物业费:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract02.price/100+'元/'+priceUnitType02}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">物业押金:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract02.deposit/100+'元'}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">付款周期:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract02.receivePeriod+ ' 月'}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract02.latePayRatio"> | |||
| <el-col :span="3" class="span-title">滞纳金费率:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract02.latePayRatio+ '%'}}<span style="margin-left:30px;">{{'欠缴后 '+wxRentContract02.latePayDay+' 日开始计费'}}</span></el-col> | |||
| </el-row> | |||
| <el-row | |||
| v-if="wxRentContract02.adjustRatio&&wxRentContract02.adjustRatio.length>0" | |||
| > | |||
| <el-col :span="3" class="span-title">年物业费调整:</el-col> | |||
| <el-col :span="18" class="span-text"> | |||
| <div>{{getPricePer03(wxRentContract02.adjustRatio)}}</div> | |||
| </el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">物业账单:</el-col> | |||
| <el-col :span="18" class="span-text"> | |||
| <rent-bill :editIf="true" :ref="billTk02"></rent-bill> | |||
| </el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <!-- <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">审批意见</div> --> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <!-- <label class="text" style="color:blue;" v-for="(item,index) in fileNames" :key="index" @click="download(index)"><u>{{item.name}}</u></label> --> | |||
| <el-col :span="3" class="span-title">合同附件:</el-col> | |||
| <el-col :span="6" class="span-text" style="color:blue;" v-if="fileNames.length<=0">无</el-col> | |||
| <el-col :span="6" class="span-text" style="color:blue;" v-if="fileNames.length>0"> | |||
| <div | |||
| class="download-file" | |||
| v-for="(item,index) in fileNames" | |||
| :key="index" | |||
| @click.stop.prevent="download(index)" | |||
| >{{item.name}}</div> | |||
| </el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <el-row style="margin:20px 0 0;text-align:center;"> | |||
| <el-button @click.stop.prevent="cancel">返回</el-button> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import commonUtil from "../../core/tool/commonUtil"; | |||
| import AjaxUtil from "../../core/tool/ajaxService"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import rentBill from "../contract/contractutil/rentbill.vue"; | |||
| import { ContractUrl } from "../contract/businessComp/UrlEnum.js"; | |||
| import { CouponCacheData } from "../../service/couponData/data.js"; | |||
| import { ContractData } from "../../service/contract/data.js"; | |||
| import rentShop from "./contractutil/rentshop.vue"; | |||
| import showRateList from "./rent/showRateList.vue"; | |||
| import moment from "moment"; | |||
| export default { | |||
| extends: AjaxUtil, | |||
| name: "rentLeaseCheck", | |||
| components: { | |||
| rentBill, | |||
| rentShop, | |||
| showRateList | |||
| }, | |||
| data() { | |||
| return { | |||
| brands: [], | |||
| merchentEditIf: true, | |||
| priceUnitType: "", | |||
| fromAddTask:"", | |||
| priceUnitType02: "", | |||
| priceUnitOption: ContractData.priceUnitOption, | |||
| contractType: 0, | |||
| totalPeriodMonth: 0, | |||
| totalPeriodDay: 0, | |||
| remark: "", | |||
| wxShops: "", | |||
| rentInfo: [], | |||
| fileNames: [], | |||
| billTk: "rentbill", | |||
| billTk02: "rentbill02", | |||
| wxRentContract: "", | |||
| wxRentContract02: "", | |||
| wxMerchant: "", | |||
| businessIds: [], | |||
| active: 0, | |||
| // 店铺类型 | |||
| shopTypes: ContractData.shopTypes, | |||
| //计租计算方式 | |||
| computedTypes: ContractData.computedTypes | |||
| }; | |||
| }, | |||
| //新增computed属性 | |||
| computed: { | |||
| ...mapState({ | |||
| topNav: state => state.topNav.data, //将 this.topNav 映射为 this.$store.topNav.data | |||
| navigationInfo: state => state.topNav.navigationInfo, | |||
| formData: state => state.setRentInfo.formData | |||
| }), | |||
| getRentPrice() { | |||
| let str = ""; | |||
| if (this.wxRentContract.rentInputWay == 2) { | |||
| this.rentInfo.map((item, index) => { | |||
| str = | |||
| str != "" | |||
| ? str + | |||
| ", " + | |||
| item.shopNumber + | |||
| "号铺:" + | |||
| item.rentPrice + | |||
| "㎡/元/" + | |||
| this.priceUnitType | |||
| : item.shopNumber + | |||
| "号铺:" + | |||
| item.rentPrice + | |||
| "㎡/元/" + | |||
| this.priceUnitType; | |||
| }); | |||
| } else { | |||
| str = this.wxRentContract.rentPrice + "㎡/元/" + this.priceUnitType; | |||
| } | |||
| return str; | |||
| }, | |||
| getAdjustPeriod() { | |||
| return this.wxRentContract.adjustPeriod == 3 | |||
| ? "按自然月生成" | |||
| : "按计租日期生成"; | |||
| }, | |||
| getTotleArea() { | |||
| this.rentArea = 0; | |||
| this.rentInfo.map((item, index) => { | |||
| this.rentArea += Number(item.rentArea); | |||
| }); | |||
| return this.rentArea; | |||
| }, | |||
| getAreaList() { | |||
| let str = ""; | |||
| this.rentInfo.map((item, index) => { | |||
| str = | |||
| str != "" | |||
| ? str + ", " + item.shopNumber + "号铺:" + item.rentArea + "㎡" | |||
| : item.shopNumber + "号铺:" + item.rentArea + "㎡"; | |||
| }); | |||
| return str; | |||
| }, | |||
| getTotlePrice() { | |||
| if (this.wxRentContract.rentInputWay == 1) { | |||
| return ( | |||
| Number(this.wxRentContract.price) / 100 + "元/" + this.priceUnitType | |||
| ); | |||
| } else { | |||
| this.price = 0; | |||
| this.rentInfo.map((item, index) => { | |||
| this.price += Number(item.price); | |||
| }); | |||
| return this.price + "元/" + this.priceUnitType; | |||
| } | |||
| }, | |||
| getPriceList() { | |||
| let str = ""; | |||
| this.rentInfo.map((item, index) => { | |||
| str = | |||
| str != "" | |||
| ? str + | |||
| ", " + | |||
| item.shopNumber + | |||
| "号铺: " + | |||
| item.price + | |||
| "元/" + | |||
| this.priceUnitType | |||
| : item.shopNumber + | |||
| "号铺: " + | |||
| item.price + | |||
| "元/" + | |||
| this.priceUnitType; | |||
| }); | |||
| return str; | |||
| }, | |||
| getTotleDeposit() { | |||
| if (this.wxRentContract.rentInputWay == 1) { | |||
| return Number(this.wxRentContract.deposit) / 100 + "元"; | |||
| } else { | |||
| this.deposit = 0; | |||
| this.rentInfo.map((item, index) => { | |||
| this.deposit += Number(item.deposit); | |||
| }); | |||
| return this.deposit + "元"; | |||
| } | |||
| }, | |||
| getDepositList() { | |||
| let str = ""; | |||
| this.rentInfo.map((item, index) => { | |||
| str = | |||
| str != "" | |||
| ? str + ", " + item.shopNumber + "号铺: " + item.deposit + "元" | |||
| : item.shopNumber + "号铺: " + item.deposit + "元"; | |||
| }); | |||
| return str; | |||
| } | |||
| }, | |||
| methods: { | |||
| ...mapActions([ | |||
| "setNavData", | |||
| "setFormData", | |||
| "setRentInfo" // 将this.setNavData 映射为 this.$store.dispatch('setNavData') | |||
| ]), | |||
| cStatus(item) { | |||
| return item != undefined | |||
| ? CouponCacheData.rentStatus.filter(e => { | |||
| return e.value == item.toString(); | |||
| })[0].name | |||
| : ""; | |||
| }, | |||
| getPricePer02(items, indexs) { | |||
| let str = ""; | |||
| if ( | |||
| this.wxRentContract.adjustRatioWay == 1 || | |||
| this.wxRentContract02.adjustRatioWay == 1 | |||
| ) { | |||
| items != undefined | |||
| ? items.map((item, index) => { | |||
| str = | |||
| index != 0 | |||
| ? str + ",第" + (index + 2) + "年上浮" + item + "%" | |||
| : str + "第" + (index + 2) + "年上浮" + item + "%"; | |||
| }) | |||
| : ""; | |||
| } else if ( | |||
| this.wxRentContract.adjustRatioWay == 2 || | |||
| this.wxRentContract02.adjustRatioWay == 2 | |||
| ) { | |||
| items != undefined | |||
| ? items.map((item, index) => { | |||
| str = | |||
| index != 0 | |||
| ? str + | |||
| ",第" + | |||
| (index + 2) + | |||
| "年上浮" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType | |||
| : str + | |||
| "第" + | |||
| (index + 2) + | |||
| "年上浮" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType; | |||
| }) | |||
| : ""; | |||
| } else { | |||
| items != undefined | |||
| ? items.map((item, index) => { | |||
| str = | |||
| index != 0 | |||
| ? str + | |||
| ",第" + | |||
| (index + 2) + | |||
| "年" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType | |||
| : str + | |||
| "第" + | |||
| (index + 2) + | |||
| "年" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType; | |||
| }) | |||
| : ""; | |||
| } | |||
| return str; | |||
| }, | |||
| getPricePer03(items, indexs) { | |||
| let str = ""; | |||
| if ( | |||
| this.wxRentContract.adjustRatioWay == 1 || | |||
| this.wxRentContract02.adjustRatioWay == 1 | |||
| ) { | |||
| items != undefined | |||
| ? items.map((item, index) => { | |||
| str = | |||
| index != 0 | |||
| ? str + ",第" + (index + 2) + "年上浮" + item + "%" | |||
| : str + "第" + (index + 2) + "年上浮" + item + "%"; | |||
| }) | |||
| : ""; | |||
| } else if ( | |||
| this.wxRentContract.adjustRatioWay == 2 || | |||
| this.wxRentContract02.adjustRatioWay == 2 | |||
| ) { | |||
| items != undefined | |||
| ? items.map((item, index) => { | |||
| str = | |||
| index != 0 | |||
| ? str + | |||
| ",第" + | |||
| (index + 2) + | |||
| "年上浮" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType02 | |||
| : str + | |||
| "第" + | |||
| (index + 2) + | |||
| "年上浮" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType02; | |||
| }) | |||
| : ""; | |||
| } else { | |||
| items != undefined | |||
| ? items.map((item, index) => { | |||
| str = | |||
| index != 0 | |||
| ? str + | |||
| ",第" + | |||
| (index + 2) + | |||
| "年" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType02 | |||
| : str + | |||
| "第" + | |||
| (index + 2) + | |||
| "年" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType02; | |||
| }) | |||
| : ""; | |||
| } | |||
| return str; | |||
| }, | |||
| getAdjustRatio(items) { | |||
| let str = items.shopNumber + "号铺: "; | |||
| if (this.wxRentContract.adjustRatioWay == 1) { | |||
| items.adjustRatio.map((item, index) => { | |||
| str = str + "第" + (index + 2) + "年上浮" + item + "% "; | |||
| }); | |||
| } else if(this.wxRentContract.adjustRatioWay == 2){ | |||
| items.adjustRatio.map((item, index) => { | |||
| str = | |||
| str + | |||
| "第" + | |||
| (index + 2) + | |||
| "年上浮" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType; | |||
| }); | |||
| } else { | |||
| items.adjustRatio.map((item, index) => { | |||
| str = | |||
| str + | |||
| "第" + | |||
| (index + 2) + | |||
| "年" + | |||
| item + | |||
| "元/" + | |||
| this.priceUnitType; | |||
| }); | |||
| } | |||
| return str; | |||
| }, | |||
| changeBrand(brand) { | |||
| return this.brands.length > 0 && brand | |||
| ? this.brands.filter(e => e.id == brand)[0].value | |||
| : ""; | |||
| }, | |||
| changeBusiness(businessId) { | |||
| return this.businessIds.length > 0 && businessId != undefined | |||
| ? this.businessIds.filter(e => e.id == businessId)[0].title | |||
| : ""; | |||
| }, | |||
| changeShopType(id) { | |||
| return id != undefined | |||
| ? this.shopTypes.filter(e => e.value == id)[0].label | |||
| : ""; | |||
| }, | |||
| changeDate(date) { | |||
| return moment(date).format("YYYY-MM-DD"); | |||
| }, | |||
| changeType(type) { | |||
| return type != undefined | |||
| ? this.computedTypes.filter(e => e.value == type)[0].label | |||
| : ""; | |||
| }, | |||
| download: function(index) { | |||
| window.open(this.fileNames[index].url); | |||
| }, | |||
| cancel() { | |||
| this.$router.back(-1); | |||
| }, | |||
| getData() { | |||
| let _this = this; | |||
| this.contractType = this.$route.query.contractType; | |||
| this.getFetch( | |||
| ContractUrl.rentPropertyContractFindById + "?id=" + this.$route.query.id | |||
| ).then(d => { | |||
| console.log(d); | |||
| _this.wxRentContract = d.data.rent.wxRentContract; | |||
| _this.wxRentContract.fixStartDate = _this.wxRentContract.fixStartDate | |||
| ? moment(_this.wxRentContract.fixStartDate).format("YYYY-MM-DD") | |||
| : ""; | |||
| _this.wxRentContract.fixEndDate = _this.wxRentContract.fixEndDate | |||
| ? moment(_this.wxRentContract.fixEndDate).format("YYYY-MM-DD") | |||
| : ""; | |||
| this.priceUnitType = this.wxRentContract.priceUnit | |||
| ? this.priceUnitOption.filter( | |||
| e => e.value == this.wxRentContract.priceUnit | |||
| )[0].name | |||
| : ""; | |||
| _this.totalPeriodMonth = d.data.rent.totalPeriodMonth; | |||
| _this.totalPeriodDay = d.data.rent.totalPeriodDay; | |||
| _this.rentInfo = d.data.rent.wxRentContract.rentInfo | |||
| ? JSON.parse(d.data.rent.wxRentContract.rentInfo) | |||
| : []; | |||
| let adjustRatio = []; | |||
| JSON.parse(d.data.rent.wxRentContract.adjustRatio).map( | |||
| (item, index) => { | |||
| let a = item / 100; | |||
| adjustRatio.push(a); | |||
| } | |||
| ); | |||
| _this.wxRentContract.adjustRatio = adjustRatio; | |||
| _this.$refs[_this.billTk].setData(d.data.rent.previewBillRentList); | |||
| //aaa | |||
| if ( | |||
| d.data.rent.wxRentContract.busDiscountRatio == undefined || | |||
| d.data.rent.wxRentContract.busDiscountTime == undefined | |||
| ) { | |||
| d.data.rent.wxRentContract.busDiscountRatio = ""; | |||
| d.data.rent.wxRentContract.busDiscountTime = 1; | |||
| } | |||
| let curObj = Object.assign({}, this.formData); | |||
| curObj.busDiscountRatio = d.data.rent.wxRentContract.busDiscountRatio; | |||
| curObj.busDiscountTime = d.data.rent.wxRentContract.busDiscountTime; | |||
| curObj.payRatio = d.data.rent.wxRentContract.payRatio; | |||
| this.setFormData(curObj); | |||
| //如果没有设置物业信息不走下面的语句 | |||
| if (!d.data.property) { | |||
| return; | |||
| } | |||
| _this.wxRentContract02 = d.data.property; | |||
| _this.wxRentContract02.fixStartDate = _this.wxRentContract02 | |||
| .fixStartDate | |||
| ? moment(_this.wxRentContract02.fixStartDate).format("YYYY-MM-DD") | |||
| : ""; | |||
| _this.wxRentContract02.fixEndDate = _this.wxRentContract02.fixEndDate | |||
| ? moment(_this.wxRentContract02.fixEndDate).format("YYYY-MM-DD") | |||
| : ""; | |||
| this.priceUnitType02 = this.wxRentContract02.priceUnit | |||
| ? this.priceUnitOption.filter( | |||
| e => e.value == this.wxRentContract02.priceUnit | |||
| )[0].name | |||
| : ""; | |||
| _this.fileNames = d.data.property.fileNames | |||
| ? JSON.parse(d.data.property.fileNames) | |||
| : []; | |||
| let adjustRatio02 = []; | |||
| JSON.parse(d.data.property.adjustRatio).map((item, index) => { | |||
| let a = item / 100; | |||
| adjustRatio02.push(a); | |||
| }); | |||
| _this.wxRentContract02.adjustRatio = adjustRatio02; | |||
| _this.$refs[_this.billTk02].setData( | |||
| d.data.property.previewBillRentList | |||
| ); | |||
| }); | |||
| } | |||
| }, | |||
| mounted: function() { | |||
| commonUtil.pvuv.setPVUV.apply(this, []); | |||
| }, | |||
| created() { | |||
| this.setNavData(["合同管理", "店铺", "租金+物业合同", "查看"]); | |||
| this.getData(); | |||
| if(this.$route.query.flags){ | |||
| this.fromAddTask = this.$route.query.flags; | |||
| this.setNavData(["招商管理", "店铺", "租金+物业合同", "查看"]); | |||
| } | |||
| //获取品牌列表 | |||
| this.getFetch("/api/wxBrand/queryBrand") | |||
| .then(d => { | |||
| this.brands = d.data; | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| this.getFetch(ContractUrl.businessList) | |||
| .then(d => { | |||
| this.businessIds = d.data; | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| } | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| .text-box { | |||
| background: #fff; | |||
| margin-bottom: 20px; | |||
| } | |||
| .download-file { | |||
| cursor: pointer; | |||
| } | |||
| .text-box-title { | |||
| height: 42px; | |||
| line-height: 42px; | |||
| padding-left: 20px; | |||
| color: #fff; | |||
| font-weight: 400px; | |||
| font-size: 14px; | |||
| background: rgba(51, 153, 255, 1); | |||
| } | |||
| .text-box-content { | |||
| padding: 20px; | |||
| line-height: 36px; | |||
| font-size: 12px; | |||
| } | |||
| .span-title { | |||
| text-align: right; | |||
| padding-right: 15px; | |||
| } | |||
| .layout-content { | |||
| width: 100%; | |||
| height: auto; | |||
| min-height: 300px; | |||
| background: #141e29; | |||
| border-radius: 2px; | |||
| padding: 0 20px 20px 20px; | |||
| overflow: hidden; | |||
| text-align: left; | |||
| } | |||
| .el-form { | |||
| background: #f5f7f8; | |||
| text-align: left; | |||
| padding: 25px 22px 22px; | |||
| margin-bottom: 20px !important; | |||
| } | |||
| .el-form .el-form-item { | |||
| margin-bottom: 0 !important; | |||
| /* width: 200px; */ | |||
| } | |||
| /* .el-select{ | |||
| width:120px; | |||
| } */ | |||
| .tableContainer { | |||
| margin-top: 20px !important; | |||
| background: #fff; | |||
| } | |||
| .el-button { | |||
| /* width: 60px; */ | |||
| border: none !important; | |||
| margin: 0 10px; | |||
| height: 40px; | |||
| } | |||
| .builtBtn { | |||
| width: 100px; | |||
| height: 32px; | |||
| background: rgba(81, 169, 201, 1); | |||
| border: 0 !important; | |||
| line-height: 32px; | |||
| text-align: center; | |||
| margin: 0; | |||
| padding: 0 !important; | |||
| } | |||
| .builtBtn:hover { | |||
| background: rgba(81, 169, 201, 0.88); | |||
| } | |||
| .builtBtn i { | |||
| margin-right: 10px; | |||
| } | |||
| .fx_send .el-form-item__content .el-select { | |||
| width: 120px !important; | |||
| } | |||
| .fx_title .el-input { | |||
| width: 150px; | |||
| } | |||
| .cur-rate-list /deep/ .rate-show-list li { | |||
| margin-top: 6px; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,578 @@ | |||
| <template> | |||
| <div> | |||
| <div class="layout-content"> | |||
| <el-form | |||
| :inline="true" | |||
| :model="ruleForm" | |||
| ref="ruleForm" | |||
| class="demo-form-inline" | |||
| label-position="right" | |||
| > | |||
| <el-form-item label="商铺号" prop="name" class="fx_title"> | |||
| <el-input v-model.trim="ruleForm.shopNumber" placeholder="请输入" clearable></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="商户名称" prop="merchantName" class="fx_title"> | |||
| <el-input v-model.trim="ruleForm.merchantName" placeholder="请输入" clearable></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="合同状态" class="fx_send"> | |||
| <el-select v-model="ruleForm.status" placeholder="请选择" clearable class="select-method"> | |||
| <el-option | |||
| v-for="(item,index) in options" | |||
| :key="index" | |||
| :value="item.value" | |||
| :label="item.label" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="审批状态" class="fx_send"> | |||
| <el-select v-model="ruleForm.applyStatus" placeholder="请选择" clearable class="select-method"> | |||
| <el-option | |||
| v-for="(item,index) in applyStatusOptions" | |||
| :key="index" | |||
| :value="item.value" | |||
| :label="item.name" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="计租方式" class="fx_send"> | |||
| <el-select v-model="ruleForm.type" placeholder="请选择" clearable class="select-method"> | |||
| <el-option | |||
| v-for="(item,index) in types" | |||
| :key="index" | |||
| :value="item.value" | |||
| :label="item.label" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item> | |||
| <el-button | |||
| class="hoverBtn" | |||
| type="primary" | |||
| icon="el-icon-search" | |||
| :style="'border:0;background:'+navigationInfo.moduleColor" | |||
| size="medium" | |||
| @click="search" | |||
| ></el-button> | |||
| </el-form-item> | |||
| </el-form> | |||
| <el-button type="primary" class="builtBtn" @click="goSave" style="margin-right:4px;"> | |||
| <i>+</i>新建 | |||
| </el-button> | |||
| <!-- <el-button type="primary" class="builtBtn" @click="goBulu" style="margin-left:4px;"> | |||
| <i>+</i>补录 | |||
| </el-button> --> | |||
| <el-button type="primary" class="builtBtn" @click="goRenew" style="margin-left:4px;"> | |||
| <i>+</i>续签 | |||
| </el-button> | |||
| <table-list :ref="tk" :options="optionsTable"></table-list> | |||
| <stop-contract :ref="st" :type='18' :processData="processData" :options="stopOptions"></stop-contract> | |||
| </div> | |||
| <div> | |||
| <el-dialog | |||
| title="提示" | |||
| :visible.sync="dialogVisible" | |||
| width="40%" | |||
| :modal-append-to-body="false" | |||
| :before-close="handleClose" | |||
| > | |||
| <span>当前有欠缴账单未结清,是否要继续终止合同?</span> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button @click="dialogVisible = false">取 消</el-button> | |||
| <el-button type="primary" @click="stopContract">确定</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import TableList from "../../../core/comps/table/tableList.vue"; | |||
| import StopContract from "../contractutil/stopcontract.vue"; | |||
| import commonUtil from "../../../core/tool/commonUtil"; | |||
| import reportTool from "../../../core/tool/report.js"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import { CouponCacheData } from "../../../service/couponData/data.js"; | |||
| import { ContractData } from "../../../service/contract/data.js"; | |||
| import { promissionUrl } from "../../../urlconfig/promission/url.js"; | |||
| import { ContractUrl } from "../businessComp/UrlEnum.js" | |||
| let echarts = require("echarts"); | |||
| export default { | |||
| inject: ["reload"], | |||
| name: "rentLeaselist", | |||
| components: { | |||
| TableList, | |||
| StopContract | |||
| }, | |||
| data() { | |||
| return { | |||
| processData:[], | |||
| waitSignCount: "", //待签约 | |||
| endSoonCount: "", //将到期合同 | |||
| dialogVisible: false, | |||
| rendPaidCount: "", //计租中合同 | |||
| shopcount: "", //空余商铺 | |||
| tk: "manjianTableKey", | |||
| st: "stopContract", | |||
| stopOptions: { | |||
| contractType: "1" | |||
| }, | |||
| applyStatusOptions:ContractData.applyStatus, | |||
| ruleForm: { | |||
| shopNumber: "", | |||
| merchantName: "", | |||
| status: "", | |||
| type: "", | |||
| applyStatus:"" | |||
| }, | |||
| options: ContractData.statusOptions, | |||
| types: [ | |||
| { | |||
| value: "1", | |||
| label: "按租赁面积" | |||
| }, | |||
| { | |||
| value: "2", | |||
| label: "联营扣点" | |||
| }, | |||
| { | |||
| value: 3, | |||
| label: "面积计租、联营取高" | |||
| } | |||
| ], | |||
| optionsTable: { | |||
| actions: [ | |||
| { | |||
| key: "edit", | |||
| val: "提交审批", | |||
| action: this.doApply, | |||
| show: item => { | |||
| return item.status == 1 | |||
| ? true | |||
| : false; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "编辑", | |||
| action: this.aCount, | |||
| show: item => { | |||
| //合同状态 审批状态 | |||
| return item.status == 10 && (item.applyStatus == 3 || item.applyStatus == 5) | |||
| ? true | |||
| : false; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "终止", | |||
| action: this.endcontract, | |||
| show: item => { | |||
| if ( | |||
| item.status == 2 || item.status == 3 | |||
| ) { | |||
| return true; | |||
| } else { | |||
| return false; | |||
| } | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "查看", | |||
| action: this.goCheck, | |||
| show: item => { | |||
| return true; | |||
| } | |||
| }, | |||
| { | |||
| key: "download", | |||
| val: "下载", | |||
| action: this.goDownload, | |||
| show: item => { | |||
| return true; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "审批进度", | |||
| action: this.checkCurrentStatus, | |||
| show: item => { | |||
| return item.applyStatus == 1 || | |||
| item.applyStatus == 2 || | |||
| item.applyStatus == 3 || | |||
| item.applyStatus == 5 | |||
| ? true | |||
| : false; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "绑定商户", | |||
| action: this.goToEditShop, | |||
| show: item => { | |||
| return (item.applyStatus == 2||(item.applyStatus == 0 && !item.merchantId)) && item.propertyStatus == 1 &&item.status == 1 ? true : false; | |||
| } | |||
| } | |||
| ], | |||
| showCk: false, | |||
| map: [ | |||
| { | |||
| key: "contractNumber", | |||
| val: "合同编号" | |||
| }, | |||
| { | |||
| key: "shopNumber", | |||
| val: "商铺号", | |||
| convert: this.changeShopNum, | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "merchantName", | |||
| val: "商户名称" | |||
| }, | |||
| { | |||
| key: "rentalStartDate", | |||
| val: "租赁开始日期", | |||
| type: "date", | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "rentalEndDate", | |||
| val: "租赁结束日期", | |||
| type: "date", | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "rentPrice", | |||
| val: "租金", | |||
| convert: this.divide, | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "propertyPrice", | |||
| val: "物业费", | |||
| convert: this.divide02, | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "type", | |||
| val: "计租方式", | |||
| convert: this.ctype | |||
| }, | |||
| { | |||
| key: "status", | |||
| val: "合同状态", | |||
| convert: this.cStatus | |||
| }, | |||
| { | |||
| key: "applyStatus", | |||
| val: "审批状态", | |||
| convert: this.cApplyStatus | |||
| } | |||
| ], | |||
| getUrl: () => { | |||
| return ( | |||
| ContractUrl.rentPropertyContractList+"?merchantName=" + | |||
| this.ruleForm.merchantName + | |||
| "&shopNumber=" + | |||
| this.ruleForm.shopNumber + | |||
| "&status=" + | |||
| this.ruleForm.status + | |||
| "&type=" + | |||
| this.ruleForm.type + | |||
| "&rentShopType=1&applyStatus=" + | |||
| this.ruleForm.applyStatus+ | |||
| "&operationType=2" | |||
| ); | |||
| }, | |||
| pageOption: { | |||
| sizeKey: "pageSize", | |||
| indexKey: "pageNum", | |||
| index: 1, | |||
| size: 10 | |||
| }, | |||
| analysis: data => { | |||
| return { | |||
| data: data.data.list, | |||
| count: data.data.total | |||
| }; | |||
| } | |||
| } | |||
| }; | |||
| }, | |||
| computed: { | |||
| ...mapState({ | |||
| navigationInfo: state => state.topNav.navigationInfo | |||
| }) | |||
| }, | |||
| methods: { | |||
| ...mapActions([ | |||
| "setNavData" // 将this.setNavData 映射为 this.$store.dispatch('setNavData') | |||
| ]), | |||
| doApply(item,row) { | |||
| console.log(item) | |||
| let params = { | |||
| remark: '', | |||
| id: item.id | |||
| } | |||
| this.postFetch("/api/wxRentContract/apply",params) | |||
| .then(d => { | |||
| }) | |||
| .catch(err => { | |||
| this.$message.success(err.data); | |||
| }); | |||
| }, | |||
| changeShopNum(item, row) { | |||
| let rentInfo = JSON.parse(row.rentInfo); | |||
| let str = ""; | |||
| rentInfo.map((items, indexs) => { | |||
| str = str != "" ? str + " ," + items.shopNumber : items.shopNumber; | |||
| }); | |||
| return str; | |||
| }, | |||
| cApplyStatus(col, item) { | |||
| if (item.applyStatus) { | |||
| return ( | |||
| (item.businessType != 18 ? "签约" : "终止") + | |||
| ContractData.applyStatus.filter(e => e.value == item.applyStatus)[0] | |||
| .name | |||
| ); | |||
| } else if (item.applyStatus === 0) { | |||
| return "未提交审核"; | |||
| } | |||
| }, | |||
| goToEditShop(item) { | |||
| this.$router.push({ | |||
| path: "/merchant/merchantAdd?contractId=" + item.id | |||
| }); | |||
| }, | |||
| checkCurrentStatus(item, row) { | |||
| this.$router.push({ | |||
| path: "rentApprovals?id=" + item.id | |||
| }); | |||
| }, | |||
| cStatus(col, item) { | |||
| return CouponCacheData.rentStatus.filter(e => { | |||
| return e.value == item.status.toString(); | |||
| })[0].name; | |||
| }, | |||
| divide(col, item) { | |||
| //aaa | |||
| if (item.busDiscountRatio != undefined && item.busDiscountTime != 0 && item.busDiscountRatio !='') { | |||
| return Number(item.rentPrice) / 100 +(item.busDiscountTime==1?'元/年':item.busDiscountTime==2?'元/月':'元/周期'); | |||
| } else { | |||
| return Number(item.rentPrice) / 100 +(item.rentPriceUnit==1?'元/日':item.rentPriceUnit==2?'元/月':'元/年'); | |||
| } | |||
| }, | |||
| divide02(col, item) { | |||
| return item.propertyPrice?Number(item.propertyPrice) / 100 +(item.propertyPriceUnit==1?'元/日':item.propertyPriceUnit==2?'元/月':'元/年'):'暂未设置'; | |||
| }, | |||
| ctype(col, item) { | |||
| if (item.type == 1) { | |||
| return "按租赁面积"; | |||
| } else if (item.type == 2) { | |||
| return "联营扣点"; | |||
| } else { | |||
| return "面积计租、联营取高"; | |||
| } | |||
| }, | |||
| aCount: function(item, row) { | |||
| if (item.merchantId) { | |||
| this.$router.push({ | |||
| path: "rentLeaseBulu?id=" + item.id | |||
| }); | |||
| } else { | |||
| this.$router.push({ | |||
| path: "rentLeaseEdit?id=" + item.id | |||
| }); | |||
| } | |||
| }, | |||
| goCheck: function(item, row) { | |||
| /** | |||
| contractType合同类型:1租金合同,2多经合同,3物业合同,4多经物业合同 | |||
| businessType操作类型:1合同审批,2账单审批,3终止合同审批 | |||
| id为合同id | |||
| */ | |||
| this.$router.push({ | |||
| path: `rentLeaseCheck?id=${item.id}&contractType=5&businessType=1` | |||
| }); | |||
| }, | |||
| handleClose(done) { | |||
| this.$confirm("确认关闭?") | |||
| .then(_ => { | |||
| done(); | |||
| }) | |||
| .catch(_ => {}); | |||
| }, | |||
| endcontract: function(item, row) { | |||
| let that = this; | |||
| this.getFetch("/api/wxBillAll/oweBillCount?type=1&contractId=" + item.id) | |||
| .then(d => { | |||
| that.dialogVisible = true; | |||
| that.contractId = item.id; | |||
| if (Number(d.data) > 0) { | |||
| that.contractNumber = item.contractNumber; | |||
| } else { | |||
| if(this.processData.length>0){ | |||
| this.dialogVisible = false; | |||
| this.$refs[this.st].showLog(item.id, item.contractNumber); | |||
| }else{ | |||
| this.makeSure(); | |||
| } | |||
| } | |||
| }) | |||
| .catch(err => { | |||
| this.$message.success(err.data); | |||
| }); | |||
| }, | |||
| makeSure(){ | |||
| this.$confirm('您确定要提前终止此合同吗?', '提示', { | |||
| confirmButtonText: '确定', | |||
| cancelButtonText: '取消', | |||
| type: 'warning' | |||
| }).then(() => { | |||
| this.endProperty(); | |||
| }).catch(() => { | |||
| this.$message({ | |||
| type: 'info', | |||
| message: '已取消删除' | |||
| }); | |||
| }); | |||
| }, | |||
| endProperty(){ | |||
| let _this=this; | |||
| let param={ | |||
| id:this.contractId, | |||
| endProperty:2 | |||
| } | |||
| this.postFetch(ContractUrl.endContract, param) | |||
| .then(d => { | |||
| _this.$message.success("操作成功"); | |||
| _this.dialogVisible = false; | |||
| _this.search(); | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| }, | |||
| stopContract() { | |||
| let _this=this; | |||
| if(this.processData.length>0){ | |||
| this.dialogVisible = false; | |||
| this.$refs[this.st].showLog(this.contractId, this.contractNumber); | |||
| }else{ | |||
| this.endProperty(); | |||
| } | |||
| }, | |||
| goSave: function() { | |||
| this.$router.push({ | |||
| path: "/rentLeaseEdit" | |||
| }); | |||
| }, | |||
| goBulu: function() { | |||
| this.$router.push({ | |||
| path: "/rentLeaseBulu" | |||
| }); | |||
| }, | |||
| goRenew(){ | |||
| this.$router.push({ | |||
| path: "/rentLeaseEdit", | |||
| query:{ | |||
| Renew:true | |||
| } | |||
| }); | |||
| }, | |||
| goDownload: function(item) { | |||
| location.href = "/api/wxRentContract/exportContract?id=" + item.id; | |||
| }, | |||
| search: function() { | |||
| let tk = this.$refs[this.tk]; | |||
| tk.search(tk.getParams().index); | |||
| }, | |||
| /** | |||
| * 根据业务查询模板 | |||
| */ | |||
| getModelBybusiness(){ | |||
| this.getFetch(`${promissionUrl.getModelBybusiness}?flowType=18`) | |||
| .then(d=>{ | |||
| if(d.data.length>0){ | |||
| this.processData = JSON.parse(d.data[0].flow).lists; | |||
| } | |||
| }) | |||
| .catch(err=>{ | |||
| this.$message.error(err.data); | |||
| }) | |||
| } | |||
| }, | |||
| activated(){ | |||
| this.search() | |||
| this.getModelBybusiness(); | |||
| this.setNavData(["合同管理", "店铺", "租金+物业合同"]); | |||
| }, | |||
| created() { | |||
| if (this.$route.query.status) { | |||
| this.ruleForm.status = this.$route.query.status.toString(); | |||
| }; | |||
| } | |||
| }; | |||
| </script> | |||
| <!-- Add "scoped" attribute to limit CSS to this component only --> | |||
| <style scoped> | |||
| .layout-content { | |||
| width: 100%; | |||
| background: #141e29; | |||
| height: auto; | |||
| border-radius: 2px; | |||
| min-height: 300px; | |||
| padding: 0 20px 20px 20px; | |||
| overflow: hidden; | |||
| text-align: left; | |||
| } | |||
| .el-form { | |||
| background: #f5f7f8; | |||
| text-align: left; | |||
| padding: 25px 22px 22px; | |||
| margin-bottom: 20px !important; | |||
| } | |||
| .el-form .el-form-item { | |||
| margin-bottom: 0 !important; | |||
| } | |||
| .tableContainer { | |||
| margin-top: 20px !important; | |||
| background: #fff; | |||
| } | |||
| .el-button { | |||
| /* width:60px; */ | |||
| height: 40px; | |||
| } | |||
| .builtBtn { | |||
| width: 80px; | |||
| height: 32px; | |||
| background: rgba(81, 169, 201, 1); | |||
| border: 0 !important; | |||
| line-height: 32px; | |||
| text-align: center; | |||
| margin: 0; | |||
| padding: 0 !important; | |||
| } | |||
| .builtBtn:hover { | |||
| background: rgba(81, 169, 201, 0.88); | |||
| } | |||
| .builtBtn i { | |||
| margin-right: 10px; | |||
| } | |||
| .el-form-item .el-form-item__content, | |||
| .el-form-item .el-form-item__content .el-date-editor, | |||
| .el-form-item .el-form-item__content .el-date-editor .el-input__inner { | |||
| width: 150px; | |||
| } | |||
| /* .fx_send .el-form-item__content .el-select { | |||
| width: 153px !important; | |||
| } */ | |||
| .fx_title .el-input { | |||
| width: 193px; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,678 @@ | |||
| <template> | |||
| <div> | |||
| <div class="layout-content"> | |||
| <div class="shopBox" style="margin-bottom:20px;" v-if="fromAddTask != 'fromAddTask'"> | |||
| <rent-shop :rentInfoData='rentInfo' :merchentEditIf="merchentEditIf"></rent-shop> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">合同信息</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同编号:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.contractNumber}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同状态:</el-col> | |||
| <el-col :span="18" class="span-text">{{cStatus(wxRentContract.status)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同签约日:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeDate(wxRentContract.signDate)}}</el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">乙方信息</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">商户名称:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.merchantName}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同主体名称:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.subjectName}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">经营品牌:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeBrand(wxRentContract.brand)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">业态:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeBusiness(wxRentContract.businessId)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">店面类型:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeShopType(wxRentContract.shopType)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">负责人:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.linkPerson}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">联系电话:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.linkPhone}}</el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">签约信息</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">租赁开始日期:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeDate(wxRentContract.rentalStartDate)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">租赁截止日期:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeDate(wxRentContract.rentalEndDate)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">总租期:</el-col> | |||
| <el-col :span="18" class="span-text">{{totalPeriodMonth+'个月'+totalPeriodDay+"天"}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">装修期:</el-col> | |||
| <el-col | |||
| :span="18" | |||
| class="span-text" | |||
| >{{wxRentContract.fixStartDate+' 至 '+wxRentContract.fixEndDate}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">计租开始日期:</el-col> | |||
| <el-col :span="18" class="span-text">{{changeDate(wxRentContract.startDate)}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">账单生成方式:</el-col> | |||
| <el-col :span="18" class="span-text">{{getAdjustPeriod}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title" v-if="contractType!=3&&contractType!=4">计租方式:</el-col> | |||
| <el-col | |||
| :span="18" | |||
| class="span-text" | |||
| v-if="contractType!=3&&contractType!=4" | |||
| >{{changeType(wxRentContract.type)}}</el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">费用明细</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col | |||
| :span="3" | |||
| v-if="wxRentContract.type==2&&contractType!=3&&contractType!=4" | |||
| class="span-title" | |||
| >保底营业额:</el-col> | |||
| <el-col | |||
| :span="18" | |||
| v-if="wxRentContract.type==2&&contractType!=3&&contractType!=4" | |||
| class="span-text" | |||
| >{{wxRentContract.revenue/100+'元'}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col | |||
| :span="3" | |||
| v-if="wxRentContract.type!=1&&contractType!=3&&contractType!=4" | |||
| class="span-title" | |||
| >联营扣点:</el-col> | |||
| <el-col | |||
| :span="18" | |||
| v-if="wxRentContract.type!=1&&contractType!=3&&contractType!=4&& wxRentContract.busDiscountRatio!=undefined &&wxRentContract.busDiscountRatio==''" | |||
| class="span-text" | |||
| >{{wxRentContract.payRatio/100+'%'}}</el-col> | |||
| <!-- aaa --> | |||
| <el-col :span="18" v-if="wxRentContract.type!=1&&contractType!=3&&contractType!=4 && wxRentContract.busDiscountRatio!=undefined &&wxRentContract.busDiscountRatio!=''" class="span-text"> | |||
| <!-- aaa --> | |||
| <show-rate-list class="cur-rate-list"></show-rate-list> | |||
| </el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">总面积:</el-col> | |||
| <el-col :span="18" class="span-text">{{getTotleArea+'㎡'+' ('+getAreaList+')'}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.type!=2&&contractType==1"> | |||
| <el-col :span="3" class="span-title">租金单价:</el-col> | |||
| <el-col :span="18" class="span-text">{{getRentPrice}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.type!=2&&contractType==1"> | |||
| <el-col :span="3" class="span-title">租金:</el-col> | |||
| <el-col v-if="wxRentContract.rentInputWay==2" :span="18" class="span-text">{{getTotlePrice+' ('+getPriceList+')'}}</el-col> | |||
| <el-col v-else :span="18" class="span-text">{{getTotlePrice}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.type!=2&&contractType==1"> | |||
| <el-col :span="3" class="span-title">押金:</el-col> | |||
| <el-col v-if="wxRentContract.rentInputWay==2" :span="18" class="span-text">{{getTotleDeposit+' ('+getDepositList+')'}}</el-col> | |||
| <el-col v-else :span="18" class="span-text">{{getTotleDeposit}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.type!=2&&contractType==3"> | |||
| <el-col :span="3" class="span-title">物业费单价:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.rentPrice/100+'㎡/元/'+this.priceUnitType}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.type!=2&&contractType==3"> | |||
| <el-col :span="3" class="span-title">物业费:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.price/100+'元/'+this.priceUnitType}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.type!=2&&contractType==3"> | |||
| <el-col :span="3" class="span-title">物业押金:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.deposit/100+'元'}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">付款周期:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.receivePeriod+ ' 月'}}</el-col> | |||
| </el-row> | |||
| <el-row v-if="wxRentContract.latePayRatio"> | |||
| <el-col :span="3" class="span-title">滞纳金费率:</el-col> | |||
| <el-col :span="18" class="span-text">{{wxRentContract.latePayRatio+ '%'}}<span style="margin-left:30px;">{{'欠缴后 '+wxRentContract.latePayDay+' 日开始计费'}}</span></el-col> | |||
| </el-row> | |||
| <el-row | |||
| v-if="wxRentContract.type!=2&&rentInfo[0]&&rentInfo[0].adjustRatio.length>0&&contractType==1&&wxRentContract.rentInputWay==2" | |||
| > | |||
| <el-col :span="3" class="span-title">年租金调整:</el-col> | |||
| <el-col :span="18" class="span-text"> | |||
| <div v-for="(item,index) in rentInfo" :key="index">{{getAdjustRatio(item)}}</div> | |||
| </el-col> | |||
| </el-row> | |||
| <el-row | |||
| v-if="(wxRentContract.type==2&&wxRentContract.adjustRatio&&wxRentContract.adjustRatio.length>0)||contractType==3||wxRentContract.rentInputWay==1" | |||
| > | |||
| <el-col :span="3" class="span-title">{{contractType!=3?'年租金调整:':'年物业费调整:'}}</el-col> | |||
| <el-col :span="18" class="span-text"> | |||
| <div>{{getPricePer02(wxRentContract.adjustRatio)}}</div> | |||
| </el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="3" class="span-title">合同账单:</el-col> | |||
| <el-col :span="18" class="span-text"> | |||
| <rent-bill :data="billData" :editIf="true" :ref="billTk"></rent-bill> | |||
| </el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box" v-if="businessType==3"> | |||
| <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">租赁信息</div> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <el-col :span="2" class="span-title">租赁费用:</el-col> | |||
| <el-col :span="6" class="span-text">{{Number(rentOweCount)>0?'有欠缴':'无欠缴'}}</el-col> | |||
| <el-col :span="2" class="span-title">物业费用:</el-col> | |||
| <el-col :span="6" class="span-text">{{Number(propertyOweCount)>0?'有欠缴':'无欠缴'}}</el-col> | |||
| <el-col :span="2" class="span-title">押金情况:</el-col> | |||
| <el-col :span="6" class="span-text">{{Number(depositOweCount)>0?'有欠缴':'无欠缴'}}</el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="2" class="span-title">其他:</el-col> | |||
| <el-col :span="6" class="span-text">{{sRemark}}</el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <div class="text-box"> | |||
| <!-- <div class="text-box-title" :style="{background:navigationInfo.moduleColor}">审批意见</div> --> | |||
| <div class="text-box-content"> | |||
| <el-row> | |||
| <!-- <label class="text" style="color:blue;" v-for="(item,index) in fileNames" :key="index" @click="download(index)"><u>{{item.name}}</u></label> --> | |||
| <el-col :span="3" class="span-title">合同附件:</el-col> | |||
| <el-col :span="6" class="span-text" style="color:blue;" v-if="fileNames.length<=0">无</el-col> | |||
| <el-col :span="6" class="span-text" style="color:blue;" v-if="fileNames.length>0"> | |||
| <div | |||
| class="download-file" | |||
| v-for="(item,index) in fileNames" | |||
| :key="index" | |||
| @click.stop.prevent="download(index)" | |||
| >{{item.name}}</div> | |||
| </el-col> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| <el-row style="margin:20px 0 0;text-align:center;"> | |||
| <el-button @click.stop.prevent="cancel">返回</el-button> | |||
| </el-row> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import commonUtil from "../../core/tool/commonUtil"; | |||
| import AjaxUtil from "../../core/tool/ajaxService"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import rentBill from "../contract/contractutil/rentbill.vue"; | |||
| import { ContractUrl } from "../contract/businessComp/UrlEnum.js"; | |||
| import { CouponCacheData } from "../../service/couponData/data.js"; | |||
| import { ContractData } from "../../service/contract/data.js"; | |||
| import rentShop from "./contractutil/rentshop.vue"; | |||
| import showRateList from './rent/showRateList.vue'; | |||
| import moment from "moment"; | |||
| export default { | |||
| extends: AjaxUtil, | |||
| name: "rentsCheck", | |||
| components: { | |||
| rentBill, | |||
| rentShop, | |||
| showRateList, | |||
| }, | |||
| data() { | |||
| return { | |||
| brands:[], | |||
| fromAddTask:"", | |||
| merchentEditIf: true, | |||
| priceUnitType: "", | |||
| priceUnitOption: ContractData.priceUnitOption, | |||
| contractType: 0, | |||
| totalPeriodMonth: 0, | |||
| totalPeriodDay: 0, | |||
| remark: "", | |||
| wxShops: "", | |||
| rentInfo: [], | |||
| billData: [], | |||
| fileNames: [], | |||
| billTk: "rentbill", | |||
| wxRentContract: "", | |||
| rentOweCount: "", | |||
| propertyOweCount: "", | |||
| businessType: "", | |||
| depositOweCount: "", | |||
| sRemark: "", | |||
| wxMerchant: "", | |||
| businessIds: [], | |||
| active: 0, | |||
| // 店铺类型 | |||
| shopTypes: ContractData.shopTypes, | |||
| //计租计算方式 | |||
| computedTypes: ContractData.computedTypes | |||
| }; | |||
| }, | |||
| //新增computed属性 | |||
| computed: { | |||
| ...mapState({ | |||
| topNav: state => state.topNav.data, //将 this.topNav 映射为 this.$store.topNav.data | |||
| navigationInfo: state => state.topNav.navigationInfo, | |||
| formData: state => state.setRentInfo.formData, | |||
| }), | |||
| getRentPrice() { | |||
| let str = ""; | |||
| if(this.wxRentContract.rentInputWay==2){ | |||
| this.rentInfo.map((item, index) => { | |||
| str = | |||
| str != ""? str + ", " + item.shopNumber + "号铺:" + item.rentPrice + "㎡/元/"+this.priceUnitType: item.shopNumber + "号铺:" + item.rentPrice + "㎡/元/"+this.priceUnitType; | |||
| }); | |||
| }else{ | |||
| str = this.wxRentContract.rentPrice + "㎡/元/"+this.priceUnitType; | |||
| } | |||
| return str; | |||
| }, | |||
| getAdjustPeriod() { | |||
| return this.wxRentContract.adjustPeriod == 3 | |||
| ? "按自然月生成" | |||
| : "按计租日期生成"; | |||
| }, | |||
| getTotleArea() { | |||
| this.rentArea = 0; | |||
| this.rentInfo.map((item, index) => { | |||
| this.rentArea += Number(item.rentArea); | |||
| }); | |||
| return this.rentArea; | |||
| }, | |||
| getAreaList() { | |||
| let str = ""; | |||
| this.rentInfo.map((item, index) => { | |||
| str = | |||
| str != "" | |||
| ? str + ", " + item.shopNumber + "号铺:" + item.rentArea + "㎡" | |||
| : item.shopNumber + "号铺:" + item.rentArea + "㎡"; | |||
| }); | |||
| return str; | |||
| }, | |||
| getTotlePrice() { | |||
| if(this.wxRentContract.rentInputWay==1){ | |||
| return Number(this.wxRentContract.price)/100 + "元/"+ this.priceUnitType; | |||
| }else{ | |||
| this.price = 0; | |||
| this.rentInfo.map((item, index) => { | |||
| this.price += Number(item.price); }); | |||
| return this.price + "元/" + this.priceUnitType; | |||
| } | |||
| }, | |||
| getPriceList() { | |||
| let str = ""; | |||
| this.rentInfo.map((item, index) => { | |||
| str = | |||
| str != "" | |||
| ? str + | |||
| ", " + | |||
| item.shopNumber + | |||
| "号铺: " + | |||
| item.price + | |||
| "元/" + | |||
| this.priceUnitType | |||
| : item.shopNumber + | |||
| "号铺: " + | |||
| item.price + | |||
| "元/" + | |||
| this.priceUnitType; | |||
| }); | |||
| return str; | |||
| }, | |||
| getTotleDeposit() { | |||
| if(this.wxRentContract.rentInputWay==1){ | |||
| return Number(this.wxRentContract.deposit)/100 + "元"; | |||
| }else{ | |||
| this.deposit = 0; | |||
| this.rentInfo.map((item, index) => { | |||
| this.deposit += Number(item.deposit); | |||
| }); | |||
| return this.deposit + "元"; | |||
| } | |||
| }, | |||
| getDepositList() { | |||
| let str = ""; | |||
| this.rentInfo.map((item, index) => { | |||
| str = | |||
| str != "" | |||
| ? str + ", " + item.shopNumber + "号铺: " + item.deposit + "元" | |||
| : item.shopNumber + "号铺: " + item.deposit + "元"; | |||
| }); | |||
| return str; | |||
| } | |||
| }, | |||
| methods: { | |||
| ...mapActions([ | |||
| "setNavData", | |||
| "setRentInfo", | |||
| "setFormData", | |||
| // 将this.setNavData 映射为 this.$store.dispatch('setNavData') | |||
| ]), | |||
| cStatus(item) { | |||
| return item!=undefined?CouponCacheData.rentStatus.filter(e => { | |||
| return e.value == item.toString(); | |||
| })[0].name:''; | |||
| }, | |||
| getPricePer02(items, indexs) { | |||
| let str = ""; | |||
| if(this.wxRentContract.adjustRatioWay==1){ | |||
| items != undefined? items.map((item, index) => { | |||
| str = | |||
| index != 0 | |||
| ? str + ",第" + (index + 2) + "年上浮" + item + "%" | |||
| : str + "第" + (index + 2) + "年上浮" + item + "%"; | |||
| }): ""; | |||
| }else if(this.wxRentContract.adjustRatioWay==2){ | |||
| items != undefined? items.map((item, index) => { | |||
| str = | |||
| index != 0 | |||
| ? str + ",第" + (index + 2) + "年上浮" + item + "元/"+this.priceUnitType | |||
| : str + "第" + (index + 2) + "年上浮" + item + "元/"+this.priceUnitType; | |||
| }): ""; | |||
| }else{ | |||
| items != undefined? items.map((item, index) => { | |||
| str = | |||
| index != 0 | |||
| ? str + ",第" + (index + 2) + "年" + item + "元/"+this.priceUnitType | |||
| : str + "第" + (index + 2) + "年" + item + "元/"+this.priceUnitType; | |||
| }): ""; | |||
| } | |||
| return str; | |||
| }, | |||
| getAdjustRatio(items) { | |||
| let str = items.shopNumber + "号铺: "; | |||
| if(this.wxRentContract.adjustRatioWay==1){ | |||
| items.adjustRatio.map((item, index) => { | |||
| str = str + "第" + (index + 2) + "年上浮" + item + "% "; | |||
| }); | |||
| }else{ | |||
| items.adjustRatio.map((item, index) => { | |||
| str = str + "第" + (index + 2) + "年上浮" + item + "元/"+this.priceUnitType; | |||
| }); | |||
| } | |||
| return str; | |||
| }, | |||
| changeBrand(brand){ | |||
| return this.brands.length>0&&brand!=undefined?this.brands.filter(e=>e.id==brand)[0].value:'' | |||
| }, | |||
| changeBusiness(businessId) { | |||
| return this.businessIds.length > 0 && businessId != undefined | |||
| ? this.businessIds.filter(e => e.id == businessId)[0].title | |||
| : ""; | |||
| }, | |||
| changeShopType(id) { | |||
| return id != undefined | |||
| ? this.shopTypes.filter(e => e.value == id)[0].label | |||
| : ""; | |||
| }, | |||
| changeDate(date) { | |||
| return moment(date).format("YYYY-MM-DD"); | |||
| }, | |||
| changeType(type) { | |||
| return type != undefined | |||
| ? this.computedTypes.filter(e => e.value == type)[0].label | |||
| : ""; | |||
| }, | |||
| download: function(index) { | |||
| window.open(this.fileNames[index].url); | |||
| }, | |||
| cancel() { | |||
| this.$router.back(-1); | |||
| }, | |||
| getData() { | |||
| let _this = this; | |||
| this.contractType = this.$route.query.contractType; | |||
| if ( | |||
| this.$route.query.contractType == 3 || | |||
| this.$route.query.contractType == 4 | |||
| ) { | |||
| this.getFetch( | |||
| "/api/wxPropertyContract/findById?id=" + this.$route.query.id | |||
| ).then(d => { | |||
| _this.wxRentContract = d.data.wxPropertyContract; | |||
| _this.wxRentContract.fixStartDate = _this.wxRentContract.fixStartDate | |||
| ? moment(_this.wxRentContract.fixStartDate).format("YYYY-MM-DD") | |||
| : ""; | |||
| _this.wxRentContract.fixEndDate = _this.wxRentContract.fixEndDate | |||
| ? moment(_this.wxRentContract.fixEndDate).format("YYYY-MM-DD") | |||
| : ""; | |||
| this.priceUnitType = this.wxRentContract.priceUnit | |||
| ? this.priceUnitOption.filter( | |||
| e => e.value == this.wxRentContract.priceUnit | |||
| )[0].name | |||
| : ""; | |||
| _this.totalPeriodMonth = d.data.totalPeriodMonth; | |||
| _this.totalPeriodDay = d.data.totalPeriodDay; | |||
| _this.rentInfo = JSON.parse(d.data.wxPropertyContract.rentInfo); | |||
| _this.fileNames = JSON.parse(d.data.wxPropertyContract.fileNames); | |||
| let adjustRatio = []; | |||
| JSON.parse(d.data.wxPropertyContract.adjustRatio).map( | |||
| (item, index) => { | |||
| let a = item / 100; | |||
| adjustRatio.push(a); | |||
| } | |||
| ); | |||
| _this.wxRentContract.adjustRatio = adjustRatio; | |||
| if (_this.$route.query.businessType == 3) { | |||
| _this.rentOweCount = d.data.rentOweCount; | |||
| _this.propertyOweCount = d.data.propertyOweCount; | |||
| _this.depositOweCount = d.data.depositOweCount; | |||
| _this.sRemark = d.data.remark; | |||
| } | |||
| if (_this.businessType != 3) { | |||
| _this.$refs[_this.billTk].setData(d.data.previewBillRentList); | |||
| } | |||
| if (d.data.wxRentContract.busDiscountRatio == undefined || d.data.wxRentContract.busDiscountTime == undefined) { | |||
| d.data.wxRentContract.busDiscountRatio = ''; | |||
| d.data.wxRentContract.busDiscountTime = 1; | |||
| } | |||
| //aaa | |||
| let curObj = Object.assign({},this.formData); | |||
| curObj.busDiscountRatio = d.data.wxRentContract.busDiscountRatio; | |||
| curObj.busDiscountTime = d.data.wxRentContract.busDiscountTime; | |||
| curObj.payRatio = d.data.wxRentContract.payRatio; | |||
| this.setFormData(curObj); | |||
| }); | |||
| } else { | |||
| this.getFetch( | |||
| "/api/wxRentContract/findById?id=" + this.$route.query.id | |||
| ).then(d => { | |||
| _this.wxRentContract = d.data.wxRentContract; | |||
| _this.wxRentContract.fixStartDate = _this.wxRentContract.fixStartDate | |||
| ? moment(_this.wxRentContract.fixStartDate).format("YYYY-MM-DD") | |||
| : ""; | |||
| _this.wxRentContract.fixEndDate = _this.wxRentContract.fixEndDate | |||
| ? moment(_this.wxRentContract.fixEndDate).format("YYYY-MM-DD") | |||
| : ""; | |||
| this.priceUnitType = this.wxRentContract.priceUnit | |||
| ? this.priceUnitOption.filter( | |||
| e => e.value == this.wxRentContract.priceUnit | |||
| )[0].name | |||
| : ""; | |||
| _this.totalPeriodMonth = d.data.totalPeriodMonth; | |||
| _this.totalPeriodDay = d.data.totalPeriodDay; | |||
| _this.rentInfo = JSON.parse(d.data.wxRentContract.rentInfo); | |||
| _this.fileNames = JSON.parse(d.data.wxRentContract.fileNames); | |||
| // _this.wxShops=d.data.wxShops[0] | |||
| if (_this.$route.query.businessType == 3) { | |||
| _this.rentOweCount = d.data.rentOweCount; | |||
| _this.propertyOweCount = d.data.propertyOweCount; | |||
| _this.depositOweCount = d.data.depositOweCount; | |||
| _this.sRemark = d.data.remark; | |||
| } | |||
| let adjustRatio = []; | |||
| JSON.parse(d.data.wxRentContract.adjustRatio).map((item, index) => { | |||
| let a = item / 100; | |||
| adjustRatio.push(a); | |||
| }); | |||
| _this.wxRentContract.adjustRatio = adjustRatio; | |||
| if (_this.businessType != 3) { | |||
| _this.$refs[_this.billTk].setData(d.data.previewBillRentList); | |||
| } | |||
| //aaa | |||
| let curObj = Object.assign({},this.formData); | |||
| curObj.busDiscountRatio = d.data.wxRentContract.busDiscountRatio; | |||
| curObj.busDiscountTime = d.data.wxRentContract.busDiscountTime; | |||
| curObj.payRatio = d.data.wxRentContract.payRatio; | |||
| this.setFormData(curObj); | |||
| console.log(_this.wxRentContract, _this.businessType, 333333333); | |||
| }); | |||
| } | |||
| } | |||
| }, | |||
| mounted: function() { | |||
| commonUtil.pvuv.setPVUV.apply(this, []); | |||
| }, | |||
| created() { | |||
| this.businessType = this.$route.query.businessType; | |||
| if(this.$route.query.contractType==1){ | |||
| this.setNavData(["合同管理", "店铺", "租金合同", "查看"]); | |||
| }else{ | |||
| this.setNavData(["合同管理", "店铺", "物业合同", "查看"]); | |||
| } | |||
| if(this.$route.query.flags){ | |||
| this.fromAddTask = this.$route.query.flags; | |||
| this.setNavData(["招商管理", "店铺", "租金合同", "查看"]); | |||
| } | |||
| this.getData(); | |||
| //获取品牌列表 | |||
| this.getFetch("/api/wxBrand/queryBrand") | |||
| .then(d => { | |||
| this.brands = d.data; | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| this.getFetch(ContractUrl.businessList) | |||
| .then(d => { | |||
| this.businessIds = d.data; | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| } | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| .text-box { | |||
| background: #fff; | |||
| margin-bottom: 20px; | |||
| } | |||
| .download-file { | |||
| cursor: pointer; | |||
| } | |||
| .text-box-title { | |||
| height: 42px; | |||
| line-height: 42px; | |||
| padding-left: 20px; | |||
| color: #fff; | |||
| font-weight: 400px; | |||
| font-size: 14px; | |||
| background: rgba(51, 153, 255, 1); | |||
| } | |||
| .text-box-content { | |||
| padding: 20px; | |||
| line-height: 36px; | |||
| font-size: 12px; | |||
| } | |||
| .span-title { | |||
| text-align: right; | |||
| padding-right: 15px; | |||
| } | |||
| .layout-content { | |||
| width: 100%; | |||
| height: auto; | |||
| min-height: 300px; | |||
| background: #141e29; | |||
| border-radius: 2px; | |||
| padding: 0 20px 20px 20px; | |||
| overflow: hidden; | |||
| text-align: left; | |||
| } | |||
| .el-form { | |||
| background: #f5f7f8; | |||
| text-align: left; | |||
| padding: 25px 22px 22px; | |||
| margin-bottom: 20px !important; | |||
| } | |||
| .el-form .el-form-item { | |||
| margin-bottom: 0 !important; | |||
| /* width: 200px; */ | |||
| } | |||
| /* .el-select{ | |||
| width:120px; | |||
| } */ | |||
| .tableContainer { | |||
| margin-top: 20px !important; | |||
| background: #fff; | |||
| } | |||
| .el-button { | |||
| /* width: 60px; */ | |||
| border: none !important; | |||
| margin: 0 10px; | |||
| height: 40px; | |||
| } | |||
| .builtBtn { | |||
| width: 100px; | |||
| height: 32px; | |||
| background: rgba(81, 169, 201, 1); | |||
| border: 0 !important; | |||
| line-height: 32px; | |||
| text-align: center; | |||
| margin: 0; | |||
| padding: 0 !important; | |||
| } | |||
| .builtBtn:hover { | |||
| background: rgba(81, 169, 201, 0.88); | |||
| } | |||
| .builtBtn i { | |||
| margin-right: 10px; | |||
| } | |||
| .fx_send .el-form-item__content .el-select { | |||
| width: 120px !important; | |||
| } | |||
| .fx_title .el-input { | |||
| width: 150px; | |||
| } | |||
| .cur-rate-list /deep/ .rate-show-list li { | |||
| margin-top: 6px; | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,532 @@ | |||
| <template> | |||
| <div> | |||
| <div class="layout-content"> | |||
| <el-form | |||
| :inline="true" | |||
| :model="ruleForm" | |||
| ref="ruleForm" | |||
| class="demo-form-inline" | |||
| label-position="right" | |||
| > | |||
| <el-form-item label="商铺号" prop="name" class="fx_title"> | |||
| <el-input v-model.trim="ruleForm.shopNumber" placeholder="请输入" clearable></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="商户名称" prop="merchantName" class="fx_title"> | |||
| <el-input v-model.trim="ruleForm.merchantName" placeholder="请输入" clearable></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="合同状态" class="fx_send"> | |||
| <el-select v-model="ruleForm.status" placeholder="请选择" clearable class="select-method"> | |||
| <el-option | |||
| v-for="(item,index) in options" | |||
| :key="index" | |||
| :value="item.value" | |||
| :label="item.label" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="审批状态" class="fx_send"> | |||
| <el-select v-model="ruleForm.applyStatus" placeholder="请选择" clearable class="select-method"> | |||
| <el-option | |||
| v-for="(item,index) in applyStatusOptions" | |||
| :key="index" | |||
| :value="item.value" | |||
| :label="item.name" | |||
| ></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item> | |||
| <el-button | |||
| class="hoverBtn" | |||
| type="primary" | |||
| icon="el-icon-search" | |||
| :style="'border:0;background:'+navigationInfo.moduleColor" | |||
| @click="search" | |||
| ></el-button> | |||
| </el-form-item> | |||
| </el-form> | |||
| <el-button type="primary" class="builtBtn" @click="goSave"> | |||
| <i>+</i>新建 | |||
| </el-button> | |||
| <!-- <el-button type="primary" class="builtBtn" @click="goRenew" style="margin-left:4px;"> | |||
| <i>+</i>续签 | |||
| </el-button> --> | |||
| <table-list :ref="tk" :options="optionsTable"></table-list> | |||
| <stop-contract :ref="st" :type='14' :processData="processData" :options="stopOptions"></stop-contract> | |||
| </div> | |||
| <el-dialog title="提示" :visible.sync="dialogVisible" width="40%" :modal-append-to-body="false"> | |||
| <span>当前有欠缴账单未结清,是否要继续终止物业合同?</span> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button @click="dialogVisible = false">取 消</el-button> | |||
| <el-button type="primary" @click="stopContract">确定</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import TableList from "../../../core/comps/table/tableList.vue"; | |||
| import reportTool from "../../../core/tool/report.js"; | |||
| import commonUtil from "../../../core/tool/commonUtil"; | |||
| import AjaxUtil from "../../../core/tool/ajaxService"; | |||
| import StopContract from "../contractutil/stopcontract.vue"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import { CouponCacheData } from "../../../service/couponData/data.js"; | |||
| import { ContractData } from "../../../service/contract/data.js"; | |||
| import { promissionUrl } from "../../../urlconfig/promission/url.js"; | |||
| import { ContractUrl } from "../businessComp/UrlEnum.js"; | |||
| let echarts = require("echarts"); | |||
| export default { | |||
| inject: ["reload"], | |||
| extends: AjaxUtil, | |||
| name: "tenementlist", | |||
| components: { | |||
| TableList, | |||
| StopContract | |||
| }, | |||
| data() { | |||
| return { | |||
| processData:[], | |||
| waitSignCount: "", //待签约 | |||
| endSoonCount: "", //将到期合同 | |||
| rendPaidCount: "", //计租中合同 | |||
| shopcount: "", //空余商铺 | |||
| tk: "manjianTableKey", | |||
| st: "stopContract", | |||
| stopOptions: { | |||
| contractType: "3", | |||
| stopType: 2 //物业合同 | |||
| }, | |||
| applyStatusOptions:ContractData.applyStatus, | |||
| ruleForm: { | |||
| shopNumber: "", | |||
| merchantName: "", | |||
| status:"", | |||
| applyStatus:'' | |||
| }, | |||
| options:ContractData.statusOptions, | |||
| dialogVisible: false, | |||
| optionsTable: { | |||
| actions: [ | |||
| { | |||
| key: "edit", | |||
| val: "提交审批", | |||
| action: this.doApply, | |||
| show: item => { | |||
| return item.status == 1 | |||
| ? true | |||
| : false; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "编辑", | |||
| action: this.goEdit, | |||
| show: item => { | |||
| return item.status == 10 && (item.applyStatus == 3 || item.applyStatus == 5) | |||
| ? true | |||
| : false; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "终止", | |||
| action: this.endcontract, | |||
| // show: this.isendcontract(item), | |||
| show: item => { | |||
| if ( | |||
| item.status == 2 || item.status == 3 | |||
| ) { | |||
| return true; | |||
| } else { | |||
| return false; | |||
| } | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "查看", | |||
| action: this.goCheck, | |||
| show: item => { | |||
| return true; | |||
| } | |||
| }, | |||
| { | |||
| key: "download", | |||
| val: "下载", | |||
| action: this.goDownload, | |||
| show: item => { | |||
| return true; | |||
| } | |||
| }, | |||
| { | |||
| key: "edit", | |||
| val: "审批进度", | |||
| action: this.checkCurrentStatus, | |||
| show: item => { | |||
| return item.applyStatus == 1 || | |||
| item.applyStatus == 2 || | |||
| item.applyStatus == 3 || | |||
| item.applyStatus == 5 | |||
| ? true | |||
| : false; | |||
| } | |||
| } | |||
| ], | |||
| showCk: false, | |||
| map: [ | |||
| { | |||
| key: "contractNumber", | |||
| val: "合同编号" | |||
| }, | |||
| { | |||
| key: "shopNumber", | |||
| val: "商铺号", | |||
| convert: this.changeShopNum, | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "merchantName", | |||
| val: "商户名称" | |||
| }, | |||
| { | |||
| key: "rentalStartDate", | |||
| val: "租赁开始日期", | |||
| type: "date", | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "rentalEndDate", | |||
| val: "租赁结束日期", | |||
| type: "date", | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "price", | |||
| val: "物业费", | |||
| convert: this.divide, | |||
| sortable:true | |||
| }, | |||
| { | |||
| key: "status", | |||
| val: "合同状态", | |||
| convert: this.cStatus | |||
| }, | |||
| { | |||
| key: "applyStatus", | |||
| val: "审批状态", | |||
| convert: this.cApplyStatus | |||
| } | |||
| ], | |||
| getUrl: () => { | |||
| return ( | |||
| "/api/wxPropertyContract/list?merchantName=" + | |||
| this.ruleForm.merchantName + | |||
| "&shopNumber=" + | |||
| this.ruleForm.shopNumber + | |||
| "&rentShopType=1&applyStatus=" + | |||
| this.ruleForm.applyStatus + | |||
| "&status=" + | |||
| this.ruleForm.status+ | |||
| "&operationType=1" | |||
| ); | |||
| }, | |||
| pageOption: { | |||
| sizeKey: "pageSize", | |||
| indexKey: "pageNum", | |||
| index: 1, | |||
| size: 10 | |||
| }, | |||
| analysis: data => { | |||
| return { | |||
| data: data.data.pageInfo.list, | |||
| count: data.data.pageInfo.total | |||
| }; | |||
| } | |||
| } | |||
| }; | |||
| }, | |||
| computed: { | |||
| ...mapState({ | |||
| navigationInfo: state => state.topNav.navigationInfo | |||
| }) | |||
| }, | |||
| methods: { | |||
| ...mapActions([ | |||
| "setNavData" // 将this.setNavData 映射为 this.$store.dispatch('setNavData') | |||
| ]), | |||
| doApply(item,row) { | |||
| console.log(item) | |||
| let params = { | |||
| remark: '', | |||
| id: item.id | |||
| } | |||
| this.postFetch("/api/wxRentContract/apply",params) | |||
| .then(d => { | |||
| }) | |||
| .catch(err => { | |||
| this.$message.success(err.data); | |||
| }); | |||
| }, | |||
| changeShopNum(item, row) { | |||
| let rentInfo = row.rentInfo?JSON.parse(row.rentInfo):[]; | |||
| let str = ""; | |||
| rentInfo.map((items, indexs) => { | |||
| str = str != "" ? str + " ," + items.shopNumber : items.shopNumber; | |||
| }); | |||
| return str; | |||
| }, | |||
| cApplyStatus(col, item) { | |||
| if (item.applyStatus) { | |||
| return ( | |||
| (item.businessType != 14 ? "签约" : "终止") + | |||
| ContractData.applyStatus.filter(e => e.value == item.applyStatus)[0] | |||
| .name | |||
| ); | |||
| } else if (item.applyStatus === 0) { | |||
| return "未提交审核"; | |||
| } | |||
| }, | |||
| checkCurrentStatus(item, row) { | |||
| this.$router.push({ | |||
| path: "rentApprovals?id=" + item.id | |||
| }); | |||
| }, | |||
| cStatus(col, item) { | |||
| return CouponCacheData.rentStatus.filter(e => { | |||
| return e.value == item.status.toString(); | |||
| })[0].name; | |||
| }, | |||
| goEdit: function(item, row) { | |||
| this.$router.push({ | |||
| path: "tenementAdd?id=" + item.id | |||
| }); | |||
| }, | |||
| divide(col, item) { | |||
| return Number(item.price) / 100 +(item.price_unit==1?'元/日':item.price_unit==2?'元/月':'元/年'); | |||
| }, | |||
| endcontract: function(item, row) { | |||
| let that = this; | |||
| that.contractId = item.id; | |||
| that.contractNumber = item.contractNumber; | |||
| this.getFetch("/api/wxBillAll/oweBillCount?type=2&contractId=" + item.id) | |||
| .then(d => { | |||
| if (Number(d.data) > 0) { | |||
| that.dialogVisible = true; | |||
| } else { | |||
| if(this.processData.length>0){ | |||
| this.dialogVisible = false; | |||
| this.$refs[this.st].showLog(this.contractId, this.contractNumber); | |||
| }else{ | |||
| this.makeSure(); | |||
| } | |||
| } | |||
| }) | |||
| .catch(err => { | |||
| this.$message.success(err.data); | |||
| }); | |||
| }, | |||
| stopContract() { | |||
| // this.$refs[this.st].showLog(this.contractId, this.contractNumber); | |||
| if(this.processData.length>0){ | |||
| this.dialogVisible = false; | |||
| this.$refs[this.st].showLog(this.contractId, this.contractNumber); | |||
| }else{ | |||
| this.endProperty(); | |||
| } | |||
| }, | |||
| makeSure(){ | |||
| this.$confirm('您确定要提前终止此合同吗?', '提示', { | |||
| confirmButtonText: '确定', | |||
| cancelButtonText: '取消', | |||
| type: 'warning' | |||
| }).then(() => { | |||
| this.endProperty(); | |||
| }).catch(() => { | |||
| this.$message({ | |||
| type: 'info', | |||
| message: '已取消删除' | |||
| }); | |||
| }); | |||
| }, | |||
| endProperty(){ | |||
| let _this=this; | |||
| let param={ | |||
| id:this.contractId | |||
| } | |||
| this.postFetch(ContractUrl.endPropertyContract, param) | |||
| .then(d => { | |||
| _this.$message.success("操作成功"); | |||
| _this.dialogVisible = false; | |||
| _this.search(); | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| }, | |||
| goSave: function() { | |||
| this.$router.push({ | |||
| path: "/tenementAdd" | |||
| }); | |||
| }, | |||
| goRenew(){ | |||
| this.$router.push({ | |||
| path: "/tenementAdd", | |||
| query:{ | |||
| Renew:true | |||
| } | |||
| }); | |||
| }, | |||
| goCheck: function(item, row) { | |||
| /** | |||
| contractType合同类型:1租金合同,2多经合同,3物业合同,4多经物业合同 | |||
| businessType操作类型:1合同审批,2账单审批,3终止合同审批 | |||
| id为合同id | |||
| */ | |||
| this.$router.push({ | |||
| path: `rentsCheck?id=${item.id}&contractType=3&businessType=1` | |||
| }); | |||
| }, | |||
| getcount: function() { | |||
| this.getFetch( | |||
| "/api/wxPropertyContract/list?pageNum=1&pageSize=10&shopNumber=" + | |||
| this.ruleForm.shopNumber + | |||
| "&merchantName=" + | |||
| this.ruleForm.merchantName + | |||
| "&rentShopType=1" | |||
| ) | |||
| .then(d => { | |||
| this.waitSignCount = d.data.rentContractStatusInfo.waitSignCount; | |||
| this.endSoonCount = d.data.rentContractStatusInfo.endSoonCount; | |||
| this.rendPaidCount = d.data.rentContractStatusInfo.rendPaidCount; | |||
| this.shopcount = | |||
| d.data.rentContractStatusInfo.shopCountInfo.unrentedCount; //空余商铺 | |||
| let allRentCount = | |||
| Number(d.data.rentContractStatusInfo.allCount) == 0 | |||
| ? 100 | |||
| : Number(d.data.rentContractStatusInfo.allCount); //合同总数 | |||
| let allShopCount = | |||
| Number(d.data.rentContractStatusInfo.shopCountInfo.allCount) == 0 | |||
| ? 100 | |||
| : Number(d.data.rentContractStatusInfo.shopCountInfo.allCount); //商铺总数 | |||
| let value_spare = Number(this.shopcount) || 0; | |||
| let myChart_spare = echarts.init(document.getElementById("spare")); | |||
| myChart_spare.setOption( | |||
| reportTool.myPie("空余商铺", "#5976BF", value_spare, allShopCount) | |||
| ); | |||
| let value_signed = Number(this.waitSignCount) || 0; | |||
| let myChart_signed = echarts.init(document.getElementById("signed")); | |||
| myChart_signed.setOption( | |||
| reportTool.myPie("待签约", "#C85963", value_signed, allRentCount) | |||
| ); | |||
| let value_expire = Number(this.endSoonCount) || 0; | |||
| let myChart_expire = echarts.init(document.getElementById("expire")); | |||
| myChart_expire.setOption( | |||
| reportTool.myPie("将到期", "#EE7653", value_expire, allRentCount) | |||
| ); | |||
| let value_planning = Number(this.rendPaidCount) || 0; | |||
| let myChart_planning = echarts.init( | |||
| document.getElementById("planning") | |||
| ); | |||
| myChart_planning.setOption( | |||
| reportTool.myPie("计租中", "#3FC496", value_planning, allRentCount) | |||
| ); | |||
| }) | |||
| .catch(err => { | |||
| this.$message.error(err.data); | |||
| }); | |||
| }, | |||
| search: function() { | |||
| let tk = this.$refs[this.tk]; | |||
| tk.search(tk.getParams().index); | |||
| }, | |||
| goDownload: function(item) { | |||
| location.href = | |||
| "/api/wxRentContract/exportContract?id=" + item.rentContractId; | |||
| }, | |||
| /** | |||
| * 根据业务查询模板 | |||
| */ | |||
| getModelBybusiness(){ | |||
| this.getFetch(`${promissionUrl.getModelBybusiness}?flowType=14`) | |||
| .then(d=>{ | |||
| if(d.data.length>0){ | |||
| this.processData = JSON.parse(d.data[0].flow).lists; | |||
| } | |||
| }) | |||
| .catch(err=>{ | |||
| this.$message.error(err.data); | |||
| }) | |||
| } | |||
| }, | |||
| created(){ | |||
| this.setNavData(["合同管理", "店铺", "物业合同"]); | |||
| }, | |||
| activated(){ | |||
| this.search() | |||
| // this.getcount(); | |||
| this.getModelBybusiness(); | |||
| this.setNavData(["合同管理", "店铺", "物业合同"]); | |||
| } | |||
| }; | |||
| </script> | |||
| <!-- Add "scoped" attribute to limit CSS to this component only --> | |||
| <style scoped> | |||
| .layout-content { | |||
| width: 100%; | |||
| background: #141e29; | |||
| height: auto; | |||
| border-radius: 2px; | |||
| min-height: 300px; | |||
| padding: 0 20px 20px 20px; | |||
| overflow: hidden; | |||
| text-align: left; | |||
| } | |||
| .el-form { | |||
| background: #f5f7f8; | |||
| text-align: left; | |||
| padding: 25px 22px 22px; | |||
| margin-bottom: 20px !important; | |||
| } | |||
| .el-form .el-form-item { | |||
| margin-bottom: 0 !important; | |||
| } | |||
| .tableContainer { | |||
| margin-top: 20px !important; | |||
| background: #fff; | |||
| } | |||
| .el-button { | |||
| width: 60px; | |||
| height: 40px; | |||
| } | |||
| .builtBtn { | |||
| width: 100px; | |||
| height: 32px; | |||
| background: rgba(81, 169, 201, 1); | |||
| border: 0 !important; | |||
| line-height: 32px; | |||
| text-align: center; | |||
| margin: 0; | |||
| padding: 0 !important; | |||
| } | |||
| .builtBtn:hover { | |||
| background: rgba(81, 169, 201, 0.88); | |||
| } | |||
| .builtBtn i { | |||
| margin-right: 10px; | |||
| } | |||
| .el-form-item .el-form-item__content, | |||
| .el-form-item .el-form-item__content .el-date-editor, | |||
| .el-form-item .el-form-item__content .el-date-editor .el-input__inner { | |||
| width: 150px; | |||
| } | |||
| .fx_title .el-input { | |||
| width: 193px; | |||
| } | |||
| </style> | |||