|
|
@@ -0,0 +1,282 @@
|
|
|
+<template>
|
|
|
+ <a-card :bordered="false">
|
|
|
+ <!-- 查询区域 -->
|
|
|
+ <div class="table-page-search-wrapper">
|
|
|
+ <a-form layout="inline" @keyup.enter.native="loadScheme">
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :span="6">
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ </a-form>
|
|
|
+ </div>
|
|
|
+ <!-- 查询区域-END -->
|
|
|
+
|
|
|
+ <!-- 操作按钮区域 -->
|
|
|
+ <div class="table-operator">
|
|
|
+ <a-button @click="loadScheme" type="primary" icon="add">查询</a-button>
|
|
|
+ <a-button @click="addScheme" type="primary" icon="plus">新增</a-button>
|
|
|
+ </div>
|
|
|
+ <!-- <div class="table-operator">
|
|
|
+ <a-tabs v-model:activeKey="activeKey">
|
|
|
+ <a-tab-pane key="1" tab="Tab 1">Content of Tab Pane 1</a-tab-pane>
|
|
|
+ <a-tab-pane key="2" tab="Tab 2" force-render>Content of Tab Pane 2</a-tab-pane>
|
|
|
+ <a-tab-pane key="3" tab="Tab 3">Content of Tab Pane 3</a-tab-pane>
|
|
|
+ </a-tabs>
|
|
|
+ </div> -->
|
|
|
+
|
|
|
+ <!-- table区域-begin -->
|
|
|
+ <div>
|
|
|
+ <!-- <div class="ant-alert ant-alert-info" style="margin-bottom: 16px">
|
|
|
+ <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择
|
|
|
+ <a style="font-weight: 600">{{ selectedRowKeys.length }}</a
|
|
|
+ >项
|
|
|
+ <a style="margin-left: 24px" @click="onClearSelected">清空</a>
|
|
|
+</div> -->
|
|
|
+
|
|
|
+ <a-table
|
|
|
+ rowKey="id"
|
|
|
+ :columns="columns"
|
|
|
+ :dataSource="longRentSchemeList"
|
|
|
+ bordered
|
|
|
+ :pagination="ipagination"
|
|
|
+ class="j-table-force-nowrap">
|
|
|
+ <template slot="name" slot-scope="text, record, index" >
|
|
|
+ <div style="margin: -15px -16px">
|
|
|
+ <div v-for="(item, indexs) in record.houseLongRentChargeList" :key="indexs" class="table_list_item">
|
|
|
+ {{ item.name }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template slot="chargeType" slot-scope="text, record, index" >
|
|
|
+ <div style="margin: -15px -16px">
|
|
|
+ <div v-for="(item, indexs) in record.houseLongRentChargeList" :key="indexs" class="table_list_item">
|
|
|
+ {{ getChargeTypeText(item.chargeType) }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template slot="marketPrice" slot-scope="text, record, index" >
|
|
|
+ <div style="margin: -15px -16px">
|
|
|
+ <div v-for="(item, indexs) in record.houseLongRentChargeList" :key="indexs" class="table_list_item">
|
|
|
+ {{ getMarketPriceText(item) }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template slot="state" slot-scope="text, record, index" >
|
|
|
+ <a-switch/>启用
|
|
|
+ </template>
|
|
|
+ <template slot="action" slot-scope="text, record, index" >
|
|
|
+ <a @click="editScheme(record)">修改</a>
|
|
|
+ <a-divider type="vertical" />
|
|
|
+ <a-popconfirm title="确定删除吗?" >
|
|
|
+ <a :disabled="flag">删除</a>
|
|
|
+ </a-popconfirm>
|
|
|
+ </template>
|
|
|
+ </a-table>
|
|
|
+ </div>
|
|
|
+ <!-- <room-layout-form ref="modalForm" @ok="modalFormOk"></room-layout-form>-->
|
|
|
+ <!-- <room-layout-price-modal ref="priceModal" @ok="onPriceSave"></room-layout-price-modal>-->
|
|
|
+ <!-- <room-layout-detail-modal @saveOk="onSaveOk" ref="detailModal"></room-layout-detail-modal>-->
|
|
|
+ <long-rent-scheme-model ref="longRentSchemeModel" @ok="longRentSchemeModelOk"></long-rent-scheme-model>
|
|
|
+ </a-card>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+
|
|
|
+import HousePriceSchemeModal from './modules/housePriceSchemeModal'
|
|
|
+import { httpAction, getAction } from '@/api/manage'
|
|
|
+import HousePriceSchemeDetailModal from './modules/housePriceSchemeDetailModal'
|
|
|
+import LongRentSchemeModel from '@views/settings/components/roomModules/longRentSchemeModel'
|
|
|
+let hotelInfo = JSON.parse(localStorage.getItem('storeInfo'))
|
|
|
+export default {
|
|
|
+ name: 'LongRentScheme',
|
|
|
+ components: {
|
|
|
+ LongRentSchemeModel,
|
|
|
+ HousePriceSchemeDetailModal,
|
|
|
+ HousePriceSchemeModal
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ visible: false,
|
|
|
+ queryParam: {},
|
|
|
+ labelCol: {
|
|
|
+ xs: { span: 24 },
|
|
|
+ sm: { span: 7 }
|
|
|
+ },
|
|
|
+ wrapperCol: {
|
|
|
+ xs: { span: 24 },
|
|
|
+ sm: { span: 16 }
|
|
|
+ },
|
|
|
+ // 分页参数
|
|
|
+ ipagination: {
|
|
|
+ current: 1,
|
|
|
+ pageSize: 3,
|
|
|
+ pageSizeOptions: ['3', '6', '9'],
|
|
|
+ showTotal: (total, range) => {
|
|
|
+ return range[0] + '-' + range[1] + ' 共' + total + '条'
|
|
|
+ },
|
|
|
+ showQuickJumper: true,
|
|
|
+ showSizeChanger: true,
|
|
|
+ total: 0
|
|
|
+ },
|
|
|
+ // 表头
|
|
|
+ columns: [
|
|
|
+ {
|
|
|
+ title: '房价方案',
|
|
|
+ align: 'center',
|
|
|
+ width: 80,
|
|
|
+ dataIndex: 'name'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '费用名称',
|
|
|
+ dataIndex: 'name',
|
|
|
+ width: 80,
|
|
|
+ scopedSlots: { customRender: 'name' }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '费用类型',
|
|
|
+ dataIndex: 'chargeType',
|
|
|
+ width: 80,
|
|
|
+ scopedSlots: { customRender: 'chargeType' }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '费用标准',
|
|
|
+ dataIndex: 'marketPrice',
|
|
|
+ width: 60,
|
|
|
+ scopedSlots: { customRender: 'marketPrice' }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '状态',
|
|
|
+ dataIndex: 'state',
|
|
|
+ align: 'center',
|
|
|
+ width: 147,
|
|
|
+ scopedSlots: { customRender: 'state' }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '操作',
|
|
|
+ dataIndex: 'action',
|
|
|
+ align: 'center',
|
|
|
+ width: 147,
|
|
|
+ scopedSlots: { customRender: 'action' }
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ url: {
|
|
|
+ list: '/rooms/cesHousePriceScheme/list?hotelId=' + hotelInfo.id
|
|
|
+ },
|
|
|
+ longRentSchemeList: [],
|
|
|
+ // 新增费项
|
|
|
+ addChargeList: [],
|
|
|
+ // 新增时选择的费项类型
|
|
|
+ chargeType: null,
|
|
|
+ rentCharges: {
|
|
|
+ chargeType: 2,
|
|
|
+ isMust: true
|
|
|
+ },
|
|
|
+ depositCharges: {
|
|
|
+ chargeType: 1,
|
|
|
+ isDepositCustom: false,
|
|
|
+ isMust: true
|
|
|
+ },
|
|
|
+ newScheme: {}
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.loadScheme()
|
|
|
+ // console.log(111);
|
|
|
+ // this.getMember()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getChargeTypeText(text) {
|
|
|
+ if (text === 1) {
|
|
|
+ return '一次性'
|
|
|
+ } else if (text === 2) {
|
|
|
+ return '周期性'
|
|
|
+ } else if (text === 3) {
|
|
|
+ return '水费'
|
|
|
+ } else if (text === 4) {
|
|
|
+ return '电费'
|
|
|
+ } else if (text === 5) {
|
|
|
+ return '燃气费'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getMarketPriceText(record) {
|
|
|
+ let standard = ''
|
|
|
+ standard = record.money + '元'
|
|
|
+ if (record.cycleUnit === 1) {
|
|
|
+ standard += '/月'
|
|
|
+ } else if (record.cycleUnit === 1) {
|
|
|
+ standard += '/季'
|
|
|
+ } else if (record.cycleUnit === 1) {
|
|
|
+ standard += '/年'
|
|
|
+ } else if (record.chargeType === 3) {
|
|
|
+ standard += '/吨'
|
|
|
+ } else if (record.chargeType === 4) {
|
|
|
+ standard += '/度'
|
|
|
+ } else if (record.chargeType === 5) {
|
|
|
+
|
|
|
+ }
|
|
|
+ return standard
|
|
|
+ },
|
|
|
+ longRentChange(record) {
|
|
|
+ console.log(record, 'record')
|
|
|
+ this.chooseLongRentScheme = this.longRentSchemeList.find(e => e.id === record)
|
|
|
+ if (this.chooseLongRentScheme == null) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ // 押金
|
|
|
+ this.depositCharges = this.chooseLongRentScheme.houseLongRentChargeList.find(e => e.chargeType === 1 && e.isMust)
|
|
|
+ // 租金
|
|
|
+ this.rentCharges = this.chooseLongRentScheme.houseLongRentChargeList.find(e => e.chargeType === 2 && e.isMust)
|
|
|
+ console.log(this.depositCharges)
|
|
|
+ console.log(this.rentCharges, 'rentCharges')
|
|
|
+ },
|
|
|
+ loadScheme() {
|
|
|
+ getAction('rooms/cesHouseLongRentScheme/page', { pageSize: this.ipagination.pageSize, pageNo: this.ipagination.current}
|
|
|
+ ).then((res) => {
|
|
|
+ if (res.success && res.result.records.length > 0) {
|
|
|
+ this.longRentSchemeList = res.result.records
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ addScheme() {
|
|
|
+ this.$refs.longRentSchemeModel.visible = true
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs.longRentSchemeModel.add()
|
|
|
+ this.$refs.longRentSchemeModel.title = '新增方案'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ editScheme(value) {
|
|
|
+ this.$refs.longRentSchemeModel.visible = true
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs.longRentSchemeModel.edit(value)
|
|
|
+ this.$refs.longRentSchemeModel.title = '修改方案'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ longRentSchemeModelOk() {
|
|
|
+ this.loadScheme()
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style scoped>
|
|
|
+@import "~@assets/less/common.less";
|
|
|
+
|
|
|
+.dynamic-delete-button {
|
|
|
+ cursor: pointer;
|
|
|
+ position: relative;
|
|
|
+ /* top: 4px; */
|
|
|
+ margin-left: 5px;
|
|
|
+ font-size: 18px;
|
|
|
+ color: #1890ff;
|
|
|
+ transition: all 0.3s;
|
|
|
+}
|
|
|
+
|
|
|
+.table_list_item{
|
|
|
+ height: 65px;
|
|
|
+ line-height: 65px;
|
|
|
+ padding: 0 16px;
|
|
|
+ border-bottom: 1px solid #e8e8e8;
|
|
|
+}
|
|
|
+</style>
|
许智捷