Просмотр исходного кода

酒店工作人员查看所有优惠策略、下单时增加优惠策略选择

陈远志 6 лет назад
Родитель
Сommit
7b7b8523ef

+ 27 - 0
front_end/src/api/coupon.js

@@ -0,0 +1,27 @@
+import { axios } from '@/utils/request'
+const api = {
+    couponPre: '/api/coupon'
+}
+export function hotelTargetMoneyAPI(data) {
+    return axios({
+        url: `${api.couponPre}/hotelTargetMoney`,
+        method: 'POST',
+        data,
+    })
+}
+
+export function hotelAllCouponsAPI(hotelId) {
+    return axios({
+        url: `${api.couponPre}/hotelAllCoupons`,
+        method: 'GET',
+        params: {hotelId: hotelId},
+    })
+}
+
+export function orderMatchCouponsAPI(params) {
+    return axios({
+        url: `${api.couponPre}/orderMatchCoupons`,
+        method: 'GET',
+        params,
+    })
+}

+ 0 - 1
front_end/src/permission.js

@@ -9,7 +9,6 @@ router.beforeEach(async(to, from, next) => {
     NProgress.start()
     // determine whether the user has logged in
     const hasToken = getToken()
-    console.log(hasToken)
     if (hasToken) {
         store.commit('set_userId', hasToken)
       if (to.path === '/login') {

+ 3 - 1
front_end/src/store/getters.js

@@ -10,6 +10,7 @@ const getters = {
   currentHotelId: state => state.hotel.currentHotelId,
   orderModalVisible: state => state.hotel.orderModalVisible,
   currentOrderRoom: state => state.hotel.currentOrderRoom,
+  orderMatchCouponList: state => state.hotel.orderMatchCouponList,
   //admin
   managerList: state => state.admin.managerList,
   addManagerModalVisible: state => state.admin.addManagerModalVisible,
@@ -18,8 +19,9 @@ const getters = {
   orderList: state => state.hotelManager.orderList,
   addHotelModalVisible: state => state.hotelManager.addHotelModalVisible,
   addRoomModalVisible: state => state.hotelManager.addRoomModalVisible,
+  couponVisible: state => state.hotelManager.couponVisible,
   activeHotelId: state => state.hotelManager.activeHotelId,
-
+  couponList: state => state.hotelManager.couponList,
   }
   
   export default getters

+ 16 - 2
front_end/src/store/modules/hotel.js

@@ -4,10 +4,12 @@ import {
     getHotelsAPI,
     getHotelByIdAPI
 } from '@/api/hotel'
-
 import {
     reserveHotelAPI
 } from '@/api/order'
+import {
+    orderMatchCouponsAPI,
+} from '@/api/coupon'
 
 const hotel = {
     state: {
@@ -26,7 +28,10 @@ const hotel = {
         orderModalVisible: false,
         currentOrderRoom: {
 
-        }
+        },
+        orderMatchCouponList: [
+
+        ]
     },
     mutations: {
         set_hotelList: function(state, data) {
@@ -58,6 +63,9 @@ const hotel = {
                 ...state.currentOrderRoom,
                 ...data,
             }
+        },
+        set_orderMatchCouponList: function(state, data) {
+            state.orderMatchCouponList = data
         }
     },
 
@@ -85,6 +93,12 @@ const hotel = {
                 commit('set_orderModalVisible', false)
             }
         },
+        getOrderMatchCoupons: async({ state, commit }, data) => {
+            const res = await orderMatchCouponsAPI(data)
+            if(res){
+                commit('set_orderMatchCouponList', res)
+            }
+        }
     }
 }
 

+ 19 - 3
front_end/src/store/modules/hotelManager.js

@@ -2,11 +2,14 @@ import {
     addRoomAPI,
     addHotelAPI,
 } from '@/api/hotelManager'
-
 import {
     getAllOrdersAPI,
 } from '@/api/order'
+import {
+    hotelAllCouponsAPI,
+} from '@/api/coupon'
 import { message } from 'ant-design-vue'
+
 const hotelManager = {
     state: {
         orderList: [],
@@ -29,7 +32,9 @@ const hotelManager = {
             curNum: 0,
         },
         addRoomModalVisible: false,
+        couponVisible: false,
         activeHotelId: 0,
+        couponList: [],
     },
     mutations: {
         set_orderList: function(state, data) {
@@ -53,16 +58,21 @@ const hotelManager = {
                 ...data,
             }
         },
+        set_couponVisible: function(state, data) {
+            state.couponVisible = data
+        },
         set_activeHotelId: function(state, data) {
             state.activeHotelId = data
-        }
+        },
+        set_couponList: function(state, data) {
+            state.couponList = data
+        },
     },
     actions: {
         getAllOrders: async({ state, commit }) => {
             const res = await getAllOrdersAPI()
             if(res){
                 commit('set_orderList', res)
-                console.log()
             }
         },
         addHotel: async({ state, dispatch, commit }) => {
@@ -100,6 +110,12 @@ const hotelManager = {
             }else{
                 message.error('添加失败')
             }
+        },
+        getHotelCoupon: async({ state, commit }) => {
+            const res = await hotelAllCouponsAPI(state.activeHotelId)
+            if(res) {
+                commit('set_couponList', res)
+            }
         }
     }
 }

+ 2 - 2
front_end/src/utils/request.js

@@ -8,10 +8,10 @@ import router from '../router'
 
 // 创建 axios 实例
 const service = axios.create({
-  baseURL: 'http://localhost:8080',
+  baseURL: process.env.NODE_ENV === 'production' ? '': 'http://localhost:8080',
   withCredentials: true
 })
-
+console.log(process.env.NODE_ENV)
  const err = (error) => { 
   if (error.response) {
     const data = error.response.data

+ 104 - 33
front_end/src/views/hotel/components/orderModal.vue

@@ -11,9 +11,23 @@
             <a-form-item v-bind="formItemLayout" label="房型信息">
                 <span>{{ currentOrderRoom.roomType }}</span>
             </a-form-item>
-            <a-form-item v-bind="formItemLayout" label="房间单价">
-                <span>{{ currentOrderRoom.price }}</span>
+            <a-form-item v-bind="formItemLayout" label="入住人姓名">
+                <a-input
+                    v-decorator="[
+                        'clientName',
+                        { rules: [{required: true, message: '请填写入住人姓名', }] }
+                    ]"
+                />
             </a-form-item>
+            <a-form-item v-bind="formItemLayout" label="手机号">
+                <a-input
+                    v-decorator="[
+                        'phoneNumber',
+                        { rules: [{required: true, message: '请填写入住人联系手机', }] }
+                    ]"
+                />
+            </a-form-item>
+            
             <a-form-item v-bind="formItemLayout" label="入住日期">
                 <a-range-picker
                     format="YYYY-MM-DD"
@@ -50,6 +64,17 @@
                     </a-select-option>
                 </a-select>
             </a-form-item>
+            <a-form-item v-bind="formItemLayout" label="有无儿童">
+                <a-radio-group
+                    v-decorator="[
+                        'haveChild',
+                        { rules: [{required: true, message: '请选择有无儿童入住', }] }
+                    ]"
+                >
+                    <a-radio :value="1">有</a-radio>
+                    <a-radio :value="0">无</a-radio>
+                </a-radio-group>
+            </a-form-item>
             <a-form-item v-bind="formItemLayout" label="房间数">
                 <a-select
                     v-decorator="[
@@ -70,38 +95,32 @@
                     </a-select-option>
                 </a-select>
             </a-form-item>
-            <a-form-item v-bind="formItemLayout" label="房费情况">
+            <a-form-item v-bind="formItemLayout" label="房间单价">
+                <span>{{ currentOrderRoom.price }}</span>
+            </a-form-item>
+            <a-form-item v-bind="formItemLayout" label="总价">
                 <span>¥{{ totalPrice }}</span>
             </a-form-item>
-            
             <a-divider></a-divider>
-
-            <a-form-item v-bind="formItemLayout" label="入住人姓名">
-                <a-input
-                    v-decorator="[
-                        'clientName',
-                        { rules: [{required: true, message: '请填写入住人姓名', }] }
-                    ]"
-                />
-            </a-form-item>
-            <a-form-item v-bind="formItemLayout" label="手机号">
-                <a-input
-                    v-decorator="[
-                        'phoneNumber',
-                        { rules: [{required: true, message: '请填写入住人联系手机', }] }
-                    ]"
-                />
-            </a-form-item>
-            <a-form-item v-bind="formItemLayout" label="有无儿童">
-                <a-radio-group
-                    v-decorator="[
-                        'haveChild',
-                        { rules: [{required: true, message: '请选择有无儿童入住', }] }
-                    ]"
+            <h2 v-if="orderMatchCouponList.length>0">优惠</h2>
+            <a-checkbox-group v-model="checkedList" @change="onchange">
+                <a-table
+                    :columns="columns"
+                    :dataSource="orderMatchCouponList"
+                    :showHeader="false"
+                    bordered
+                    v-if="orderMatchCouponList.length>0"
                 >
-                    <a-radio :value="1">有</a-radio>
-                    <a-radio :value="0">无</a-radio>
-                </a-radio-group>
+                    <a-checkbox
+                        slot="id"
+                        slot-scope="record"
+                        :value="record"
+                    >
+                    </a-checkbox>
+                </a-table>
+            </a-checkbox-group>
+             <a-form-item v-bind="formItemLayout" label="结算后总价">
+                <span>¥{{ finalPrice }}</span>
             </a-form-item>
         </a-form>
     </a-modal>
@@ -109,6 +128,32 @@
 <script>
 import { mapGetters, mapMutations, mapActions } from 'vuex'
 const moment = require('moment')
+const columns = [
+    {  
+        title: '勾选',
+        dataIndex: 'id',
+        scopedSlots: {customRender: 'id'}
+    },
+    {
+        title: '优惠类型',
+        dataIndex: 'couponName',
+        scopedSlots: {customRender: 'couponName'}
+    },
+    {
+        title: '折扣',
+        dataIndex: 'discount',
+    },
+
+    {
+        title: '优惠简介',
+        dataIndex: 'description',
+        
+    },
+    {
+        title: '优惠金额',
+        dataIndex: 'discountMoney',
+    },
+  ];
 export default {
     name: 'orderModal',
     data() {
@@ -124,6 +169,9 @@ export default {
                 },
             },
             totalPrice: '',
+            columns,
+            checkedList: [],
+            finalPrice: ''
         }
     },
     computed: {
@@ -133,6 +181,7 @@ export default {
             'currentHotelId',
             'currentHotelInfo',
             'userId',
+            'orderMatchCouponList'
         ]),
         
     },
@@ -144,7 +193,8 @@ export default {
             'set_orderModalVisible'
         ]),
         ...mapActions([
-            'addOrder'
+            'addOrder',
+            'getOrderMatchCoupons'
         ]),
         cancelOrder() {
             this.set_orderModalVisible(false)
@@ -163,6 +213,14 @@ export default {
         changeRoomNum(v) {
             this.totalPrice = Number(v) * Number(this.currentOrderRoom.price) * moment(this.form.getFieldValue('date')[1]).diff(moment(this.form.getFieldValue('date')[0]),'day')
         },
+        onchange() {
+            this.finalPrice = this.totalPrice
+            if(this.checkedList.length>0){
+                this.orderMatchCouponList.filter(item => this.checkedList.indexOf(item.id)!=-1).forEach(item => this.finalPrice= this.finalPrice-item.discountMoney)
+            }else{
+                
+            }
+        },
         handleSubmit(e) {
             e.preventDefault();
             this.form.validateFieldsAndScroll((err, values) => {
@@ -177,13 +235,26 @@ export default {
                         roomNum: this.form.getFieldValue('roomNum'),
                         peopleNum: this.form.getFieldValue('peopleNum'),
                         haveChild: this.form.getFieldValue('haveChild'),
-                        createForm: '',
-                        price: this.currentOrderRoom.price
+                        createDate: '',
+                        price: this.checkedList.length > 0 ? this.finalPrice: this.totalPrice
                     }
                     this.addOrder(data)
                 }
             });
         },
+    },
+    watch:{
+        totalPrice(val) {
+            let data = {
+                userId: this.userId,
+                hotelId: this.currentHotelId,
+                orderPrice: this.totalPrice,
+                roomNum: this.form.getFieldValue('roomNum'),
+                checkIn: moment(this.form.getFieldValue('date')[0]).format('YYYY-MM-DD'),
+                checkOut: moment(this.form.getFieldValue('date')[1]).format('YYYY-MM-DD'),
+            }
+            this.getOrderMatchCoupons(data)
+        }
     }
 }
 </script>

+ 91 - 0
front_end/src/views/hotelManager/components/coupon.vue

@@ -0,0 +1,91 @@
+<template>
+    <a-modal
+        :visible="couponVisible"
+        title="优惠策略"
+        width="900px"
+        cancelText="取消"
+        okText="确定"
+        @cancel="cancel"
+    >
+        <a-table
+            :columns="columns"
+            :dataSource="couponList"
+            bordered
+        >
+            <!-- <span slot="action" slot-scope="record">
+                <a-popconfirm
+                    title="确定想删除该酒店吗?"
+                    @confirm="deleteHotel(record)"
+                    okText="确定"
+                    cancelText="取消"
+                >
+                    <a-button type="danger" size="small">删除酒店</a-button>
+                </a-popconfirm>
+            </span> -->
+            <a-tag color="red" slot="couponName" slot-scope="text">
+                {{text}}
+            </a-tag>
+        </a-table>
+    </a-modal>
+</template>
+<script>
+import { mapGetters, mapMutations, mapActions } from 'vuex'
+const columns = [
+    {  
+        title: '酒店名',
+        dataIndex: 'name',
+    },
+    {
+        title: '优惠类型',
+        dataIndex: 'couponName',
+        scopedSlots: {customRender: 'couponName'}
+    },
+    {
+        title: '折扣',
+        dataIndex: 'discount',
+    },
+
+    {
+        title: '优惠简介',
+        dataIndex: 'description',
+        
+    },
+    {
+        title: '优惠金额',
+        dataIndex: 'discountMoney',
+    },
+    // {
+    //   title: '操作',
+    //   key: 'action',
+    //   scopedSlots: { customRender: 'action' },
+    // },
+  ];
+export default {
+    name: 'coupon',
+    data() {
+        return {
+            columns
+        }
+    },
+    computed: {
+        ...mapGetters([
+            'couponVisible',
+            'couponList',
+        ])
+    },
+    methods: {
+        ...mapMutations([
+            'set_couponVisible'
+        ]),
+        ...mapActions([
+            'getHotelCoupon'
+        ]),
+        cancel() {
+            this.set_couponVisible(false)
+        },
+    },
+}
+</script>
+<style scoped>
+
+</style>

+ 16 - 9
front_end/src/views/hotelManager/manageHotel.vue

@@ -4,6 +4,7 @@
             <a-tab-pane tab="酒店管理" key="1">
                 <div style="width: 100%; text-align: right; margin:20px 0">
                     <a-button type="primary" @click="addHotel"><a-icon type="plus" />添加酒店</a-button>
+                    <a-button type="info"><a-icon type="plus" />添加优惠策略</a-button>
                 </div>
                  <a-table
                     :columns="columns1"
@@ -13,6 +14,8 @@
                     <span slot="action" slot-scope="record">
                         <a-button type="primary" size="small" @click="addRoom(record)">录入房间</a-button>
                         <a-divider type="vertical"></a-divider>
+                        <a-button type="info" size="small" @click="showCoupon(record)">优惠策略</a-button>
+                        <a-divider type="vertical"></a-divider>
                         <a-popconfirm
                             title="确定想删除该酒店吗?"
                             @confirm="deleteHotel(record)"
@@ -30,14 +33,6 @@
                     :dataSource="orderList"
                     bordered
                 >
-                        <!-- <span slot="status" slot-scope="status">
-                            <a-tag
-                                :color="status==='入住中' ? 'green' :  'red' "
-                                :key="status"
-                            >
-                                {{ status }}
-                            </a-tag>
-                        </span> -->
                     <span slot="price" slot-scope="text">
                         <span>¥{{ text }}</span>
                     </span>
@@ -60,15 +55,18 @@
                     </span>
                 </a-table>
             </a-tab-pane>
+            
         </a-tabs>
         <AddHotelModal></AddHotelModal>
         <AddRoomModal></AddRoomModal>
+        <Coupon></Coupon>
     </div>
 </template>
 <script>
 import { mapGetters, mapMutations, mapActions } from 'vuex'
 import AddHotelModal from './components/addHotelModal'
 import AddRoomModal from './components/addRoomModal'
+import Coupon from './components/coupon'
 const moment = require('moment')
 const columns1 = [
     {  
@@ -153,6 +151,7 @@ export default {
     components: {
         AddHotelModal,
         AddRoomModal,
+        Coupon,
     },
     computed: {
         ...mapGetters([
@@ -161,6 +160,7 @@ export default {
             'addHotelModalVisible',
             'addRoomModalVisible',
             'activeHotelId',
+            'couponVisible'
         ]),
     },
     async mounted() {
@@ -171,11 +171,13 @@ export default {
         ...mapMutations([
             'set_addHotelModalVisible',
             'set_addRoomModalVisible',
+            'set_couponVisible',
             'set_activeHotelId',
         ]),
         ...mapActions([
             'getHotelList',
-            'getAllOrders'
+            'getAllOrders',
+            'getHotelCoupon'
         ]),
         addHotel() {
             this.set_addHotelModalVisible(true)
@@ -184,6 +186,11 @@ export default {
             this.set_activeHotelId(record.id)
             this.set_addRoomModalVisible(true)
         },
+        showCoupon(record) {
+            this.set_activeHotelId(record.id)
+            this.set_couponVisible(true)
+            this.getHotelCoupon()
+        },
         deleteHotel(){
 
         },