|
|
@@ -1,110 +1,140 @@
|
|
|
<template>
|
|
|
- <Container
|
|
|
- class="body-content"
|
|
|
- title="首页"
|
|
|
- bgColor="#F8F8F8"
|
|
|
- :showBack="false"
|
|
|
- >
|
|
|
- <view class="home">
|
|
|
- <!-- 倒计时 -->
|
|
|
- <view class="time" v-if="(splitDays != '') & (splitDays != null)">
|
|
|
- <view>距离考试倒计时</view>
|
|
|
- <!-- 将天数拆分为单个数字显示 -->
|
|
|
- <view
|
|
|
- class="exam-countdown-tiem-item"
|
|
|
- v-for="(digit, index) in splitDays"
|
|
|
- :key="index"
|
|
|
- >{{ digit }}</view
|
|
|
+ <template>
|
|
|
+ <Container
|
|
|
+ class="body-content"
|
|
|
+ title="首页"
|
|
|
+ bgColor="#F8F8F8"
|
|
|
+ :showBack="false"
|
|
|
+ >
|
|
|
+ <view class="home">
|
|
|
+ <!-- 倒计时 -->
|
|
|
+ <view class="time" v-if="(splitDays != '') & (splitDays != null)">
|
|
|
+ <view>距离2025年考试倒计时</view>
|
|
|
+ <!-- 将天数拆分为单个数字显示 -->
|
|
|
+ <view
|
|
|
+ class="exam-countdown-tiem-item"
|
|
|
+ v-for="(digit, index) in splitDays"
|
|
|
+ :key="index"
|
|
|
+ >{{ digit }}</view
|
|
|
+ >
|
|
|
+ <view>天</view>
|
|
|
+ </view>
|
|
|
+ <!-- 轮播图 -->
|
|
|
+ <swiper
|
|
|
+ class="swiper"
|
|
|
+ :style="{
|
|
|
+ height: imgHeight,
|
|
|
+ }"
|
|
|
+ circular
|
|
|
+ autoplay
|
|
|
>
|
|
|
- <view>天</view>
|
|
|
- </view>
|
|
|
- <!-- 轮播图 -->
|
|
|
- <swiper class="swiper" circular autoplay>
|
|
|
- <swiper-item v-for="(item, index) in banner_list" :key="index">
|
|
|
- <view class="swiper-item"
|
|
|
- ><image
|
|
|
- class="swiper-item-image"
|
|
|
- :src="item.image_url"
|
|
|
- mode="aspectFill"
|
|
|
- @load="onImageLoad($event, item, index)"
|
|
|
- @click="goto_notice_list(item.link_url)"
|
|
|
- ></image
|
|
|
- ></view>
|
|
|
- </swiper-item>
|
|
|
- </swiper>
|
|
|
- <!-- 公告 -->
|
|
|
- <view class="notice" v-if="notice_list != '' && notice_list != null">
|
|
|
- <view class="title-lable">公告</view>
|
|
|
- <view class="notice-title">{{ notice_list[0]["title"] }}</view>
|
|
|
- <navigator url="/pages/notice/list">
|
|
|
- <view class="notice-more">{{ "更多 >" }}</view>
|
|
|
- </navigator>
|
|
|
- </view>
|
|
|
- <!-- 2025新大纲 -->
|
|
|
- <view class="new_outline">
|
|
|
- <uni-section title="基础用法" type="line">
|
|
|
- <view class="p-20">
|
|
|
- <uni-segmented-control
|
|
|
- :flex="false"
|
|
|
- :current="current"
|
|
|
- :values="list.map((item) => item.name)"
|
|
|
- style-type="text"
|
|
|
- @clickItem="(e) => (current = e.currentIndex)"
|
|
|
- />
|
|
|
- <!-- 执业药师 -->
|
|
|
- <template v-for="(item, index) in list" :key="item.id">
|
|
|
- <view v-if="current === index" class="grid">
|
|
|
- <view
|
|
|
- v-for="i in item?.children"
|
|
|
- :key="i.id"
|
|
|
- class="flex"
|
|
|
- @click="clickClass(i)"
|
|
|
- >
|
|
|
- <image :src="i.chapter_image_url" class="img_small"></image>
|
|
|
- <view>{{ i.name }}</view>
|
|
|
+ <swiper-item v-for="(item, index) in banner_list" :key="index">
|
|
|
+ <view class="swiper-item"
|
|
|
+ ><image
|
|
|
+ class="swiper-item-image"
|
|
|
+ :src="item.image_url"
|
|
|
+ mode="aspectFill"
|
|
|
+ @load="onImageLoad($event, item, index)"
|
|
|
+ @click="goto_notice_list(item.link_url)"
|
|
|
+ ></image
|
|
|
+ ></view>
|
|
|
+ </swiper-item>
|
|
|
+ </swiper>
|
|
|
+ <!-- 公告 -->
|
|
|
+ <view class="notice" v-if="notice_list != '' && notice_list != null">
|
|
|
+ <view class="title-lable">公告</view>
|
|
|
+ <view class="notice-title">{{ notice_list[0]["title"] }}</view>
|
|
|
+ <navigator url="/pages/notice/list">
|
|
|
+ <view class="notice-more">{{ "更多 >" }}</view>
|
|
|
+ </navigator>
|
|
|
+ </view>
|
|
|
+ <!-- 2025新大纲 -->
|
|
|
+ <view class="new_outline">
|
|
|
+ <uni-section title="基础用法" type="line">
|
|
|
+ <view class="p-20">
|
|
|
+ <uni-segmented-control
|
|
|
+ :flex="false"
|
|
|
+ :current="current"
|
|
|
+ :values="list.map((item) => item.name)"
|
|
|
+ style-type="text"
|
|
|
+ @clickItem="(e) => (current = e.currentIndex)"
|
|
|
+ />
|
|
|
+ <!-- 执业药师 -->
|
|
|
+ <template v-for="(item, index) in list" :key="item.id">
|
|
|
+ <view v-if="current === index" class="grid">
|
|
|
+ <view
|
|
|
+ v-for="i in item?.children"
|
|
|
+ :key="i.id"
|
|
|
+ class="flex"
|
|
|
+ @click="clickClass(i)"
|
|
|
+ >
|
|
|
+ <image :src="i.chapter_image_url" class="img_small"></image>
|
|
|
+ <view>{{ i.name }}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </template>
|
|
|
+ </view>
|
|
|
+ </uni-section>
|
|
|
+ </view>
|
|
|
+ <view class="p-20">
|
|
|
+ <uni-section title="往年真题" type="line">
|
|
|
+ <!-- 往年真题 -->
|
|
|
+ <view class="grid-3">
|
|
|
+ <view
|
|
|
+ v-for="item in rightList"
|
|
|
+ :key="item.originName"
|
|
|
+ class="flex"
|
|
|
+ @click="
|
|
|
+ toReal({
|
|
|
+ title: item.name + '真题',
|
|
|
+ origin: item.originName,
|
|
|
+ })
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <view class="bg-red">
|
|
|
+ <view class="text">{{ item.name }}真题</view>
|
|
|
</view>
|
|
|
- </view>
|
|
|
- </template>
|
|
|
- </view>
|
|
|
- </uni-section>
|
|
|
- </view>
|
|
|
- <view class="p-20">
|
|
|
- <uni-section title="往年真题" type="line">
|
|
|
- <!-- 往年真题 -->
|
|
|
- <view class="grid-3">
|
|
|
- <view
|
|
|
- v-for="item in rightList"
|
|
|
- :key="item.originName"
|
|
|
- class="flex"
|
|
|
- @click="
|
|
|
- toReal({
|
|
|
- title: item.name + '真题',
|
|
|
- origin: item.originName,
|
|
|
- })
|
|
|
- "
|
|
|
- >
|
|
|
- <view class="bg-red">
|
|
|
- <view class="text">{{ item.name }}真题</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- </view>
|
|
|
- </uni-section>
|
|
|
+ </uni-section>
|
|
|
+ </view>
|
|
|
+ <!-- #ifdef MP-WEIXIN -->
|
|
|
+ <official-account @load="onload"></official-account>
|
|
|
+ <!-- #endif -->
|
|
|
</view>
|
|
|
- <!-- #ifdef MP-WEIXIN -->
|
|
|
- <official-account @load="onload"></official-account>
|
|
|
- <!-- #endif -->
|
|
|
+ </Container>
|
|
|
+ <view class="service">
|
|
|
+ <CustomerService>联系客服</CustomerService>
|
|
|
</view>
|
|
|
- </Container>
|
|
|
- <view class="service">
|
|
|
- <CustomerService>联系客服</CustomerService>
|
|
|
- </view>
|
|
|
+ </template>
|
|
|
+ <Modal title="ces" :footer="false" v-model:open="showModal">
|
|
|
+ <template #custom>
|
|
|
+ <view class="mo">
|
|
|
+ <uni-icons
|
|
|
+ type="closeempty"
|
|
|
+ class="icons"
|
|
|
+ color="#fff"
|
|
|
+ @click="showModal = false"
|
|
|
+ ></uni-icons>
|
|
|
+ <div class="bgt">
|
|
|
+ <span>恭喜您获得7天会员</span>
|
|
|
+ <span>可以免费学习所有课程以及练习题库</span>
|
|
|
+ <span style="margin-top: 71rpx">戳下方还可以</span>
|
|
|
+ <span>添加专属助教老师为您答疑解惑</span>
|
|
|
+ <span>限时领取《药品速记口诀》</span>
|
|
|
+ <span class="fixed" @click="receive"></span>
|
|
|
+ </div>
|
|
|
+ </view>
|
|
|
+ </template>
|
|
|
+ </Modal>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
import { ref, onMounted, computed, onBeforeUnmount } from "vue";
|
|
|
|
|
|
import Container from "../../components/Container/Container.vue";
|
|
|
-import CustomerService from '../../components/CustomerService/CustomerService.vue';
|
|
|
+import CustomerService from "../../components/CustomerService/CustomerService.vue";
|
|
|
+import Modal from "../../components/Modal/Modal.vue";
|
|
|
import { router, getRoute } from "../../utils/router";
|
|
|
import { request } from "../../utils/request";
|
|
|
import { arrayToTree } from "../../utils";
|
|
|
@@ -115,11 +145,26 @@ const banner_list = ref([]);
|
|
|
const notice_list = ref([]);
|
|
|
const imgHeight = ref("auto"); // 初始高度
|
|
|
const rightList = ref([]);
|
|
|
+const showModal = ref(false);
|
|
|
|
|
|
const days = ref("000"); // 默认值设为100，确保有3位数
|
|
|
let timer = null;
|
|
|
const exam_time = ref(""); //考试时间
|
|
|
|
|
|
+const isLogin = () => {
|
|
|
+ const userInfo = uni.getStorageSync("userLogin");
|
|
|
+ return !!userInfo?.is_register;
|
|
|
+};
|
|
|
+const receive = () => {
|
|
|
+ if (!isLogin()) {
|
|
|
+ router.push("/pages/login/index");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ showModal.value = false;
|
|
|
+ setTimeout(() => {
|
|
|
+ router.push("/pages/contant/sub");
|
|
|
+ }, 0);
|
|
|
+};
|
|
|
// 将天数拆分为单个数字数组
|
|
|
const splitDays = computed(() => {
|
|
|
// 将数字转为字符串，然后拆分为字符数组
|
|
|
@@ -156,6 +201,7 @@ const toReal = (item) => {
|
|
|
params: item,
|
|
|
});
|
|
|
};
|
|
|
+
|
|
|
const onImageLoad = (e, item, index) => {
|
|
|
const { width, height } = e.detail;
|
|
|
const ratio = height / width;
|
|
|
@@ -163,19 +209,22 @@ const onImageLoad = (e, item, index) => {
|
|
|
const imgHeightValue = systemInfo.windowWidth * ratio;
|
|
|
imgHeight.value = imgHeightValue + "px";
|
|
|
};
|
|
|
+
|
|
|
onBeforeUnmount(() => {
|
|
|
if (timer) clearInterval(timer);
|
|
|
});
|
|
|
+
|
|
|
const goto_notice_list = (link_url) => {
|
|
|
uni.navigateTo({
|
|
|
url: link_url,
|
|
|
});
|
|
|
};
|
|
|
+
|
|
|
onMounted(async () => {
|
|
|
- const params = getRoute().params
|
|
|
+ const params = getRoute().params;
|
|
|
if (params.scene) {
|
|
|
- const p = params.scene.split('=')
|
|
|
- const value = p[1]
|
|
|
+ const p = params.scene.split("=");
|
|
|
+ const value = p[1];
|
|
|
uni.setStorageSync("share_uid", value);
|
|
|
}
|
|
|
const res = await request(
|
|
|
@@ -240,6 +289,10 @@ onMounted(async () => {
|
|
|
return newItem;
|
|
|
});
|
|
|
|
|
|
+ if (!isLogin()) {
|
|
|
+ showModal.value = true;
|
|
|
+ }
|
|
|
+
|
|
|
calculateDays();
|
|
|
timer = setInterval(() => {
|
|
|
calculateDays();
|
|
|
@@ -253,14 +306,53 @@ onMounted(async () => {
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
@import "@/uni.scss";
|
|
|
+.mo {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: flex-end;
|
|
|
+ width: 658rpx;
|
|
|
+
|
|
|
+ .icons {
|
|
|
+ background: #8a8a8b;
|
|
|
+ width: 48rpx;
|
|
|
+ height: 48rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ }
|
|
|
+ .bgt {
|
|
|
+ width: 658rpx;
|
|
|
+ height: 766rpx;
|
|
|
+ position: relative;
|
|
|
+ background: url(https://openwork-oss.oss-cn-shenzhen.aliyuncs.com/uploads/question/2025/06/p3qrAPK10tNFOfwy27yryTtwEOsE8x40V0wFvbOW.png);
|
|
|
+ background-size: 100% 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ font-weight: 600;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #8b3700;
|
|
|
+ gap: 16rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-top: 161rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .fixed {
|
|
|
+ position: absolute;
|
|
|
+ width: 348rpx;
|
|
|
+ height: 86rpx;
|
|
|
+ bottom: 30rpx;
|
|
|
+ }
|
|
|
+}
|
|
|
.service {
|
|
|
- position: absolute;
|
|
|
- bottom: 20%;
|
|
|
- right: 5%;
|
|
|
- color: $uni-primary;
|
|
|
- font-size: 28rpx;
|
|
|
- margin-bottom: 40rpx;
|
|
|
- text-align: right;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 20%;
|
|
|
+ right: 5%;
|
|
|
+ color: $uni-primary;
|
|
|
+ font-size: 28rpx;
|
|
|
+ margin-bottom: 40rpx;
|
|
|
+ text-align: right;
|
|
|
}
|
|
|
.img_small {
|
|
|
width: 112rpx;
|
|
|
@@ -314,7 +406,6 @@ onMounted(async () => {
|
|
|
|
|
|
.swiper {
|
|
|
width: 100%;
|
|
|
- height: v-bind(imgHeight);
|
|
|
/* 关键修复样式 */
|
|
|
overflow: hidden;
|
|
|
transform-style: preserve-3d;
|
