修改样式

src/student/live-class/live-detail.tsx

@@ -16,6 +16,8 @@ import LiveItem from '@/views/live-class/live-item'
 import iconShare from '@/views/shop-mall/images/icon-share.svg'
 import { state } from '@/state'
 import { browser } from '@/helpers/utils'
+import { goodsType } from '@/constant';
+import { discountTimer, tradeOrder } from '../trade/tradeOrder'
 interface IProps {
   courseTime: string
   coursePlan: string
@@ -178,26 +180,6 @@ export default defineComponent({
     async onBuy() {
       try {
         const live = this.live
-        orderStatus.orderObject.orderType = 'LIVE'
-        orderStatus.orderObject.orderName = '直播课购买'
-        orderStatus.orderObject.orderDesc = '直播课购买'
-        orderStatus.orderObject.actualPrice = live.coursePrice
-        orderStatus.orderObject.recomUserId = this.recomUserId
-        orderStatus.orderObject.orderNo = ''
-        orderStatus.orderObject.orderList = [
-          {
-            orderType: 'LIVE',
-            goodsName: '直播课购买',
-            courseGroupId: live.courseGroupId,
-            courseGroupName: live.courseGroupName,
-            coursePrice: live.coursePrice,
-            teacherName: live.userName || `游客${live.teacherId || ''}`,
-            teacherId: live.teacherId,
-            avatar: live.avatar,
-            courseInfo: this.courseInfo,
-            recomUserId: this.recomUserId
-          }
-        ]
         // 判断是否是0无订单
         if (live.coursePrice <= 0) {
           await onSubmitZero(() => {
@@ -231,15 +213,40 @@ export default defineComponent({
             confirmButtonText: '继续支付'
           })
             .then(async () => {
-              orderStatus.orderObject.orderNo = result.orderNo
-              orderStatus.orderObject.actualPrice = result.actualPrice
-              orderStatus.orderObject.discountPrice = result.discountPrice
-              orderStatus.orderObject.paymentConfig = {
-                ...result.paymentConfig,
-                paymentVendor: result.paymentVendor,
-                paymentVersion: result.paymentVersion
-              }
-              this.routerTo()
+              // orderStatus.orderObject.orderNo = result.orderNo
+              // orderStatus.orderObject.actualPrice = result.actualPrice
+              // orderStatus.orderObject.discountPrice = result.discountPrice
+              // orderStatus.orderObject.paymentConfig = {
+              //   ...result.paymentConfig,
+              //   paymentVendor: result.paymentVendor,
+              //   paymentVersion: result.paymentVersion
+              // }
+
+              // const orderDetailList = result.orderDetailList || []
+              
+              // let tempObj: any = {}
+              // let discountJson: any = {}
+              // orderDetailList.forEach((item: any) => {
+              //   if(item.goodType === "DISCOUNT") { 
+              //     const users = state.user.data || {}
+              //     tempObj ={
+              //       orderType: item.goodType,
+              //       goodsName: item.goodName,
+              //       id: item.bizId,
+              //       title: item.goodName,
+              //       num: item.goodNum,
+              //       salePrice: item.actualPrice,
+              //       price: item.actualPrice,
+              //       period: item.period,
+              //       ...discountTimer(users.discountEndTime, item.period)
+              //     }
+              //   } else if(item.goodType === 'LIVE') {
+              //     discountJson = item.discountJson ? JSON.parse(item.discountJson) : {}
+              //   }
+              // })
+              // tempObj.discountPrice = discountJson.DISCOUNT || 0
+              // orderStatus.orderObject.orderList.push(tempObj)
+              tradeOrder(result, this.routerTo)
             })
             .catch(() => {
               Dialog.close()
@@ -247,6 +254,26 @@ export default defineComponent({
               this.cancelPayment(result.orderNo)
             })
         } else {
+          orderStatus.orderObject.orderType = 'LIVE'
+          orderStatus.orderObject.orderName = '直播课购买'
+          orderStatus.orderObject.orderDesc = '直播课购买'
+          orderStatus.orderObject.actualPrice = live.coursePrice
+          orderStatus.orderObject.recomUserId = this.recomUserId
+          orderStatus.orderObject.orderNo = ''
+          orderStatus.orderObject.orderList = [
+            {
+              orderType: 'LIVE',
+              goodsName: '直播课购买',
+              courseGroupId: live.courseGroupId,
+              courseGroupName: live.courseGroupName,
+              coursePrice: live.coursePrice,
+              teacherName: live.userName || `游客${live.teacherId || ''}`,
+              teacherId: live.teacherId,
+              avatar: live.avatar,
+              courseInfo: this.courseInfo,
+              recomUserId: this.recomUserId
+            }
+          ]
           this.routerTo()
         }
       } catch {

src/student/teacher-dependent/teacher-follow.module.less

@@ -0,0 +1,398 @@
+.headerContent {
+  padding-top: 40px;
+  padding-bottom: 20px;
+  min-height: 100px;
+  position: relative;
+}
+
+.teacherContent {
+  display: flex;
+  justify-content: space-between;
+  flex-shrink: 0;
+}
+
+.teacherIcon {
+  position: relative;
+  margin-top: -38px;
+  line-height: 0;
+
+  .avatar {
+    position: relative;
+    width: 78px;
+    height: 78px;
+    box-sizing: border-box;
+    border: 2px solid #fff;
+    background-color: #fff;
+  }
+
+  .avatarActive {
+    border-color: #F0AF88;
+    background-color: #F0AF88;
+  }
+
+  .teacherIconVip {
+    position: absolute;
+    bottom: 0;
+    right: -12px;
+    width: 39px;
+    height: 18px;
+  }
+}
+
+.teacherInfo {
+  display: flex;
+  align-items: center;
+  padding: 14px 0;
+
+  .teacherInfoName {
+    font-size: 20px;
+    font-weight: 500;
+    color: #1a1a1a;
+    // line-height: 22px;
+    max-width: 150px;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
+
+  &>img {
+    margin-left: 10px;
+    width: 39px;
+    height: 16px;
+  }
+}
+
+.teacherHonor {
+  display: flex;
+  align-items: center;
+  font-size: 12px;
+  line-height: 16px;
+  color: #666;
+  font-weight: 500;
+  padding-bottom: 12px;
+  padding-top: 10px;
+
+  .score {
+    margin-left: 0;
+  }
+}
+
+.headerCount {
+  width: calc(100% - 28px);
+  padding: 12px;
+  margin: 0 auto;
+  background-color: #fff;
+  border-radius: 10px;
+  box-sizing: border-box;
+}
+
+.teacherOperation {
+  :global {
+    .van-button {
+      height: 28px;
+    }
+  }
+
+  .btn {
+    padding: 3px 12px 1px;
+    min-width: 62px;
+  }
+
+  .btnStar {
+    color: #f18400;
+    border-color: #f18400;
+  }
+}
+
+.subjectSection {
+  margin-right: 10px;
+  // height: 18px;
+  max-width: 68px;
+  box-sizing: content-box;
+}
+
+.teacher-bottom {
+  padding: 30px 0 0 0;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.followFans {
+  padding-top: 10px !important;
+}
+
+.teacher-data {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+
+  .teacher-data_item {
+    font-size: 14px;
+    color: #333333;
+    position: relative;
+
+    span {
+      font-weight: 500;
+      color: #000000;
+      font-size: 20px;
+      margin-left: 5px;
+    }
+
+    &::after {
+      content: ' ';
+      display: inline-block;
+      position: absolute;
+      right: 0px;
+      top: 2px;
+      width: 1px;
+      height: 16px;
+      background: #ebebeb;
+    }
+
+    &:first-child {
+      padding-right: 15px;
+      margin-right: 15px;
+    }
+
+    &:last-child {
+      &::after {
+        display: none;
+      }
+    }
+  }
+}
+
+.iconVip {
+  width: 34px !important;
+  margin-right: 5px;
+}
+
+.iconOther {
+  margin-left: 6px;
+  width: 18px;
+  height: 18px;
+}
+
+.teacher-info {
+  margin-left: 8px;
+
+  .teacher-name {
+    font-size: 18px;
+    font-weight: 500;
+    color: #1a1a1a;
+    padding-bottom: 6px;
+    display: flex;
+    justify-content: space-between;
+
+    .teacherCert {
+      display: flex;
+      align-items: center;
+    }
+
+    .teacherLast {
+      display: inline-block;
+      max-width: 120px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+  }
+}
+
+.subjectList::-webkit-scrollbar {
+  display: none;
+  /* Chrome Safari */
+}
+
+.subjectList {
+  overflow: auto;
+  width: 255px;
+  // height: 18px;
+  display: flex;
+  flex-wrap: nowrap;
+}
+
+.piNameSubject {
+  display: flex;
+  align-items: center;
+
+  .subject {
+    display: flex;
+    align-items: center;
+    margin-left: 4px;
+    background: #effbf9;
+    border-radius: 8px;
+    font-size: 12px;
+    line-height: 16px;
+    color: #2dc7aa;
+    padding: 0 5px;
+    white-space: nowrap;
+
+    &:first-child {
+      margin-left: 0;
+    }
+  }
+}
+
+.rTitle {
+  display: flex;
+  align-items: center;
+
+  &::before {
+    margin-right: 8px;
+    content: ' ';
+    display: inline-block;
+    width: 4px;
+    height: 14px;
+    background: #2dc7aa;
+    border-radius: 3px;
+  }
+}
+
+.liveTag {
+  position: absolute;
+  bottom: 0;
+  left: 50%;
+  transform: translateX(-50%);
+  line-height: 16px;
+  background: #ff6363;
+  border-radius: 20px;
+  text-align: center;
+  color: #fff;
+  font-size: 10px;
+  font-weight: 500;
+  padding: 2px 0;
+  width: 60%;
+  z-index: 10;
+}
+
+.teacherName {
+  display: inline-block;
+  flex: 1;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100px;
+}
+
+.teacherIcons {
+  display: flex;
+  align-items: center;
+}
+
+.teaherPopup {
+  background: transparent;
+  width: 276px;
+  overflow: initial;
+}
+
+.teacherIconWrap {
+  padding: 50px 22px 22px 22px;
+  background-color: #fff;
+  border-radius: 0 0 10px 10px;
+  margin-top: -25px;
+}
+
+.teacherIconItem {
+  margin-bottom: 16px;
+
+  .teacherIconItemTop {
+    display: flex;
+    align-items: center;
+    margin-bottom: 10px;
+  }
+
+  :global {
+    .van-image {
+      margin-right: 8px;
+      width: 24px;
+      height: 24px;
+    }
+  }
+
+  .teacherIconTitle {
+    font-size: 16px;
+    font-weight: bold;
+    color: #333;
+  }
+
+  .teacherIconDes {
+    font-size: 12px;
+    line-height: 16px;
+    font-weight: 400;
+    padding-left: 3px;
+    color: #666;
+  }
+}
+
+.closeIcon {
+  position: absolute;
+  bottom: -54px;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 0.96rem;
+  height: 0.96rem;
+}
+
+.liveList {
+  padding: 12px 0;
+
+  .headerFollow {
+    margin-bottom: 12px;
+
+    .teacherIcon {
+      margin: 0 10px 0 0;
+    }
+
+    .score {
+      margin-left: 10px;
+    }
+
+    .teacherIconVip {
+      left: 50%;
+      right: initial;
+      transform: translateX(-50%);
+      bottom: -6px;
+    }
+
+    .liveTag {
+      // bottom: -30px;
+      width: 80%;
+    }
+
+    .avatar {
+      width: 60px;
+      height: 60px;
+    }
+
+    .piNameSubject {
+      align-items: flex-start;
+    }
+
+    .subjectList {
+      flex-wrap: wrap;
+    }
+
+    .subject {
+      margin: 2px 5px 3px 0;
+    }
+
+    .teacher-bottom {
+      padding-top: 24px;
+    }
+
+    .unlinkeBtn {
+      font-size: 12px;
+      color: #ff6363;
+      border: 1px solid #ff6363;
+      padding: 5px 10px;
+      border-radius: 20px;
+    }
+  }
+}
+
+.followContainer {
+  display: flex;
+  align-items: flex-start;
+}

src/student/teacher-dependent/teacher-follow.tsx

@@ -1,9 +1,7 @@
 import { Cell, Dialog, Icon, Image, List, Rate, Sticky, Toast } from 'vant'
 import { defineComponent } from 'vue'
-import styles from './model/teacher-header.module.less'
+import styles from './teacher-follow.module.less'
 import iconTeacher from '@common/images/icon_teacher.png'
-import musicCert from '@common/images/music_cert.png'
-import teacherCert from '@common/images/teacher_cert.png'
 import request from '@/helpers/request'
 import ColResult from '@/components/col-result'
 import { postMessage } from '@/helpers/native-message'
@@ -261,7 +259,7 @@ export default defineComponent({
                   </div>
                 </div>
                 <div class={styles.teacherHonor}>
-                  <div>勋章:</div>
+                  {/* <div>勋章:</div>
                   <div class={styles.teacherIcons}>
                     <Image
                       class={styles.iconOther}
@@ -295,7 +293,7 @@ export default defineComponent({
                           : getAssetsHomeFile('music_default.png')
                       }
                     />
-                  </div>
+                  </div> */}
                   <div class={styles.score}>评分: </div>
                   <div class={styles.level}>
                     {item.starGrade ? (

src/student/trade/tradeOrder.ts

@@ -11,6 +11,26 @@ const apiSuffix =
 // VIDEO: '视频课',
 // VIP: '开通会员',
 // MUSIC: '单曲点播'
+
+/** 计算畅学卡时间 */
+export const discountTimer = (discountEndTime: any, period: string) => {
+  const startTime = discountEndTime || new Date()
+  let endTime = dayjs(new Date()).format('YYYY-MM-DD')
+  if (period === 'MONTH') {
+    endTime = dayjs(startTime).add(1, 'month').format('YYYY-MM-DD')
+  } else if (period === 'QUARTERLY') {
+    endTime = dayjs(startTime).add(3, 'month').format('YYYY-MM-DD')
+  } else if (period === 'YEAR_HALF') {
+    endTime = dayjs(startTime).add(6, 'month').format('YYYY-MM-DD')
+  } else if (period === 'YEAR') {
+    endTime = dayjs(startTime).add(1, 'year').format('YYYY-MM-DD')
+  }
+  return {
+    startTime: dayjs(startTime).format('YYYY-MM-DD'),
+    endTime
+  }
+}
+
 interface IAmount {
   couponAmount: number
   discountPrice: number
@@ -19,7 +39,6 @@ interface IAmount {
 export const formatOrderDetail = async (item: any, amount?: IAmount) => {
   const type = item.goodType
   let tempList: any = {}
-
   switch (type) {
     case 'LIVE':
       {
@@ -54,7 +73,7 @@ export const formatOrderDetail = async (item: any, amount?: IAmount) => {
         }
       }
       break
-    case 'PRACTICE': {
+    case 'PRACTICE': case 'VIP_COURSE': {
       const bizContent: any = JSON.parse(item.bizContent)
       tempList = {
         ...bizContent,
@@ -182,22 +201,17 @@ export const formatOrderDetail = async (item: any, amount?: IAmount) => {
       break
     case 'DISCOUNT':
       {
-        try {
-          const res = await getDiscountDetail(item.id)
-          console.log(res, 'res', item, 'item')
-          tempList = {
-            orderType: item.goodType,
-            goodName: item.goodName,
-            num: item.goodNum,
-            id: item.id,
-            title: item.goodName || '',
-            // 判断是否有优惠金额
-            price: item.expectPrice,
-            startTime: dayjs(res?.discountStartTime || new Date()).format('YYYY-MM-DD'),
-            endTime: dayjs(res?.discountEndTime || new Date()).format('YYYY-MM-DD')
-          }
-        } catch (e: any) {
-          throw new Error(e.message)
+        const users = state.user.data || {}
+        tempList = {
+          orderType: item.goodType,
+          goodName: item.goodName,
+          num: item.goodNum,
+          id: item.id,
+          discountPrice: item.discountPrice || 0,
+          title: item.goodName || '',
+          // 判断是否有优惠金额
+          price: item.expectPrice,
+          ...discountTimer(users.discountEndTime, item.period)
         }
       }
       break
@@ -217,7 +231,6 @@ export const formatOrderDetail = async (item: any, amount?: IAmount) => {
       break
     case 'ALBUM':
       {
-        console.log(item)
         try {
           const res = await getAlbumDetail(item.bizId)
           tempList = {
@@ -248,7 +261,7 @@ export const formatOrderDetail = async (item: any, amount?: IAmount) => {
   }
   tempList.orderType = type
   tempList.goodName = item.goodName
-  orderStatus.orderObject.orderList.push(tempList)
+  return tempList
 }
 // 获取视频课详情
 export const getVideoDetail = async (groupId: any) => {
@@ -327,18 +340,36 @@ export const getAlbumDetail = async (id: any) => {
   }
 }
 
-// 获取畅学卡详情
-export const getDiscountDetail = async (id: any) => {
-  try {
-    const {data} = await request.get(`${apiSuffix}/memberPriceSettings/detail/` + id)
-    return data
-  } catch {
-    throw new Error('获取畅学卡详情失败')
-  }
+/** 处理选择了畅学卡之后的显示 */
+const formatOrder = (orderDetailList: any, orderType: string) => {
+  let discountJson: any = {}
+  orderDetailList.forEach((item: any) => {
+    if(item.goodType === orderType) {
+      discountJson = item.discountJson ? JSON.parse(item.discountJson) : {}
+    }
+  })
+  orderDetailList.forEach((item: any) => {
+    if(item.goodType === "DISCOUNT") {
+      item.discountPrice = discountJson.DISCOUNT || 0
+    }
+  })
+  return orderDetailList
+}
+
+const moveToEnd = () => {
+  const orderList = orderStatus.orderObject.orderList || []
+  const index = orderList.findIndex((item: any) => item.orderType === 'DISCOUNT')
+    if (index !== -1) {
+      const i = orderList.splice(index, 1)
+      orderStatus.orderObject.orderList = [
+        ...orderList,
+        ...i
+      ]
+    }
 }
 
 // 为了处理继续支付逻辑
-export const tradeOrder = (result: any, callBack?: any) => {
+export const tradeOrder = async (result: any, callBack?: any) => {
   const {
     orderNo,
     actualPrice,
@@ -359,6 +390,7 @@ export const tradeOrder = (result: any, callBack?: any) => {
   orderStatus.orderObject.actualPrice = actualPrice
   orderStatus.orderObject.orderNo = orderNo
   orderStatus.orderObject.discountPrice = discountPrice
+  orderStatus.orderObject.couponAmount = couponAmount
   orderStatus.orderObject.paymentConfig = {
     ...paymentConfig,
     paymentVendor,
@@ -377,13 +409,17 @@ export const tradeOrder = (result: any, callBack?: any) => {
       }
     })
     orderDetails[0] && (orderDetails[0].activityList = orderDetailsActivity)
-    orderDetails.forEach(async (item: any) => {
-      await formatOrderDetail(item, {
+
+    formatOrder(orderDetails, orderType).forEach(async (item: any) => {
+      const child = await formatOrderDetail(item, {
         couponAmount,
         discountPrice,
         expectPrice
       })
+      orderStatus.orderObject.orderList.push(child)
+      moveToEnd()
     })
+
     callBack && callBack()
   } catch {
     //

src/student/video-class/video-detail.tsx

@@ -94,9 +94,6 @@ export default defineComponent({
           isTeacher: result.teacherFlag ? true : false
         }
         this.detailList = result.detailList || []
-
-        console.log(lessonGroup.payType, userInfo.isVip)
-        console.log(this.userInfo, 'this.userInfo')
       } catch {
         //
       }
@@ -131,27 +128,6 @@ export default defineComponent({
         }
 
         const userInfo = this.userInfo
-        orderStatus.orderObject.orderType = 'VIDEO'
-        orderStatus.orderObject.orderName = '视频课购买'
-        orderStatus.orderObject.orderDesc = '视频课购买'
-        orderStatus.orderObject.actualPrice = userInfo.lessonPrice
-        orderStatus.orderObject.recomUserId = this.recomUserId
-        orderStatus.orderObject.orderNo = ''
-        orderStatus.orderObject.orderList = [
-          {
-            orderType: 'VIDEO',
-            goodsName: '视频课购买',
-            courseGroupId: userInfo.id,
-            courseGroupName: userInfo.lessonName,
-            coursePrice: userInfo.lessonPrice,
-            teacherName: userInfo.username || `游客${userInfo.teacherId || ''}`,
-            teacherId: userInfo.teacherId,
-            avatar: userInfo.headUrl,
-            relationType: this.userInfo.relationType,
-            courseInfo: this.detailList,
-            recomUserId: this.recomUserId
-          }
-        ]
 
         // 判断是否是0无订单
         if (userInfo.lessonPrice <= 0) {
@@ -194,6 +170,27 @@ export default defineComponent({
               this.cancelPayment(result.orderNo)
             })
         } else {
+          orderStatus.orderObject.orderType = 'VIDEO'
+          orderStatus.orderObject.orderName = '视频课购买'
+          orderStatus.orderObject.orderDesc = '视频课购买'
+          orderStatus.orderObject.actualPrice = userInfo.lessonPrice
+          orderStatus.orderObject.recomUserId = this.recomUserId
+          orderStatus.orderObject.orderNo = ''
+          orderStatus.orderObject.orderList = [
+            {
+              orderType: 'VIDEO',
+              goodsName: '视频课购买',
+              courseGroupId: userInfo.id,
+              courseGroupName: userInfo.lessonName,
+              coursePrice: userInfo.lessonPrice,
+              teacherName: userInfo.username || `游客${userInfo.teacherId || ''}`,
+              teacherId: userInfo.teacherId,
+              avatar: userInfo.headUrl,
+              relationType: this.userInfo.relationType,
+              courseInfo: this.detailList,
+              recomUserId: this.recomUserId
+            }
+          ]
           this.routerTo()
         }
       } catch {}

src/teacher/piano-room/account-recharge-timer/index.tsx

@@ -101,6 +101,7 @@ export default defineComponent({
         }
       ]
 
+      console.log(orderStatus.orderObject.orderList, 'orderStatus.orderObject.orderList')
       this.$router.push({
         path: '/orderDetail',
         query: {

src/teacher/practice-class/timer/timer.tsx

@@ -9,6 +9,7 @@ import ColField from '@/components/col-field'
 import request from '@/helpers/request'
 import { postMessage } from '@/helpers/native-message'
 import TheSticky from '@/components/the-sticky'
+import ColHeader from '@/components/col-header'
 dayjs.extend(customParseFormat)
 dayjs.extend(isSameOrBefore)
 
@@ -202,32 +203,34 @@ export default defineComponent({
   render() {
     return (
       <div class={styles.timer}>
-            <ColField  border={false} class={styles.colField}>
-              {{
-                title: () => <div class={styles.title}>
-                  <img src={iconQuestion}></img>
-                  是否跳过节假日
-                </div>,
-                default: () =>　<RadioGroup
-                class={styles['radio-group']}
-                modelValue={this.skipHolidayFlag}
-                onUpdate:modelValue={val => (this.skipHolidayFlag = val)}
-              >
-                {['1', '0'].map((item: string) => {
-                  const isActive =
-                    Number(item) === Number(this.skipHolidayFlag)
-                  const type = isActive ? 'primary' : 'default'
-                  return (
-                    <Radio class={styles.radio} name={item}>
-                      <Tag size="large" plain={isActive} type={type}>
-                        {this.chargeTypeArr[item]}
-                      </Tag>
-                    </Radio>
-                  )
-                })}
-              </RadioGroup>
-              }}
-            </ColField>
+        <ColHeader  />
+
+        <ColField  border={false} class={styles.colField}>
+          {{
+            title: () => <div class={styles.title}>
+              <img src={iconQuestion}></img>
+              是否跳过节假日
+            </div>,
+            default: () =>　<RadioGroup
+            class={styles['radio-group']}
+            modelValue={this.skipHolidayFlag}
+            onUpdate:modelValue={val => (this.skipHolidayFlag = val)}
+          >
+            {['1', '0'].map((item: string) => {
+              const isActive =
+                Number(item) === Number(this.skipHolidayFlag)
+              const type = isActive ? 'primary' : 'default'
+              return (
+                <Radio class={styles.radio} name={item}>
+                  <Tag size="large" plain={isActive} type={type}>
+                    {this.chargeTypeArr[item]}
+                  </Tag>
+                </Radio>
+              )
+            })}
+          </RadioGroup>
+          }}
+        </ColField>
         {/* <div class={styles.tips}>
           <div class={styles.tipsTitle}>请选择陪练开始时间</div>
           <div class={styles.tipsTime}>

src/views/order-detail/add-discount/index.module.less

@@ -0,0 +1,104 @@
+
+.addDiscount {
+  .selectDiscount {
+    padding-left: 11px;
+  }
+  .boxStyle {
+    background: transparent !important;
+    width: 18px;
+    height: 18px;
+    border: transparent !important;
+    
+  }
+  :global {
+    .van-checkbox {
+      display: inline-block;
+      align-items: inherit;
+      overflow: inherit;
+      margin-right: 4px;
+    }
+    .van-checkbox__icon {
+      height: 18px;
+      line-height: 18px;
+      display: inline-block;
+      vertical-align: middle;
+    }
+    .van-checkbox__label {
+      line-height: 18px;
+    }
+  }
+}
+
+.container {
+  display: flex;
+  .memberLogo {
+    flex-shrink: 0;
+    margin-right: 10px;
+    width: 76px;
+    height: 76px;
+  }
+
+  .info{
+    flex: 1 auto;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+
+    .top {
+      display: flex;
+      justify-content: space-between;
+      font-size: 14px;
+        color: #131415;
+        line-height: 22px;
+      .title {
+        font-weight: 600;
+      }
+    }
+
+    .center {
+      .t {
+        display: inline-block;
+        background: #FEE8E4;
+        border-radius: 4px;
+        font-size: 12px;
+        color: #333333;
+        line-height: 1;
+        padding: 2px 8px 2px 0;
+        .dis {
+          background: linear-gradient( 315deg, #FF3C83 0%, #FF0704 51%, #FF7A4F 100%);
+          border-radius: 4px;
+          color: #FFFFFF;
+          font-weight: bold;
+          padding: 0 4px;
+          margin-right: 8px;
+        }
+        .text {
+          vertical-align: middle;
+        }
+      }
+    }
+
+    .bottom {
+      font-size: 12px;
+      color: #999999;
+      line-height: 18px;
+    }
+  }
+}
+
+.cellGroup {
+  border-radius: 10px;
+  overflow: hidden;
+}
+.timer {
+  font-size: 14px;
+  font-weight: 500;
+  color: #FF1A00;
+  line-height: 20px;
+}
+
+.timerCell {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}

src/views/order-detail/add-discount/index.tsx

@@ -0,0 +1,219 @@
+import { defineComponent, onMounted, reactive, ref } from 'vue'
+import styles from './index.module.less'
+import { Cell, CellGroup, Checkbox, Icon, Image } from 'vant'
+import activeButtonIcon from '@common/images/icon_checkbox.png'
+import inactiveButtonIcon from '@common/images/icon_checkbox_default.png'
+import iconDiscount from '@common/images/icon_discount.png'
+import request from '@/helpers/request'
+import { state } from '@/state'
+import { moneyFormat } from '@/helpers/utils'
+import dayjs from 'dayjs'
+
+type DiscountDetail = {
+  /** 编号 */
+  id: number | null
+  /** 销售金额 */
+  salePrice: number
+  /** 折扣 */
+  discountRate: number
+  /** 类型 */
+  period: string
+  /**　券类型 */
+  vipType: string
+}
+
+export default defineComponent({
+  name: 'add-discount',
+  props: {
+    /** 订单类型 */
+    orderType: {
+      type: String,
+      default: ''
+    },
+    /** 实际需要支付金额 */
+    actualPrice: {
+      type: Number,
+      default: 0
+    }
+  },
+  emits: ['confirm'],
+  setup(props, { emit }) {
+    //
+    const isDisplay = ref(false)
+    const checked = ref(false)
+    const params = reactive({
+      discountPrice: 0 as any, // 优惠的金额,
+      startTime: '' as string,
+      endTime: '' as string
+    })
+    const discountDetail = ref<DiscountDetail>({
+      id: null,
+      salePrice: 0,
+      discountRate: 0,
+      period: 'YEAR',
+      vipType: 'DISCOUNT'
+    })
+
+    // 格式化显示
+    const formatShowTime = () => {
+      console.log(props.actualPrice, 'actualPrice')
+      if(checked.value) {
+        params.discountPrice = (
+          props.actualPrice -
+          (props.actualPrice * discountDetail.value.discountRate / 100)
+        ).toFixed(2)
+        // discountEndTime
+        const users = state.user.data
+        const startTime = users.discountEndTime || new Date()
+        let endTime = dayjs(new Date()).format('YYYY-MM-DD')
+        if (discountDetail.value.period === 'MONTH') {
+          endTime = dayjs(startTime).add(1, 'month').format('YYYY-MM-DD')
+        } else if (discountDetail.value.period === 'QUARTERLY') {
+          endTime = dayjs(startTime).add(3, 'month').format('YYYY-MM-DD')
+        } else if (discountDetail.value.period === 'YEAR_HALF') {
+          endTime = dayjs(startTime).add(6, 'month').format('YYYY-MM-DD')
+        } else if (discountDetail.value.period === 'YEAR') {
+          endTime = dayjs(startTime).add(1, 'year').format('YYYY-MM-DD')
+        }
+        params.startTime = dayjs(startTime).format('YYYY-MM-DD')
+        params.endTime = endTime
+      } else {
+        params.discountPrice = 0
+        params.startTime = ''
+        params.endTime = ''
+      }
+    }
+
+    const onDiscountChange = () => {
+      checked.value = !checked.value
+
+      formatShowTime()
+
+      emit('confirm', {
+        checked: checked.value,
+        discountPrice: params.discountPrice,
+        ...discountDetail.value
+      })
+    }
+
+    const __init = async () => {
+      const { data } = await request.get(
+        `${state.platformApi}/memberPriceSettings/getDiscount`
+      )
+      discountDetail.value = {
+        id: data.id,
+        salePrice: data.salePrice,
+        period: data.period,
+        discountRate: (data.discountRate || 0) * 100,
+        vipType: data.vipType
+      }
+      const productType = data.productType ? data.productType.split(',') : []
+      // 判断是否需要购买畅学卡
+      if (productType.includes(props.orderType)) {
+        isDisplay.value = true
+      } else {
+        isDisplay.value = false
+      }
+    }
+
+    __init()
+    return () =>
+      isDisplay.value ? (
+        <div class={styles.addDiscount}>
+          <CellGroup class={['mb12', styles.cellGroup]} border={false}>
+            <Cell
+              center
+              class={styles.selectDiscount}
+              titleClass={styles.titleClass}
+              onClick={() => {
+                onDiscountChange()
+              }}
+              v-slots={{
+                icon: () => (
+                  <Checkbox
+                    modelValue={checked.value}
+                    v-slots={{
+                      icon: (props: any) => (
+                        <Icon
+                          class={styles.boxStyle}
+                          name={
+                            props.checked
+                              ? activeButtonIcon
+                              : inactiveButtonIcon
+                          }
+                          size="15"
+                        />
+                      )
+                    }}
+                  ></Checkbox>
+                ),
+                title: () => (
+                  <div class={styles.container}>
+                    <Image class={styles.memberLogo} src={iconDiscount} />
+                    <div class={styles.info}>
+                      <div class={styles.top}>
+                        <div class={styles.title}>畅学卡</div>
+                        <div class={styles.price}>
+                          ¥{moneyFormat(discountDetail.value.salePrice)}/年
+                        </div>
+                      </div>
+                      <div class={styles.center}>
+                        <div class={styles.t}>
+                          <span class={styles.dis}>
+                            约课{discountDetail.value.discountRate}折
+                          </span>
+                          <span class={styles.text}>现在开通立即优惠</span>
+                        </div>
+                      </div>
+                      <div class={styles.bottom}>x1</div>
+                    </div>
+                  </div>
+                )
+              }}
+            />
+          </CellGroup>
+
+          {checked.value ? (
+            <>
+              <CellGroup class={['mb12', styles.cellGroup]} border={false}>
+                <Cell
+                  center
+                  v-slots={{
+                    title: () => (
+                      <div class={styles.timerCell}>
+                        <div class={styles.timerTitle}>
+                          <span>畅学卡生效时间</span>
+                        </div>
+                        <div class={styles.timer}>
+                          {params.startTime} 至 {params.endTime}
+                        </div>
+                      </div>
+                    )
+                  }}
+                />
+              </CellGroup>
+              <CellGroup class={['mb12', styles.cellGroup]} border={false}>
+                <Cell
+                  center
+                  v-slots={{
+                    title: () => (
+                      <div class={styles.timerCell}>
+                        <div class={styles.timerTitle}>
+                          <span>畅学卡优惠</span>
+                        </div>
+                        <div class={styles.timer}>-￥{params.discountPrice}</div>
+                      </div>
+                    )
+                  }}
+                />
+              </CellGroup>
+            </>
+          ) : (
+            ''
+          )}
+        </div>
+      ) : (
+        ''
+      )
+  }
+})

src/views/order-detail/index.module.less

@@ -77,31 +77,34 @@
     }
 
     .priceSection {
-      // display: flex;
+      display: flex;
       // align-items: center;
-      font-size: 14px;
-      font-weight: 500;
-      color: #999999;
+      font-size: 12px;
+      // font-weight: 500;
+      color: #333333;
       line-height: 20px;
 
       .goodsNum {
-        font-size: 12px;
         color: #777777;
         padding-right: 6px;
         font-weight: 400;
+        padding-top: 4px;
       }
 
       .price {
         display: inline-block;
-        font-size: 28px;
+        font-size: 20px;
         font-weight: bold;
         color: #ff3535;
         font-family: DINAlternate-Bold, DINAlternate;
 
         .priceUnit {
-          font-size: 14px;
+          font-size: 12px;
         }
       }
+      .isDiscountPrice {
+        color: #777777;
+      }
     }
   }
 

src/views/order-detail/index.tsx

@@ -43,6 +43,7 @@ import OrderTennatAlbum from './order-tennat-album'
 import { orderType } from '@/constant'
 import OrderDiscount from './order-discount'
 import OrderVipCourse from './order-vip-course'
+import AddDiscount from './add-discount'
 
 export default defineComponent({
   name: 'order-detail',
@@ -50,7 +51,7 @@ export default defineComponent({
     const query = this.$route.query
     return {
       loading: false, // 是否加载中，为了处理0元订单（）
-      dialogVisiable: false,
+      dialogVisible: false,
       dialogContent: '',
       dialogBtnText: '确定',
       dialogType: 'back' as 'back' | 'refresh',
@@ -73,6 +74,7 @@ export default defineComponent({
       showQrcode: false,
       orderTimer: null as any,
       qrCodeUrl: '',
+      selectGoods: [] as any, // 用于先中的其它商品
       pay_channel: '',
       orderInfo: {} as any,
       config: {} as any, // 支付信息
@@ -104,6 +106,10 @@ export default defineComponent({
         }
       })
       return num
+    },
+    countDiscountPrice() {
+      const orderObject = orderStatus.orderObject
+      return orderObject.couponAmount || orderObject.couponDiscountPrice + orderObject.discountCardPrice
     }
   },
   async mounted() {
@@ -156,12 +162,12 @@ export default defineComponent({
     this.$nextTick(() => {
       // paymentButton
       // 处理超过一屏显示
-      const { height } = useRect((this as any).$refs.paymentButtom)
+      const { height } = useRect((this as any).$refs.paymentButton)
       this.bottomHeight = height + 10
     })
 
     if (!orderStatus.orderObject.orderType) {
-      this.dialogVisiable = true
+      this.dialogVisible = true
       this.dialogContent = '产品信息已更新，请重新选择'
       this.dialogBtnText = '确定'
       this.dialogType = 'back'
@@ -307,7 +313,7 @@ export default defineComponent({
           })
           const result = res.data || {}
           if (res.code === 998 || res.code === 999) {
-            this.dialogVisiable = true
+            this.dialogVisible = true
             this.dialogContent = res.msg
             this.dialogBtnText = '刷新'
             this.dialogType = 'back'
@@ -331,11 +337,17 @@ export default defineComponent({
             state.platformType === 'TEACHER'
               ? '/api-teacher/userOrder/executeOrder/v2'
               : '/api-student/userOrder/executeOrder/v2'
+
+          const goods: any = orderTenantInfos()
+          if(this.selectGoods && this.selectGoods.length > 0) {
+            goods.push(...orderTenantInfos(this.selectGoods))
+          }
+
           const res = await request.post(url, {
             data: {
               activityId: orderObject.activityId || null,
               couponIds: orderObject.couponId,
-              goodsInfos: [...orderTenantInfos()],
+              goodsInfos: goods,
               orderDesc: orderObject.orderDesc,
               orderName: orderObject.orderName,
               orderType: orderObject.orderType,
@@ -347,7 +359,7 @@ export default defineComponent({
           const result = res.data || {}
           // 支付成功
           if (res.code === 999 || res.code === 998) {
-            this.dialogVisiable = true
+            this.dialogVisible = true
             this.dialogContent = res.msg
             this.dialogBtnText = '确定'
             this.dialogType = 'back'
@@ -362,12 +374,14 @@ export default defineComponent({
             })
             return
           }
-          orderStatus.orderObject.paymentConfig = res.data || {}
-          orderStatus.orderObject.orderNo = res.data?.orderNo
+          orderStatus.orderObject.paymentConfig = result.paymentConfig || {}
+          // orderStatus.orderObject.paymentConfig.actualPrice = result.paymentConfig.price
+          orderStatus.orderObject.actualPrice = result.paymentConfig.price
+          orderStatus.orderObject.orderNo = result?.orderNo
           this.orderInfo = result
           this.orderNo = result.orderNo
         }
-        console.log(orderStatus.orderObject, '111')
+        // console.log(orderStatus.orderObject, orderStatus.orderObject.paymentConfig, '111')
         this.paymentStatus = true
       } catch {
         this.loading = false
@@ -382,7 +396,7 @@ export default defineComponent({
       }
     },
     async onDialogConfirm() {
-      this.dialogVisiable = false
+      this.dialogVisible = false
       if (this.dialogType === 'back') {
         this.$router.back()
       } else if (this.dialogType === 'refresh') {
@@ -411,7 +425,11 @@ export default defineComponent({
       })
 
       const lastAmount = Number(
-        (Number(this.orderAmount) - Number(discountCount)).toFixed(2)
+        (
+          Number(this.orderAmount) -
+          orderStatus.orderObject.discountCardPrice -
+          Number(discountCount)
+        ).toFixed(2)
       )
       this.orderPrice = lastAmount >= 0 ? lastAmount : 0
       // 设置优惠券编号
@@ -551,6 +569,7 @@ export default defineComponent({
               } else if (item.orderType === 'DISCOUNT') {
                 return (
                   <OrderDiscount
+                    disabled={this.disabledCoupon}
                     item={item}
                     onPriceChange={(price: number) => {
                       // 重置金额
@@ -568,18 +587,78 @@ export default defineComponent({
               }
             })}
 
+            {/* 畅学卡 - 目前只有学生端支持 */}
+            {state.platformType === 'STUDENT' &&
+            !this.dataLoading &&
+            !this.disabledCoupon ? (
+              <AddDiscount
+                actualPrice={this.orderAmount}
+                orderType={this.orderType}
+                onConfirm={(item: {
+                  checked: boolean
+                  id: number | null
+                  salePrice: number
+                  discountRate: number
+                  discountPrice: number | string
+                  vipType: string
+                }) => {
+                  // 畅学卡变更状态时需要重新选择优惠券
+                  orderStatus.orderObject.couponId = ''
+                  orderStatus.orderObject.couponDiscountPrice = 0
+                  // 是否选中畅学卡
+                  const index = this.selectGoods?.findIndex(
+                    (child: any) => child.id === item.id
+                  )
+                  if (item.checked) {
+                    orderStatus.orderObject.discountCardPrice = Number(
+                      item.discountPrice
+                    )
+                    if (index === -1) {
+                      this.orderAmount = this.orderAmount + item.salePrice
+                      this.selectGoods.push({
+                        orderType: item.vipType,
+                        goodsName: '畅学卡',
+                        num: 1,
+                        id: item.id
+                      })
+                    }
+                  } else {
+                    orderStatus.orderObject.discountCardPrice = 0
+                    if (index !== -1) {
+                      this.selectGoods.splice(index, 1)
+                      this.orderAmount = this.orderAmount - item.salePrice
+                    }
+                  }
+                  console.log(orderStatus.orderObject, 'orderObject-----')
+
+                  this.orderPrice = Number(
+                    (
+                      Number(this.orderAmount) -
+                      Number(item.discountPrice) -
+                      Number(orderStatus.orderObject.couponDiscountPrice)
+                    ).toFixed(2)
+                  )
+                }}
+              />
+            ) : (
+              ''
+            )}
+
             {/* 优惠券使用 */}
             {!this.dataLoading && (
               <UseCoupon
+                couponId={orderStatus.orderObject.couponId}
                 discountPrice={orderStatus.orderObject.discountPrice}
                 orderType={this.orderType}
-                orderAmount={this.orderAmount}
+                orderAmount={
+                  this.orderAmount - orderStatus.orderObject.discountCardPrice
+                }
                 onCouponSelect={this.onCouponSelect}
                 disabled={this.disabledCoupon}
               />
             )}
 
-            <div class={styles.paymentInfo} ref="paymentButtom">
+            <div class={styles.paymentInfo} ref="paymentButton">
               {this.orderPrice > 0 && (
                 <div
                   class={[
@@ -598,12 +677,17 @@ export default defineComponent({
               <div class={styles.btnGroup}>
                 <div class={styles.priceSection}>
                   <span class={styles.goodsNum}>共{this.goodsNum || 1}件</span>
-                  合计：
-                  <div class={styles.price}>
-                    <span class={styles.priceUnit}>￥</span>
-                    <span class={styles.priceNum}>
-                      {moneyFormat(this.orderPrice)}
-                    </span>
+                  <div>
+                    <div>
+                      合计：
+                      <div class={styles.price}>
+                        <span class={styles.priceUnit}>￥</span>
+                        <span class={styles.priceNum}>
+                          {moneyFormat(this.orderPrice)}
+                        </span>
+                      </div>
+                    </div>
+                    <div class={styles.isDiscountPrice}>已优惠 ¥{moneyFormat(this.countDiscountPrice)}</div>
                   </div>
                 </div>
                 <Button
@@ -677,7 +761,7 @@ export default defineComponent({
         </Popup>
 
         <Popup
-          v-model:show={this.dialogVisiable}
+          v-model:show={this.dialogVisible}
           style={{ background: 'transparent' }}
           closeOnClickOverlay={false}
         >

src/views/order-detail/order-discount/index.module.less

@@ -53,7 +53,7 @@
 
 .timer {
   font-size: 14px;
-  font-weight: 500;
+  font-weight: 600;
   color: #FE2451;
   line-height: 20px;
 }

src/views/order-detail/order-discount/index.tsx

@@ -5,7 +5,6 @@ import styles from './index.module.less'
 
 import iconDiscount from '@common/images/icon_discount.png'
 import dayjs from 'dayjs'
-import { memberSimpleType } from '@/constant'
 
 export default defineComponent({
   name: 'OrderVideo',
@@ -23,15 +22,6 @@ export default defineComponent({
   computed: {
     startTime() {
       const item = this.item
-      if (this.disabled) {
-        return item.startTime
-      }
-      if (item.svipEndDays > 0 && item.orderType === 'SVIP') {
-        return dayjs(item.startTime).add(1, 'day').format('YYYY-MM-DD')
-      }
-      if (item.vipEndDays > 0 && item.orderType === 'VIP') {
-        return dayjs(item.startTime).add(1, 'day').format('YYYY-MM-DD')
-      }
       return item.startTime
     }
   },
@@ -110,8 +100,7 @@ export default defineComponent({
               title: () => (
                 <div class={styles.timerCell}>
                   <div class={styles.timerTitle}>
-                    {/* <Icon name={iconTimer} size={18} /> */}
-                    <span>生效时间</span>
+                    <span>畅学卡生效时间</span>
                   </div>
                   <div class={styles.timer}>
                     {this.startTime} 至 {item.endTime}
@@ -121,6 +110,23 @@ export default defineComponent({
             }}
           />
         </CellGroup>
+
+        {item.discountPrice && item.discountPrice > 0 ? <CellGroup class={['mb12', styles.cellGroup]} border={false}>
+          <Cell
+            center
+            v-slots={{
+              title: () => (
+                <div class={styles.timerCell}>
+                  <div class={styles.timerTitle}>
+                    <span>畅学卡优惠</span>
+                  </div>
+                  <div class={styles.timer}>-￥{(this as any).$filters.moneyFormat(item.discountPrice)}</div>
+                </div>
+              )
+            }}
+          />
+        </CellGroup> : ''}
+        
       </div>
       // 视频课
     )

src/views/order-detail/order-vip/index.module.less

@@ -67,7 +67,7 @@
 
 .timer {
   font-size: 14px;
-  font-weight: 500;
+  font-weight: 600;
   color: #FE2451;
   line-height: 20px;
 }

src/views/order-detail/orderStatus.ts

@@ -40,7 +40,9 @@ const original = () => {
       orderList: [] as Array<any>, // 商品信息
       activityId: '' as any, // 活动编号
       couponId: '' as string, // 优惠券编号
+      couponAmount: 0 as number, // 所有的优惠金额 - 继续支付使用
       couponDiscountPrice: 0 as number, // 优惠券扣减金额
+      discountCardPrice: 0 as number, // 畅学卡扣减金额
       discountPrice: 0 as number // 优惠
     } as any
     // orderObject: {
@@ -172,9 +174,16 @@ export const orderInfos = () => {
   })
 }
 
-export const orderTenantInfos = () => {
+// 
+export const orderTenantInfos = (otherGoods: any[] = []) => {
   // 商品列表
-  const orderList = orderStatus.orderObject.orderList || []
+  let orderList: any[] =  []
+  if(otherGoods && otherGoods.length > 0) {
+    orderList = otherGoods || []
+  } else {
+    orderList = orderStatus.orderObject.orderList || []
+  }
+  
   const activityList: any[] = [] // 活动赠品
   const infos = orderList.map((item: any) => {
     const params: any = {

src/views/order-detail/use-coupons/index.module.less

@@ -4,7 +4,7 @@
 
   .couponCount {
     color: #ff3535;
-    font-size: 16px;
+    font-size: 14px;
     font-weight: 600;
 
     i {

src/views/order-detail/use-coupons/index.tsx

@@ -42,6 +42,11 @@ export default defineComponent({
       // 优惠券使用金额
       type: Number,
       default: 0
+    },
+    // 选择的优惠券
+    couponId: {
+      type: String,
+      default: ''
     }
   },
   emits: ['couponSelect'],
@@ -79,6 +84,19 @@ export default defineComponent({
       return couponEnum[this.orderType] || 'UNIVERSAL'
     }
   },
+  watch: {
+    couponId(val: any) {
+      // 为
+      const ids = val ? val.split(',').map(i => Number(i)) : []
+      const selectCouponList: any[] = []
+      this.useCouponList.forEach((item: any) => {
+        if(ids.includes(item.couponIssueId)) {
+          selectCouponList.push(item)
+        }
+      });
+      this.useCouponList = selectCouponList
+    }
+  },
   mounted() {
     // this.getUseableCoupon()
     this.getList()