|
|
@@ -90,9 +90,7 @@
|
|
|
<span class="price_1" v-text="changePrice('1', CourseData.price)"></span>
|
|
|
<span class="price_2" v-text="changePrice('2', CourseData.price)"></span>
|
|
|
</span>
|
|
|
- <button class="get" @click="getPurchase">
|
|
|
- {{ is_buy ? $t('Key390') : $t('Key391') }}
|
|
|
- </button>
|
|
|
+ <button class="get" @click="handleCourseStatus">{{ buttonName }}</button>
|
|
|
<span class="collection" @click="addOrDeleteMyCollection">
|
|
|
<svg-icon :icon-class="collection ? 'collection-solid' : 'collection'" />
|
|
|
</span>
|
|
|
@@ -292,6 +290,17 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+export default {
|
|
|
+ name: 'CourseDetails'
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { ref, inject, onBeforeUnmount, computed } from 'vue';
|
|
|
+import { useRoute, useRouter } from 'vue-router/composables';
|
|
|
+import { Message } from 'element-ui';
|
|
|
+import store from '@/store';
|
|
|
+
|
|
|
import Audit from '@/components/payment/Audit.vue';
|
|
|
import PreviewCourse from '@/components/preview/PreviewCourse.vue';
|
|
|
import Payment from '@/components/payment/Payment.vue';
|
|
|
@@ -300,250 +309,304 @@ import {
|
|
|
CheckMyGoodsBuyStatus,
|
|
|
AddMyCollection,
|
|
|
CancelMyGoodsCollection,
|
|
|
- CheckMyGoodsCollectionStatus
|
|
|
+ CheckMyGoodsCollectionStatus,
|
|
|
+ ApplyJoinCourse
|
|
|
} from '@/api/course';
|
|
|
import { GetMyGoodsBuyInfo } from '@/api/user';
|
|
|
|
|
|
-export default {
|
|
|
- name: 'CourseDetails',
|
|
|
- components: {
|
|
|
- Audit,
|
|
|
- Payment,
|
|
|
- PreviewCourse
|
|
|
- },
|
|
|
- data() {
|
|
|
- const query = this.$route.query;
|
|
|
-
|
|
|
- return {
|
|
|
- goods_id: query.goods_id,
|
|
|
- goods_type: Number(query.goods_type),
|
|
|
- readonly: 'readonly' in query ? query.readonly === 'true' : false,
|
|
|
- // 调用模块
|
|
|
- invok_module: query.invok_module,
|
|
|
- collection: false,
|
|
|
- openList: [],
|
|
|
- timer: null, // 获取倒计时
|
|
|
- backTime: 0,
|
|
|
- auditShow: false,
|
|
|
- loading: false,
|
|
|
- is_buy: false,
|
|
|
- is_free_license: false, // 是否机构免费授权
|
|
|
- CourseData: null,
|
|
|
- isData: false,
|
|
|
- courseContentList: [
|
|
|
- { id: 'pre_task_list', name: 'Key353' },
|
|
|
- { id: 'mid_task_list', name: 'Key354' },
|
|
|
- { id: 'after_task_list', name: 'Key355' }
|
|
|
- ],
|
|
|
- visiblePay: false,
|
|
|
- orderId: '',
|
|
|
- visible: false,
|
|
|
- fileId: '',
|
|
|
- fileType: '',
|
|
|
- previewGroupId: '[]'
|
|
|
- };
|
|
|
- },
|
|
|
- created() {
|
|
|
- // 获取课程详情
|
|
|
- this.loading = true;
|
|
|
- CheckMyGoodsBuyStatus({ goods_type: this.goods_type, goods_id: this.goods_id }).then(
|
|
|
- ({ is_buy, is_free_license }) => {
|
|
|
- this.is_buy = is_buy === 'true';
|
|
|
- this.is_free_license = is_free_license === 'true';
|
|
|
- }
|
|
|
- );
|
|
|
- GetCourseInfoBox({ id: this.goods_id })
|
|
|
- .then((res) => {
|
|
|
- this.CourseData = res;
|
|
|
- this.isData = 'id' in res;
|
|
|
- this.getBackTime();
|
|
|
- this.checkMyGoodsCollectionStatus();
|
|
|
- this.getMyGoodsBuyInfo(this.CourseData.book_list.map(({ book_id }) => book_id));
|
|
|
- this.loading = false;
|
|
|
- })
|
|
|
- .catch(() => {
|
|
|
- this.loading = false;
|
|
|
- });
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- this.$parent.$refs.header.changeLoginNavIndex(this.invok_module);
|
|
|
- },
|
|
|
- beforeDestroy() {
|
|
|
- // 清空定时器
|
|
|
- clearInterval(this.timer);
|
|
|
- },
|
|
|
- // 方法集合
|
|
|
- methods: {
|
|
|
- // 课程任务的打开和关闭
|
|
|
- handleChange(val) {
|
|
|
- this.openList.includes(val) ? this.openList.splice(this.openList.indexOf(val), 1) : this.openList.push(val);
|
|
|
- },
|
|
|
- goBook(book_id, is_buy = false) {
|
|
|
- if (!is_buy) {
|
|
|
- window.location.href = `/GCLS-Book/#/GoodsDetail?goods_id=${book_id}&goods_type=101&invok_module=${
|
|
|
- this.invok_module ? this.invok_module : 'GCLS-Learn'
|
|
|
- }`;
|
|
|
- }
|
|
|
- },
|
|
|
+const $t = inject('$t');
|
|
|
+const route = useRoute();
|
|
|
+const router = useRouter();
|
|
|
+const query = route.query;
|
|
|
+const goods_id = query.goods_id;
|
|
|
+const goods_type = Number(query.goods_type);
|
|
|
+const readonly = 'readonly' in query ? query.readonly === 'true' : false;
|
|
|
+// 调用模块
|
|
|
+const invok_module = query.invok_module;
|
|
|
+let collection = ref(false);
|
|
|
+let openList = ref([]);
|
|
|
+let timer = null; // 获取倒计时
|
|
|
+let backTime = ref(0);
|
|
|
+let auditShow = ref(false);
|
|
|
+let loading = ref(true);
|
|
|
+let isData = ref(false);
|
|
|
+let courseContentList = ref([
|
|
|
+ { id: 'pre_task_list', name: 'Key353' },
|
|
|
+ { id: 'mid_task_list', name: 'Key354' },
|
|
|
+ { id: 'after_task_list', name: 'Key355' }
|
|
|
+]);
|
|
|
+let visiblePay = ref(false);
|
|
|
+let orderId = ref('');
|
|
|
+let visible = ref(false);
|
|
|
+let fileId = ref('');
|
|
|
+let fileType = ref('');
|
|
|
+let previewGroupId = ref('[]');
|
|
|
+
|
|
|
+const changeLoginNavIndex = inject('changeLoginNavIndex');
|
|
|
+changeLoginNavIndex(invok_module);
|
|
|
+
|
|
|
+let orderID = ref(''); // 订单 ID
|
|
|
+let is_buy = ref(false); // 是否购买
|
|
|
+let isFree = ref(false); // 是否机构免费授权
|
|
|
+let isCommon = ref(false); // 是否公开
|
|
|
+let isApplyJoin = ref(false); // 是否已申请加入
|
|
|
+let applyJoinAuditStatus = ref(0); // 申请加入审核状态 0 未审核，1，审核通过，2 审核拒绝
|
|
|
+let applyButtonNameList = ['已申请', '去支付', '重新申请'];
|
|
|
+let buttonName = computed(() => {
|
|
|
+ if (is_buy.value || (isFree.value && isCommon.value)) return $t('Key390');
|
|
|
+ if (!isFree.value && isCommon.value) return '购买';
|
|
|
+ if (isFree.value && !isCommon.value) {
|
|
|
+ if (!isApplyJoin.value) return '申请加入';
|
|
|
+ return applyButtonNameList[applyJoinAuditStatus.value];
|
|
|
+ }
|
|
|
+ if (!isFree.value && !isCommon.value) {
|
|
|
+ if (!isApplyJoin.value) return '申请加入';
|
|
|
+ return applyButtonNameList[applyJoinAuditStatus.value];
|
|
|
+ }
|
|
|
+ return '';
|
|
|
+});
|
|
|
+
|
|
|
+function checkMyGoodsBuyStatus() {
|
|
|
+ return CheckMyGoodsBuyStatus({ goods_type, goods_id }).then(
|
|
|
+ ({ is_buy: buy, price, student_enter_control_type, is_apply_join, apply_join_audit_status, order_id }) => {
|
|
|
+ is_buy.value = buy === 'true';
|
|
|
+ isFree.value = price <= 0;
|
|
|
+ isCommon.value = student_enter_control_type === 0;
|
|
|
+ isApplyJoin.value = is_apply_join === 'true';
|
|
|
+ applyJoinAuditStatus.value = apply_join_audit_status;
|
|
|
+ orderID.value = order_id;
|
|
|
+ }
|
|
|
+ );
|
|
|
+}
|
|
|
+checkMyGoodsBuyStatus();
|
|
|
+
|
|
|
+/**
|
|
|
+ * 处理课程状态
|
|
|
+ */
|
|
|
+function handleCourseStatus() {
|
|
|
+ if (is_buy.value) return router.push('/');
|
|
|
+ if (!backTime.value) return Message.warning($t('Key389'));
|
|
|
+ if (isFree.value && isCommon.value) {
|
|
|
+ applyJoinCourse().then(() => {
|
|
|
+ router.push('/');
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
|
|
|
- checkMyGoodsCollectionStatus() {
|
|
|
- CheckMyGoodsCollectionStatus({ goods_type: this.goods_type, goods_id: this.CourseData.id }).then(
|
|
|
- ({ is_collection }) => {
|
|
|
- this.collection = is_collection === 'true';
|
|
|
- }
|
|
|
- );
|
|
|
- },
|
|
|
-
|
|
|
- // 处理价格
|
|
|
- changePrice(type, item) {
|
|
|
- const str = String(item);
|
|
|
- if (type === '1') {
|
|
|
- return str.includes('.') ? str.split('.')[0] : str;
|
|
|
+ if (!isFree.value && isCommon.value) {
|
|
|
+ applyJoinCourse().then(({ is_audited, order_id }) => {
|
|
|
+ if (is_audited === 'true') {
|
|
|
+ auditedSuccess(order_id);
|
|
|
}
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
|
|
|
- if (type === '2') {
|
|
|
- return str.includes('.') ? `.${str.split('.')[1]}` : '.00';
|
|
|
- }
|
|
|
- },
|
|
|
- // 收藏
|
|
|
- addOrDeleteMyCollection() {
|
|
|
- if (this.collection) {
|
|
|
- CancelMyGoodsCollection({ goods_type: this.goods_type, goods_id_list: [this.CourseData.id] }).then(() => {
|
|
|
- this.$message.success(this.$i18n.t('Key396'));
|
|
|
- this.collection = false;
|
|
|
- });
|
|
|
- } else {
|
|
|
- let goods_person_name_desc = '';
|
|
|
- this.CourseData.teacher_list.forEach((item) => {
|
|
|
- goods_person_name_desc += item.teacher_name;
|
|
|
- });
|
|
|
-
|
|
|
- AddMyCollection({
|
|
|
- goods_id: this.goods_id,
|
|
|
- goods_type: this.goods_type,
|
|
|
- goods_name: this.CourseData.name,
|
|
|
- goods_person_name_desc,
|
|
|
- goods_picture_id: this.CourseData.picture_id,
|
|
|
- goods_price: this.CourseData.price
|
|
|
- }).then(() => {
|
|
|
- this.$message.success(this.$i18n.t('Key397'));
|
|
|
- this.collection = true;
|
|
|
- });
|
|
|
- }
|
|
|
- },
|
|
|
- // 购买需要先加入课程 审核 审核通过之后才能购买课程
|
|
|
- getPurchase() {
|
|
|
- // 购买通道关闭
|
|
|
- if (this.is_buy) {
|
|
|
- return this.$router.push('/');
|
|
|
- }
|
|
|
- if (!this.backTime) {
|
|
|
- this.$message.warning(this.$i18n.t('Key389'));
|
|
|
- return;
|
|
|
- }
|
|
|
- this.auditShow = true;
|
|
|
- },
|
|
|
-
|
|
|
- getMyGoodsBuyInfo(goods_id_list) {
|
|
|
- GetMyGoodsBuyInfo({ goods_type: 101, goods_id_list }).then(({ goods_id_list_buy }) => {
|
|
|
- this.CourseData.book_list.forEach((book) => {
|
|
|
- this.$set(book, 'is_buy', goods_id_list_buy.includes(book.book_id));
|
|
|
- });
|
|
|
+ if (isFree.value && !isCommon.value) {
|
|
|
+ if (!isApplyJoin.value || (isApplyJoin.value && applyJoinAuditStatus.value === 2)) {
|
|
|
+ applyJoinCourse().then(() => {
|
|
|
+ checkMyGoodsBuyStatus();
|
|
|
});
|
|
|
- },
|
|
|
-
|
|
|
- auditedSuccess(orderId) {
|
|
|
- this.orderId = orderId;
|
|
|
- this.auditShow = false;
|
|
|
- this.visiblePay = true;
|
|
|
- },
|
|
|
-
|
|
|
- closePayment() {
|
|
|
- this.visiblePay = false;
|
|
|
- this.$refs.Confirmorder.clearData();
|
|
|
- },
|
|
|
-
|
|
|
- judgePayResult(bool) {
|
|
|
- this.isPayment = false;
|
|
|
- if (bool) {
|
|
|
- this.$message.success(this.$t('Key657'));
|
|
|
- } else {
|
|
|
- this.$message.warning('支付失败');
|
|
|
- }
|
|
|
- CheckMyGoodsBuyStatus({ goods_type: this.goods_type, goods_id: this.goods_id }).then(({ is_buy }) => {
|
|
|
- this.is_buy = is_buy === 'true';
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (applyJoinAuditStatus.value === 0) return Message.warning('请等待审核通过');
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!isFree.value && !isCommon.value) {
|
|
|
+ if (!isApplyJoin.value || (isApplyJoin.value && applyJoinAuditStatus.value === 2)) {
|
|
|
+ applyJoinCourse().then(() => {
|
|
|
+ checkMyGoodsBuyStatus();
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (applyJoinAuditStatus.value === 0) return Message.warning('请等待审核通过');
|
|
|
+ if (applyJoinAuditStatus.value === 1) {
|
|
|
+ checkMyGoodsBuyStatus().then(() => {
|
|
|
+ auditedSuccess(orderID.value);
|
|
|
});
|
|
|
- },
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
- closeaudit() {
|
|
|
- this.auditShow = false;
|
|
|
- },
|
|
|
+/**
|
|
|
+ * 申请加入课程
|
|
|
+ */
|
|
|
+function applyJoinCourse() {
|
|
|
+ return ApplyJoinCourse({ course_id: goods_id });
|
|
|
+}
|
|
|
|
|
|
- preview(fileId, fileType, goods_id, group_id_selected_info) {
|
|
|
- if (fileType === 'courseware') {
|
|
|
- CheckMyGoodsBuyStatus({ goods_id, goods_type: 101 }).then(({ is_buy }) => {
|
|
|
- if (is_buy === 'false') {
|
|
|
- return this.$message.warning('请先购买该课件对应的教材');
|
|
|
- }
|
|
|
- this.fileId = fileId;
|
|
|
- this.fileType = fileType;
|
|
|
- this.previewGroupId = group_id_selected_info ?? '[]';
|
|
|
- this.visible = true;
|
|
|
- });
|
|
|
- }
|
|
|
+let CourseData = ref(null);
|
|
|
+GetCourseInfoBox({ id: goods_id })
|
|
|
+ .then((res) => {
|
|
|
+ CourseData.value = res;
|
|
|
+ isData.value = 'id' in res;
|
|
|
+ getBackTime();
|
|
|
+ checkMyGoodsCollectionStatus();
|
|
|
+ getMyGoodsBuyInfo(CourseData.value.book_list.map(({ book_id }) => book_id));
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ loading.value = false;
|
|
|
+ });
|
|
|
+
|
|
|
+// 课程任务的打开和关闭
|
|
|
+function handleChange(val) {
|
|
|
+ let index = openList.value.indexOf(val);
|
|
|
+ index === -1 ? openList.value.push(val) : openList.value.splice(index, 1);
|
|
|
+}
|
|
|
|
|
|
- if (fileType === 'file') {
|
|
|
- if (this.$store.state.user.user_type !== 'TEACHER' && !this.is_buy) {
|
|
|
- this.$message.warning('请先购买该课程');
|
|
|
- return;
|
|
|
- }
|
|
|
- this.fileId = fileId;
|
|
|
- this.fileType = fileType;
|
|
|
- this.visible = true;
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- dialogClose() {
|
|
|
- this.visible = false;
|
|
|
- this.fileId = '';
|
|
|
- this.fileType = '';
|
|
|
- },
|
|
|
-
|
|
|
- // 获取当前时间到指定时间的倒计时
|
|
|
- getBackTime() {
|
|
|
- const date = new Date(this.CourseData.end_date);
|
|
|
- const targetTime = new Date(date.getFullYear(), date.getMonth(), date.getDate(), 23, 59, 59).getTime();
|
|
|
- // 目标时间戳 - 当前时间戳 = 倒计时
|
|
|
- this.timer = setInterval(() => {
|
|
|
- let backTime = targetTime - new Date().getTime();
|
|
|
- if (backTime > 0) {
|
|
|
- backTime = this.formatduring(backTime);
|
|
|
- this.backTime = backTime;
|
|
|
- } else {
|
|
|
- this.backTime = 0;
|
|
|
- clearInterval(this.timer);
|
|
|
- }
|
|
|
- }, 1000);
|
|
|
- },
|
|
|
- // 倒计时时间戳转换为 天 小时 分钟 秒
|
|
|
- formatduring(mss) {
|
|
|
- const days = parseInt(mss / (1000 * 60 * 60 * 24));
|
|
|
- const hours = parseInt((mss % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
|
|
|
- const minutes = parseInt((mss % (1000 * 60 * 60)) / (1000 * 60));
|
|
|
- const seconds = parseInt((mss % (1000 * 60)) / 1000);
|
|
|
- // 如果到时间了返回false 关闭购买通道 无法购买
|
|
|
- if (days <= 0 && hours <= 0 && minutes <= 0 && seconds <= 0) {
|
|
|
- return false;
|
|
|
+function goBook(book_id, is_buy = false) {
|
|
|
+ if (!is_buy) {
|
|
|
+ window.location.href = `/GCLS-Book/#/GoodsDetail?goods_id=${book_id}&goods_type=101&invok_module=${
|
|
|
+ invok_module || 'GCLS-Learn'
|
|
|
+ }`;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+function checkMyGoodsCollectionStatus() {
|
|
|
+ CheckMyGoodsCollectionStatus({ goods_type, goods_id: CourseData.value.id }).then(({ is_collection }) => {
|
|
|
+ collection.value = is_collection === 'true';
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+// 处理价格
|
|
|
+function changePrice(type, item) {
|
|
|
+ const str = String(item);
|
|
|
+ if (type === '1') {
|
|
|
+ return str.includes('.') ? str.split('.')[0] : str;
|
|
|
+ }
|
|
|
+
|
|
|
+ if (type === '2') {
|
|
|
+ return str.includes('.') ? `.${str.split('.')[1]}` : '.00';
|
|
|
+ }
|
|
|
+}
|
|
|
+// 收藏
|
|
|
+function addOrDeleteMyCollection() {
|
|
|
+ if (collection.value) {
|
|
|
+ CancelMyGoodsCollection({ goods_type, goods_id_list: [CourseData.value.id] }).then(() => {
|
|
|
+ Message.success($t('Key396'));
|
|
|
+ collection.value = false;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ let goods_person_name_desc = '';
|
|
|
+ CourseData.value.teacher_list.forEach((item) => {
|
|
|
+ goods_person_name_desc += item.teacher_name;
|
|
|
+ });
|
|
|
+
|
|
|
+ AddMyCollection({
|
|
|
+ goods_id,
|
|
|
+ goods_type,
|
|
|
+ goods_name: CourseData.value.name,
|
|
|
+ goods_person_name_desc,
|
|
|
+ goods_picture_id: CourseData.value.picture_id,
|
|
|
+ goods_price: CourseData.value.price
|
|
|
+ }).then(() => {
|
|
|
+ Message.success($t('Key397'));
|
|
|
+ collection.value = true;
|
|
|
+ });
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+function getMyGoodsBuyInfo(goods_id_list) {
|
|
|
+ GetMyGoodsBuyInfo({ goods_type: 101, goods_id_list }).then(({ goods_id_list_buy }) => {
|
|
|
+ CourseData.value.book_list.forEach((book) => {
|
|
|
+ book['is_buy'] = goods_id_list_buy.includes(book.book_id);
|
|
|
+ });
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+function auditedSuccess(id) {
|
|
|
+ orderId.value = id;
|
|
|
+ auditShow.value = false;
|
|
|
+ visiblePay.value = true;
|
|
|
+}
|
|
|
+
|
|
|
+let Confirmorder = ref();
|
|
|
+function closePayment() {
|
|
|
+ visiblePay.value = false;
|
|
|
+ Confirmorder.value.clearData();
|
|
|
+}
|
|
|
+
|
|
|
+function judgePayResult(bool) {
|
|
|
+ if (bool) {
|
|
|
+ Message.success($t('Key657'));
|
|
|
+ } else {
|
|
|
+ Message.warning('支付失败');
|
|
|
+ }
|
|
|
+ CheckMyGoodsBuyStatus({ goods_type, goods_id }).then(({ is_buy: buy }) => {
|
|
|
+ is_buy.value = buy === 'true';
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+function closeaudit() {
|
|
|
+ auditShow.value = false;
|
|
|
+}
|
|
|
+
|
|
|
+function preview(fId, fType, goods_id, group_id_selected_info) {
|
|
|
+ if (fileType.value === 'courseware') {
|
|
|
+ CheckMyGoodsBuyStatus({ goods_id, goods_type: 101 }).then(({ is_buy }) => {
|
|
|
+ if (is_buy === 'false') {
|
|
|
+ return Message.warning('请先购买该课件对应的教材');
|
|
|
}
|
|
|
- return {
|
|
|
- days,
|
|
|
- hours,
|
|
|
- minutes,
|
|
|
- seconds
|
|
|
- };
|
|
|
+ fileId.value = fId;
|
|
|
+ fileType.value = fType;
|
|
|
+ previewGroupId.value = group_id_selected_info ?? '[]';
|
|
|
+ visible.value = true;
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ if (fileType.value === 'file') {
|
|
|
+ if (store.state.user.user_type !== 'TEACHER' && !is_buy.value) {
|
|
|
+ Message.warning('请先购买该课程');
|
|
|
+ return;
|
|
|
}
|
|
|
+ fileId.value = fId;
|
|
|
+ fileType.value = fType;
|
|
|
+ visible.value = true;
|
|
|
}
|
|
|
-};
|
|
|
+}
|
|
|
+
|
|
|
+function dialogClose() {
|
|
|
+ visible.value = false;
|
|
|
+ fileId.value = '';
|
|
|
+ fileType.value = '';
|
|
|
+}
|
|
|
+
|
|
|
+// 获取当前时间到指定时间的倒计时
|
|
|
+function getBackTime() {
|
|
|
+ const date = new Date(CourseData.value.end_date);
|
|
|
+ const targetTime = new Date(date.getFullYear(), date.getMonth(), date.getDate(), 23, 59, 59).getTime();
|
|
|
+ // 目标时间戳 - 当前时间戳 = 倒计时
|
|
|
+ timer = setInterval(() => {
|
|
|
+ let diffTime = targetTime - new Date().getTime();
|
|
|
+ if (diffTime > 0) {
|
|
|
+ backTime.value = formatduring(diffTime);
|
|
|
+ } else {
|
|
|
+ backTime.value = 0;
|
|
|
+ clearInterval(timer);
|
|
|
+ }
|
|
|
+ }, 1000);
|
|
|
+}
|
|
|
+// 倒计时时间戳转换为 天 小时 分钟 秒
|
|
|
+function formatduring(mss) {
|
|
|
+ const days = parseInt(mss / (1000 * 60 * 60 * 24));
|
|
|
+ const hours = parseInt((mss % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
|
|
|
+ const minutes = parseInt((mss % (1000 * 60 * 60)) / (1000 * 60));
|
|
|
+ const seconds = parseInt((mss % (1000 * 60)) / 1000);
|
|
|
+ // 如果到时间了返回false 关闭购买通道 无法购买
|
|
|
+ if (days <= 0 && hours <= 0 && minutes <= 0 && seconds <= 0) {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ return {
|
|
|
+ days,
|
|
|
+ hours,
|
|
|
+ minutes,
|
|
|
+ seconds
|
|
|
+ };
|
|
|
+}
|
|
|
+
|
|
|
+onBeforeUnmount(() => {
|
|
|
+ clearInterval(timer);
|
|
|
+});
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
