|
@@ -0,0 +1,287 @@
|
|
|
+<template>
|
|
|
+ <div class="main">
|
|
|
+ <div class="search" v-if="!condition">
|
|
|
+ <el-input placeholder="请输入合同编号/名称" class="search-input" clearable v-model="mixins_query.contractName"></el-input>
|
|
|
+ <el-select placeholder="合同状态" v-model="mixins_query.adStatus" clearable>
|
|
|
+ <el-option v-for="(item, index) in advertisingStatus" :key="index" :label="item.label" :value="item.status">{{
|
|
|
+ item.label
|
|
|
+ }}</el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-date-picker
|
|
|
+ v-model="times"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ type="daterange"
|
|
|
+ range-separator="至"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ @change="effectiveDateToggle"
|
|
|
+ ></el-date-picker>
|
|
|
+ <el-button type="primary" class="search-btn" @click="mixins_search" icon="el-icon-search">查询 </el-button>
|
|
|
+ <div class="search-icon">
|
|
|
+ <el-tooltip class="item" effect="light" placement="bottom" content="新增">
|
|
|
+ <i class="zoniot_font zoniot-icon-tianjia2" @click="addOrEdit('add')"></i>
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="roles-wrap">
|
|
|
+ <zz-table
|
|
|
+ :cols="cols"
|
|
|
+ :settings="{ showIndex: true, stripe: true }"
|
|
|
+ :loading="mixins_onQuery"
|
|
|
+ :data="mixins_list"
|
|
|
+ :pageset="mixins_pageset"
|
|
|
+ @page-change="pageChange"
|
|
|
+ @selection-change="selectionChange"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope" slot="opt">
|
|
|
+ <div class="opt">
|
|
|
+ <!-- <el-tooltip effect="light" placement="bottom" content="编辑">
|
|
|
+ <i class="zoniot_font zoniot-icon-bianji" @click="addOrEdit('edit', scope.row)"></i>
|
|
|
+ </el-tooltip> -->
|
|
|
+
|
|
|
+ <el-tooltip effect="light" placement="bottom" content="详情">
|
|
|
+ <i class="zoniot_font zoniot-icon-xiangqing" @click="lookDetail(scope.row)"></i>
|
|
|
+ </el-tooltip>
|
|
|
+ <el-tooltip effect="light" placement="bottom" content="续期">
|
|
|
+ <i class="zoniot_font zoniot-icon-xuqi" @click="renewal(scope.row)"></i>
|
|
|
+ </el-tooltip>
|
|
|
+
|
|
|
+ <el-tooltip effect="light" placement="bottom" content="退租">
|
|
|
+ <i
|
|
|
+ class="zoniot_font zoniot-icon-tuifang redText"
|
|
|
+ v-if="scope.row.contractStatus !== 2"
|
|
|
+ @click="rentWithdrawal(scope.row)"
|
|
|
+ ></i>
|
|
|
+ <i class="zoniot_font zoniot-icon-tuifang ashText" v-else></i>
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </zz-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import list from '@utils/list.js';
|
|
|
+export default {
|
|
|
+ mixins: [list],
|
|
|
+ data() {
|
|
|
+ let _this = this;
|
|
|
+ return {
|
|
|
+ times: [],
|
|
|
+ advertisingStatus: [
|
|
|
+ {
|
|
|
+ status: 0,
|
|
|
+ label: '已签约'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ status: 1,
|
|
|
+ label: '生效中'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ status: 2,
|
|
|
+ label: '到期'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ cols: [
|
|
|
+ {
|
|
|
+ label: '合同编号',
|
|
|
+ prop: 'contractNo'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '客户名称',
|
|
|
+ prop: 'userName'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '客户类型',
|
|
|
+ prop: 'customerType',
|
|
|
+ format(val) {
|
|
|
+ if (val == 1) {
|
|
|
+ return '企业';
|
|
|
+ } else if (val == 2) {
|
|
|
+ return '个人';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ width: '100'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '合同类型',
|
|
|
+ prop: 'contractType',
|
|
|
+ format(val) {
|
|
|
+ if (val == 0) {
|
|
|
+ return '租赁合同';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '房间',
|
|
|
+ prop: 'houseName'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '合同状态',
|
|
|
+ prop: 'contractStatus',
|
|
|
+ format(val) {
|
|
|
+ if (val == 0) {
|
|
|
+ return '已签约';
|
|
|
+ } else if (val == 1) {
|
|
|
+ return '生效中';
|
|
|
+ } else if (val == 2) {
|
|
|
+ return '到期';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '开始时间',
|
|
|
+ prop: 'startTime',
|
|
|
+ format(val) {
|
|
|
+ if (!!val) {
|
|
|
+ return _this.$moment(val).format('YYYY-MM-DD');
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '结束时间',
|
|
|
+ prop: 'endTime',
|
|
|
+ format(val) {
|
|
|
+ if (!!val) {
|
|
|
+ return _this.$moment(val).format('YYYY-MM-DD');
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '合同到期天数',
|
|
|
+ prop: 'expiryDays'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '操作',
|
|
|
+ slot: 'opt',
|
|
|
+ width: '180'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ mixins_post: 'post',
|
|
|
+ CommunityTree: []
|
|
|
+ };
|
|
|
+ },
|
|
|
+ props: ['condition'],
|
|
|
+ created() {
|
|
|
+ this.getorgTree();
|
|
|
+ this.getCommunityArr();
|
|
|
+ if (!!this.condition) {
|
|
|
+ this.mixins_query = this.condition;
|
|
|
+ }
|
|
|
+ this.mixins_dataUrl = '/sc-community/contract/page';
|
|
|
+ this.mixins_search();
|
|
|
+ },
|
|
|
+ mounted() {},
|
|
|
+ methods: {
|
|
|
+ getorgTree() {
|
|
|
+ this.$http
|
|
|
+ .get('/sc-community/assets/community/list')
|
|
|
+ .then((data) => {
|
|
|
+ this.communityArr = data.data;
|
|
|
+ this.$store.commit('setAreaSelect', data.data);
|
|
|
+ })
|
|
|
+
|
|
|
+ .catch(function () {});
|
|
|
+ },
|
|
|
+ getCommunityArr() {
|
|
|
+ this.$http
|
|
|
+ .get('/sc-community/assets/tree/community/find')
|
|
|
+ .then(({ data }) => {
|
|
|
+ this.CommunityTree = data;
|
|
|
+ })
|
|
|
+ .catch(function () {});
|
|
|
+ },
|
|
|
+ effectiveDateToggle(va) {
|
|
|
+ let arr = va;
|
|
|
+ if (!arr) {
|
|
|
+ arr = ['', ''];
|
|
|
+ }
|
|
|
+ this.mixins_query.startTime = arr[0];
|
|
|
+ this.mixins_query.endTime = arr[1];
|
|
|
+ },
|
|
|
+ addOrEdit(todo, data = {}) {
|
|
|
+ new Promise((resolve) => {
|
|
|
+ let title = '添加合同';
|
|
|
+ if (todo !== 'add') {
|
|
|
+ title = '修改合同';
|
|
|
+ }
|
|
|
+ this.$store.dispatch('addPopup', {
|
|
|
+ url: '/businessManagement/contractManagement/stepPage/add.vue',
|
|
|
+ width: '850px',
|
|
|
+ height: '600px',
|
|
|
+ props: {
|
|
|
+ data,
|
|
|
+ todo,
|
|
|
+ communityArr: this.communityArr,
|
|
|
+ communityTree: this.CommunityTree,
|
|
|
+ callback: resolve
|
|
|
+ },
|
|
|
+ title: title,
|
|
|
+ showIndex: 0,
|
|
|
+ previousStepButton: false,
|
|
|
+ showConfirmButton: true,
|
|
|
+ nextStepButton: true
|
|
|
+ });
|
|
|
+ }).then(() => {
|
|
|
+ this.mixins_search();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ exportExcel() {
|
|
|
+ this.__exportExcel('/sc-community/enterprise/excel', this.mixins_query);
|
|
|
+ },
|
|
|
+ lookDetail(row) {
|
|
|
+ new Promise((resolve) => {
|
|
|
+ this.$store.dispatch('addPopup', {
|
|
|
+ url: '/businessManagement/contractManagement/stepPage/details.vue',
|
|
|
+ width: '850px',
|
|
|
+ height: '600px',
|
|
|
+ props: {
|
|
|
+ row,
|
|
|
+ callback: resolve
|
|
|
+ },
|
|
|
+ title: '合同详情',
|
|
|
+ hideStar: true,
|
|
|
+ showCancelButton: true,
|
|
|
+ showConfirmButton: true
|
|
|
+ });
|
|
|
+ }).then(() => {
|
|
|
+ this.mixins_search();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ rentWithdrawal(row) {
|
|
|
+ new Promise((resolve) => {
|
|
|
+ this.$store.dispatch('addPopup', {
|
|
|
+ url: '/businessManagement/contractManagement/stepPage/rentWithdrawal.vue',
|
|
|
+ width: '850px',
|
|
|
+ height: '600px',
|
|
|
+ props: {
|
|
|
+ row,
|
|
|
+ callback: resolve
|
|
|
+ },
|
|
|
+ title: '退租',
|
|
|
+ hideStar: true
|
|
|
+ });
|
|
|
+ }).then(() => {
|
|
|
+ this.mixins_search();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ renewal(row) {
|
|
|
+ new Promise((resolve) => {
|
|
|
+ this.$store.dispatch('addPopup', {
|
|
|
+ url: '/businessManagement/contractManagement/stepPage/renewal.vue',
|
|
|
+ width: '850px',
|
|
|
+ height: '600px',
|
|
|
+ props: {
|
|
|
+ row,
|
|
|
+ callback: resolve
|
|
|
+ },
|
|
|
+ title: '续租'
|
|
|
+ });
|
|
|
+ }).then(() => {
|
|
|
+ this.mixins_search();
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|