基本完成Lab5代码（目测存在bug）

components.d.ts

@@ -10,6 +10,7 @@ declare module 'vue' {
     CommentItem: typeof import('./src/components/CommentItem.vue')['default']
     ElAlert: typeof import('element-plus/es')['ElAlert']
     ElAside: typeof import('element-plus/es')['ElAside']
+    ElAvatar: typeof import('element-plus/es')['ElAvatar']
     ElButton: typeof import('element-plus/es')['ElButton']
     ElCard: typeof import('element-plus/es')['ElCard']
     ElCarousel: typeof import('element-plus/es')['ElCarousel']
@@ -19,6 +20,7 @@ declare module 'vue' {
     ElDescriptions: typeof import('element-plus/es')['ElDescriptions']
     ElDescriptionsItem: typeof import('element-plus/es')['ElDescriptionsItem']
     ElDialog: typeof import('element-plus/es')['ElDialog']
+    ElDivider: typeof import('element-plus/es')['ElDivider']
     ElForm: typeof import('element-plus/es')['ElForm']
     ElFormItem: typeof import('element-plus/es')['ElFormItem']
     ElHeader: typeof import('element-plus/es')['ElHeader']

src/api/coupon.ts

@@ -25,7 +25,7 @@ export const getCouponGroups = () => {
 }
 
 // 创建优惠券
-export const createCoupons = (couponInfo: CouponInfo) => {
+export const createCoupon = (couponInfo: CouponInfo) => {
     return axios.post(`${COUPON_MODULE}/`, couponInfo,
         {headers: {'Content-Type': 'application/json'}})
         .then(res => {

src/components/Header.vue

@@ -56,6 +56,7 @@ function logout() {
         </router-link>
       </el-col>
 
+      <!--Lab4新增，点击至全部优惠券界面-->
       <el-col :span="1" class="header-icon">
         <router-link to="/allCoupon" v-slot="{navigate}">
           <el-icon @click="navigate" :size="35" color="white" ><Discount /></el-icon>

src/components/OrderItem.vue

@@ -26,9 +26,9 @@ const status = ref('')        //订单状态
 const createTime = ref('')
 const finishTime = ref('')
 const storeId = ref(0)
+const paid = ref(null)           //Lab4新增，实付金额
 //订单总价（折扣前）
 const totalPrice = ref(0)
-
 //评论dialog
 const commentDialogVisible = ref(false)
 
@@ -50,6 +50,7 @@ function getOrderDetail() {
     createTime.value = res.data.result.createTime
     finishTime.value = res.data.result.finishTime
     storeId.value = res.data.result.storeId
+    paid.value = res.data.result.paid
     //根据单价和购买数量计算总价
     totalPrice.value = price.value * amount.value
   })
@@ -198,9 +199,12 @@ const statusText = computed(() => {
       <el-descriptions-item style="font-size: 15px" label="数量">
         {{ amount }} 件
       </el-descriptions-item>
-      <el-descriptions-item style="font-size: 15px" label="总价">
+      <el-descriptions-item style="font-size: 15px" label="原价">
         {{ totalPrice }} 元
       </el-descriptions-item>
+      <el-descriptions-item style="font-size: 15px" label="实付金额" v-if="status!=='UNPAID'">
+        {{ paid }} 元
+      </el-descriptions-item>
       <el-descriptions-item style="font-size: 15px" label="取货类型">
         <el-tag> {{ parseOrderType(type) }}</el-tag>
       </el-descriptions-item>

src/components/PayDialog.vue

@@ -78,12 +78,11 @@ const availableCouponList = ref<Coupon[]>([])
 const currentRow = ref()
 const singleTableRef = ref<InstanceType<typeof ElTable>>()
 
-
 getAvailableCouponsByStoreId(storeId.value).then(res => {
+  console.log(res.data.result)
   availableCouponList.value = res.data.result
 })
 
-
 const setCurrent = (row?: User) => {
   singleTableRef.value!.setCurrentRow(row)
 }

src/utils/index.ts

@@ -57,10 +57,11 @@ export function parseRating(rating: number|null) {
     }
 }
 
+//Lab4新增
 //将优惠券类型转化为中文显示
 export function parseCouponType(type: string) {
     if (type === "FULL_REDUCTION") {
-        return "满减"
+        return "满减券"
     } else if (type === "SPECIAL") {
         return "蓝鲸券"
     }

src/views/coupon/AllCoupon.vue

@@ -1,8 +1,9 @@
+<!--Lab4新增，全部优惠券界面-->
 <script setup lang="ts">
-import {computed, ref} from "vue";
-import {createCoupons, getCouponGroups, getCoupons, receiveCouponGroup} from "../../api/coupon";
-import {userInfo} from "../../api/user";
-import {parseCouponType, parseOrderType} from "../../utils";
+import {computed, ref} from "vue"
+import {createCoupons, getCouponGroups, getCoupons, receiveCouponGroup} from "../../api/coupon"
+import {userInfo} from "../../api/user"
+import {parseCouponType} from "../../utils"
 
 const role = sessionStorage.getItem("role")
 const myCouponList = ref()
@@ -13,18 +14,13 @@ const minus = ref(undefined)
 const rest = ref(undefined)
 const storeName = ref()
 
+//从用户信息中获取到当前用户的店铺名（可能为空）
 userInfo().then(res => {
   storeName.value = res.data.result.storeName
 })
 
-getMyCouponList()
 getReceiveCouponList()
-
-function getMyCouponList() {
-  getCoupons().then(res => {
-    myCouponList.value = res.data.result
-  })
-}
+getMyCouponList()
 
 function getReceiveCouponList() {
   getCouponGroups().then(res => {
@@ -32,11 +28,17 @@ function getReceiveCouponList() {
   })
 }
 
+function getMyCouponList() {
+  getCoupons().then(res => {
+    myCouponList.value = res.data.result
+  })
+}
+
 const hasTypeInput = computed(() => type.value != null)
 const hasSatisfactionInput = computed(() => satisfaction.value != '')
 const hasMinusInput = computed(() => minus.value != '')
 const hasRestInput = computed(() => rest.value != '')
-
+//确定创建优惠券按钮是否可用
 const createCouponDisabled = computed(() => {
   if (type.value === 'FULL_REDUCTION') {
     return !(hasTypeInput.value && hasSatisfactionInput.value && hasMinusInput.value && hasRestInput.value);
@@ -49,10 +51,12 @@ const createCouponDisabled = computed(() => {
 
 const couponDialogVisible = ref(false)
 
+//打开创建优惠券弹窗
 function toCreateCoupon() {
   couponDialogVisible.value = true
 }
 
+//关闭创建优惠券弹窗，需要将这些参数都置为默认值
 function handleCloseCouponDialog() {
   type.value = null
   satisfaction.value = undefined
@@ -61,6 +65,7 @@ function handleCloseCouponDialog() {
   couponDialogVisible.value = false
 }
 
+//确定创建优惠券
 function handleCreateCoupon() {
   const payload = {
     type: type.value,
@@ -76,6 +81,7 @@ function handleCreateCoupon() {
         type: 'success',
         center: true,
       })
+      //更新可获取优惠券列表
       getReceiveCouponList()
       type.value = ''
       satisfaction.value = undefined
@@ -91,6 +97,7 @@ function handleCreateCoupon() {
   })
 }
 
+//顾客获取优惠券
 function receiveCoupon(couponGroupId: number) {
   receiveCouponGroup(couponGroupId).then(res => {
     if (res.data.code === '000') {
@@ -99,7 +106,9 @@ function receiveCoupon(couponGroupId: number) {
         type: 'success',
         center: true,
       })
+      //更新我的优惠券列表
       getMyCouponList()
+      //更新可获取优惠券列表
       getReceiveCouponList()
     } else if (res.data.code === '400') {
       ElMessage({
@@ -177,7 +186,7 @@ function receiveCoupon(couponGroupId: number) {
 
     <div class="all-coupon-main">
       <div>
-        <span class="this-title" v-if="role === 'CUSTOMER'">可获取优惠券</span>
+        <span class="this-title" v-if="role === 'CUSTOMER'">可领优惠券（按发放时间排序）</span>
         <span class="this-title" v-if="role === 'MANAGER'">全部优惠券</span>
         <span class="this-title" v-if="role === 'STAFF'">门店下优惠券</span>
         <el-table :data="receiveCouponList" stripe class="coupon-table">
@@ -216,7 +225,7 @@ function receiveCoupon(couponGroupId: number) {
       </div>
 
       <div v-if="role === 'CUSTOMER'">
-        <span class="this-title">我的优惠券</span>
+        <span class="this-title">我的优惠券（按领取时间排序）</span>
         <el-table :data="myCouponList" stripe class="coupon-table">
           <el-table-column type="index" width="50"/>
           <el-table-column prop="storeName" label="所属商店" width="180"/>