简历模板

components.d.ts

@@ -17,6 +17,7 @@ declare module 'vue' {
     Combobox: typeof import('./src/components/FormUI/combobox/index.vue')['default']
     ComboboxZhAndEn: typeof import('./src/components/FormUI/comboboxZhAndEn/index.vue')['default']
     ConfirmPaymentDialog: typeof import('./src/components/pay/confirmPaymentDialog.vue')['default']
+    copy: typeof import('./src/components/CtForm/index copy.vue')['default']
     CtBtn: typeof import('./src/components/CtVuetify/CtBtn/index.vue')['default']
     CtDialog: typeof import('./src/components/CtDialog/index.vue')['default']
     CtForm: typeof import('./src/components/CtForm/index.vue')['default']

src/api/common/index.js

@@ -346,3 +346,21 @@ export const socialAuthRedirect = async (params) => {
     params
   })
 }
+
+// 求职端交易订单  创建
+export const orderCreated = async (data) => {
+  return await request.post({
+    url: '/app-api/menduner/system/trade/order/create',
+    data
+  })
+}
+
+// 求职端交易订单  创建
+export const getOrder = async (params) => {
+  return await request.get({
+    url: '/app-api/menduner/system/trade/order/get/unpaid',
+    params
+  })
+}
+
+

src/components/personalRecharge/pay.vue

@@ -0,0 +1,200 @@
+<template>
+  <div class="code pa-5 resume-box">
+    <div class="resume-header">
+      <div class="resume-title">扫码支付</div>
+    </div>
+    <div class="d-flex align-end mt-3">
+      <div class="code-left">
+        <QrCode :text="props.qrCode" :disabled="props.disabled" :width="170" @refresh="refreshQRCode" />
+      </div>
+      <div class="code-right ml-5">
+        <div class="price">
+          <span class="font-size-13">￥</span>
+          {{ props.payPrice }}
+        </div>
+        <div class="mt-3 d-flex align-center">
+          <span class="color-666 font-weight-bold mr-5">支付方式</span>
+          <v-chip-group v-model="payType" selected-class="text-primary" column mandatory @update:modelValue="payTypeChange">
+            <v-chip filter v-for="k in payTypeList" :key="k.code" :value="k.code" class="mr-3" label>
+              {{ k.name }}
+              <svg-icon v-if="k.icon" class="ml-1" :name="k.icon" :size="k.size"></svg-icon>
+            </v-chip>
+          </v-chip-group>
+        </div>
+      </div>
+    </div>
+    <div
+      class="mt-5 ml-2"
+      style="color: var(--v-error-base);"
+    >
+      扫码支付时请勿离开
+      <span v-if="remainderZhShow">{{ remainderZhShow }}</span>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import QrCode from '@/components/QrCode'
+import { ref, watch, onUnmounted } from 'vue'
+import { definePayTypeList } from '@/utils/payType'
+import { getEnableCodeList } from '@/api/common'
+const emit = defineEmits(['refreshQrCode'])
+const props = defineProps({
+  // 价格
+  payPrice: {
+    type: Number,
+    default: 0
+  },
+  // 渠道id
+  appId: {
+    type: Number,
+    default: 8 // 8：个人微信付款
+  },
+  // 二维码text
+  qrCode: {
+    type: String,
+    default: ''
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  payChannelCode: {
+    type: String,
+    default: 'wx_native'
+  }
+})
+
+const payType = ref(props.payChannelCode)
+const payTypeList = ref([])
+const codeList = ref([])
+
+const remainderZhShow = ref(0)
+
+let interTimer = null
+
+let _checkPayStatus = checkPayStatus()
+
+// 计时器
+const initIntervalFun = () => {
+
+  let remainder = 60000*5 // 倒计时五分钟
+  if (interTimer) {
+    clearInterval(interTimer)
+  }
+  remainderZhShow.value = formatDuration(remainder)
+  interTimer = setInterval(() => {
+    remainder -= 1000
+    remainderZhShow.value = formatDuration(remainder)
+    // 查询是否已经支付
+    _checkPayStatus()
+    if (remainder <= 0) {
+      // 倒计时结束，二维码过期
+      emit('overdue')
+      clearInterval(interTimer)
+    }
+  }, 1000)
+}
+
+// 检测付款状态
+async function checkPayStatus() {
+  let statusLoading = false
+  return async (params) => {
+    if (!statusLoading) {
+      return
+    }
+    statusLoading = true
+    try {
+      console.log(params)
+      // const { data } = await ApiName
+      // console.log(data)
+    } catch (error) {
+      console.log(error)
+    } finally {
+      statusLoading = false
+    }
+  }
+}
+
+
+const formatDuration = (remainder) => {
+  // 将毫秒转换为秒
+  var seconds = Math.floor(remainder / 1000)
+  // 计算分钟和剩余的秒数
+  var minutes = Math.floor(seconds / 60)
+  var remainingSeconds = seconds % 60
+  // 格式化分钟和秒数，确保秒数为两位数（如果小于10，则前面补0）
+  minutes = minutes.toString().padStart(2, '0')
+  remainingSeconds = remainingSeconds.toString().padStart(2, '0')
+  // 返回格式化的字符串
+  return `${minutes}分${remainingSeconds}秒`
+}
+
+// 获取支付渠道
+async function getCodeList () {
+  try {
+    const list = await getEnableCodeList({appId: props.appId})
+    console.log(list)
+    codeList.value = list || []
+    if (!codeList.value.length) {
+      return
+    }
+    payTypeList.value.push(...definePayTypeList.filter(d => list.includes(d.code)))
+  } catch (error) {
+    console.log(error)
+  }
+}
+
+// 刷新二维码
+function refreshQRCode(){
+  emit('refreshQrCode', payType.value)
+}
+
+function payTypeChange (val) {
+  payType.value = val
+  refreshQRCode()
+}
+
+
+watch(
+  () => props.qrCode,
+  (val) => {
+    if (!val) {
+      if (interTimer) {
+        clearInterval(interTimer)
+      }
+      remainderZhShow.value = null
+      return
+    }
+    initIntervalFun()
+  }
+)
+
+onUnmounted(() => {
+  // 回收
+  _checkPayStatus = null
+  clearInterval(interTimer)
+})
+
+initIntervalFun()
+getCodeList()
+</script>
+
+<style lang="scss" scoped>
+.code {
+  border-radius: 6px;
+  background-color: #f7f8fa;
+  &-left {
+    border: 1px solid #00897B;
+    border-radius: 6px;
+    padding: 5px;
+  }
+  &-right {
+    .price {
+      font-size: 30px;
+      font-weight: 700;
+      color: var(--v-error-base);
+    }
+  }
+}
+</style>

src/router/modules/components/recruit/personCenter.js

@@ -52,6 +52,14 @@ const personCenter = [
                   enName: 'Attachment Resume',
                   title: '附件简历'
                 }
+              },
+              {
+                path: '/recruit/personal/personalCenter/resume/template',
+                component: () => import('@/views/recruit/personal/PersonalCenter/resume/template/index.vue'),
+                meta: {
+                  enName: 'Resume Template',
+                  title: '简历模板'
+                }
               }
             ]
           },

src/views/mall/purchasePackage/components/packageList.js

@@ -3,28 +3,34 @@ const equity = ['VIP会员标识', '简历刷新次数', '简历屏蔽', '优先
 export const packData =  [
   {
     title: '14天双周卡',
-    price: 128,
-    type: '大众会员套餐',
+    price: 1, // 128
+    type: '3',
+    spuId: '3', // 编号
     equity,
     showLength: 3
   },
   {
     title: '30天月卡',
     price: 198,
-    type: '企业基础套餐',
+    type: '4',
+    spuId: '4', // 编号
     equity,
     showLength: 4
   },
   {
     title: '60天月卡',
     price: 318,
+    type: '5',
     recommend: true,
+    spuId: '5', // 编号
     equity,
     showLength: 5
   },
   {
     title: '90天月卡',
     price: 378,
+    type: '6',
+    spuId: '6', // 编号
     equity,
     showLength: 6
   },
@@ -32,6 +38,8 @@ export const packData =  [
     title: '年度卡',
     price: 999,
     // cycle: '6个月',
+    type: '7',
+    spuId: '7', // 编号
     equity,
     showLength: 7
   }

src/views/mall/purchasePackage/components/packageList.vue

@@ -25,18 +25,19 @@
         <div class="font-size-15">扫描下方二维码联系高级客户经理为您定制</div>
       </div>
       <div class="text-center item-btn">
-        <v-btn v-if="!val.customized" color="error" variant="outlined" rounded @click="handleOpenMembership(val)">开通会员</v-btn>
+        <v-btn v-if="!val.customized" color="error" variant="outlined" rounded @click="createOrder(val)">开通会员</v-btn>
       </div>
     </div>
   </div>
   
   <CtDialog :visible="open" :widthType="1" :footer="false" titleClass="text-h6" title="开通会员" @close="open = false">
-    <initPay
-      v-if="itemInfo"
-      :info="itemInfo"
-      @stopInterval="null"
-      @paySuccess="null"
-    ></initPay>
+    <m-pay
+      :payPrice="100"
+      :qrCode="qrCode"
+      :disabled="disabled"
+      @overdue="handleOverdue"
+      @refreshQrCode="refreshQrCode"
+    ></m-pay>
   </CtDialog>
 </template>
 
@@ -44,21 +45,66 @@
 import { packData } from './packageList.js'
 import { ref } from 'vue'
 // import Snackbar from '@/plugins/snackbar'
-import initPay from '@/components/personalRecharge/initPay.vue'
+import MPay from '@/components/personalRecharge/pay.vue'
+import { orderCreated, getOrder } from '@/api/common'
 defineOptions({name: 'purchasePackage-packageList'})
 
+
 const active = ref(2)
 const handleClickItem = (val, i) => {
   active.value = i
 }
 
 const open = ref(false)
+const disabled = ref(false)
+
+const qrCode = ref('')
 
-const itemInfo = ref(null)
+// const itemInfo = ref(null)
 
 // 开通会员
-const handleOpenMembership = () => {
-  open.value = true
+// const handleOpenMembership = (val) => {
+//   console.log(val)
+//   // createOrder()
+//   // open.value = true
+// }
+
+// 重新获取订单
+const refreshQrCode = () => {
+  // getOrder(payType)
+}
+
+// 创建订单
+async function createOrder (val) {
+  try {
+
+    const data = await getOrder({
+      spuId: val.spuId, // 商品编号
+      type: val.type
+    })
+
+    if (data) {
+      return
+    }
+
+
+    const orderId = await orderCreated({
+      spuId: val.spuId, // 商品编号
+      spuName: val.title, // 商品名称
+      price: val.price, // 价格
+      type: val.type // 订单类型 0平台订单|1求职端订单|2招聘端订单|3用户会员-14天|4用户会员-30天|5用户会员-30天|6用户会员-90天|7用户会员-365天,
+    })
+    // 获取二维码
+    console.log(orderId)
+    // qrCode.value = data
+  } catch (error) {
+    // console.log(error)
+  }
+}
+
+// 过期
+function handleOverdue () {
+  disabled.value = true
 }
 </script>
 <style lang="scss" scoped>

src/views/recruit/personal/PersonalCenter/resume/template/index.vue

@@ -0,0 +1,15 @@
+<template>
+  <div class="resume-box" style="position: relative; height: 100%;">
+    <div class="resume-header">
+      <div class="resume-title">简历模板下载</div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+
+</script>
+
+<style lang="scss" scoped>
+
+</style>