123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270 |
- <template>
- <div class="main">
- <div class="search">
- <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="yyyyMMdd"
- 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>
- <!-- <el-tooltip class="item" effect="light" placement="bottom" content="导出">
- <i class="zoniot_font zoniot-icon-daochu2" @click="exportExcel"></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() {
- return {
- times: [],
- advertisingStatus: [
- {
- status: 0,
- label: '已签约'
- },
- {
- status: 1,
- label: '生效中'
- },
- {
- status: 2,
- label: '到期'
- }
- ],
- cols: [
- {
- label: '合同编号',
- prop: 'contractNo'
- },
- {
- label: '客户名称',
- prop: 'customerName'
- },
- {
- label: '客户类型',
- prop: 'customerType',
- format(val) {
- if (val == 1) {
- return '企业';
- } else if (val == 2) {
- return '个人';
- }
- },
- width: '100'
- },
- {
- label: '合同类型',
- prop: 'contractType'
- },
- {
- 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'
- },
- {
- label: '结束时间',
- prop: 'endTime'
- },
- {
- label: '合同到期天数',
- prop: 'endTime'
- },
- {
- label: '操作',
- slot: 'opt',
- width: '180'
- }
- ],
- mixins_post: 'post',
- CommunityTree: []
- };
- },
- created() {
- this.getorgTree();
- this.getCommunityArr();
- 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>
|