|
@@ -7,16 +7,18 @@ import pdf3 from '../assets/cognize/goNogo.pdf'
|
|
|
import pdf4 from '../assets/cognize/dtc.pdf'
|
|
|
|
|
|
import { useRoute, useRouter } from 'vue-router';
|
|
|
+import { queryCognizeDetailApi } from '@/api/plan';
|
|
|
const router = useRouter()
|
|
|
const route = useRoute()
|
|
|
|
|
|
|
|
|
|
|
|
const flag = ref<string>('')
|
|
|
-const flagName = ref<string>('')
|
|
|
-const planId = ref<string>('')
|
|
|
const planName = ref<string>('')
|
|
|
-const num = ref<string>('')
|
|
|
+const planId = ref<string>('')
|
|
|
+const type = ref<string>('')
|
|
|
+
|
|
|
+const cognizeDetail = ref<any>({})
|
|
|
|
|
|
// 查看PDF
|
|
|
//刚进入页面就将高度设置为页面需要的
|
|
@@ -29,12 +31,30 @@ onMounted(() => {
|
|
|
flag.value = route.params.flag as string;
|
|
|
planId.value = route.params.planId as string
|
|
|
planName.value = route.params.planName as string
|
|
|
- flagName.value = route.params.flagName as string
|
|
|
- num.value = route.params.num as string
|
|
|
+ type.value = route.params.type as string
|
|
|
+
|
|
|
+ //根据flag 查询认知任务详情
|
|
|
|
|
|
//进到界面开始轮询
|
|
|
+ if (type.value == '1') {
|
|
|
+ queryScaleDetail()
|
|
|
+ }
|
|
|
})
|
|
|
-
|
|
|
+const queryScaleDetail = async () => {
|
|
|
+ //根据flag查询量表详情
|
|
|
+ let res: any = await queryCognizeDetailApi(flag.value)
|
|
|
+ console.log(res)
|
|
|
+ cognizeDetail.value = res.data
|
|
|
+ debugger;
|
|
|
+
|
|
|
+ // scaleName.value = res.data.name;
|
|
|
+ // detail.value = res.data.description;
|
|
|
+ // theory.value = res.data.theory;
|
|
|
+ // //参考文献
|
|
|
+ // console.log(res.data.reference)
|
|
|
+ // reference.value = res.data.reference.split('//');
|
|
|
+ // console.log(reference.value)
|
|
|
+}
|
|
|
const centerDialogVisible = ref<boolean>(false)
|
|
|
const viewPDF = () => {
|
|
|
centerDialogVisible.value = true
|
|
@@ -47,11 +67,11 @@ const requireImg = (name: string) => {
|
|
|
}
|
|
|
|
|
|
const startCog = (val: number) => {
|
|
|
- if (num.value == '3') {
|
|
|
- router.push({ name: 'cognizeGoNoGo', params: { currentType: val } })
|
|
|
- } else if (num.value == '4') {
|
|
|
- router.push({ name: 'cognizeFaceDot', params: { currentType: val } })
|
|
|
- }
|
|
|
+ // if (num.value == '3') {
|
|
|
+ // router.push({ name: 'cognizeGoNoGo', params: { currentType: val } })
|
|
|
+ // } else if (num.value == '4') {
|
|
|
+ // router.push({ name: 'cognizeFaceDot', params: { currentType: val } })
|
|
|
+ // }
|
|
|
|
|
|
}
|
|
|
|
|
@@ -84,32 +104,33 @@ onUnmounted(() => {
|
|
|
<div class="kply_inner">
|
|
|
<div style="padding :20px 40px">
|
|
|
<div class="cognize_title">
|
|
|
- {{ flagName }}
|
|
|
+ {{ cognizeDetail.name }}
|
|
|
</div>
|
|
|
<div class="cognize_img_out">
|
|
|
- <img src="../assets/cognize/c1.png" v-show="num == '3'" width=" 100px"
|
|
|
- style="margin-right: 20px;" />
|
|
|
- <img src="../assets/cognize/c2.png" v-show="num == '4'" width="100px"
|
|
|
- style="margin-right: 20px;" />
|
|
|
+ <!-- <img src="../assets/kepu/czscz_default.png" width=" 100px" style="margin-right: 20px;" /> -->
|
|
|
+ <!-- <img src="../assets/cognize/c2.png" v-show="num == '4'" width="100px"
|
|
|
+ style="margin-right: 20px;" /> -->
|
|
|
<div class="cognize_des">
|
|
|
- 测评介绍:对于患有抑郁症的人群并不在少数,
|
|
|
- 每一个人或多或少都会有纠结的时候,
|
|
|
- 所以为了预防和及时了解自己的情况,
|
|
|
- 医学界给出来很多测量方式,像最常见的自我测量答题表,
|
|
|
- 专业的他测量表,以及日常行为的观察,就变得极其普遍和有效。(示例)
|
|
|
+ <span class="cpjs">测评介绍:</span>
|
|
|
+ <span class="cpjs_detail">{{ cognizeDetail.testExplain }}</span>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
- <div class="cognize_title2"> {{ flagName }}演示视频:</div>
|
|
|
- <div class="cognize_video" v-show="num == '3'">
|
|
|
- <!-- poster="../assets/cognize/bg_ty.png" -->
|
|
|
- <video width="60%" height="100%" controls style="border-radius: 20px;">
|
|
|
- <source src="../assets/cognize/goNogo.mp4" type="video/mp4">
|
|
|
- <!-- <source src="movie.ogg" type="video/ogg"> -->
|
|
|
- 您的浏览器不支持 video 标签。
|
|
|
- </video>
|
|
|
+ <div class="cpll">
|
|
|
+ <span class="cpll_title">理论:</span>
|
|
|
+ <span class="cpll_detail">{{ cognizeDetail.theory }}</span>
|
|
|
</div>
|
|
|
- <div class="cognize_video" v-show="num == '4'">
|
|
|
+ <div class="czsm">
|
|
|
+ <span class="czsm_title">操作说明:</span>
|
|
|
+ <span class="czsm_detail">
|
|
|
+ {{ cognizeDetail.description }}
|
|
|
+ {{ cognizeDetail.testDescription }}
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="cognize_title2"> {{ cognizeDetail.name }}演示视频:</div>
|
|
|
+
|
|
|
+ <div class="cognize_video">
|
|
|
<!-- poster="../assets/cognize/bg_ty.png" -->
|
|
|
<video width="60%" height="100%" controls style="border-radius: 40px;">
|
|
|
<source src="../assets/cognize/dtc.mp4" type="video/mp4">
|
|
@@ -131,6 +152,14 @@ onUnmounted(() => {
|
|
|
<div @click="viewPDF" class="view">预览</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div class="reference_cla" v-if="cognizeDetail.reference">
|
|
|
+ <div class="reference_title">参考文献:</div>
|
|
|
+ <div class="reference_detail" v-for="item, index in cognizeDetail.reference.split('//')"
|
|
|
+ :key="item">
|
|
|
+ <div>[{{ index + 1 }}] </div>
|
|
|
+ <div> {{ item }}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
|
|
|
<div class="scale_button">
|
|
|
<el-row>
|
|
@@ -153,11 +182,10 @@ onUnmounted(() => {
|
|
|
<!-- <embed width="100%" height=500px v-show="num == '3'" src='../assets/cognize/goNogo.pdf'>
|
|
|
|
|
|
</embed> -->
|
|
|
- <embed width="100%" height=600px v-show="num == '3'" :src="requireImg('goNogo')">
|
|
|
- </embed>
|
|
|
+
|
|
|
<!-- <embed width="100%" height=500px v-show="num == '3'" :src="pdf3">
|
|
|
</embed> -->
|
|
|
- <embed width="100%" height=600px v-show="num == '4'" :src="requireImg('dtc')">
|
|
|
+ <embed width="100%" height=600px :src="requireImg('dtc')">
|
|
|
</embed>
|
|
|
<!-- <embed width="100%" height=500px v-show="num == '4'" :src="pdf4">
|
|
|
</embed> -->
|
|
@@ -217,6 +245,58 @@ onUnmounted(() => {
|
|
|
background-color: #ffffff;
|
|
|
border-radius: 40px;
|
|
|
|
|
|
+ .reference_cla {
|
|
|
+ margin-top: 10px;
|
|
|
+
|
|
|
+ .reference_title {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #a9a9a9;
|
|
|
+ line-height: 24px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .reference_detail {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #a9a9a9;
|
|
|
+ line-height: 24px;
|
|
|
+ letter-spacing: 3px;
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .cpll {
|
|
|
+ margin-top: 10px;
|
|
|
+
|
|
|
+ .cpll_title {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #48D68E;
|
|
|
+ font-weight: 700;
|
|
|
+ }
|
|
|
+
|
|
|
+ .cpll_detail {
|
|
|
+ font-size: 14px;
|
|
|
+ letter-spacing: 3px;
|
|
|
+ line-height: 24px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .czsm {
|
|
|
+ margin-top: 10px;
|
|
|
+
|
|
|
+ .czsm_title {
|
|
|
+ color: #48D68E;
|
|
|
+ font-weight: 700;
|
|
|
+ line-height: 24px;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .czsm_detail {
|
|
|
+ line-height: 24px;
|
|
|
+ font-size: 14px;
|
|
|
+ letter-spacing: 3px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
.cognize_title {
|
|
|
|
|
|
font-size: 20px;
|
|
@@ -241,6 +321,19 @@ onUnmounted(() => {
|
|
|
letter-spacing: 2px;
|
|
|
line-height: 20px;
|
|
|
font-size: 16px;
|
|
|
+
|
|
|
+ .cpjs {
|
|
|
+ color: #48D68E;
|
|
|
+ font-weight: 700;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 24px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .cpjs_detail {
|
|
|
+ line-height: 24px;
|
|
|
+ letter-spacing: 3px;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
|