Skip to content

P
pica.cloud.web-app-learning-report
提交 bbc4f70e 编写于 作者: guangjun.yang's avatar guangjun.yang
浏览文件
操作

从搜索（SSR）版本中新建的项目

上级
显示空白字符变更
内嵌 并排
正在显示 包含 7592 行增加 和 0 行删除
README.md 0 → 100644
浏览文件 @ bbc4f70e
# nuxt-ssr
> nuxt ssr layout
## Build Setup
``` bash
# install dependencies
$ npm run install
# serve with hot reload at localhost:3000
$ npm run dev
# build for production and launch server
# 有环境变量 非本地打包请自行带上ENV => dev, test, uat, prod
$ ENV=上一行的变量 npm run build // eg: ENV=dev npm run build
$ npm run start // 对于 start 命令，可以根据需求自行 更改PORT (有部署冲突的时候会改)
# generate static project // 暂时用不到
$ npm run generate
```
\ No newline at end of file
assets/images/sousuo/icon-voice.svg 0 → 100644
浏览文件 @ bbc4f70e
<?xml version="1.0" encoding="UTF-8"?>
<svg width="50px" height="50px" viewBox="0 0 50 50" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 55.2 (78181) - https://sketchapp.com -->
<title>编组</title>
<desc>Created with Sketch.</desc>
<g id="页面1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="切图" transform="translate(-78.000000, -16.000000)">
<g id="语音-搜索" transform="translate(78.000000, 16.000000)">
<rect id="矩形" x="0" y="0" width="50" height="50"></rect>
<path d="M26.0937574,38.0758069 L26.0937574,40.3122959 L27.1877041,40.3122959 C27.7920979,40.3122959 28.2815561,40.8016595 28.2815088,41.406148 C28.2815088,42.0106364 27.7920979,42.5 27.1876567,42.5 L22.8122486,42.5 C22.2077602,42.5 21.7187278,42.0106364 21.7187278,41.406148 C21.7187278,40.8016595 22.2077602,40.3122959 22.8122959,40.3122959 L23.906148,40.3122959 L23.906148,38.0758069 C18.5061615,37.58862 13.9346199,33.5296279 12.9688579,28.2810592 L15.156562,28.2810592 C16.1517085,32.6631865 20.3161726,35.9373137 25.0000946,35.9372664 C29.6840639,35.9372664 33.8483861,32.6631865 34.8435326,28.2810592 L37.0311421,28.2810592 C36.0653801,33.5295806 31.4942171,37.5886673 26.093852,38.0758069 L26.0937574,38.0758069 Z M25,33.7499409 C20.7714199,33.7499409 17.3438402,30.3223612 17.3438402,26.0936864 L17.3438402,15.156491 C17.3438402,10.9285734 20.7712779,7.5 25,7.5 C29.2286274,7.5 32.6561598,10.9285734 32.6561598,15.156491 L32.6561598,26.0937811 C32.6561598,30.3223612 29.2286274,33.7499409 25,33.7499409 L25,33.7499409 Z" id="形状" fill="#676869" fill-rule="nonzero"></path>
</g>
</g>
</g>
</svg>
\ No newline at end of file
assets/style/common.scss 0 → 100644
浏览文件 @ bbc4f70e
@function px2rem($px){
$rem: 37.5px;
@return ($px / $rem) + rem;
}
img {
-webkit-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
}
body, div, span, header, footer, nav, section, aside, article, ul, dl, dt, dd, li, a, p, h1, h2, h3, h4,h5, h6, i, b, textarea, button, input, select, figure, figcaption, {
padding: 0;
margin: 0;
list-style: none;
font-style: normal;
text-decoration: none;
border: none;
color: #333;
font-weight: normal;
font-family: "PingFangSC-Regular","-apple-system-font","Source Han Sans","Helvetica Neue","sans-serif";
box-sizing: border-box;
-webkit-tap-highlight-color:transparent;
-webkit-font-smoothing: antialiased;
&:hover{
outline: none;
}
}
/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
::-webkit-scrollbar
{
width: 0px;
height: 0px;
display: none;
}
/*定义滚动条轨道 内阴影+圆角*/
::-webkit-scrollbar-track
{
// -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,0);
border-radius: 0;
background-color: #fff;
}
/*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb
{
border-radius: 0;
// -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
background-color: #fff;
}
input[type="button"], input[type="submit"], input[type="search"], input[type="reset"] {
-webkit-appearance: none;
}
textarea { -webkit-appearance: none;}
html,body{
height: 100%;
width: 100%;
background-color: #fff;
}
.clear:after{
content: '';
display: block;
clear: both;
}
.clear{
zoom:1;
}
.back_img{
background-repeat: no-repeat;
background-size: 100% 100%;
}
.margin{
margin: 0 auto;
}
.left{
float: left;
}
.right{
float: right;
}
.hide{
display: none;
}
.show{
display: block;
}
.ellipsis{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.paddingTop{
padding-top: 1.95rem;
}
@keyframes backOpacity{
0% { opacity: 1 }
25% { opacity: .5 }
50% { opacity: 1 }
75% { opacity: .5 }
100% { opacity: 1 }
}
.animation_opactiy{
animation: backOpacity 2s ease-in-out infinite;
}
div.van-search {
padding: 0 px2rem(5px) 0 px2rem(5px);
background: #F0F1F2!important;
border-radius: 0.8rem;
position: relative;
.van-search__content--square {
/*padding: 0.02667rem 0.24667rem 0 0.24rem;*/
border-radius: 0.8rem;
background: #F0F1F2!important;
/*width: 85%;*/
height: 100%;
div.van-cell {
padding: 0;
div.van-cell__value {
color: red;
.van-field__body {
height: 100%;
.van-field__control {
//background: #f6f6f6;
font-size: 13px;
color: #666;
/* padding-left: 0.4rem;*/
line-height: .45rem;
/*margin-top: 4px;*/
/*padding: 0 0 4px 0.4rem;*/
}
}
}
}
}
}
.search-black,.search-voice {
width: px2rem(25px);
height: px2rem(25px);
margin-top: px2rem(4px);
}
.van-search__action {
/*position: absolute;
height: 100%;
right: px2rem(5px);
bottom: 0;*/
height: 100%;
}
.voice-container {
height: 100%;
display: flex;
align-items: center;
}
.voice-container>span {
display: inline-block;
height: px2rem(18px);
width: px2rem(1px);
background: #979797;
// margin-bottom: px2rem(2px);
margin-left: px2rem(8px);
margin-right: px2rem(5px);
}
.voice-search {
display: inline-block;
vertical-align: center;
width: px2rem(25px);
height: px2rem(25px);
//margin-top: px2rem(2px);
}
/*
.van-field__left-icon .van-icon{
!*display: none;*!
!*top: .06rem;*!
}
*/
.van-icon-clear {}
.search-container {
div {
font-family: "PingFangSC", "Microsoft Yahei";
}
}
div.van-search .van-search__content--square div.van-cell div.van-cell__value .van-field__body .van-field__control {
// line-height: 0.5rem;
/*padding-top: 2px;*/
height: px2rem(30px);
}
assets/style/global.scss 0 → 100644
浏览文件 @ bbc4f70e
@import './common.scss';
//定位
.relative{
position: relative;
}
.flex{
display: flex;
}
.space-between{
display: flex;
justify-content: space-between;
}
.flex-start{
display: flex;
justify-content: flex-start;
}
.flex-end{
display: flex;
justify-content: flex-end;
}
.textLeft{
float: left;
}
.center{
text-align: center;
}
.line20{
margin-top: px2rem(10px);
}
.mb42{
margin-bottom: px2rem(21px);
}
.marginLR40{
margin: 0 px2rem(20px);
}
.fs10{
font-size: px2rem(10px);
}
.fs11{
font-size: px2rem(11px);
}
.fs13{
font-size: px2rem(13px);
}
.fs14{
font-size: px2rem(14px);
}
.fs22{
font-size: px2rem(11px);
}
.fs24{
font-size: px2rem(12px);
}
.fs26{
font-size: px2rem(13px);
}
.fs28{
font-size: px2rem(14px);
}
.fs32{
font-size: px2rem(16px);
}
.fs30{
font-size: px2rem(15px);
}
.fs50{
font-size: px2rem(25px);
}
.fw{
font-weight: 600;
}
//背景颜色
.bgWhite{
background-color: #fff;
}
//字体颜色
.gray{
color: RGBA(177, 181, 184, 1);
}
.white{
color: #fff;
}
.fs30{
font-size: px2rem(15px);
}
\ No newline at end of file
assets/style/mixin copy.scss 0 → 100644
浏览文件 @ bbc4f70e
@import '@/assets/style/mixin';
$blue: #3190e8;
$bc: #e4e4e4;
$fc:#fff;
// 背景图片地址和大小
@mixin bis($url) {
background-image: url($url);
background-repeat: no-repeat;
background-size: 100% 100%;
}
@mixin borderRadius($radius) {
-webkit-border-radius: $radius;
-moz-border-radius: $radius;
-ms-border-radius: $radius;
-o-border-radius: $radius;
border-radius: $radius;
}
//定位全屏
@mixin allcover{
position:absolute;
top:0;
right:0;
}
//定位上下左右居中
@mixin center {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
//定位上下居中
@mixin ct {
position: absolute;
top: 50%;
transform: translateY(-50%);
}
//定位左右居中
@mixin cl {
position: absolute;
left: 50%;
transform: translateX(-50%);
}
//宽高
@mixin wh($width, $height){
width: $width;
height: $height;
}
//字体大小、行高、字体
@mixin font($size, $line-height, $family: 'Microsoft YaHei') {
font: #{$size}/#{$line-height} $family;
}
//字体大小，颜色
@mixin sc($size, $color){
font-size: $size;
color: $color;
}
//flex 布局和 子元素 对其方式
@mixin fj($type: space-between){
display: flex;
justify-content: $type;
}
@function px2rem($px){
$rem: 37.5px;
@return ($px / $rem) + rem;
}
\ No newline at end of file
assets/style/mixin.scss 0 → 100644
浏览文件 @ bbc4f70e
$blue: #3190e8;
$bc: #e4e4e4;
$fc:#fff;
// 背景图片地址和大小
@mixin bis($url) {
background-image: url($url);
background-repeat: no-repeat;
background-size: 100% 100%;
}
@mixin borderRadius($radius) {
-webkit-border-radius: $radius;
-moz-border-radius: $radius;
-ms-border-radius: $radius;
-o-border-radius: $radius;
border-radius: $radius;
}
//定位全屏
@mixin allcover{
position:absolute;
top:0;
right:0;
}
//定位上下左右居中
@mixin center {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
//定位上下居中
@mixin ct {
position: absolute;
top: 50%;
transform: translateY(-50%);
}
//定位左右居中
@mixin cl {
position: absolute;
left: 50%;
transform: translateX(-50%);
}
//宽高
@mixin wh($width, $height){
width: $width;
height: $height;
}
//字体大小、行高、字体
@mixin font($size, $line-height, $family: 'Microsoft YaHei') {
font: #{$size}/#{$line-height} $family;
}
//字体大小，颜色
@mixin sc($size, $color){
font-size: $size;
color: $color;
}
//flex 布局和 子元素 对其方式
@mixin fj($type: space-between){
display: flex;
justify-content: $type;
}
@function px2rem($px){
$rem: 37.5px;
@return ($px / $rem) + rem;
}
\ No newline at end of file
assets/style/swiper.min.css 0 → 100644
浏览文件 @ bbc4f70e
/**
* Swiper 3.4.1
* Most modern mobile touch slider and framework with hardware accelerated transitions
*
* http://www.idangero.us/swiper/
*
* Copyright 2016, Vladimir Kharlampidi
* The iDangero.us
* http://www.idangero.us/
*
* Licensed under MIT
*
* Released on: December 13, 2016
*/
.swiper-container{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;z-index:1}.swiper-container-no-flexbox .swiper-slide{float:left}.swiper-container-vertical>.swiper-wrapper{-webkit-box-orient:vertical;-moz-box-orient:vertical;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;-o-transition-property:-o-transform;-ms-transition-property:-ms-transform;transition-property:transform;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-o-transform:translate(0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.swiper-container-multirow>.swiper-wrapper{-webkit-box-lines:multiple;-moz-box-lines:multiple;-ms-flex-wrap:wrap;-webkit-flex-wrap:wrap;flex-wrap:wrap}.swiper-container-free-mode>.swiper-wrapper{-webkit-transition-timing-function:ease-out;-moz-transition-timing-function:ease-out;-ms-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto}.swiper-slide{-webkit-flex-shrink:0;-ms-flex:0 0 auto;flex-shrink:0;width:100%;height:100%;position:relative}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{-webkit-box-align:start;-ms-flex-align:start;-webkit-align-items:flex-start;align-items:flex-start;-webkit-transition-property:-webkit-transform,height;-moz-transition-property:-moz-transform;-o-transition-property:-o-transform;-ms-transition-property:-ms-transform;transition-property:transform,height}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-wp8-horizontal{-ms-touch-action:pan-y;touch-action:pan-y}.swiper-wp8-vertical{-ms-touch-action:pan-x;touch-action:pan-x}.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:27px;height:44px;margin-top:-22px;z-index:10;cursor:pointer;-moz-background-size:27px 44px;-webkit-background-size:27px 44px;background-size:27px 44px;background-position:center;background-repeat:no-repeat}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-prev,.swiper-container-rtl .swiper-button-next{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");left:10px;right:auto}.swiper-button-prev.swiper-button-black,.swiper-container-rtl .swiper-button-next.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")}.swiper-button-prev.swiper-button-white,.swiper-container-rtl .swiper-button-next.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")}.swiper-button-next,.swiper-container-rtl .swiper-button-prev{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");right:10px;left:auto}.swiper-button-next.swiper-button-black,.swiper-container-rtl .swiper-button-prev.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")}.swiper-button-next.swiper-button-white,.swiper-container-rtl .swiper-button-prev.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")}.swiper-pagination{position:absolute;text-align:center;-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s;transition:.3s;-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-moz-appearance:none;-ms-appearance:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-white .swiper-pagination-bullet{background:#fff}.swiper-pagination-bullet-active{opacity:1;background:#007aff}.swiper-pagination-white .swiper-pagination-bullet-active{background:#fff}.swiper-pagination-black .swiper-pagination-bullet-active{background:#000}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;-webkit-transform:translate3d(0,-50%,0);-moz-transform:translate3d(0,-50%,0);-o-transform:translate(0,-50%);-ms-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:5px 0;display:block}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 5px}.swiper-pagination-progress{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progress .swiper-pagination-progressbar{background:#007aff;position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);-webkit-transform-origin:left top;-moz-transform-origin:left top;-ms-transform-origin:left top;-o-transform-origin:left top;transform-origin:left top}.swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar{-webkit-transform-origin:right top;-moz-transform-origin:right top;-ms-transform-origin:right top;-o-transform-origin:right top;transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progress{width:100%;height:4px;left:0;top:0}.swiper-container-vertical>.swiper-pagination-progress{width:4px;height:100%;left:0;top:0}.swiper-pagination-progress.swiper-pagination-white{background:rgba(255,255,255,.5)}.swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar{background:#fff}.swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar{background:#000}.swiper-container-3d{-webkit-perspective:1200px;-moz-perspective:1200px;-o-perspective:1200px;perspective:1200px}.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper{-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-ms-transform-style:preserve-3d;transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-shadow-left{background-image:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-moz-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-right{background-image:-webkit-gradient(linear,right top,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-moz-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-top{background-image:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-moz-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-bottom{background-image:-webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-moz-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-coverflow .swiper-wrapper,.swiper-container-flip .swiper-wrapper{-ms-perspective:1200px}.swiper-container-cube,.swiper-container-flip{overflow:visible}.swiper-container-cube .swiper-slide,.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-cube .swiper-slide .swiper-slide,.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active,.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top,.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right,.swiper-container-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-cube .swiper-slide{visibility:hidden;-webkit-transform-origin:0 0;-moz-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube.swiper-container-rtl .swiper-slide{-webkit-transform-origin:100% 0;-moz-transform-origin:100% 0;-ms-transform-origin:100% 0;transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0;width:100%;height:100%;background:#000;opacity:.6;-webkit-filter:blur(50px);filter:blur(50px);z-index:0}.swiper-container-fade.swiper-container-free-mode .swiper-slide{-webkit-transition-timing-function:ease-out;-moz-transition-timing-function:ease-out;-ms-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.swiper-container-fade .swiper-slide{pointer-events:none;-webkit-transition-property:opacity;-moz-transition-property:opacity;-o-transition-property:opacity;transition-property:opacity}.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-zoom-container{width:100%;height:100%;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-moz-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-moz-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}.swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;-webkit-transform-origin:50%;-moz-transform-origin:50%;transform-origin:50%;-webkit-animation:swiper-preloader-spin 1s steps(12,end) infinite;-moz-animation:swiper-preloader-spin 1s steps(12,end) infinite;animation:swiper-preloader-spin 1s steps(12,end) infinite}.swiper-lazy-preloader:after{display:block;content:"";width:100%;height:100%;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");background-position:50%;-webkit-background-size:100%;background-size:100%;background-repeat:no-repeat}.swiper-lazy-preloader-white:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}@-webkit-keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg)}}@keyframes swiper-preloader-spin{100%{transform:rotate(360deg)}}
\ No newline at end of file
components/about.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<div class="about-container">
about nuxtjs ssr
</div>
</template>
<script>
// asyncData fetch 在组件中无效
export default {
data() {
return {
name: 'about'
}
}
}
</script>
<style lang="less">
.about-container {
font-size: 18px;
}
</style>
\ No newline at end of file
components/search/BackTop.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<section class="back-top">
<div class="back-btn" @click="backTop">
<img src="../../assets/images/search/back-top.png" />
</div>
</section>
</template>
<script>
export default {
data() {
return {
objPoint: {}
};
},
mounted() {},
methods: {
backTop: function() {
var osTop = document.documentElement.scrollTop || document.body.scrollTop;
if (osTop > 0) {
document.documentElement.scrollTop = document.body.scrollTop = 0;
this.$emit("backTop");
}
}
}
};
</script>
<style lang="scss" scoped>
@import '@/assets/style/mixin';
.back-btn {
position: fixed;
width: px2rem(35px);
height: px2rem(35px);
right: px2rem(15px);
z-index: 100;
bottom: px2rem(80px);
img {
width: 100%;
height: 100%;
display: block;
}
}
</style>
components/search/BottomLine.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<span style="border-bottom: 0" :style="{'border-color': borderColor, 'border-style': borderStyle, 'border-width': borderWidth}">
</span>
</template>
<script>
export default {
props: {
borderWidth: {
type: String,
default: '0.5px'
},
borderStyle: {
type: String,
default: 'solid'
},
borderColor: {
type: String,
default: '#F8F8F8'
}
}
}
</script>
<style lang="scss" scoped>
@import '@/assets/style/mixin';
// @import '@/assets/style/global';
</style>
components/search/ConfirmTip.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<section class="loader loader--style3" title="2">
<div class="loader-mask"></div>
<article class="confirm-content">
<span class="confirm-content-title">{{confirmTitle}}</span>
<div class="confirm-content-split"></div>
<div class="confirm-content-btn">
<span v-bp="{ component_tag: '003#022015' }" class="confirm-content-btn-confirm" @click="confirm">{{confirmBtnText}}</span>
<span class="confirm-content-btn-split"></span>
<span v-bp="{ component_tag: '003#022016' }" class="confirm-content-btn-concle" @click="cancle">{{concleBtnText}}</span>
</div>
</article>
</section>
</template>
<script>
export default {
data() {
return {
}
},
props: {
confirmTitle: {
type: String,
default: '确认删除所有搜索历史'
},
confirmBtnText: {
type: String,
default: '删除'
},
concleBtnText: {
type: String,
default: '再想想'
}
},
methods: {
confirm() {
this.$emit('confirm')
},
cancle() {
this.$emit('cancle')
}
}
}
</script>
<style lang="scss" scoped>
@import '@/assets/style/mixin';
.loader {
&-mask {
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: 100;
background: rgba(205,205,205, 0.6);
}
.confirm-content {
position: absolute;
top: px2rem(280px);
left: px2rem(52.5px);
z-index: 101;
width: px2rem(270px);
height: px2rem(116px);
border-radius: px2rem(6px);
text-align: center;
font-weight: 400;
background: #fff;
&-title {
display: inline-flex;
height: px2rem(70px);
line-height: px2rem(70px);
font-size: px2rem(17px);
color: rgba(102,102,102,1);
}
&-split {
border-top: 1px solid #F0F0F0;
}
&-btn {
display: flex;
padding-top: px2rem(14px);
justify-content: center;
font-size: px2rem(15px);
&-confirm {
color: #999;
}
&-split {
margin: 0 px2rem(50px);
border-left: 1px solid #F0F0F0;
}
&-concle {
color: #4A9E8F;
}
}
}
}
</style>
components/search/CourseAdjust.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<section>
<GroupTitle groupTitle="大家在看" :isShowNum="isShowNum"/>
<div class="cource-teach" id="adjust-u">
<div class="couse-cont">
<div
class="couse-list"
infinite-scroll-disabled="loading"
infinite-scroll-distance="10"
:style="'height:'+clientHeight"
>
<div
v-show="index < 4"
:class="index%2==1 ? 'course-item end-left' : 'course-item'"
:key="index"
v-for="(item,index) in cParamData"
>
<div class="course-pic" @click="goToPage(item)">
<img :src="item.appCourseUrl" class="pic-tec">
<span class="course-tag">{{item.disName}}</span>
</div>
<p class="course-txt">{{item.name}}</p>
<div class="course-opt">
<span
class="opt-info"
>{{!item.showTime ? '' : item.showTime + ' |'}} {{item.joinNum}}人已学</span>
<span
:class="item.whetherFavors==2?'opt collect':'opt collected'"
@click="collectFun(item.whetherFavors,item.id,item.name)"
>{{item.whetherFavors==2?'收藏':'已收藏'}}</span>
</div>
</div>
</div>
</div>
</div>
</section>
</template>
<script>
import { mapGetters, mapActions } from "vuex";
import GroupTitle from "@/components/search/GroupTitle";
import { setEventByModuleCode } from '@/utils'
import { getRecommendCourseList, favorsCourse } from '@/service';
export default {
name: 'CourseAdjust',
data() {
return {
token: "",
isShowNum: false,
list: [],
pageNo: 2,
isDisabled: false,
pageSize: 10,
title: "为您推荐",
isCollected: "",
allLoaded: true,
loading: false, //是否滚动加载
isLoading: false, //加载中
noMore: false,
clientHeight: "auto",
isShowLoading: true,
menuHeight: 0,
ptop: 20,
popHeight: 0,
menuptop: 0,
isReauestBack: true,
isWeb: true
};
},
props: {
isFixed: {
default: false,
type: Boolean
},
statusBarHeight: {
type: Number,
default: 0
},
adjustPageNo: {
type: Number,
default: 1
},
userToken: {
type: String,
default: ""
},
parmData: {
type: Array,
default: () => []
}
},
created() {
if(process.client) {
let _this = this;
this.isWeb = this.$rocNative.isWeb;
window.__refresh = function(parm) {
_this.getUserInfo();
};
}
},
mounted() {
if(!this.isWeb && this.$rocNative.appInit()) {
this.getUserInfo();
}
if(this.isWeb) {
this.getData();
}
},
computed: {
...mapGetters({
userInfo: "userInfo",
refreshNum: "refreshNum"
}),
cParamData() {
if (this.list && this.list.length) {
return this.list;
} else {
return this.parmData;
}
}
},
watch: {
refreshNum(val) {
this.getData();
}
},
components: {
GroupTitle
},
methods: {
...mapActions({
setUserInfo: "setUserInfo",
setRefreshNum: "setRefreshNum"
}),
getUserInfo() {
this.$rocNative
.getUserInfo()
.then(params => {
this.token = params.userToken;
this.getData();
this.setUserInfo(params);
this.setRefreshNum(this.refreshNum + 1)
});
},
// 跳转课程介绍页
goToPage(item) {
this.pageNo = 1;
this.$emit("setRefrshParm", {isclick: true});
let itemData = {
title: item.name,
imageUrl: "",
appModuleInfo: {
code: "M200",
type: 4,
name: "课程介绍页",
paramFlag: 1,
paramList: [{
key: "className",
value:
"com.picahealth.yunque.activitys.courseplaynew.CourseIntroduceActivity###WeexCourseIntroViewController",
type: 4,
seqNo: 1
},
{
key: "courseId",
value: `${item.id}`,
type: 1,
seqNo: 2
}]
}
};
let paramList = setEventByModuleCode(itemData.appModuleInfo);
this.$rocNative.dispatchEventByModuleCode({
modeCode: itemData.appModuleInfo.code,
jsonString: paramList
});
},
// 收藏/取消收藏
collectFun(status, id, name) {
status = status == 1 ? 2 : 1;
let params = {
token: (this.userInfo && this.userInfo.userToken) || this.token,
type: status,
courseId: id,
setEntry: "headers"
};
favorsCourse(params).then( res => {
if (res.code === "000000") {
this.getData();
} else {
this.$rocNative.showNativeToast({
message: "登录后才能收藏"
});
}
});
},
// 获取推荐的课程列表
getData(type) {
let params = {
pageNo: 1,
pageSize: 4,
token: (this.userInfo && this.userInfo.userToken) || this.token,
setEntry: "headers"
};
getRecommendCourseList(params).then( res => {
if (res.code === "000000") {
this.list = res.data || [];
}
})
}
}
};
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
@import '@/assets/style/mixin';
@import '@/assets/style/global';
// img {
// @include bis("../../assets/images/evaluatBg.png");
// }
.ellipsis {
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 2;
width: px2rem(170px);
}
.couse-list {
overflow: hidden;
}
.bgFill {
background: inherit;
height: px2rem(20px);
}
.cource-teach .cource-header,
.couse-cont {
padding: 0 px2rem(15px);
}
.couse-cont {
}
.fixBox {
}
.cource-header {
/* margin: 0 0 px2rem(11px) 0;*/
/*height: px2rem(45px);*/
margin-bottom: px2rem(15px);
.font-title {
line-height: px2rem(36px);
height: px2rem(36px);
background: #fff;
}
}
.loading-box {
font-size: px2rem(16px);
padding: px2rem(10px) 0 px2rem(20px) 0;
text-align: center;
span {
color: #999;
}
}
.change-part {
margin-top: px2rem(10px);
float: right;
font-size: px2rem(11px);
line-height: px2rem(11px);
border: 1px solid #a9aeb7;
border-radius: px2rem(9px);
vertical-align: middle;
padding: px2rem(3px) px2rem(5px) px2rem(4px) px2rem(6px);
img {
width: px2rem(12px);
height: px2rem(12px);
}
}
.fixed {
.fixBox {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 112;
.font-title {
background: #44a99b;
padding: 0 px2rem(15px);
color: #fff;
}
}
.bgFill {
background: #44a99b;
}
}
.course-item {
float: left;
margin-bottom: px2rem(19px);
margin-right: px2rem(5px);
}
.end-left {
margin-right: 0;
}
.course-pic {
width: px2rem(170px);
height: px2rem(95px);
border-radius: px2rem(3px);
position: relative;
.pic-tec {
width: 100%;
height: 100%;
display: block;
border-radius: px2rem(3px);
}
.course-tag {
position: absolute;
display: inline-block;
top: px2rem(5px);
left: px2rem(5px);
line-height: px2rem(16px);
height: px2rem(16px);
color: #4a87d4;
padding: 0 px2rem(3px);
background: #fafcff;
border: 1px solid #c3dcfb;
font-size: px2rem(10px);
border-radius: px2rem(2px);
}
}
.course-txt {
margin-top: px2rem(5px);
font-size: px2rem(14px);
line-height: px2rem(19px);
max-height: px2rem(38px);
color: #333;
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 2;
width: px2rem(170px);
}
.course-opt {
font-size: px2rem(12px);
position: relative;
/*margin-top: px2rem(6px);*/
.opt-info {
color: #999;
}
.opt {
display: inline-block;
height: px2rem(18px);
line-height: px2rem(18px);
padding: 0 px2rem(4px);
position: absolute;
right: 0;
top: 0;
}
.collect {
background: #f7f8f9;
color: #666;
}
.collected {
color: #f47a48;
background: RGBA(244, 122, 72, 0.04);
}
}
.font-title {
font-size: px2rem(18px);
font-weight: bold;
color: #28344c;
}
.title {
font-size: px2rem(16px);
text-align: left;
width: px2rem(170px);
max-height: px2rem(20px);
}
</style>
components/search/GroupTitle.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<section class="group-title">
<article v-show="showTitle" class="group-title-title">
<span>{{groupTitle}}</span><span class="group-title-title-ml-6" v-show="isShowNum">（{{groupNum}}）</span>
</article>
<article v-show="showOrder" class="group-title-order">
<div @click="order(2, index1IsSortUp)" class="group-title-order-item">
<span :class="{'active': showOrderIndex === 2}">{{orderIndex1Title}}</span>
<!-- <img src="../../assets/images/sousuo/sort-down.png" v-show="showOrderIndex === 1"/> -->
<img :class="{'ad-top': isAndroid}" v-show="showOrderIndex === 2 && index1IsSortUp" src="../../assets/images/search/sort-down.png"/>
<img :class="{'ad-top': isAndroid}" v-show="showOrderIndex === 2 && !index1IsSortUp" src="../../assets/images/search/sort-up.png"/>
<img :class="{'ad-top': isAndroid}" v-show="showOrderIndex !== 2" src="../../assets/images/search/sort-no.png"/>
</div>
<div @click="order(1, index2IsSortUp)" class="group-title-order-item">
<span :class="{'active': showOrderIndex === 1}">{{orderIndex2Title}}</span>
<!-- <img src="../../assets/images/sousuo/sort-down.png"/> -->
<img :class="{'ad-top': isAndroid}" v-show="showOrderIndex === 1 && index2IsSortUp" src="../../assets/images/search/sort-down.png"/>
<img :class="{'ad-top': isAndroid}" v-show="showOrderIndex === 1 && !index2IsSortUp" src="../../assets/images/search/sort-up.png"/>
<img :class="{'ad-top': isAndroid}" v-show="showOrderIndex !== 1" src="../../assets/images/search/sort-no.png"/>
<!-- <img src="../../assets/images/sousuo/sort-down.png" v-show="showOrderIndex === 2"/> -->
</div>
</article>
</section>
</template>
<script>
import { mapGetters } from 'vuex'
export default {
data() {
return {
cOrderIndex: 2,
showOrderIndex: 2,
index1IsSortUp: true,
index2IsSortUp: true,
// isAndroid: __isAndroid,
isAndroid: false,
}
},
props: {
groupTitle: {
type: String,
default: '课程'
},
isShowNum: {
type: Boolean,
default: true
},
groupNum: {
type: Number,
default: 0
},
showTitle: {
type: Boolean,
default: true
},
showOrder: {
type: Boolean,
default: false
},
orderIndex1Title: {
type: String,
default: '发布时间'
},
orderIndex2Title: {
type: String,
default: '学习人数'
}
},
computed: {
...mapGetters({
orderNum: 'orderNum'
})
},
watch: {
orderNum(val) {
// console.log('in Group Title', val)
this.showOrderIndex = 2
this.cOrderIndex = 2
this.index1IsSortUp = true
this.index2IsSortUp = true
}
},
created() {
// this.isAndroid = window.__isAndroid
},
mounted() {
this.isAndroid = window.__isAndroid
},
methods: {
toggle() {
this.showTitle = !showTitle
this.showOrder = !showOrder
},
order(index, isSortUp) {
let isCIndex = this.cOrderIndex == index
let isUp = isSortUp
this.cOrderIndex = index
this.showOrderIndex = index
if(isCIndex) {
if(index === 2) {
this.index1IsSortUp = !isSortUp
} else {
this.index2IsSortUp = !isSortUp
}
} else {
isUp = !isSortUp
}
this.$emit('order', index, isUp ? 1 : 2)
},
}
}
</script>
<style lang="scss" scoped>
@import '@/assets/style/mixin';
.group-title {
display: flex;
margin: 0 px2rem(15px) px2rem(10px);
flex-direction: row;
justify-content: space-between;
&-order {
display: flex;
flex-direction: row;
padding: px2rem(20px) 0 px2rem(10px);
font-size: px2rem(13px);
&-item {
position: relative;
span {
margin: 0 0 0 px2rem(15px);
padding: px2rem(2px) px2rem(20px) px2rem(2px) px2rem(10px);
border: 1px solid #F8F9FA;
border-radius: px2rem(26px);
font-size: px2rem(12px);
background: #F8F9FA;
}
img {
position: absolute;
top: px2rem(4px);
left: px2rem(75px);
height: px2rem(12px);
width: px2rem(12px);
}
}
}
.active {
border: 1px solid #449284;
color: #449284;
background: #fff;
}
&-title {
padding: px2rem(20px) 0 px2rem(10px);
font-size: px2rem(14px);
font-weight: 400;
span {
font-size: px2rem(14px);
color: #676869;
}
&-ml-6 {
margin-left: -4px;
}
}
}
.ad-top {
top: px2rem(2px) !important;
}
</style>
components/search/HealthComics.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<section>
<GroupTitle
:groupTitle="groupTitle"
:groupNum="groupNum"
:showTitle="showTitle"
:isShowNum="isShowNum"
:showOrder="showOrder"
orderIndex2Title="推送人数"
@order="orderAction"
/>
<div
v-bp="{ component_tag: '003#022008' }"
v-if="displayConfig && displayConfig.educationComtentDisplayFlag && appVerstion >= 308"
class="jump-img"
@click="jumpToCartoonByCatageryId"
>
<img src="../../assets/images/search/jump-bg.png" alt />
<span v-html="getTextByHT(displayConfig.educationComtentDisplayContent)"></span>
</div>
<div class="font-style">
<div class="teach-opt">
<div class="teach-list">
<div
v-bp="{ component_tag: '003#022004#健康知识' }"
:class="index%2==1 ? 'list-item mr0':'list-item'"
v-for="(item, index) in cParamData"
:key="index"
@click="goToPage(item)"
>
<div class="tea-img">
<img :src="item.imageUrl" />
</div>
<div class="tea-txt">
<div class="tea-position" v-html="item.highLightHeaderName"></div>
</div>
</div>
</div>
</div>
</div>
</section>
</template>
<script>
import { mapGetters } from "vuex";
import { searchForOrder, setEventByModuleCode } from "@/utils/index";
import GroupTitle from "@/components/search/GroupTitle";
import { debug } from "util";
export default {
data() {
return {
list: [],
orderIndex: 1,
orderDir: 1
};
},
components: {
GroupTitle
},
props: {
groupTitle: {
type: String,
default: "健康知识"
},
isShowNum: {
type: Boolean,
default: true
},
parmData: {
type: Array,
default: () => []
},
groupNum: {
type: Number,
default: 0
},
showTitle: {
type: Boolean,
default: true
},
showOrder: {
type: Boolean,
default: false
},
isListPage: {
type: Boolean,
default: false
}
},
computed: {
...mapGetters({
cSearchText: "cSearchText",
orderNum: "orderNum",
displayConfig: "displayConfig",
userInfo: "userInfo"
}),
cParamData() {
if (this.list && this.list.length) {
return this.list;
} else {
return this.parmData;
}
},
appVerstion() {
let appVersion = this.userInfo.appVersion || "300";
return appVersion.split(".").join("");
}
},
watch: {
orderNum(val) {
if (!this.isListPage && this.groupNum > 0) {
this.orderIndex = 2;
this.orderDir = 2;
this.orderAction(2, 2);
}
}
},
mounted() {},
methods: {
goToPage(item) {
let itemData = {
imageUrl: "",
appModuleInfo: {
code: "M200",
type: 4,
name: "课程介绍页",
paramFlag: 1,
paramList: []
}
};
itemData.title = item.name;
itemData.appModuleInfo["paramList"] = [
{
key: "className",
value:
"com.picahealth.yunque.activitys.webs.CaricatureDetailActivity###EducationDetailViewController",
// "value": 'com.picahealth.yunque.activitys.music.WebMusicListActivity###FiveMinutesMedicalSchoolWebViewController',
type: 4,
seqNo: 1
},
{
key: "id",
value: `${item.id}`,
type: 1,
seqNo: 2
}
];
let paramList = setEventByModuleCode(itemData.appModuleInfo);
this.$rocNative.dispatchEventByModuleCode({
modeCode: itemData.appModuleInfo.code,
jsonString: paramList
});
},
// 跳转到漫画页面
jumpToCartoonByCatageryId() {
let paramList = [
{
key: "className",
value:
"com.picahealth.yunque.activitys.patienteduknowledge.TotalCartoonActivity###AllCartoonViewController",
type: 4,
seqNo: 1
},
{
key: "id",
value: this.displayConfig.educationComtentDisplayParam.id,
type: 1,
seqNo: 2
},
{
key: "seq_no",
value: this.displayConfig.educationComtentDisplayParam.seqNo,
type: 1,
seqNo: 3
},
{
key: "lable",
value: this.displayConfig.educationComtentDisplayParam.name,
type: 1,
seqNo: 4
}
];
this.$rocNative.dispatchEventByModuleCode({
modeCode: "M200",
jsonString: paramList
});
},
orderAction(orderIndex, orderDir) {
this.orderIndex = orderIndex;
this.orderDir = orderDir;
searchForOrder(
"4",
this.cSearchText,
this.orderIndex,
this.orderDir,
this.cParamData.length,
this.parmData,
this.userInfo.userToken
).then(param => {
this.list = param;
});
},
getTextByHT: function(rText) {
return rText.replace(/color: rgba/g, "font-weight:700;color:rgba");
}
}
};
</script>
<style lang="scss" scoped>
body {
background: #fff;
}
@import "@/assets/style/mixin";
.mint-header {
background-color: rgba($color: #000000, $alpha: 0);
}
.font-style {
width: 100%;
overflow: hidden;
@include sc(0.6rem, #666);
}
.teach-opt {
padding: 0 px2rem(15px) px2rem(15px) px2rem(15px);
.teach-title {
font-size: px2rem(18px);
// padding-bottom: px2rem(0px);
color: #333;
}
.teach-list {
margin-top: px2rem(-14px);
overflow: hidden;
}
.opt-span {
span {
color: #449284;
font-size: px2rem(13px);
display: inline-block;
vertical-align: middle;
height: px2rem(10px);
line-height: px2rem(10px);
img {
display: inline-block;
width: px2rem(15px);
height: px2rem(15px);
vertical-align: middle;
}
}
}
.list-item {
width: px2rem(170px);
margin-right: px2rem(5px);
margin-top: px2rem(15px);
border-radius: 0 0 px2rem(3px) px2rem(3px);
float: left;
box-shadow: 0 px2rem(4px) px2rem(6px) 0 RGBA(0, 0, 0, 0.06);
}
.mr0 {
margin-right: 0;
}
.tea-txt {
padding: px2rem(5px) px2rem(7px);
}
.tea-img {
width: px2rem(170px);
height: px2rem(125px);
position: relative;
border-radius: px2rem(3px) px2rem(3px) 0 0;
img {
width: 100%;
height: 100%;
display: block;
border-radius: px2rem(3px) px2rem(3px) 0 0;
}
.learn-p {
padding-left: px2rem(5px);
position: absolute;
width: 100%;
left: 0;
bottom: 0;
background: #333;
background: -webkit-linear-gradient(
left,
RGBA(0, 0, 0, 0.2),
RGBA(0, 0, 0, 0)
);
background: -o-linear-gradient(
right,
RGBA(0, 0, 0, 0.2),
RGBA(0, 0, 0, 0)
);
background: -moz-linear-gradient(
right,
RGBA(0, 0, 0, 0.2),
RGBA(0, 0, 0, 0)
);
background: linear-gradient(
to right,
RGBA(0, 0, 0, 0.2),
RGBA(0, 0, 0, 0)
);
color: #fff;
font-size: px2rem(11px);
height: px2rem(20px);
line-height: px2rem(20px);
}
}
.tea-name {
padding: 0;
color: #333;
font-size: px2rem(14px);
font-weight: 500;
}
.tea-position {
height: px2rem(53px);
padding: px2rem(7px) px2rem(0px) px2rem(10px);
line-height: px2rem(15px);
font-size: px2rem(14px);
font-weight: 400;
color: #333;
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 2;
}
}
.home-header {
height: px2rem(185px);
@include bis("../../assets/images/sousuo/headerTop.png");
.logo_img {
height: px2rem(85px);
width: px2rem(345px);
text-align: center;
}
}
.jump-img {
position: relative;
top: 0;
left: 0;
text-align: center;
margin-bottom: px2rem(10px);
img {
width: px2rem(345px);
height: px2rem(30px);
}
span {
position: absolute;
top: px2rem(6px);
left: px2rem(25px);
font-size: px2rem(14px);
font-weight: 700;
color: #373839;
}
}
</style>
components/search/HealthComicsNew.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<section>
<GroupTitle
:groupTitle="groupTitle"
:groupNum="groupNum"
:showTitle="showTitle"
:isShowNum="isShowNum"
:showOrder="showOrder"
orderIndex2Title="推送人数"
@order="orderAction"
/>
<div
v-bp="{ component_tag: '003#022008' }"
v-if="displayConfig.educationComtentDisplayFlag && appVerstion >= 308"
class="jump-img"
@click="jumpToCartoonByCatageryId"
>
<img src="../../assets/images/search/jump-bg.png" alt />
<span v-html="getTextByHT(displayConfig.educationComtentDisplayContent)"></span>
</div>
<div class="font-style">
<div class="teach-opt">
<div class="teach-list">
<!--<div
v-bp="{ component_tag: '003#022004#健康知识' }"
:class="index%2==1 ? 'list-item mr0':'list-item'"
v-for="(item, index) in cParamData"
:key="index"
@click="goToPage(item)"
>
<div class="tea-img">
<img :src="item.imageUrl" />
</div>
<div class="tea-txt">
<div class="tea-position" v-html="item.highLightHeaderName">
</div>
</div>
</div>-->
<div
class="teach-item"
v-for="(item, index) in cParamData"
:key="index"
@click="goToPage(item)"
>
<div class="left">
<p
v-bp="{ component_tag: '003#022004#健康知识' }"
v-html="getTextByHT(item.highLightHeaderName)"
></p>
<div class="labels">
<span v-for="(label,labelIndex) in item.labels" :key="labelIndex">{{label}}</span>
</div>
<div class="operation">
<button @click.stop="choiceComics(item)" v-if="appVerstion>=310">推送给居民</button>
<span>已推送{{item.sendNum}}</span>
</div>
</div>
<div class="right">
<img :src="item.imageUrl" alt />
<p>{{item.releaseTime}}</p>
</div>
</div>
</div>
</div>
</div>
</section>
</template>
<script>
import { mapGetters } from "vuex";
import { searchForOrder, setEventByModuleCode } from "@/utils/index";
import { sortParmData } from "@/utils/index";
import GroupTitle from "@/components/search/GroupTitle";
import { debug } from "util";
export default {
data() {
return {
list: [],
orderIndex: 1,
orderDir: 1,
};
},
components: {
GroupTitle,
},
props: {
groupTitle: {
type: String,
default: "健康知识"
},
isShowNum: {
type: Boolean,
default: true
},
parmData: {
type: Array,
default: () => []
},
groupNum: {
type: Number,
default: 0
},
showTitle: {
type: Boolean,
default: true
},
showOrder: {
type: Boolean,
default: false
},
isListPage: {
type: Boolean,
default: false
}
},
computed: {
...mapGetters({
cSearchText: "cSearchText",
orderNum: "orderNum",
displayConfig: "displayConfig",
userInfo: "userInfo"
}),
cParamData() {
if (this.list && this.list.length) {
return this.list;
} else {
return this.parmData;
}
},
appVerstion() {
let appVersion = this.userInfo.appVersion || "300";
return appVersion.split(".").join("");
}
},
watch: {
orderNum(val) {
if (!this.isListPage && this.groupNum > 0) {
this.orderIndex = 2;
this.orderDir = 2;
this.orderAction(2, 2);
}
}
},
mounted() {
},
methods: {
goToPage(item) {
let itemData = {
imageUrl: "",
appModuleInfo: {
code: "M200",
type: 4,
name: "课程介绍页",
paramFlag: 1,
paramList: []
}
};
itemData.title = item.name;
itemData.appModuleInfo["paramList"] = [
{
key: "className",
value:
"com.picahealth.yunque.activitys.webs.CaricatureDetailActivity###EducationDetailViewController",
// "value": 'com.picahealth.yunque.activitys.music.WebMusicListActivity###FiveMinutesMedicalSchoolWebViewController',
type: 4,
seqNo: 1
},
{
key: "id",
value: `${item.id}`,
type: 1,
seqNo: 2
},
{
key: "pageSource",
value: "4",
type: 1,
seqNo: 2
}
];
let paramList = setEventByModuleCode(itemData.appModuleInfo);
this.$rocNative.dispatchEventByModuleCode({
modeCode: itemData.appModuleInfo.code,
jsonString: paramList
});
},
// 跳转到漫画页面
jumpToCartoonByCatageryId() {
let paramList = [
{
key: "className",
value:
"com.picahealth.yunque.activitys.patienteduknowledge.TotalCartoonActivity###AllCartoonViewController",
type: 4,
seqNo: 1
},
{
key: "id",
value: this.displayConfig.educationComtentDisplayParam.id,
type: 1,
seqNo: 2
},
{
key: "seq_no",
value: this.displayConfig.educationComtentDisplayParam.seqNo,
type: 1,
seqNo: 3
},
{
key: "lable",
value: this.displayConfig.educationComtentDisplayParam.name,
type: 1,
seqNo: 4
},
{
key: "pageSource",
value: "4",
type: 1,
seqNo: 2
}
];
this.$rocNative.dispatchEventByModuleCode({
modeCode: "M200",
jsonString: paramList
});
},
orderAction(orderIndex, orderDir) {
this.orderIndex = orderIndex;
this.orderDir = orderDir;
searchForOrder(
"4",
this.cSearchText,
this.orderIndex,
this.orderDir,
this.cParamData.length,
this.parmData,
this.userInfo.userToken
).then(param => {
this.list = param;
});
},
getTextByHT: function(rText) {
return rText.replace(/color: rgba/g, "font-weight:700;color:rgba");
},
choiceComics(item) {
//推送给居民
item.comicsType = 4;
this.$rocNative.selectHealthcartoonCallBack(item);
},
//标题高亮
getTextByHT: function(rText) {
return rText.replace(/color:rgba/g, "font-weight:700;color:rgba");
}
}
};
</script>
<style lang="scss" scoped>
@import "@/assets/style/mixin";
body {
background: #fff;
}
.mint-header {
background-color: rgba($color: #000000, $alpha: 0);
}
.font-style {
width: 100%;
overflow: hidden;
@include sc(0.6rem, #666);
}
.teach-opt {
padding: 0 px2rem(15px) px2rem(15px) px2rem(15px);
.teach-list {
margin-top: px2rem(-14px);
overflow: hidden;
.teach-item {
padding: px2rem(20px) 0;
display: flex;
justify-content: space-between;
position: relative;
.left {
width: px2rem(245px);
display: flex;
flex-flow: column;
p {
font-size: px2rem(16px);
line-height: px2rem(18px);
font-family: PingFangSC;
font-weight: 700;
color: #373839;
width: px2rem(245px);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
span {
font-weight: 700 !important;
}
}
.labels {
margin-top: px2rem(8px);
display: flex;
align-items: center;
span {
display: inline;
padding: 0 px2rem(5px);
height: px2rem(15px);
line-height: px2rem(15px);
margin-right: px2rem(6px);
background: #fffdfa;
border-radius: px2rem(2px);
font-size: px2rem(11px);
font-family: PingFangSC;
font-weight: 400;
color: #bf9e15;
position: relative;
}
span:after {
position: absolute;
content: " ";
top: 0;
left: 0;
bottom: 0;
right: 0;
width: 200%;
height: 200%;
border: 1PX solid #fae5af;
border-radius: px2rem(2px);
color: #e7e8e9;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scale(0.5, 0.5);
transform: scale(0.5, 0.5);
}
}
.operation {
margin-top: px2rem(6px);
display: flex;
align-items: center;
button {
padding: 0 px2rem(10px);
height: px2rem(25px);
line-height: px2rem(25px);
background: #fff;
color: #449284;
border-radius: px2rem(15px);
position: relative;
border: none;
margin-right: px2rem(10px);
font-size: px2rem(12px);
}
button:after {
position: absolute;
content: " ";
top: 0;
left: 0;
bottom: 0;
right: 0;
width: 200%;
height: 200%;
border: 1PX solid #449284;
opacity: 0.6;
border-radius: px2rem(30px);
color: #449284;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scale(0.5, 0.5);
transform: scale(0.5, 0.5);
}
span {
font-size: px2rem(12px);
font-family: PingFangSC;
font-weight: 400;
color: #979899;
}
}
}
.right {
width: px2rem(80px);
height: px2rem(60px);
border-radius: px2rem(4px);
position: relative;
img {
width: px2rem(80px);
height: px2rem(60px);
border-radius: px2rem(4px);
}
p {
width: px2rem(77px);
height: px2rem(20px);
line-height: px2rem(20px);
position: absolute;
bottom: 0;
font-size: px2rem(12px);
font-family: PingFangSC;
font-weight: 700;
color: #fff;
text-align: right;
padding-right: px2rem(3px);
background: linear-gradient(
180deg,
rgba(0, 0, 0, 0) 0%,
rgba(0, 0, 0, 0.5) 100%
);
border-bottom-right-radius: px2rem(4px);
border-bottom-left-radius: px2rem(4px);
}
}
}
.teach-item:after {
position: absolute;
content: " ";
left: 0;
top: 0;
right: 0;
height: 1PX;
border-top: 1PX solid #f0f1f2;
color: #f0f1f2;
-webkit-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
transform-origin: 0 100%;
-webkit-transform: scaleY(0.5);
-ms-transform: scaleY(0.5);
transform: scaleY(0.5);
}
}
}
.jump-img {
position: relative;
top: 0;
left: 0;
text-align: center;
margin-bottom: px2rem(10px);
img {
width: px2rem(345px);
height: px2rem(30px);
}
span {
position: absolute;
top: px2rem(6px);
left: px2rem(25px);
font-size: px2rem(14px);
font-weight: 700;
color: #373839;
}
}
</style>
components/search/HistoryLabels copy 2.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<article v-if="allLabels && allLabels.length > 0" class="history-labels">
<!-- <article v-if="allHistoryLabels && allHistoryLabels.length > 0" class="history-labels"> -->
<section class="history-labels-title">
<span>{{title}}</span>
<span v-show="showDelete" class="history-labels-title-all">
<span @click="confirmDelete" v-bp="{ component_tag: '003#022013' }">全部删除</span>
<span>|</span>
<span v-bp="{ component_tag: '003#022014' }" @click="toggleDelete">取消</span>
</span>
<img
v-bp="{ component_tag: '003#022011' }"
@click="toggleDelete"
v-show="!showDelete"
src="../../assets/images/sousuo/recicle.png"
alt="删除"
/>
</section>
<section
v-bp="{ component_tag: '003#022009' }"
class="history-labels-item"
@click="searchAction(item.keyword)"
v-for="(item, index) in allLabels"
:key="index"
>
<span class="history-labels-item-name" v-if="index < 15">
<span>{{item.keyword}}</span>
<img
v-bp="{ component_tag: '003#022012' }"
@click.stop="deleteHistorys(false, index)"
v-show="showDelete"
src="../../assets/images/sousuo/delete.png"
alt
/>
</span>
</section>
<ConfirmTip v-show="showConfirm" @cancle="showConfirm=false" @confirm="confirm" />
</article>
</template>
<script>
import ConfirmTip from "@/components/search/ConfirmTip";
import { getListHistorys, delHistorysService } from "@/service";
import { mapGetters, mapActions } from 'vuex';
export default {
name: "HistoryLabels",
props: {
title: {
type: String,
default: "历史搜索"
},
allHistoryLabels: {
type: Array,
default: () => []
}
},
computed: {
// ...mapGetters([
// 'allHistoryLabels'
// ]),
},
watch:{
allHistoryLabels: {
handler: function(val, oldval){
this.allLabels = val
},
deep: true //对象内部的属性监听，也叫深度监听
}
},
components: {
ConfirmTip
},
data() {
return {
token: "",
allLabels: [],
showDelete: false,
showConfirm: false
};
},
created() {
// if (process.client) {
// }
},
mounted() {
// if (this.$rocNative.isWeb) {
// // 为了Web调试用
// this.listHistorys(this.token);
// } else {
// this.getUserInfo();
// }
},
methods: {
// ...mapActions([
// 'setAllHistoryLabels'
// ]),
// 跳转到搜索结果页面
searchAction(searchText) {
if (this.showDelete) return;
this.$router.push({
path: "/result",
query: {
searchText: searchText,
pageFrom: "searchIndex"
}
});
},
// 获取用户TOKEN，并获取个人的历史数据
getUserInfo() {
this.$rocNative
.getUserInfo()
.then(params => {
this.token = params.userToken;
this.listHistorys(this.token);
});
},
// 获取个人的历史搜索关键字（必须）
listHistorys(token) {
let data = {
token: token || "",
setEntry: "headers"
};
getListHistorys(data).then(res => {
this.allLabels = res.data.list;
});
},
// // 批量删除关键词（亦可单个）
// deleteHistorys(isAll, index = 0, length = 1) {
// let params = {
// token: this.token || '',
// setEntry: "headers",
// keywordIds: []
// };
// if (isAll) {
// params.keywordIds = this.allLabels.map(element => {
// return element.id;
// });
// } else {
// params.keywordIds.push(this.allLabels[index].id);
// }
// delHistorysService(params).then(res => {
// this.allLabels.splice(index, params.keywordIds.length);
// });
// },
// 批量删除关键词（亦可单个）
deleteHistorys(isAll, index = 0, length = 1) {
let params = {
token: this.token || '',
setEntry: "headers",
keywordIds: []
};
if (isAll) {
params.keywordIds = this.allHistoryLabels.map(element => {
return element.id;
});
} else {
params.keywordIds.push(this.allHistoryLabels[index].id);
}
delHistorysService(params).then(res => {
this.allHistoryLabels.splice(index, params.keywordIds.length);
// this.setAllHistoryLabels(this.allHistoryLabels.splice(index, params.keywordIds.length))
});
},
// 确认删除
confirm() {
this.deleteHistorys(true);
},
// 切换删除与全部删除按钮
toggleDelete() {
this.showDelete = !this.showDelete;
},
// 弹出删除全部的确认框
confirmDelete() {
this.showConfirm = true;
}
}
};
</script>
<style lang="scss" scoped>
@import "@/assets/style/mixin";
.history-labels {
width: 100%;
padding: px2rem(20px) px2rem(15px) 0;
margin-bottom: px2rem(20px);
background-color: #fff;
&-title {
display: inline-flex;
height: px2rem(30px);
width: 100%;
align-items: center;
justify-content: space-between;
span {
font-size: px2rem(14px);
color: #666;
}
img {
width: px2rem(20px);
height: px2rem(20px);
padding: px2rem(4px);
}
&-all {
span {
padding: px2rem(4px) px2rem(5px);
font-size: px2rem(12px);
color: #999;
}
}
}
&-item {
display: inline-flex;
height: px2rem(30px);
margin: px2rem(10px) px2rem(15px) 0 0;
text-align: center;
align-items: center;
&-name {
position: relative;
top: 0;
left: 0;
padding: px2rem(6px) px2rem(15px) px2rem(6px);
border-radius: px2rem(15px);
background-color: #f8f9fa;
color: #999;
font-size: px2rem(13px);
span {
background-color: #f8f9fa;
color: #999;
font-size: px2rem(13px);
}
img {
position: absolute;
top: px2rem(-10px);
right: px2rem(-10px);
width: px2rem(20px);
height: px2rem(20px);
padding: px2rem(4px);
}
}
}
}
.del-all {
font-size: px2rem(12px);
font-weight: 400;
color: rgba(103, 104, 105, 1);
line-height: px2rem(12px);
}
</style>
components/search/HistoryLabels copy.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<article v-if="allLabels && allLabels.length > 0" class="history-labels">
<section class="history-labels-title">
<span>{{title}}</span>
<span v-show="showDelete" class="history-labels-title-all">
<span @click="confirmDelete" v-bp="{ component_tag: '003#022013' }">全部删除</span>
<span>|</span>
<span v-bp="{ component_tag: '003#022014' }" @click="toggleDelete">取消</span>
</span>
<img
v-bp="{ component_tag: '003#022011' }"
@click="toggleDelete"
v-show="!showDelete"
src="../../assets/images/sousuo/recicle.png"
alt="删除"
/>
</section>
<section
v-bp="{ component_tag: '003#022009' }"
class="history-labels-item"
@click="searchAction(item.keyword)"
v-for="(item, index) in allLabels"
:key="index"
>
<span class="history-labels-item-name" v-if="index < 15">
<span>{{item.keyword}}</span>
<img
v-bp="{ component_tag: '003#022012' }"
@click.stop="deleteHistorys(false, index)"
v-show="showDelete"
src="../../assets/images/sousuo/delete.png"
alt
/>
</span>
</section>
<ConfirmTip v-show="showConfirm" @cancle="showConfirm=false" @confirm="confirm" />
</article>
</template>
<script>
import ConfirmTip from "@/components/search/ConfirmTip";
import { getListHistorys, delHistorysService } from "@/service";
export default {
name: "HistoryLabels",
props: {
title: {
type: String,
default: "历史搜索"
}
},
components: {
ConfirmTip
},
data() {
return {
token: "",
allLabels: [],
showDelete: false,
showConfirm: false
};
},
created() {
// if (process.client) {
// }
},
mounted() {
if (this.$rocNative.isWeb) {
// 为了Web调试用
this.listHistorys(this.token);
} else {
this.getUserInfo();
}
},
methods: {
// 跳转到搜索结果页面
searchAction(searchText) {
if (this.showDelete) return;
this.$router.push({
path: "/result",
query: {
searchText: searchText,
pageFrom: "searchIndex"
}
});
},
// 获取用户TOKEN，并获取个人的历史数据
getUserInfo() {
this.$rocNative
.getUserInfo()
.then(params => {
this.token = params.userToken;
this.listHistorys(this.token);
});
},
// 获取个人的历史搜索关键字（必须）
listHistorys(token) {
let data = {
token: token || "",
setEntry: "headers"
};
getListHistorys(data).then(res => {
this.allLabels = res.data.list;
});
},
// 批量删除关键词（亦可单个）
deleteHistorys(isAll, index = 0, length = 1) {
let params = {
token: this.token || '',
setEntry: "headers",
keywordIds: []
};
if (isAll) {
params.keywordIds = this.allLabels.map(element => {
return element.id;
});
} else {
params.keywordIds.push(this.allLabels[index].id);
}
delHistorysService(params).then(res => {
this.allLabels.splice(index, params.keywordIds.length);
});
},
// 确认删除
confirm() {
this.deleteHistorys(true);
},
// 切换删除与全部删除按钮
toggleDelete() {
this.showDelete = !this.showDelete;
},
// 弹出删除全部的确认框
confirmDelete() {
this.showConfirm = true;
}
}
};
</script>
<style lang="scss" scoped>
@import "@/assets/style/mixin";
.history-labels {
width: 100%;
padding: px2rem(20px) px2rem(15px) 0;
margin-bottom: px2rem(20px);
background-color: #fff;
&-title {
display: inline-flex;
height: px2rem(30px);
width: 100%;
align-items: center;
justify-content: space-between;
span {
font-size: px2rem(14px);
color: #666;
}
img {
width: px2rem(20px);
height: px2rem(20px);
padding: px2rem(4px);
}
&-all {
span {
padding: px2rem(4px) px2rem(5px);
font-size: px2rem(12px);
color: #999;
}
}
}
&-item {
display: inline-flex;
height: px2rem(30px);
margin: px2rem(10px) px2rem(15px) 0 0;
text-align: center;
align-items: center;
&-name {
position: relative;
top: 0;
left: 0;
padding: px2rem(6px) px2rem(15px) px2rem(6px);
border-radius: px2rem(15px);
background-color: #f8f9fa;
color: #999;
font-size: px2rem(13px);
span {
background-color: #f8f9fa;
color: #999;
font-size: px2rem(13px);
}
img {
position: absolute;
top: px2rem(-10px);
right: px2rem(-10px);
width: px2rem(20px);
height: px2rem(20px);
padding: px2rem(4px);
}
}
}
}
.del-all {
font-size: px2rem(12px);
font-weight: 400;
color: rgba(103, 104, 105, 1);
line-height: px2rem(12px);
}
</style>
components/search/HistoryLabels.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<article v-if="allLabels && allLabels.length > 0" class="history-labels">
<section class="history-labels-title">
<span>{{title}}</span>
<span v-show="showDelete" class="history-labels-title-all">
<span @click="confirmDelete" v-bp="{ component_tag: '003#022013' }">全部删除</span>
<span>|</span>
<span v-bp="{ component_tag: '003#022014' }" @click="toggleDelete">取消</span>
</span>
<img
v-bp="{ component_tag: '003#022011' }"
@click="toggleDelete"
v-show="!showDelete"
src="../../assets/images/sousuo/recicle.png"
alt="删除"
/>
</section>
<section
v-bp="{ component_tag: '003#022009' }"
class="history-labels-item"
@click="searchAction(item.keyword)"
v-for="(item, index) in allLabels"
:key="index"
>
<span class="history-labels-item-name" v-if="index < 15">
<span>{{item.keyword}}</span>
<img
v-bp="{ component_tag: '003#022012' }"
@click.stop="deleteHistorys(false, index)"
v-show="showDelete"
src="../../assets/images/sousuo/delete.png"
alt
/>
</span>
</section>
<ConfirmTip v-show="showConfirm" @cancle="showConfirm=false" @confirm="confirm" />
</article>
</template>
<script>
import ConfirmTip from "@/components/search/ConfirmTip";
import { getListHistorys, delHistorysService } from "@/service";
export default {
name: "HistoryLabels",
props: {
title: {
type: String,
default: "历史搜索"
}
},
components: {
ConfirmTip
},
data() {
return {
token: "",
allLabels: [],
showDelete: false,
showConfirm: false
};
},
created() {
// if (process.client) {
// }
},
mounted() {
if (this.$rocNative.isWeb) {
// 为了Web调试用
this.listHistorys(this.token);
} else {
this.getUserInfo();
}
},
methods: {
// 跳转到搜索结果页面
searchAction(searchText) {
if (this.showDelete) return;
this.$router.push({
path: "/result",
query: {
searchText: searchText,
pageFrom: "searchIndex"
}
});
},
// 获取用户TOKEN，并获取个人的历史数据
getUserInfo() {
this.$rocNative
.getUserInfo()
.then(params => {
this.token = params.userToken;
this.listHistorys(this.token);
});
},
// 获取个人的历史搜索关键字（必须）
listHistorys(token) {
let data = {
token: token || "",
setEntry: "headers"
};
getListHistorys(data).then(res => {
this.allLabels = res.data.list;
});
},
// 批量删除关键词（亦可单个）
deleteHistorys(isAll, index = 0, length = 1) {
let params = {
token: this.token || '',
setEntry: "headers",
keywordIds: []
};
if (isAll) {
params.keywordIds = this.allLabels.map(element => {
return element.id;
});
} else {
params.keywordIds.push(this.allLabels[index].id);
}
delHistorysService(params).then(res => {
this.allLabels.splice(index, params.keywordIds.length);
});
},
// 确认删除
confirm() {
this.deleteHistorys(true);
},
// 切换删除与全部删除按钮
toggleDelete() {
this.showDelete = !this.showDelete;
},
// 弹出删除全部的确认框
confirmDelete() {
this.showConfirm = true;
}
}
};
</script>
<style lang="scss" scoped>
@import "@/assets/style/mixin";
.history-labels {
width: 100%;
padding: px2rem(20px) px2rem(15px) 0;
margin-bottom: px2rem(20px);
background-color: #fff;
&-title {
display: inline-flex;
height: px2rem(30px);
width: 100%;
align-items: center;
justify-content: space-between;
span {
font-size: px2rem(14px);
color: #666;
}
img {
width: px2rem(20px);
height: px2rem(20px);
padding: px2rem(4px);
}
&-all {
span {
padding: px2rem(4px) px2rem(5px);
font-size: px2rem(12px);
color: #999;
}
}
}
&-item {
display: inline-flex;
height: px2rem(30px);
margin: px2rem(10px) px2rem(15px) 0 0;
text-align: center;
align-items: center;
&-name {
position: relative;
top: 0;
left: 0;
padding: px2rem(6px) px2rem(15px) px2rem(6px);
border-radius: px2rem(15px);
background-color: #f8f9fa;
color: #999;
font-size: px2rem(13px);
span {
background-color: #f8f9fa;
color: #999;
font-size: px2rem(13px);
}
img {
position: absolute;
top: px2rem(-10px);
right: px2rem(-10px);
width: px2rem(20px);
height: px2rem(20px);
padding: px2rem(4px);
}
}
}
}
.del-all {
font-size: px2rem(12px);
font-weight: 400;
color: rgba(103, 104, 105, 1);
line-height: px2rem(12px);
}
</style>
components/search/HotLabels.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<article v-if="allLabels && allLabels.length > 0" class="history-labels">
<section class="history-labels-title">
<span>{{title}}</span>
</section>
<section
v-bp="{ component_tag: '003#022010' }"
class="history-labels-item"
@click="gotoPage(item)"
v-for="(item, index) in allLabels"
:key="index"
>
<span class="history-labels-item-name" v-if="index < 15">{{item.keyword}}</span>
</section>
</article>
</template>
<script>
import { getHotLabelsService } from "@/service";
import { setEventByModuleCode } from '@/utils'
export default {
name: "HotLabels",
props: {
title: {
type: String,
default: "热门搜索"
}
},
data() {
return {
allLabels: []
};
},
mounted() {
this.getHotLabels();
},
methods: {
// 通用原生或内部跳转
gotoPage(itemData) {
if (
!itemData.appModuleInfo ||
!(
itemData.appModuleInfo.code === "M001" ||
itemData.appModuleInfo.code === "M002" ||
itemData.appModuleInfo.code === "M003" ||
itemData.appModuleInfo.code === "M100" ||
itemData.appModuleInfo.code === "M200" ||
itemData.appModuleInfo.code === "M300" ||
itemData.appModuleInfo.code === "M400" ||
itemData.appModuleInfo.code === "M500"
)
) {
console.log("不支持的中转。。。");
this.jump2RezultPage(itemData.keyword);
return;
}
let paramList = setEventByModuleCode(itemData.appModuleInfo);
// alert(JSON.stringify(paramList))
if (paramList !== "NO") {
this.$rocNative.dispatchEventByModuleCode({
modeCode: itemData.appModuleInfo.code,
jsonString: paramList
});
}
},
// 跳转到结果页面
jump2RezultPage(searchText) {
if (this.showDelete) return;
this.$router.push({
path: "/result",
query: {
searchText: searchText,
pageFrom: "searchIndex"
}
});
},
// 通过原生跳转
dispatchEventByModuleCode(itemData) {
let modeCode = itemData.appModuleInfo.code;
let paramList = itemData.appModuleInfo.paramList
? itemData.appModuleInfo.paramList
: "";
if (modeCode === "M001" || modeCode === "M002" || modeCode === "M003") {
paramList = "";
} else if (modeCode === "M100" || modeCode === "M300") {
let urlPara = this.getUrlPara(paramList);
paramList[0].value += urlPara;
}
if (typeof paramList === "string" && !paramList) {
paramList = [];
}
this.$rocNative.dispatchEventByModuleCode({
modeCode: itemData.appModuleInfo.code,
jsonString: paramList
});
},
// 跳转到课程介绍页
jumpToCourse(id) {
let itemData = {
title: "课程介绍页",
imageUrl:
"https://test-file.yunqueyi.com/image/jpeg/2018/09/18/20180918103322254-f8bba621.jpg",
appModuleInfo: {
code: "M200",
type: 4,
name: "课程介绍页",
paramFlag: 1,
paramList: [
{
key: "className",
value:
"com.picahealth.yunque.activitys.courseplaynew.CourseIntroduceActivity###WeexCourseIntroViewController",
type: 4,
seqNo: 1
},
{
key: "courseId",
value: `${id}`,
type: 1,
seqNo: 2
}
]
}
};
this.dispatchEventByModuleCode(itemData);
},
// 跳转到漫画详情页
jumpToCartoon(url, name) {
let itemData = {
title: "漫画详情页",
imageUrl:
"https://test-file.yunqueyi.com/image/jpeg/2018/09/18/20180918103322254-f8bba621.jpg",
appModuleInfo: {
code: "M300",
type: 4,
name: "漫画详情页",
paramFlag: 1,
paramList: [
{
key: "pageUrl",
value: url,
type: 4,
seqNo: 1
},
{
key: "showTitle",
value: true,
type: 1,
seqNo: 2
},
{
key: "title",
value: name,
type: 1,
seqNo: 2
}
]
}
};
this.$rocNative.dispatchEventByModuleCode({
modeCode: itemData.appModuleInfo.code,
jsonString: itemData.appModuleInfo.paramList
});
},
// 获取个人的历史搜索关键字
getHotLabels() {
getHotLabelsService({type: 2}).then(res => {
this.allLabels = res.data;
});
}
}
};
</script>
<style lang="scss" scoped>
@import "@/assets/style/mixin";
.history-labels {
width: 100%;
padding: 0 px2rem(15px) 0;
// margin-bottom: px2rem(6px);
margin: px2rem(20px) 0 px2rem(6px);
background-color: #fff;
&-title {
display: inline-flex;
height: px2rem(30px);
width: 100%;
align-items: center;
justify-content: space-between;
span {
font-size: px2rem(14px);
color: #666;
}
img {
width: px2rem(20px);
height: px2rem(20px);
padding: px2rem(4px);
}
}
&-item {
display: inline-flex;
height: px2rem(30px);
margin: px2rem(10px) px2rem(15px) 0 0;
text-align: center;
align-items: center;
&-name {
padding: px2rem(6px) px2rem(15px) px2rem(6px);
border-radius: px2rem(15px);
background-color: #f8f9fa;
color: #979899;
font-size: px2rem(13px);
}
}
}
</style>
components/search/Loading-old.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<div class="loader loader--style3" title="2">
<div class="loader-mask"></div>
<svg version="1.1" id="loader-1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="40px" height="40px" viewBox="0 0 50 50" style="enable-background:new 0 0 50 50;" xml:space="preserve">
<path fill="#000" d="M43.935,25.145c0-10.318-8.364-18.683-18.683-18.683c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615c8.072,0,14.615,6.543,14.615,14.615H43.935z">
<animateTransform attributeType="xml"
attributeName="transform"
type="rotate"
from="0 25 25"
to="360 25 25"
dur="0.6s"
repeatCount="indefinite"/>
</path>
</svg>
</div>
</template>
<style lang="scss" scoped>
@import '@/assets/style/mixin';
.loader {
&-mask {
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: 100;
// background: rgba(0, 0, 0, 0.5);
}
svg {
position: absolute;
top: px2rem(280px);
left: px2rem(166px);
z-index: 101;
}
}
svg path, svg rect{
// fill: #fff;
// fill: #449284;
fill: #449284;
}
</style>
components/search/Loading.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<div class="loader loader--style3" title="2">
<div class="loader-mask"></div>
<svg version="1.1" id="loader-1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="40" height="40" viewBox="0 0 60 60" style="enable-background:new 0 0 80 80;" xml:space="preserve">
<path fill="#000" d="M43.935,25.145c0-10.318-8.364-18.683-18.683-18.683c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615c8.072,0,14.615,6.543,14.615,14.615H43.935z">
<animateTransform attributeType="xml"
attributeName="transform"
type="rotate"
from="0 25 25"
to="360 25 25"
dur="0.6s"
repeatCount="indefinite"/>
</path>
</svg>
</div>
</template>
<style lang="scss" scoped>
@import '@/assets/style/mixin';
.loader {
&-mask {
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: 100;
// background: rgba(0, 0, 0, 0.5);
}
svg {
position: absolute;
top: px2rem(280px);
left: px2rem(172px);
z-index: 101;
}
}
svg path, svg rect{
// fill: #fff;
// fill: #449284;
fill: #449284;
}
</style>
components/search/NoMoreItem.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<section class="no-more">
<span class="no-more-sub"></span>
<span class="no-more-text">{{noMoreText}}</span>
<span class="no-more-sub"></span>
</section>
</template>
<script>
export default {
data() {
return {
noMoreText: '到底啦'
}
}
}
</script>
<style lang="scss" scoped>
@import '@/assets/style/mixin';
.no-more {
display: flex;
height: px2rem(41px);
flex-direction: row;
justify-content: center;
align-items: center;
// background:rgba(248,248,248,1);
&-sub {
width: px2rem(84px);
// height: px2rem(26px);
border: px2rem(1px) solid #F7F7F7;
border-bottom: 0;
}
&-text {
padding: 0 px2rem(8px);
font-size: px2rem(14px);
color: #BEC2CC;
}
}
</style>
components/search/NoResultPage.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<section class="no-result">
<img src="../../assets/images/sousuo/search-big.png" alt="">
<p>没有找到相关内容</p>
<p>您可以修改条件后重新搜索</p>
</section>
</template>
<script>
export default {
data() {
return {
}
},
}
</script>
<style lang="scss" scoped>
@import '@/assets/style/mixin';
.no-result {
height: px2rem(180px);
margin-top: px2rem(0px);
text-align: center;
img {
width: px2rem(100px);
height: px2rem(100px);
}
p {
font-size: px2rem(15px);
color: #999;
}
}
</style>
components/search/SearchCourseList.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<section>
<GroupTitle
:groupTitle="groupTitle"
:groupNum="groupNum"
:showTitle=true
:isShowNum="isShowNum"
:showOrder="showOrder"
@order="orderAction"
/>
<div
v-bp="{ component_tag: '003#022007' }"
v-if="displayConfig && displayConfig.courseDisplayFlag && appVerstion >= 308"
class="jump-img"
@click="jumpToCourseByCatageryId"
>
<img src="../../assets/images/search/jump-bg.png" alt="">
<span :class="{'android-pt':isAndroid}" v-html="getTextByHT2(displayConfig.courseDisplayContent)"></span>
</div>
<div
v-bp="{ component_tag: '003#022004#课程' }"
class="item-course"
:class="{'item-course-h': item.highLightField == 2
|| item.highLightField == 3
|| item.highLightField == 4
|| item.highLightField == 5,
'is-last': index == cParamData.length - 1 && isShowNum}"
v-for="(item, index) in cParamData"
:key="index"
@click="goToPage(item)"
>
<div class="top-info">
<!-- <span class="top-flag">入门</span> -->
<!-- <span v-show="item.typeName" class="teacher-itemname-tag" :class="[item.typeId == 1 ? 'rm-bg' : item.typeId == 2 ? 'zj-bg': 'gj-bg']">{{item.typeId == 1 ? '入门' : item.typeId == 2 ? '中级' : '高级'}}</span> -->
<span class="teacher-itemname-tag" :class="[item.type == 1 ? 'rm-bg' : item.type == 2 ? 'zj-bg': 'gj-bg']">{{item.typeStr}}
</span>
<div class="ellipsis-1">
<span class="top-title" v-html="getTextByHT(item, 1, 'courseName', true)"></span>
</div>
<span
class="top-star"
@click.stop="collectFun(item.favorFlag, item.courseId)">
<span v-if="item.favorFlag == 1">
<span class="have-favor">已收藏</span>
</span>
<span v-else>
<img src="../../assets/images/search/collect-icon.png" />
<span class="have-no-favor">收藏</span>
</span>
</span>
</div>
<div class="bottom-info">
<div class="left-info">
<div class="top-flag">
<span v-html="getTextByHT(item, 6, 'docName')"></span><span :class="{'v-is-android': isAndroid}" class="ver-line">|</span><span class="chat">{{item.chapterSum}}章{{item.lectureNum}}节</span><span>{{item.totalTime}}分</span><span v-if="userInfo.userMobile" :class="{'v-is-android': isAndroid}" class="ver-line">|</span><span v-if="userInfo.userMobile">{{item | courseProgress}}</span>
<!-- <span v-html="item.docName"></span><span :class="{'v-is-android': isAndroid}" class="ver-line">|</span><span class="chat">{{item.chapterSum}}章{{item.lectureNum}}节</span><span>{{item.totalTime}}分</span><span v-if="isCourseProgress(item)" :class="{'v-is-android': isAndroid}" class="ver-line">|</span><span>{{item | courseProgress}}</span> -->
</div>
<div class="bottom-flag">
<span v-show="item.personGradeModel.purchased == 0" class="bottom-flag-title-mf">免费</span><span v-show="item.personGradeModel.purchased == 1" class="bottom-flag-title-ydh">已兑换<img src="../../assets/images/search/pc-icon.png" /></span><span v-show="item.personGradeModel.purchased == 2" class="bottom-flag-title">{{item | showCourseAcount}}云鹊豆<img src="../../assets/images/search/yqd-icon-2.png" /><img v-show="item.personGradeModel.costValueOnSale > 0" src="../../assets/images/search/discount-icon.png" /></span><span :class="{'v-is-android': isAndroid}" class="ver-line">|</span><span class="bottom-flag-num">{{yLocalString(item.joinNum)}}人已学</span>
</div>
</div>
<div class="right-img">
<!-- <img :src="item.courseImageUrl" /> -->
<img :src="item.courseImageUrl" />
<span>{{item.showTime}}</span>
</div>
</div>
<div class="bottom-keyword ellipsis-1-1"
v-show="item.highLightField == 2
|| item.highLightField == 3
|| item.highLightField == 4
|| item.highLightField == 5">
<span><span class="keyword">{{getHighLightText(item.highLightField)}}</span><span class="hl-name" v-html="item.highLightName"></span></span>
</div>
</div>
</section>
</template>
<script>
import { mapGetters } from 'vuex'
import GroupTitle from '@/components/search/GroupTitle';
import { sousuoSearch } from '@/service';
import { searchForOrder, setEventByModuleCode } from "@/utils/index";
import { favorsCourse } from '@/service';
let mapDesc = ['', '课程名：', '关键字：', '', '章：', '节：']
export default {
name: "SearchCourseList",
props: {
dataObj: Object,
parmData: {
type: Array,
default: () => []
},
groupTitle: {
type: String,
default: '课程'
},
groupNum: {
type: Number | String,
default: 0
},
isShowNum: {
type: Boolean,
default: true
},
showTitle: {
type: Boolean,
default: true
},
showOrder: {
type: Boolean,
default: false
},
isListPage: {
type: Boolean,
default: false
}
},
data() {
return {
isAndroid: false,
list: [],
orderIndex: 0,
orderDir: 0,
isShowCourseNoItem: false
}
},
components: {
GroupTitle,
},
watch: {
orderNum(val) {
if ( !this.isListPage && this.groupNum > 0 ) {
this.orderIndex = 2
this.orderDir = 2
this.orderAction(2, 2)
}
},
refreshNum(val) {
if ( this.isListPage ) {
this.orderAction(0, 0)
} else {
this.orderAction(this.orderIndex, this.orderDir)
}
},
},
computed: {
...mapGetters({
cSearchText: 'cSearchText',
refreshNum: 'refreshNum',
orderNum: 'orderNum',
displayConfig: 'displayConfig',
userInfo: 'userInfo',
}),
appVerstion() {
let appVersion = this.userInfo.appVersion || '300';
return appVersion.split('.').join('')
},
cParamData() {
if (this.list && this.list.length) {
return this.list
} else {
return this.parmData
}
}
},
mounted() {
this.isAndroid = window.__isAndroid
},
methods: {
orderAction(orderIndex, orderDir) {
this.orderIndex = orderIndex
this.orderDir = orderDir
searchForOrder('1', this.cSearchText, orderIndex, this.orderDir, this.cParamData.length, this.parmData, this.userInfo.userToken).then( param => {
if (orderIndex == 0) {
this.list = param.splice(0, 4)
} else {
this.list = param
}
})
},
getTextByHT: function(item, typeId, typeName, needFW) {
let rText = ""
if(item.highLightField == typeId) {
rText = item.highLightName
} else {
rText = item[typeName]
}
if(needFW) {
rText = rText.replace(/color:rgba/g, 'font-weight:700;color:rgba');
}
return rText
},
getHighLightText(val){
return mapDesc[val]
},
// 将数字转换成带千分位数字及100万
yLocalString: function (value) {
if(value >= 1000000) return (value / 10000).toFixed(1) + '万';
var b = parseInt(value).toString();
if (b === 'NaN') return 0;
var len = b.length;
if (len <= 3) { return b; }
var r = len % 3;
return r > 0 ? b.slice(0, r) + "," + b.slice(r, len).match(/\d{3}/g).join(",") : b.slice(r, len).match(/\d{3}/g).join(",");
},
// 将字符串截短至指定长度，并用在最后追加特定字符串（例如：...）
shortName: function (value, length = 10, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append
} else {
return value
}
},
// 跳转到课程分类页面
jumpToCourseByCatageryId() {
let paramList = [{
"key": "className",
"value": "com.picahealth.yunque.activitys.famousteacherschool.CourseCategoryActivity###MicroProfessionTableController",
"type": 4,
"seqNo": 1
},
{
"key": "lableIds",
"value": this.displayConfig.courseDisplayParam.join(','),
"type": 1,
"seqNo": 2
}]
this.$rocNative.dispatchEventByModuleCode({
modeCode: 'M200',
jsonString: paramList
})
},
// 收藏 取消收藏
collectFun(status, id) {
status = status == 0 ? 1 : 2;
let parms = {
token: this.userInfo.userToken,
type: status,
courseId: id,
setEntry: "headers"
};
favorsCourse(parms).then( res => {
if (res.code === "000000") {
if(this.isListPage) {
this.orderAction(0, 0)
} else {
this.orderAction(this.orderIndex, this.orderDir)
}
} else {
this.$rocNative.showNativeToast({
message: "登录后才能收藏"
});
}
});
},
// 跳转到课程介绍页
goToPage(item) {
let itemData = {
title: item.name,
imageUrl: "",
appModuleInfo: {
code: "M200",
type: 4,
name: "课程介绍页",
paramFlag: 1,
paramList: [
{
key: "className",
value:
"com.picahealth.yunque.activitys.courseplaynew.CourseIntroduceActivity###WeexCourseIntroViewController",
type: 4,
seqNo: 1
},
{
key: "courseId",
value: `${item.courseId}`,
type: 1,
seqNo: 2
}
]
}
};
let paramList = setEventByModuleCode(itemData.appModuleInfo);
this.$rocNative.dispatchEventByModuleCode({
modeCode: itemData.appModuleInfo.code,
jsonString: paramList
});
},
isCourseProgress(item) {
return this.userInfo.userMobile
},
getTextByHT2: function(rText) {
return rText.replace(/color:rgba/g, 'font-weight:700;color:rgba');
},
},
// 过滤器
filters: {
getTextByHT: function(item, typeId, typeName) {
if(item.highLightField == typeId) {
return item.highLightName
} else {
return item[typeName]
}
},
showCourseAcount(item) {
if(item.personGradeModel.costValueOnSale > 0){
return item.personGradeModel.costValueOnSale
} else {
return item.personGradeModel.costValue
}
},
courseProgress(item) {
if(item.status == 2) {
return '已学' + (item.courseProgress * 100).toFixed(0) + '%'
} else {
return item.statusStr
}
}
}
};
</script>
<style scoped lang="scss">
@import '@/assets/style/mixin';
@import '@/assets/style/global';
.item-course {
height: px2rem(102px);
margin: 0 auto;
margin: px2rem(10px) px2rem(15px) px2rem(20px);
box-sizing: border-box;
border-bottom: 0.5px solid #F0F1F2;
&-h {
height: px2rem(128px);
}
.top-info {
width: px2rem(345px);
height: px2rem(24px);
display: flex;
justify-content: space-between;
div {
align-items: center;
}
.top-flag {
width: px2rem(28px);
height: px2rem(16px);
line-height: px2rem(16px);
text-align: center;
font-size: px2rem(11px);
border-radius: px2rem(1px);
color: #fff;
background: #6a9fe9;
align-self: center;
font-weight: 300;
}
.top-title {
width: px2rem(240px);
// margin-left: px2rem(6px);
line-height: px2rem(24px);
color: #373839;
font-size: px2rem(16px);
font-weight: 700;
span {
font-weight: 700 !important;
color: #f68367;
}
}
.top-star {
width: px2rem(58px);
height: px2rem(24px);
line-height: px2rem(24px);
background: #f4f9f8;
border-radius: px2rem(15px);
text-align: center;
color: #449284;
font-size: px2rem(12px);
img {
width: px2rem(12px);
height: px2rem(12px);
vertical-align: middle;
}
span {
vertical-align: middle;
}
.have-favor {
background: #F8F9FA;
color: #C7C8C9;
}
.have-no-favor {
color: #449284;
}
}
}
.bottom-info {
width: px2rem(345px);
margin-top: px2rem(10px);
display: flex;
justify-content: space-between;
.left-info {
align-items: center;
div {
span {
img {
width: px2rem(12px);
height: px2rem(12px);
}
}
}
.top-flag {
font-size: px2rem(12px);
span {
color: #979899;
}
.ver-line {
position: relative;
top: 0;
left: 0;
margin: 0 px2rem(5px);
}
.chat {
padding-right: px2rem(6px);
}
}
.bottom-flag {
margin-top: px2rem(10px);
color: #676869;
font-size: px2rem(14px);
&-title {
font-weight: 700;
color: #676869;
&-mf {
font-weight: 700;
color: #F68367;
}
}
&-num {
color: #676869;
font-weight: 400;
}
span {
img {
width: px2rem(15px);
height: px2rem(15px);
vertical-align: middle;
padding: 0 0 px2rem(4px) px2rem(2px);
}
}
.ver-line {
position: relative;
top: 0;
left: 0;
margin: 0 px2rem(12px);
color: #979899;
}
}
}
.right-img {
align-items: center;
width: px2rem(80px);
height: px2rem(45px);
position: relative;
img {
width: 100%;
height: 100%;
}
span {
position: absolute;
right: 0;
bottom: 0;
width: px2rem(80px);
height: px2rem(20px);
padding-top: px2rem(4px);
padding: px2rem(4px) px2rem(2px) 0 0;
text-align: right;
font-size: px2rem(12px);
font-weight: 700;
color: #fff;
background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 100%);
}
}
}
}
.is-last {
border-bottom: 0px solid #fff !important;
margin-bottom: 0 !important;
}
.teacher-itemname-tag {
vertical-align: top;
height: px2rem(16px);
line-height: px2rem(16px);
margin-top: px2rem(4px);
padding: 0 px2rem(3px) 0;
border-radius: px2rem(2px);
font-size: px2rem(11px);
color: #fff;
background: rgba(106,159,233,1);
}
.rm-bg {
background-color: #6A9FE9 !important;
}
.zj-bg {
background-color: #449284 !important;
}
.gj-bg {
background-color: #CAA861 !important;
}
.bottom-keyword {
height: px2rem(36px);
line-height: px2rem(36px);
font-size: px2rem(12px);
.keyword {
color: #979899;
}
.hl-name {
color: #373839;
}
}
.ellipsis-1 {
width: 71%;
height: px2rem(30px);
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 1;
white-space: nowrap;
}
.ellipsis-1-1 {
width: 100%;
height: px2rem(30px);
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 1;
white-space: nowrap;
}
.jump-img {
position: relative;
top: 0;
left: 0;
text-align: center;
img {
width: px2rem(345px);
height: px2rem(30px);
}
span {
position: absolute;
top: px2rem(6px);
left: px2rem(25px);
font-size: px2rem(14px);
font-weight: 700;
color: #373839;
}
}
.android-pt {
padding-top: px2rem(10px);
}
.v-is-android {
top: px2rem(-1px) !important;
}
</style>
components/search/SearchFiveMedicalList.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<section>
<GroupTitle :groupTitle="groupTitle" :groupNum="groupNum" :showTitle="showTitle" :isShowNum="isShowNum" :showOrder="showOrder" @order="orderAction"/>
<div
v-bp="{ component_tag: '003#022004#5分钟医学院' }"
class="item-five"
v-for="(item, index) in cParamData"
:key="index"
:class="{'is-last': index == cParamData.length - 1 && isShowNum}"
@click="goToPage(item)"
>
<div class="left-info">
<div class="top-title ellipsis-1" v-html="getTextByHT(item.title)"></div>
<span class="bottom-flag">#<span v-html="item.categoryName"></span></span>
</div>
<div class="right-img" @click.stop="playFun(item)">
<img :src="item.appImageUrl">
<img class="play-img" src="../../assets/images/search/play.png" />
</div>
</div>
<!-- <NoMoreItem v-if="isShowFiveNoItem"></NoMoreItem> -->
</section>
</template>
<script>
import { searchForOrder, setEventByModuleCode } from "@/utils/index";
import { mapGetters } from 'vuex'
import GroupTitle from '@/components/search/GroupTitle';
import NoMoreItem from "@/components/search/NoMoreItem";
let heardHeight = 140;
let fiveListHeight = 87;
export default {
name: 'SearchFiveMedicalList',
components: {
GroupTitle,
NoMoreItem
},
props: {
dataObj: Object,
parmData: {
type: Array,
default: () => []
},
groupTitle: {
type: String,
default: '5分钟医学院'
},
isShowNum: {
isShowNum: Boolean,
default: true
},
groupNum: {
type: Number,
default: 0
},
showTitle: {
type: Boolean,
default: true
},
showOrder: {
type: Boolean,
default: false
},
isListPage: {
type: Boolean,
default: false
}
},
data(){
return{
list: [],
orderIndex: 2,
orderDir: 2,
// isShowFiveNoItem: false
}
},
watch: {
orderNum(val) {
if ( !this.isListPage && this.groupNum > 0 ) {
this.orderIndex = 2
this.orderDir = 2
this.orderAction(2, 2)
}
},
},
computed: {
...mapGetters({
cSearchText: 'cSearchText',
orderNum: 'orderNum',
userInfo: 'userInfo',
}),
cParamData() {
if (this.list && this.list.length) {
return this.list
} else {
return this.parmData
}
}
},
created(){
// let _this = this;
// //暂停
// window.__pauseAudioView = function (parm) {
// _this.changePlay(_this.id, '2');
// }
// //开始
// window.__playAudioView = function (parm) {
// _this.changePlay(_this.id, '1');
// }
// window.__closeAudioView = function (parm) {
// _this.changePlay(_this.id, '0');
// }
},
mounted() {
let _this = this;
//暂停
window.__pauseAudioView = function (parm) {
_this.changePlay(_this.id, '2');
}
//开始
window.__playAudioView = function (parm) {
_this.changePlay(_this.id, '1');
}
window.__closeAudioView = function (parm) {
_this.changePlay(_this.id, '0');
}
// let fiveListWrapper = fiveListHeight * this.cParamData.length;
// let screenHight = window.screen.height
// this.isShowfiveNoItem = false
// if(fiveListWrapper > screenHight) {
// this.$nextTick( ()=> {
// this.isShowfiveNoItem = true
// })
// }
},
filters: {
shortName: function(value, length = 10, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append
} else {
return value
}
},
},
methods: {
// orderAction(orderIndex) {
// this.searchForOrder('4', this.cSearchText, orderIndex, this.groupNum, this.parmData).then( param => {
// this.list = param
// })
// },
shortName(value, length = 10, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append
} else {
return value
}
},
goToPage(item) {
let itemData = {
"imageUrl": "",
"appModuleInfo": {
"code": "M200",
"type": 4,
"name": "课程介绍页",
"paramFlag": 1,
"paramList": []
}
};
if (!!item) {
itemData.title = item.name;
itemData.appModuleInfo["paramList"] = [{
"key": "className",
"value": 'com.picahealth.yunque.activitys.music.WebMusicListActivity###FiveMinutesMedicalSchoolWebViewController',
"type": 4,
"seqNo": 1
},
{
"key": "id",
"value": `${item.id}`,
"type": 1,
"seqNo": 2
}]
} else {
itemData.appModuleInfo.paramList = [{
"key": "className",
"value": 'com.picahealth.yunque.activitys.music.WebMusicListActivity###FiveMinutesMedicalSchoolWebViewController',
"type": 4,
"seqNo": 1
}]
}
let paramList = setEventByModuleCode(itemData.appModuleInfo);
this.$rocNative.dispatchEventByModuleCode({
modeCode: itemData.appModuleInfo.code,
jsonString: paramList
})
},
changePlay(id, str) {
//play : 1播放 2：暂停 0：初始状态
for (let i = 0; i < this.parmData.length; i++) {
if (id == this.parmData[i].id) {
if (str == '1') {
this.parmData[i].play = '1';
} else if (str == '2') {
this.parmData[i].play = '2';
} else if (str == '0') {
this.parmData[i].play = '0';
}
} else {
this.parmData[i].play = '0';
}
}
},
playFun(item) {
this.id = item.id; //保存id
this.changePlay(item.id, '1');
this.$rocNative.openFiveMintusAudio({
categoryName: item.categoryName,
appImageUrl: item.appImageUrl,
publishTime: item.publishTime,
id: item.id,
filePath: item.filePath,
title: this.getPureText(item.title),
size: item.size,
isPlay: true,
fileType: item.fileType,
totalTime: item.totalTime
})
},
// 将带高亮（标签）的文本处理成不带标签的
getPureText(title) {
let t1 = title.replace(/<span style="color:rgba\(244,122,72,1\)">/g, '')
return t1.replace(/<\/span>/g, '')
},
orderAction(orderIndex, orderDir) {
this.orderIndex = orderIndex
this.orderDir = orderDir
searchForOrder('2', this.cSearchText, orderIndex, this.orderDir, this.cParamData.length, this.parmData, this.userInfo.userToken).then( param => {
this.list = param
})
},
getTextByHT: function(rText) {
return rText.replace(/color:rgba/g, 'font-weight:700;color:rgba');
},
}
}
</script>
<style lang="scss" scoped>
@import '@/assets/style/mixin';
@import '@/assets/style/global';
.item-five {
width: px2rem(345px);
height: px2rem(70px);
margin: 0 auto;
border-bottom: 0.5px solid #F0F1F2;
// padding: px2rem(20px) 0;
margin: px2rem(10px) px2rem(15px) px2rem(20px);
box-sizing: border-box;
display: flex;
justify-content: space-between;
.left-info{
align-items: center;
span {
color: #BF9E15;
}
.top-title{
width: px2rem(280px);
line-height: px2rem(24px);
color: #373839;
font-size: px2rem(16px);
font-weight: 700;
span{
color: #F68367;
font-weight: 700;
}
}
.bottom-flag{
display: inline-block;
height: px2rem(17px);
line-height: px2rem(17px);
text-align: center;
background:rgba(255,253,250,1);
border: px2rem(0.5px) solid rgba(250,229,175,1);
color: #BF9E15;
font-size: px2rem(11px);
margin-top: px2rem(3px);
padding: 0 px2rem(3px) 0 ;
}
}
.right-img{
align-items: center;
width: px2rem(50px);
height: px2rem(50px);
position: relative;
img {
width: 100%;
height: 100%;
}
.play-img {
position: relative;
width: px2rem(28px);
height: px2rem(28px);
top: px2rem(-55px);
left: px2rem(0);
padding: px2rem(11px);
z-index: 1;
}
}
}
.is-last {
border-bottom: 0px solid #fff !important;
margin-bottom: 0 !important;
}
.ellipsis-1 {
width: 69%;
height: 0.8rem;
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 1;
white-space: nowrap;
}
</style>
components/search/SearchLecturerList.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<section>
<GroupTitle
:groupTitle="groupTitle"
:groupNum="groupNum"
:showTitle="showTitle"
:isShowNum="isShowNum"
:showOrder="showOrder"
/>
<div
v-bp="{ component_tag: '003#022004#讲师' }"
class="item-lecturer"
:class="{'first-item': index === 0, 'is-last': index == cParamData.length - 1 && isShowNum}"
v-for="(item, index) in cParamData"
:key="index"
@click="goToPage(item)"
>
<div class="left-info">
<img :src="item.avatarImageUrl">
</div>
<div class="right-info" :class="{'right-info-pt': isAndroid}">
<div><span class="name" v-html="getTextByHT(item.name)"></span><span class="expert" v-html="item.doctorDepartment"></span></div>
<div class="bottom-flag ellipsis-1">{{item.doctorHospital}}</div>
</div>
</div>
</section>
</template>
<script>
import { searchForOrder } from "@/utils/index";
import { mapGetters } from 'vuex'
import { getShareUrl } from '@/utils/index'
import GroupTitle from '@/components/search/GroupTitle';
export default {
name: 'SearchLecturerList',
components: {
GroupTitle,
},
props: {
dataObj: Object,
parmData: {
type: Array,
default: () => []
},
groupTitle: {
type: String,
default: '讲师'
},
isShowNum: {
isShowNum: Boolean,
default: true
},
groupNum: {
type: Number,
default: 0
},
showTitle: {
type: Boolean,
default: true
},
showOrder: {
type: Boolean,
default: false
},
isListPage: {
type: Boolean,
default: false
}
},
data() {
return {
list: [],
orderIndex: 2,
isAndroid: false,
orderDir: 2,
isShowLecturerNoItem: false
}
},
watch: {
orderNum(val) {
if ( !this.isListPage && this.groupNum > 0 ) {
this.orderIndex = 2
this.orderDir = 2
this.orderAction(2, 2)
}
},
},
computed: {
...mapGetters({
cSearchText: 'cSearchText',
orderNum: 'orderNum',
userInfo: 'userInfo',
}),
cParamData() {
if (this.list && this.list.length) {
return this.list
} else {
return this.parmData
}
}
},
created(){
},
mounted() {
this.isAndroid = window.__isAndroid
},
methods: {
//跳转讲师详情页面
goToPage(item){
let _this = this,
url = '', action_code = '', label_id = '';
url = getShareUrl('') +'/appl/#/teachersDetail?id='+item.id+"&from=appHome&userToken="+ _this.userInfo.userToken;
let paramList = [
{
"key":"pageUrl",
"value": url,
"type":4,
"seqNo":1
},{
"key":"showTitle",
"value": false,
"type":1,
"seqNo":2
},{
"key":"title",
"value": '',
"type":1,
"seqNo":3
}
]
this.$rocNative.dispatchEventByModuleCode({
modeCode: 'M300',
jsonString: paramList
})
},
orderAction(orderIndex, orderDir) {
this.orderIndex = orderIndex
this.orderDir = orderDir
searchForOrder('3', this.cSearchText, orderIndex, this.orderDir, this.cParamData.length, this.parmData, this.userInfo.userToken).then( param => {
this.list = param
})
},
getTextByHT: function(rText) {
return rText.replace(/color:rgba/g, 'font-weight:700;color:rgba');
},
}
}
</script>
<style lang="scss" scoped>
@import '@/assets/style/mixin';
@import '@/assets/style/global';
.item-lecturer{
display: flex;
width: px2rem(345px);
height: px2rem(80px);
margin: 0 auto;
border-bottom: 0.5px solid #F0F1F2;
padding: px2rem(20px) 0;
// margin: px2rem(10px) px2rem(15px) px2rem(20px);
box-sizing: border-box;
justify-content: flex-start;
align-items: center;
.left-info {
width: px2rem(40px);
height: px2rem(40px);
border-radius: 50%;
background-color: #ccc;
img{
width: 100%;
height: 100%;
display: block;
border-radius: 50%;
}
}
.right-info {
// height: px2rem(40px);
height: px2rem(40px);
// line-height: px2rem(16px);
margin-left: px2rem(12px);
.name {
color: #373839;
font-size: px2rem(15px);
font-weight: 700;
margin-right: px2rem(10px);
// span {
// margin-left: px2rem(10px);
// color: #F68367;
// font-size: px2rem(12px);
// }
}
.expert {
color: #676869;
font-weight: 400;
font-size: px2rem(12px);
}
.bottom-flag{
color: #979899;
font-size: px2rem(12px);
margin-top: px2rem(2px);
span{
color: #F68367;
}
}
&-pt {
padding-top: px2rem(2px);
}
}
}
.first-item {
padding-top: 0;
height: px2rem(60px);
}
.is-last {
border-bottom: 0px solid #fff !important;
// margin-bottom: 0 !important;
}
// .ellipsis-1 {
// width: 100%;
// height: 0.8rem;
// overflow: hidden;
// text-overflow: ellipsis;
// -webkit-line-clamp: 1;
// white-space: nowrap;
// }
</style>
components/search/SearchMedicalLiveList.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<section>
<GroupTitle
:groupTitle="groupTitle"
:groupNum="groupNum"
:showTitle="showTitle"
:isShowNum="isShowNum"
:showOrder="showOrder"
/>
<div
v-bp="{ component_tag: '003#022004#医直播' }"
:class="{'first-item': index === 0,
'is-last': index == cParamData.length - 1}"
class="item-live"
v-for="(item, index) in cParamData"
:key="index"
@click="jumpToLiveById(item)"
>
<header>
<span class="tag before-tag" v-if="item.liveStatus==1">预告</span>
<span class="tag ing-tag" v-if="item.liveStatus==5">
<span class="tag-i" :class="{'tag-i-ios': !isAndroid}">
<i class="i-one"></i>
<i class="i-two"></i>
<i class="i-three"></i>
</span>
<span class="ing-txt">直播中&nbsp;</span>
</span>
<span class="tag end-tag" v-if="item.liveStatus==10">已结束</span>
<span class="tag end-tag" v-if="item.liveStatus==15">去回顾</span>
</header>
<section>
<div class="live-info">
<div class="title ellipsis-2" v-html="getTextByHT(item.liveName)"></div>
<!-- <div class="info"><span class="lect-name" v-html="shortName(`<span style='color:red;'>我想</span>`, 20)"></span> -->
<div class="info ellipsis-1"><span class="lect-name" v-html="item.lecturerName + ' ' + item.lecturerHospital + ' ' + item.lecturerTitle"></span>
<!-- <div class="info"><span class="lect-name" v-html="shortName(item.lecturerName + item.lecturerHospital, 20)"></span> -->
</div>
<div class="time">
<span>{{item.liveTime}}</span>
<span v-show="item.liveStatus != 1" class="number">{{item.userNum}}{{getStatusText(item.liveStatus)}}</span>
</div>
</div>
<aside>
<img :src="item.imageUrl" />
</aside>
</section>
</div>
</section>
</template>
<script>
import { searchForOrder } from "@/utils/index";
import { mapGetters } from 'vuex'
import GroupTitle from '@/components/search/GroupTitle';
let mapLiveStatus = {1: '', 5: '人正在看', 10: '人已看', 15: '人已看'}
export default {
name: "SearchMedicalLiveList",
components: {
GroupTitle,
},
props: {
dataObj: Object,
parmData: {
type: Array,
default: () => []
},
groupTitle: {
type: String,
default: '医直播'
},
isShowNum: {
type: Boolean,
default: true
},
groupNum: {
type: Number,
default: 0
},
showTitle: {
type: Boolean,
default: true
},
showOrder: {
type: Boolean,
default: false
},
isListPage: {
type: Boolean,
default: false
}
},
data() {
return {
list: [],
orderIndex: 2,
orderDir: 2,
isAndroid: false,
isShowLiveNoItem: false
};
},
watch: {
orderNum(val) {
if ( !this.isListPage && this.groupNum > 0 ) {
this.orderIndex = 2
this.orderDir = 2
this.orderAction(2, 2)
}
},
},
computed: {
...mapGetters({
cSearchText: 'cSearchText',
orderNum: 'orderNum',
userInfo: 'userInfo',
}),
cParamData() {
if (this.list && this.list.length) {
return this.list
} else {
return this.parmData
}
}
},
created() {
},
mounted() {
this.isAndroid = window.__isAndroid
},
methods: {
// 跳转到直播详情页面
jumpToLiveById(item) {
let paramList = [
{
"key": "className",
"value": "com.picahealth.yunque.activitys.living.CourseLivingActivity###LiveStreamingViewController",
"type": 4,
"seqNo": 1
},
{
"key": "liveId",
"value": item.liveId,
"type": 1,
"seqNo": 2
},
{
"key": "liveUrl",
"value": item.receiveStreamAddressIdentification,
"type": 1,
"seqNo": 3
},
{
"key": "liveUrlGQ",
"value": item.receiveStreamAddress,
"type": 1,
"seqNo": 4
},
{
"key": "liveStatus",
"value": item.liveStatus,
"type": 1,
"seqNo": 5
},
{
"key": "loginFlag",
"value": item.liveStatus == 1 ? '0' : '1',
"type": 1,
"seqNo": 6
}
]
this.$rocNative.dispatchEventByModuleCode({
modeCode: 'M200',
jsonString: paramList
})
},
getStatusText(liveStatus) {
return mapLiveStatus[liveStatus]
},
shortName: function (value, length = 10, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append
} else {
return value
}
},
orderAction(orderIndex, orderDir) {
this.orderIndex = orderIndex
this.orderDir = orderDir
searchForOrder('5', this.cSearchText, orderIndex, this.orderDir, this.cParamData.length, this.parmData, this.userInfo.userToken).then( param => {
this.list = param
})
},
getTextByHT: function(rText) {
return rText.replace(/color:rgba/g, 'font-weight:700;color:rgba');
},
}
};
</script>
<style scoped lang="scss">
@import '@/assets/style/mixin';
@import '@/assets/style/global';
.item-live {
width: px2rem(345px);
margin: 0 auto;
box-sizing: border-box;
border-bottom: 0.5px solid #f0f1f2;
padding: px2rem(20px) 0;
header {
img {
width: px2rem(52px);
height: px2rem(15px);
}
}
section {
display: flex;
justify-content: space-between;
.live-info {
width: px2rem(254px);
height: px2rem(100px);
.title {
height: px2rem(42px);
line-height: px2rem(21px);
color: #373839;
font-size: px2rem(16px);
font-weight: 700;
}
.info {
font-size: px2rem(12px);
margin-top: px2rem(19px);
.lect-name {
color: #676869;
margin-left: 0;
}
span {
color: #979899;
margin-left: px2rem(8px);
}
}
.time {
margin-top: px2rem(6px);
font-size: px2rem(12px);
display: flex;
justify-content: space-between;
.number {
color: #979899;
}
}
}
aside {
width: px2rem(75px);
height: px2rem(100px);
img {
width: 100%;
height: 100%;
display: block;
}
}
}
}
.first-item {
padding-top: 0;
height: px2rem(144px);
}
.is-last {
border-bottom: 0px solid #fff !important;
// margin-bottom: 0 !important;
}
.tag-i{
width: px2rem(10px);
height: px2rem(12px);
position: relative;
top: -3px;
left: 0;
margin-left: 0;
float: right;
i{
width:px2rem(1px);
/* display: inline-block;*/
background: #fff;
position: absolute;
left:0;
bottom:0;
-webkit-animation: bodong 0.5s infinite ease-in-out alternate;
-moz-animation: bodong 0.5s infinite ease-in-out alternate;
-o-animation: bodong 0.5s infinite ease-in-out alternate;
-ms-animation: bodong 0.5s infinite ease-in-out alternate;
animation: bodong 0.5s infinite ease-in-out alternate;
}
.i-one{
height: px2rem(10px);
-webkit-animation-delay:0.1s;
-moz-animation-delay:0.1s;
-o-animation-delay:0.1s;
-ms-animation-delay:0.1s;
animation-delay:0.1s;
}
.i-two{
height: px2rem(5px);
left: 4px;
-webkit-animation-delay:0.3s;
-moz-animation-delay:0.3s;
-o-animation-delay:0.3s;
-ms-animation-delay:0.3s;
animation-delay:0.3s;
}
.i-three{
height:px2rem(7px);
left: 8px;
-webkit-animation-delay:0.5s;
-moz-animation-delay:0.5s;
-o-animation-delay:0.5s;
-ms-animation-delay:0.5s;
animation-delay:0.5s;
}
@-webkit-keyframes bodong {
0%{height:0;}
40%{height:8px;}
100%{height:4px;}
}
@-moz-keyframes bodong {
0%{height:0;}
40%{height:8px;}
100%{height:4px;}
}
@-o-keyframes bodong {
0% {height:0; }
40% {height:8px;}
100% {height:4px;}
}
@-ms-keyframes bodong {
0% {height:0; }
40% {height:8px;}
100% {height:4px;}
}
@keyframes bodong {
0% {height:0; }
40% {height:8px;}
100% {height:4px;}
}
}
.tag-i-ios {
top: -1px !important;
}
.tag{
font-size: px2rem(10px);
padding: px2rem(3px) px2rem(5px) px2rem(1px);
display: inline-block;
margin-bottom: px2rem(4px);
}
.before-tag{
border-radius: px2rem(1px);
background:#FFF9E6;
color: #BE994B
}
.ing-tag {
background: -webkit-linear-gradient(left, #8DC5BB , #449284);
background: -o-linear-gradient(right, #8DC5BB , #449284);
background: -moz-linear-gradient(right, #8DC5BB , #449284);
background: linear-gradient(to right, #8DC5BB , #449284);
border-radius: px2rem(2px);
color: #fff;
}
.end-tag {
border-radius: px2rem(2px);
background: #EFF2F6;
color: #8D8D8D
}
.ing-txt{
// float: left;
color: #fff;
}
.ellipsis-1 {
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 1;
white-space: nowrap;
}
.ellipsis-2 {
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 2;
white-space: wrap;
}
</style>
components/search/ShowAllItem.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<section class="show-wrapper" >
<span :class="{'margin-top15': needMarginTop}" @click="showAllItem">{{btnText}}</span>
</section>
</template>
<script>
export default {
data() {
return {
}
},
props: {
needMarginTop: {
type: Boolean,
default: false
},
btnText: {
type: String,
default: '查看全部'
},
itemIndex: {
type: String,
default: '0'
}
},
methods: {
showAllItem() {
this.$emit('showAllItem', this.itemIndex)
}
}
}
</script>
<style lang="scss" scoped>
@import '@/assets/style/mixin';
// @import '@/assets/style/global';
.show-wrapper {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-bottom: px2rem(6px);
span {
display: inline-block;
width: px2rem(345px);
height: px2rem(40px);
line-height: px2rem(40px);
margin-bottom: px2rem(15px);
text-align: center;
border-radius: px2rem(22px);
color: #676869;
background: #F8F9FA;
}
.margin-top15 {
margin-top: px2rem(15px);
}
}
</style>
components/search/SplitLine.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<div :style="{'height': height, 'background-color': bgColor}"></div>
</template>
<script>
export default {
props: {
height: {
type: String,
default: '1px'
},
bgColor: {
type: String,
default: '#F8F9FA'
}
}
}
</script>
<style lang="scss" scoped>
@import '@/assets/style/mixin';
// @import '@/assets/style/global';
</style>
jest.config.js 0 → 100644
浏览文件 @ bbc4f70e
module.exports = {
moduleNameMapper: {
'^@/(.*)$': '<rootDir>/$1',
'^~/(.*)$': '<rootDir>/$1',
'^vue$': 'vue/dist/vue.common.js'
},
moduleFileExtensions: ['js', 'vue', 'json'],
transform: {
'^.+\\.js$': 'babel-jest',
'.*\\.(vue)$': 'vue-jest'
},
'collectCoverage': true,
'collectCoverageFrom': [
'<rootDir>/components/**/*.vue',
'<rootDir>/pages/**/*.vue'
]
}
layouts/README.md 0 → 100644
浏览文件 @ bbc4f70e
# LAYOUTS
**This directory is not required, you can delete it if you don't want to use it.**
This directory contains your Application Layouts.
More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/views#layouts).
layouts/default.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<div>
<nuxt />
</div>
</template>
<style>
</style>
middleware/README.md 0 → 100644
浏览文件 @ bbc4f70e
# MIDDLEWARE
**This directory is not required, you can delete it if you don't want to use it.**
This directory contains your application middleware.
Middleware let you define custom functions that can be run before rendering either a page or a group of pages.
More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/routing#middleware).
nuxt.config copy.js 0 → 100644
浏览文件 @ bbc4f70e
module.exports = {
mode: 'universal',
/*
** Headers of the page
*/
head: {
title: process.env.npm_package_name || '云鹊医-赋能基层医生',
meta: [
{ charset: 'utf-8' },
// { name: 'viewport', content: 'width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui' },
{ name: 'screen-orientation', content: 'portrait' },
{ name: 'apple-mobile-web-app-capable', content: 'yes' },
{ name: 'format-detection', content: 'telephone=no' },
{ name: 'full-screen', content: 'yes' },
{ name: 'x5-fullscreen', content: 'true' },
{ name: 'referrer', content: 'never' }
],
link: [
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' },
// { rel: 'stylesheet', href: '/css/common.css' }
],
style: [
{ cssText: `
@charset "utf-8";html{color:#000;background:#fff;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html *{outline:0;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}html,body{font-family:PingFangSC-Regular,-apple-system-font,Source Han Sans,Helvetica Neue,sans-serif}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}abbr,acronym{border:0;font-variant:normal}del{text-decoration:line-through}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:500}ol,ul{list-style:none}caption,th{text-align:left}q:before,q:after{content:''}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}a:hover{text-decoration:underline}ins,a{text-decoration:none}
`, type: 'text/css' }
],
__dangerouslyDisableSanitizers: ['script'],
script: [
{ innerHTML: `
!function(a,b){function c(){var b=f.getBoundingClientRect().width;b/i>540&&(b=540*i);var c=b/10;f.style.fontSize=c+"px",k.rem=a.rem=c}var d,e=a.document,f=e.documentElement,g=e.querySelector('meta[name="viewport"]'),h=e.querySelector('meta[name="flexible"]'),i=0,j=0,k=b.flexible||(b.flexible={});if(g){console.warn("将根据已有的meta标签来设置缩放比例");var l=g.getAttribute("content").match(/initial\-scale=([\d\.]+)/);l&&(j=parseFloat(l[1]),i=parseInt(1/j))}else if(h){var m=h.getAttribute("content");if(m){var n=m.match(/initial\-dpr=([\d\.]+)/),o=m.match(/maximum\-dpr=([\d\.]+)/);n&&(i=parseFloat(n[1]),j=parseFloat((1/i).toFixed(2))),o&&(i=parseFloat(o[1]),j=parseFloat((1/i).toFixed(2)))}}if(!i&&!j){var p=(a.navigator.appVersion.match(/android/gi),a.navigator.appVersion.match(/iphone/gi)),q=a.devicePixelRatio;i=p?q>=3&&(!i||i>=3)?3:q>=2&&(!i||i>=2)?2:1:1,j=1/i}if(f.setAttribute("data-dpr",i),!g)if(g=e.createElement("meta"),g.setAttribute("name","viewport"),g.setAttribute("content","initial-scale="+j+", maximum-scale="+j+", minimum-scale="+j+", user-scalable=no"),f.firstElementChild)f.firstElementChild.appendChild(g);else{var r=e.createElement("div");r.appendChild(g),e.write(r.innerHTML)}a.addEventListener("resize",function(){clearTimeout(d),d=setTimeout(c,300)},!1),a.addEventListener("pageshow",function(a){a.persisted&&(clearTimeout(d),d=setTimeout(c,300))},!1),"complete"===e.readyState?e.body.style.fontSize=12*i+"px":e.addEventListener("DOMContentLoaded",function(){e.body.style.fontSize=12*i+"px"},!1),c(),k.dpr=a.dpr=i,k.refreshRem=c,k.rem2px=function(a){var b=parseFloat(a)*this.rem;return"string"==typeof a&&a.match(/rem$/)&&(b+="px"),b},k.px2rem=function(a){var b=parseFloat(a)/this.rem;return"string"==typeof a&&a.match(/px$/)&&(b+="rem"),b}}(window,window.lib||(window.lib={}));
`, type: 'text/javascript', charset: 'utf-8'}
]
},
/*
** Customize the progress-bar color
*/
loading: { color: '#fff' },
/*
** Global CSS
*/
css: [
'vant/lib/index.css'
],
/*
** Plugins to load before mounting the App
*/
plugins: [
{
src: '~/plugins/vue-inject',
ssr: false
}
],
/*
** Nuxt.js modules
*/
modules: [],
/*
** Build configuration
*/
router: {
// base: '/detection/' 上下文根据自己的需求自行打开修改
},
build: {
postcss: {
plugins: {
'postcss-pxtorem': {
rootValue: 37.5,
propList: ['*']
}
}
},
extractCSS: true,
filenames: {
app: ({ isDev }) => isDev ? '[name].js' : '[name].[chunkhash:7].js',
chunk: ({ isDev }) => isDev ? '[name].js' : '[name].[chunkhash:7].js',
css: ({ isDev }) => isDev ? '[name].css' : '[name].[contenthash:7].css',
img: ({ isDev }) => isDev ? '[path][name].[ext]' : 'img/[name].[hash:7].[ext]',
font: ({ isDev }) => isDev ? '[path][name].[ext]' : 'fonts/[name].[hash:7].[ext]',
video: ({ isDev }) => isDev ? '[path][name].[ext]' : 'videos/[name].[hash:7].[ext]'
},
/*
** You can extend webpack config here
*/
extend(config, ctx) {
config.devtool = ['dev', 'test'].indexOf(process.env.NUXT_ENV_APP) !== -1 ? 'source-map' : false;
}
}
}
\ No newline at end of file
nuxt.config.js 0 → 100644
浏览文件 @ bbc4f70e
module.exports = {
mode: 'universal',
/*
** Headers of the page
*/
head: {
title: process.env.npm_package_name || '云鹊医-赋能基层医生',
meta: [
{ charset: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui' },
{ name: 'screen-orientation', content: 'portrait' },
{ name: 'apple-mobile-web-app-capable', content: 'yes' },
{ name: 'format-detection', content: 'telephone=no' },
{ name: 'full-screen', content: 'yes' },
{ name: 'x5-fullscreen', content: 'true' },
{ name: 'referrer', content: 'never' }
],
link: [
{ rel: 'icon', type: 'image/x-icon', href: 'https://file.yunqueyi.com/static/favicon.ico' },
// { rel: 'stylesheet', href: '/css/common.css' }
],
style: [
{ cssText: `
@charset "utf-8";html{color:#000;background:#fff;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html *{outline:0;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}html,body{font-family:PingFangSC-Regular,-apple-system-font,Source Han Sans,Helvetica Neue,sans-serif}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}abbr,acronym{border:0;font-variant:normal}del{text-decoration:line-through}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:500}ol,ul{list-style:none}caption,th{text-align:left}q:before,q:after{content:''}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}a:hover{text-decoration:underline}ins,a{text-decoration:none}
`, type: 'text/css' }
],
__dangerouslyDisableSanitizers: ['script'],
script: [
{ innerHTML: `
!function(a,b){function c(){var b=f.getBoundingClientRect().width;b/i>540&&(b=540*i);var c=b/10;f.style.fontSize=c+"px",k.rem=a.rem=c}var d,e=a.document,f=e.documentElement,g=e.querySelector('meta[name="viewport"]'),h=e.querySelector('meta[name="flexible"]'),i=0,j=0,k=b.flexible||(b.flexible={});if(g){console.warn("将根据已有的meta标签来设置缩放比例");var l=g.getAttribute("content").match(/initial\-scale=([\d\.]+)/);l&&(j=parseFloat(l[1]),i=parseInt(1/j))}else if(h){var m=h.getAttribute("content");if(m){var n=m.match(/initial\-dpr=([\d\.]+)/),o=m.match(/maximum\-dpr=([\d\.]+)/);n&&(i=parseFloat(n[1]),j=parseFloat((1/i).toFixed(2))),o&&(i=parseFloat(o[1]),j=parseFloat((1/i).toFixed(2)))}}if(!i&&!j){var p=(a.navigator.appVersion.match(/android/gi),a.navigator.appVersion.match(/iphone/gi)),q=a.devicePixelRatio;i=p?q>=3&&(!i||i>=3)?3:q>=2&&(!i||i>=2)?2:1:1,j=1/i}if(f.setAttribute("data-dpr",i),!g)if(g=e.createElement("meta"),g.setAttribute("name","viewport"),g.setAttribute("content","initial-scale="+j+", maximum-scale="+j+", minimum-scale="+j+", user-scalable=no"),f.firstElementChild)f.firstElementChild.appendChild(g);else{var r=e.createElement("div");r.appendChild(g),e.write(r.innerHTML)}a.addEventListener("resize",function(){clearTimeout(d),d=setTimeout(c,300)},!1),a.addEventListener("pageshow",function(a){a.persisted&&(clearTimeout(d),d=setTimeout(c,300))},!1),"complete"===e.readyState?e.body.style.fontSize=12*i+"px":e.addEventListener("DOMContentLoaded",function(){e.body.style.fontSize=12*i+"px"},!1),c(),k.dpr=a.dpr=i,k.refreshRem=c,k.rem2px=function(a){var b=parseFloat(a)*this.rem;return"string"==typeof a&&a.match(/rem$/)&&(b+="px"),b},k.px2rem=function(a){var b=parseFloat(a)/this.rem;return"string"==typeof a&&a.match(/px$/)&&(b+="rem"),b}}(window,window.lib||(window.lib={}));
`, type: 'text/javascript', charset: 'utf-8'}
]
},
/*
** Customize the progress-bar color
*/
loading: { color: '#fff' },
/*
** Global CSS
*/
css: [
'vant/lib/index.css'
],
/*
** Plugins to load before mounting the App
*/
plugins: [
{
src: '~/plugins/vue-inject',
ssr: false
},
{
src: '~/plugins/vue-components',
ssr: false
},
// {
// src: '~/utils/wxShare',
// ssr: false
// }
],
/*
** Nuxt.js modules
*/
modules: [],
/*
** Build configuration
*/
router: {
base: '/sousuo_ssr/', // 上下文根据自己的需求自行打开修改
extendRoutes (routes, resolve) {
routes.push({
name: 'search',
path: '*',
component: resolve(__dirname, 'pages/index.vue')
})
}
},
build: {
postcss: {
plugins: {
'postcss-pxtorem': {
rootValue: 37.5,
propList: ['*']
}
}
},
extractCSS: true,
filenames: {
app: ({ isDev }) => isDev ? '[name].js' : '[name].[chunkhash:7].js',
chunk: ({ isDev }) => isDev ? '[name].js' : '[name].[chunkhash:7].js',
css: ({ isDev }) => isDev ? '[name].css' : '[name].[contenthash:7].css',
img: ({ isDev }) => isDev ? '[path][name].[ext]' : 'img/[name].[hash:7].[ext]',
font: ({ isDev }) => isDev ? '[path][name].[ext]' : 'fonts/[name].[hash:7].[ext]',
video: ({ isDev }) => isDev ? '[path][name].[ext]' : 'videos/[name].[hash:7].[ext]'
},
/*
** You can extend webpack config here
*/
extend(config, ctx) {
config.devtool = ['dev', 'test'].indexOf(process.env.NUXT_ENV_APP) !== -1 ? 'source-map' : false;
}
}
}
\ No newline at end of file
package copy.json 0 → 100644
浏览文件 @ bbc4f70e
{
"name": "nuxt-ssr",
"version": "1.0.0",
"description": "nuxt ssr layout",
"author": "souse",
"private": true,
"scripts": {
"test": "jest",
"dev": "cross-env NODE_ENV=development NUXT_ENV_APP=dev PORT=4000 nodemon server/index.js --watch server",
"build": "NUXT_ENV_APP=${ENV} nuxt build",
"start": "cross-env NUXT_ENV_APP=${ENV} HOST=0.0.0.0 NODE_ENV=production node server/index.js",
"generate": "nuxt generate"
},
"dependencies": {
"cookie-universal": "^2.0.16",
"cross-env": "^5.2.0",
"koa": "^2.6.2",
"nuxt": "^2.0.0",
"vant": "^2.0.9"
},
"devDependencies": {
"@nuxtjs/axios": "^5.5.4",
"@vue/test-utils": "^1.0.0-beta.27",
"babel-core": "7.0.0-bridge.0",
"babel-jest": "^24.1.0",
"jest": "^24.1.0",
"less": "^3.9.0",
"less-loader": "^5.0.0",
"nodemon": "^1.18.9",
"postcss-pxtorem": "^4.0.1",
"qs": "^6.7.0",
"vue-jest": "^3.0.3"
}
}
package-lock.json 0 → 100644
浏览文件 @ bbc4f70e
因为 它太大了无法显示 源差异 。您可以改为 查看blob。
package.json 0 → 100644
浏览文件 @ bbc4f70e
{
"name": "nuxt-ssr",
"version": "1.0.0",
"description": "nuxt ssr layout",
"author": "souse",
"private": true,
"scripts": {
"test": "jest",
"dev": "cross-env NODE_ENV=development NUXT_ENV_APP=dev HOST=0.0.0.0 PORT=3000 nodemon server/index.js --watch server",
"build": "NUXT_ENV_APP=${ENV} nuxt build",
"start": "cross-env NUXT_ENV_APP=${ENV} HOST=0.0.0.0 PORT=3006 NODE_ENV=production node server/index.js",
"generate": "nuxt generate"
},
"dependencies": {
"cookie-universal": "^2.0.16",
"cross-env": "^5.2.0",
"js-base64": "^2.5.1",
"koa": "^2.6.2",
"mint-ui": "^2.2.13",
"nuxt": "^2.0.0",
"pica-call-app": "^1.0.33",
"pica-topic-stencil": "^1.1.83",
"vant": "^2.0.9",
"weixin-js-sdk": "^1.4.0-test"
},
"devDependencies": {
"@nuxtjs/axios": "^5.5.4",
"@vue/test-utils": "^1.0.0-beta.27",
"babel-core": "7.0.0-bridge.0",
"babel-jest": "^24.1.0",
"jest": "^24.1.0",
"less": "^3.9.0",
"less-loader": "^5.0.0",
"node-sass": "^4.12.0",
"nodemon": "^1.18.9",
"postcss-pxtorem": "^4.0.1",
"qs": "^6.7.0",
"sass-loader": "^7.2.0",
"vue-jest": "^3.0.3"
}
}
pages/index.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<div >
<div class="top-bar-height"></div>
<form @submit.prevent="search" action="/">
<div class="search-container">
<img class="search-container-img pt-22" @click.stop="back" src="../assets/images/sousuo/left-arrow-black.png"/>
<div class="search-content">
<!--<span class="search-container-img2 search-black">
<img
class="search-container-img" :class="{'ios-top': isIOS}"
@click.stop="back"
src="../images/sousuo/search-black.png"
/>
</span>-->
<van-search
v-bp="{ component_tag: '003#022002' }"
v-model="searchText"
:maxlength="20"
:placeholder="pSearchText"
class="search-container-input"
:show-action="appVerstion >= 308"
@search="search">
<!--<img class="search-voice" slot="label" src="../images/sousuo/search-black.png" alt="">-->
<img class="search-black" slot="left-icon" src="../assets/images/sousuo/search-black.png" alt="">
<div v-if="appVerstion >= 308" class="voice-container" slot="action"><span></span><img class="voice-search" @click="awakeVoiceSearch" src="../assets/images/sousuo/icon-voice.svg" alt=""></div>
</van-search>
<span v-bp="{ component_tag: '003#022003' }" class="search-container-cancle" @click.prevent="search">搜索</span>
</div>
</div>
<button v-bp="{ component_tag: '003#022003' }" v-show="false" type="submit" />
</form>
<div class="pd-80"></div>
<HistoryLabels/>
<HotLabels/>
</div>
</template>
<script>
import SplitLine from '../components/search/SplitLine';
import HistoryLabels from '@/components/search/HistoryLabels';
import HotLabels from '@/components/search/HotLabels';
import VanSearch from 'vant/lib/search';
import { mapGetters, mapActions } from 'vuex';
// import { getHotLabels, getHotLabelsService } from '@/service';
import { getHotLabelsService } from '@/service';
// import 'vant/lib/search/style';
const cookies = require('cookie-universal')();
export default {
data() {
return {
searchText: '',
pSearchText: '',
token: 'C8D5E10A1F1243D38DFFE9BE5D8C5601',
needShowFirstTime: true,
isOnFocus: false,
isIOS: false,
isWeb: true
}
},
components: {
SplitLine,
HistoryLabels,
HotLabels,
VanSearch
},
computed: {
...mapGetters({
statusBarHeight: 'statusBarHeight',
refreshNum: 'refreshNum',
userInfo: 'userInfo',
}),
appVerstion() {
let appVersion = this.userInfo.appVersion || '300';
cookies.set('appVersion', parseInt(appVersion.replace(/\./g, '')))
return appVersion.split('.').join('')
},
},
created() {
if (process.client) {
let _self = this;
this.isWeb = this.$rocNative.isWeb
if(this.isWeb) {
_self.getHotLabels()
}
}
},
mounted() {
if(!this.isWeb) {
this.getUserInfo()
}
},
methods: {
...mapActions({
setUserInfo: 'setUserInfo',
}),
awakeVoiceSearch() {
this.$rocNative.gotoVoiceSearchActivity()
},
// 跳转到结果页面，并
search() {
this.$router.push({
path: '/result',
query: {
searchText: this.searchText || this.pSearchText,
pageFrom: 'searchIndex',
token: this.token || 'C8D5E10A1F1243D38DFFE9BE5D8C5601'
}
})
},
// 获取输入框中要显示的内容
getHotLabels() {
getHotLabelsService({type: 1}).then(res => {
if (res.code == '000000') {
if (res.data && res.data.length) {
let index = Math.floor(Math.random() * res.data.length)
this.pSearchText = res.data[index].keyword
}
}
// this.allLabels = res.data;
});
},
// 获取用户信息
getUserInfo() {
this.$rocNative
.getUserInfo()
.then(params => {
this.setUserInfo(params)
this.token = params.userToken
this.getHotLabels()
// this.getData()
// this.userMobile = params.userMobile;
});
},
back() {
this.$rocNative.goBack()
},
},
}
</script>
<style lang="scss">
@import '@/assets/style/mixin';
// .van-cell__value {
// top: px2rem(2px) !important;
// }
.van-field__control {
margin-top: px2rem(4px) !important;
}
.mint-search {
position: fixed;
top: 0px;
z-index: 2;
height: 66px;
width: 100%;
/* margin: 0 20px; */
border-bottom: 0.5px solid #E7E7E7 !important;
background-color: #fff;
}
.mint-searchbar {
position: relative;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background: #fff;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin: 0 10px;
padding: 30px 10px 8px;
z-index: 1;
}
.mint-searchbar-cancel {
margin-left: 10px;
font-size: 14px ;
color: #999;
text-decoration: none;
}
.mint-searchbar-inner {
background: #F5F6F6;
}
.mint-searchbar-core {
color: #555555;
background: #F5F6F6;
}
</style>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
@import '@/assets/style/mixin';
@import '@/assets/style/global';
.pd-80 {
padding-top: px2rem(80px);
}
.mt-100 {
padding-top: px2rem(63px) !important;
}
.search-icon {
font-size: 20px;
}
.search-icon:before {
content: "\E604";
}
.search-container {
display: flex;
position: fixed;
top: 0;
left: 0;
z-index: 3;
width: 100%;
flex-direction: row;
text-align: center;
// padding: px2rem(30px) 0 px2rem(4px);
padding: px2rem(40px) 0 px2rem(12.5px);
background: #fff;
// border-bottom: 1px solid #E7E7E7;
&-img {
/* padding: 0 0 px2rem(10px) px2rem(16px);*/
position: absolute;
bottom: px2rem(18px);
left: px2rem(16px);
width: px2rem(20px);
height: px2rem(20px);
// transform: rotate(180deg);
}
// .pt-22 {
// /* padding-bottom: px2rem(20px);*/
// }
&-img2 {
position: absolute;
top: px2rem(13px);
left: px2rem(35px);
z-index: 2;
img {
width: px2rem(25px);
height: px2rem(25px);
}
}
&-img3 {
position: absolute;
top: px2rem(9px);
left: px2rem(274px);
z-index: 2;
img {
width: px2rem(22px);
height: px2rem(22px);
}
}
&-input {
display: inline-flex;
flex: 1;
position: relative;
left: px2rem(0px);
width: px2rem(280px);
height: px2rem(30px);
margin-left: px2rem(0px);
// padding-left: px2rem(26px);
// padding-right: px2rem(28px);
border-radius: px2rem(4px);
background: rgba(246, 246, 246, 1);
font-size: px2rem(13px);
color: #666;
-webkit-appearance: none;
vertical-align: bottom;
}
&-cancle {
position: relative;
/* top: px2rem(1px);*/
top: px2rem(-6px);
left: px2rem(4px);
height: px2rem(14px);
line-height: px2rem(14px);
margin-top: px2rem(2px);
font-size: px2rem(14px);
color: #373839;
vertical-align: baseline;
}
.search-content {
margin-left: px2rem(40px);
}
}
.top-bar-height {
position: fixed;
height: px2rem(20px);
width: 100%;
top: 0;
left: 0;
z-index: 2;
background: #fff;
}
input::-webkit-search-decoration,
input::-webkit-search-cancel-button {
display: none;
}
.ios-top {
padding-top: px2rem(22.5px);
}
.search-black>img{
padding: 0;
}
.lux-close {
position: absolute;
width: 25px;
height: 25px;
top: 15.5px;
right: 10px;
background-image: url('../assets/images/sousuo/search-black.png');
background-repeat: no-repeat;
background-size: contain;
}</style>
pages/result.vue 0 → 100644
浏览文件 @ bbc4f70e
<template>
<section id="navbar-container-wrapper">
<div class="top-bar-height"></div>
<form @submit.prevent="search" action="/">
<div class="search-container">
<img
class="search-container-img pt-22"
@click.stop="back"
src="../assets/images/sousuo/left-arrow-black.png"
/>
<div class="search-content">
<van-search
v-bp="{ component_tag: '003#022002' }"
v-model="searchText"
:maxlength="20"
:id="'focusInput'"
:show-action="appVerstion >= 308"
class="search-container-input"
@search="search"
>
<img
class="search-black"
slot="left-icon"
src="../assets/images/sousuo/search-black.png"
alt
/>
<div v-if="appVerstion >= 308" class="voice-container" slot="action">
<span></span>
<img
class="voice-search"
@click="awakeVoiceSearch"
src="../assets/images/sousuo/icon-voice.svg"
alt
/>
</div>
</van-search>
<span
v-bp="{ component_tag: '003#022003' }"
class="search-container-cancle"
@click.prevent="search"
>搜索</span>
</div>
</div>
<button v-show="false" v-bp="{ component_tag: '003#022003' }" type="submit" />
</form>
<div v-show="allNum != 0" class="category-wrapper">
<div class="category-wrapper-list">
<!-- <img class="pn-left" :src="pnLeft"> -->
<img class="pn-left" src="../assets/images/search/pn-left.png" />
<span
v-bp="{ component_tag: '003#022005#' + item }"
class="item"
@click.stop="clickCategory(index)"
v-for="(item, index) in ['综合', '课程', '5分钟医学院', '讲师', '健康知识', '医直播']"
:key="index"
>
<span class="item-text" :class="{'active-text': categoryIndex == index}">{{item}}</span>
<span class="item-flag" :class="{'active-flag': categoryIndex == index}"></span>
</span>
<!-- <img class="pn-right" :src="pnRight"> -->
<img class="pn-right" src="../assets/images/search/pn-right.png" />
</div>
<div v-if="isIOS" class="scroll-hide"></div>
</div>
<!-- 综合 -->
<div v-show="categoryIndex == 0 && allNum > 0" class="category-wrapper-content">
<div v-for="mIndex in displayOrder" :key="mIndex">
<!-- 课程 -->
<div v-if="contentAppModelCount && mIndex == 1">
<SearchCourseList
:parmData="contentAppModels"
:groupNum="contentAppModelCount"
:isListPage="true"
></SearchCourseList>
<ShowAllItem
v-bp="{ component_tag: '003#022006#课程' }"
@showAllItem="showAllItem"
itemIndex="1"
v-if="contentAppModelCount > 4"
></ShowAllItem>
<SplitLine v-if="displayOrder[4] != 1" height="6px" />
</div>
<!-- 5分钟 -->
<div v-if="fiveMinutesMedicalContentListCount && mIndex == 2">
<SearchFiveMedicalList
:parmData="fiveMinutesMedicalContentList"
:groupNum="fiveMinutesMedicalContentListCount"
:isListPage="true"
></SearchFiveMedicalList>
<ShowAllItem
v-bp="{ component_tag: '003#022006#5分钟医学院' }"
@showAllItem="showAllItem"
itemIndex="2"
v-if="fiveMinutesMedicalContentListCount > 4"
></ShowAllItem>
<SplitLine height="6px" v-if="displayOrder[4] != 2" />
</div>
<!-- 健康知识 -->
<div v-if="educationContentCount && mIndex == 3">
<HealthComics
:parmData="educationContents"
:groupNum="educationContentCount"
:isListPage="true"
/>
<ShowAllItem
v-bp="{ component_tag: '003#022006#健康知识' }"
@showAllItem="showAllItem"
itemIndex="4"
v-if="educationContentCount > 4"
></ShowAllItem>
<SplitLine height="6px" v-if="displayOrder[4] != 3" />
</div>
<!-- 讲师 -->
<div v-if="pCourseDoctorModelCount && mIndex == 4">
<SearchLecturerList
:parmData="pCourseDoctorModels"
:groupNum="pCourseDoctorModelCount"
:isListPage="true"
></SearchLecturerList>
<ShowAllItem
v-bp="{ component_tag: '003#022006#讲师' }"
@showAllItem="showAllItem"
itemIndex="3"
v-if="pCourseDoctorModelCount > 4"
:needMarginTop="true"
></ShowAllItem>
<SplitLine height="6px" v-if="displayOrder[4] != 4" />
</div>
<!-- 医直播 -->
<div v-if="liveModelListCount && mIndex == 5">
<SearchMedicalLiveList
:parmData="liveModelList"
:groupNum="liveModelListCount"
:isListPage="true"
></SearchMedicalLiveList>
<ShowAllItem
v-bp="{ component_tag: '003#022006#医直播' }"
@showAllItem="showAllItem"
itemIndex="5"
v-if="liveModelListCount > 4"
:needMarginTop="true"
></ShowAllItem>
<SplitLine height="6px" v-if="displayOrder[4] != 5" />
</div>
</div>
<NoMoreItem v-if="allNum > 10"></NoMoreItem>
</div>
<!-- 综合 没有搜索到内容 -->
<div class="pt-170" v-show="allNum == 0">
<NoResultPage></NoResultPage>
<SplitLine height="6px" />
<CourseAdjust></CourseAdjust>
</div>
<!-- 课程 -->
<div id="course-list-wrapper" v-show="categoryIndex == 1 && contentAppModelCount" class="category-wrapper-content">
<SearchCourseList
:parmData="contentAppModelsAll"
:groupNum="contentAppModelCount"
:groupTitle="getGroupTitle(contentAppModelCount)"
:isShowNum="false"
:showOrder="true"
/>
<NoMoreItem v-if="isShowCourseNoItem"></NoMoreItem>
</div>
<!-- 5分钟 -->
<div id="five-list-wrapper"
v-show="categoryIndex == 2 && fiveMinutesMedicalContentListCount"
class="category-wrapper-content"
>
<SearchFiveMedicalList
:parmData="fiveMinutesMedicalContentListAll"
:groupNum="fiveMinutesMedicalContentListCount"
:groupTitle="getGroupTitle(fiveMinutesMedicalContentListCount)"
:isShowNum="false"
:showOrder="true"
/>
<NoMoreItem v-if="isShowFiveNoItem"></NoMoreItem>
</div>
<!-- 讲师 -->
<div id="lecturer-list-wrapper" v-show="categoryIndex == 3 && pCourseDoctorModelCount" class="category-wrapper-content">
<SearchLecturerList
:parmData="pCourseDoctorModelsAll"
:groupNum="pCourseDoctorModelCount"
:groupTitle="getGroupTitle(pCourseDoctorModelCount)"
:isShowNum="false"
/>
<NoMoreItem v-if="isShowLecturerNoItem"></NoMoreItem>
</div>
<!-- 健康知识 -->
<div id="comic-list-wrapper" v-show="categoryIndex == 4 && educationContentCount" class="category-wrapper-content">
<HealthComics
:parmData="educationContentsAll"
:groupNum="educationContentCount"
:groupTitle="getGroupTitle(educationContentCount)"
:isShowNum="false"
:showOrder="true"
/>
<NoMoreItem v-if="isShowComicNoItem"></NoMoreItem>
</div>
<!-- 医直播 -->
<div id="live-list-wrapper" v-show="categoryIndex == 5 && liveModelListCount" class="category-wrapper-content">
<SearchMedicalLiveList
:parmData="liveModelListAll"
:groupNum="liveModelListCount"
:groupTitle="getGroupTitle(liveModelListCount)"
:isShowNum="false"
/>
<NoMoreItem v-if="isShowLiveNoItem"></NoMoreItem>
</div>
<!-- Tap页面没有内容时 -->
<div
class="pt-170"
v-show="(categoryIndex == 1 && contentAppModelCount == 0)
|| (categoryIndex == 2 && fiveMinutesMedicalContentListCount == 0)
|| (categoryIndex == 3 && pCourseDoctorModelCount == 0)
|| (categoryIndex == 4 && educationContentCount == 0)
|| (categoryIndex == 5 && liveModelListCount == 0)"
>
<NoResultPage></NoResultPage>
</div>
<Loading v-show="showLoading" />
<BackTop ref="refBackTop" @backTop="isShowTop=false" v-show="isShowTop" />
</section>
</template>
<script>
import VanSearch from "vant/lib/search";
import HealthComics from "@/components/search/HealthComicsNew";
import ShowAllItem from "@/components/search/ShowAllItem";
import SearchCourseList from "@/components/search/SearchCourseList";
import SearchFiveMedicalList from "@/components/search/SearchFiveMedicalList";
import SearchLecturerList from "@/components/search/SearchLecturerList";
import SearchMedicalLiveList from "@/components/search/SearchMedicalLiveList";
import SplitLine from "@/components/search/SplitLine";
import NoMoreItem from "@/components/search/NoMoreItem";
import NoResultPage from "@/components/search/NoResultPage";
import Loading from "@/components/search/Loading";
import CourseAdjust from "@/components/search/CourseAdjust";
import BackTop from "@/components/search/BackTop";
import { mapGetters, mapActions } from "vuex";
import { sousuoSearch } from '@/service';
import { handelFive, spliceCertenNumData } from '@/utils'
let heardHeight = 140;
let courseListHeight = 110;
let fiveListHeight = 87;
let lecturerListHeight = 66;
let comicListHeight = 110;
let liveListHeight = 152;
export default {
data() {
return {
token: "",
showOrder: true,
showLoading: false,
searchText: "",
showTitle: false,
showOrder: true,
adjustList: [],
categoryIndex: 0,
displayOrder: [],
isIOS: false,
isShowTop: false,
showNoItem: false,
showZHNoItem: false,
isShowCourseNoItem: false,
isShowFiveNoItem: false,
isShowLecturerNoItem: false,
isShowComicNoItem: false,
isShowLiveNoItem: false,
}
},
computed: {
...mapGetters({
displayConfig: "displayConfig",
orderNum: "orderNum",
refreshNum: "refreshNum",
userInfo: "userInfo"
}),
appVerstion() {
let appVersion = this.userInfo.appVersion || "300";
return appVersion.split(".").join("");
}
},
components: {
VanSearch,
HealthComics,
SplitLine,
SearchCourseList,
SearchFiveMedicalList,
SearchLecturerList,
SearchMedicalLiveList,
ShowAllItem,
NoMoreItem,
NoResultPage,
Loading,
CourseAdjust,
BackTop
},
async asyncData( context ) {
console.log(context)
// 去掉特殊字符
let str2 = (context.query && context.query.searchText || '').replace(
/[\-\_\,\!\|\~\`\(\)\#\$\%\^\&\*\{\}\:\;\"\L\<\>\?\/\\]/g, '');
// 将搜索的字符串保存到Store中
context.store.dispatch('setCSearchText', str2);
let params = {
searchCategory: "1,2,3,4,5",
searchValue: str2,
keywordColor: "rgba(244,122,72,1)",
sortItem: 0,
dir: 0,
pageNo: 1,
pageSize: 100,
token: context.query && context.query.token || '',
setEntry: "headers"
};
let rezult = await sousuoSearch(params);
if (rezult.code == "000000") {
let cData = rezult.data
let allNum = spliceCertenNumData(cData.contentAppModels, 4).length +
spliceCertenNumData(cData.fiveMinutesMedicalContentList, 4).length +
spliceCertenNumData(cData.pCourseDoctorModels, 4).length +
spliceCertenNumData(cData.educationContents, 4).length +
spliceCertenNumData(cData.liveModelList, 4).length
const vmData = {
categoryIndex: 0,
displayOrder: cData.displayOrder,
contentAppModels: spliceCertenNumData(cData.contentAppModels, 4),
contentAppModelsAll: cData.contentAppModels,
contentAppModelCount: cData.contentAppModelCount,
fiveMinutesMedicalContentList: handelFive(spliceCertenNumData(cData.fiveMinutesMedicalContentList, 4)),
fiveMinutesMedicalContentListAll: handelFive(cData.fiveMinutesMedicalContentList || []),
fiveMinutesMedicalContentListCount: cData.fiveMinutesMedicalContentListCount,
pCourseDoctorModels: spliceCertenNumData(cData.pCourseDoctorModels, 4),
pCourseDoctorModelsAll: cData.pCourseDoctorModels,
pCourseDoctorModelCount: cData.pCourseDoctorModelCount,
educationContents: spliceCertenNumData(cData.educationContents, 4),
educationContentsAll: cData.educationContents,
educationContentCount: cData.educationContentCount,
liveModelList: spliceCertenNumData(cData.liveModelList, 4),
liveModelListAll: cData.liveModelList,
liveModelListCount: cData.liveModelCount,
allNum: allNum
}
// 将搜索的字符串保存到Store中
context.store.dispatch('setDisplayConfig', {
courseDisplayFlag: cData.courseDisplayFlag || 0,
courseDisplayContent: cData.courseDisplayContent || "",
courseDisplayParam: cData.courseDisplayParam || [],
educationComtentDisplayFlag:
cData.educationComtentDisplayFlag || 0,
educationComtentDisplayContent:
cData.educationComtentDisplayContent || "",
educationComtentDisplayParam: cData
.educationComtentDisplayParam || {
id: 1,
name: "高血压",
seqNo: "1"
}
});
context.store.dispatch('setOrderNum', 2)
context.store.dispatch('setRefreshNum', 2)
return vmData;
} else {
context.store.dispatch('setRefreshNum', 2)
return {
contentAppModelCount: 0,
contentAppModels: [],
contentAppModelsAll: [],
educationContentCount: 0,
educationContents: [],
educationContentsAll: [],
fiveMinutesMedicalContentListCount: 0,
fiveMinutesMedicalContentList: [],
fiveMinutesMedicalContentListAll: [],
pCourseDoctorModelCount: 0,
pCourseDoctorModels: [],
pCourseDoctorModelsAll: [],
liveModelListCount: 0,
liveModelList: [],
liveModelListAll: [],
allNum: 0
}
}
},
created() {
if (process.client) {
this.searchText = this.$route.query.searchText.substr(0, 20) || "";
let _this = this;
// 暂时隐藏
if (this.$rocNative.isWeb) {
// _this.search();
}
// window.__refresh = function(params) {
// // alert('__refresh' + JSON.stringify(params))
// };
window.__setSearchText = function(params) {
_this.searchText = params.searchText;
_this.search();
};
window.addEventListener("scroll", this.scrollFun);
}
},
mounted() {
if(!this.$rocNative.isWeb) {
this.getUserInfo();
}
// this.search()
this.computedShowNoItem()
},
methods: {
...mapActions({
setCSearchText: "setCSearchText",
setOrderNum: "setOrderNum",
setRefreshNum: "setRefreshNum",
setDisplayConfig: "setDisplayConfig"
}),
computedShowNoItem() {
let screenHight = window.screen.height
let courseListWrapper = courseListHeight * this.contentAppModelCount;
let fiveListWrapper = fiveListHeight * this.fiveMinutesMedicalContentListCount;
let lectureListWrapper = lecturerListHeight * this.pCourseDoctorModelCount;
let comicListWrapper = comicListHeight * this.educationContentCount;
let liveListWrapper = liveListHeight * this.liveModelListCount;
this.isShowCourseNoItem = false
this.isShowFiveNoItem = false
this.isShowLecturerNoItem = false
this.isShowComicNoItem = false
this.isShowLiveNoItem = false
if(courseListWrapper > screenHight) {
this.isShowCourseNoItem = true
}
if(fiveListWrapper > screenHight) {
this.isShowFiveNoItem = true
}
if(lectureListWrapper > screenHight) {
this.isShowLecturerNoItem = true
}
if(comicListWrapper > screenHight) {
this.isShowComicNoItem = true
}
if(liveListWrapper > screenHight) {
this.isShowLiveNoItem = true
}
},
// 唤起搜索的语音助手
awakeVoiceSearch() {
this.$rocNative.gotoVoiceSearchActivity();
},
// 获取用户信息
getUserInfo() {
this.$rocNative
.getUserInfo()
.then(params => {
this.setUserInfo(params)
this.token = params.userToken;
this.search();
});
},
// 查看全部按钮
showAllItem(index) {
this.categoryIndex = index;
this.backTop();
},
// 搜索结果
search() {
this.backTop();
this.allNum = 1;
this.showLoading = true;
let str2 = (this.searchText || "").replace(
/[\-\_\,\!\|\~\`\(\)\#\$\%\^\&\*\{\}\:\;\"\L\<\>\?\/\\]/g,
""
); // 去掉特殊字符
this.setCSearchText(str2);
let _this = this,
para = {
searchCategory: "1,2,3,4,5",
searchValue: str2,
keywordColor: "rgba(244,122,72,1)",
sortItem: 0,
dir: 0,
pageNo: 1,
pageSize: 100,
token: _this.token,
setEntry: "headers"
};
// let url = "contents/searchKeyword/v2/search";
// this.GET(url, para).then(res => {
sousuoSearch(para).then(res => {
this.showLoading = false;
if (res.code == "000000") {
_this.categoryIndex = 0;
_this.displayOrder = res.data.displayOrder;
_this.setDisplayConfig({
courseDisplayFlag: res.data.courseDisplayFlag || 0,
courseDisplayContent: res.data.courseDisplayContent || "",
courseDisplayParam: res.data.courseDisplayParam || [],
educationComtentDisplayFlag:
res.data.educationComtentDisplayFlag || 0,
educationComtentDisplayContent:
res.data.educationComtentDisplayContent || "",
educationComtentDisplayParam: res.data
.educationComtentDisplayParam || {
id: 1,
name: "高血压",
seqNo: "1"
}
});
// _this.$nextTick(function() {
// 课程
_this.contentAppModels = spliceCertenNumData(
res.data.contentAppModels, 4
);
_this.contentAppModelsAll = res.data.contentAppModels;
_this.contentAppModelCount = res.data.contentAppModelCount;
// 5分钟医学
_this.fiveMinutesMedicalContentList = handelFive(spliceCertenNumData(
res.data.fiveMinutesMedicalContentList, 4
));
_this.fiveMinutesMedicalContentListAll = handelFive(
res.data.fiveMinutesMedicalContentList || []
);
_this.fiveMinutesMedicalContentListCount = res.data.fiveMinutesMedicalContentListCount;
// 讲师
_this.pCourseDoctorModels = spliceCertenNumData(
res.data.pCourseDoctorModels, 4
);
_this.pCourseDoctorModelsAll = res.data.pCourseDoctorModels;
_this.pCourseDoctorModelCount = res.data.pCourseDoctorModelCount;
// 健康漫画
_this.educationContents = spliceCertenNumData(
res.data.educationContents, 4
);
_this.educationContentsAll = res.data.educationContents;
_this.educationContentCount = res.data.educationContentCount;
// 直播
_this.liveModelList = spliceCertenNumData(
res.data.liveModelList, 4
);
_this.liveModelListAll = res.data.liveModelList;
_this.liveModelListCount = res.data.liveModelCount;
_this.setOrderNum(_this.orderNum + 1);
_this.setRefreshNum(_this.refreshNum + 1);
_this.allNum =
_this.contentAppModels.length +
_this.fiveMinutesMedicalContentList.length +
_this.pCourseDoctorModels.length +
_this. educationContents.length +
_this.liveModelList.length;
// });
_this.computedShowNoItem()
}
});
},
// 从原数组中提取前num个元素
spliceCertenNumData(oriData, num) {
let result = [];
if (oriData.length === 0 || oriData.length < num) {
return oriData;
} else {
for (let i = 0; i < num; i++) {
result.push(oriData[i]);
}
return result.slice();
}
},
// 将滚动条置顶
backTop: function() {
var osTop = document.documentElement.scrollTop || document.body.scrollTop;
if (osTop > 0) {
document.documentElement.scrollTop = document.body.scrollTop = 0;
}
},
// 单击选中各个分类
clickCategory(categoryIndex) {
this.categoryIndex = categoryIndex;
this.$refs.refBackTop.backTop();
// this.backTop()
},
// 每个分类的标题栏
getGroupTitle(count) {
return "共" + count + "条结果";
},
// 头部返回
back() {
if (this.$route.query.pageFrom == "searchIndex") {
this.$router.push("/index");
} else {
this.$rocNative.goBack();
}
},
// 滚动事件（scroll）监听器
scrollFun() {
let navConWrapDom = document.querySelector("#navbar-container-wrapper");
let navConWrapDomOT = document.querySelector("#navbar-container-wrapper").offsetParent.offsetTop;
let scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
if (scrollTop > 5) {
this.isShowTop = true;
} else {
this.isShowTop = false;
}
},
}
};
</script>
<style lang="scss" scoped>
@import "@/assets/style/mixin";
@import "@/assets/style/global";
.category {
&-wrapper {
position: fixed;
top: px2rem(76px);
left: 0;
right: 0;
z-index: 4;
height: px2rem(52px);
overflow: hidden;
box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.04);
background: #fff;
&::-webkit-scrollbar {
width: 0px;
height: 0px;
display: none;
}
&-list {
// width: 100%;
display: flex;
margin-right: px2rem(15px);
margin-left: px2rem(15px);
white-space: nowrap;
overflow-x: scroll;
overflow-y: hidden;
// border-bottom: 1px solid hsla(0,0%,91%,.2);
// height: px2rem(50px);
-webkit-overflow-scrolling: touch;
// box-shadow: 0px px2rem(2px) px2rem(8px) 0 rgba(0,0,0,0.04) inset;
&::-webkit-scrollbar {
width: 0px;
height: 0px;
display: none;
}
.item {
display: flex;
flex-direction: column;
padding: px2rem(16px) px2rem(10px) 0;
align-items: center;
span {
font-size: px2rem(15px);
font-weight: 400;
}
&-text {
color: #979899;
}
.active-text {
color: #373839 !important;
font-weight: 700;
}
.active-flag {
background: #449284;
}
&-flag {
width: px2rem(10px);
height: px2rem(3px);
border-radius: px2rem(2px);
background: #fff;
margin-top: px2rem(10px);
}
&:first-child {
padding-left: 0 !important;
}
&:last-child {
padding-right: 0 !important;
}
}
.pn-left {
position: fixed;
right: px2rem(0px);
width: px2rem(21px);
height: px2rem(50px);
}
.pn-right {
position: fixed;
left: px2rem(0px);
width: px2rem(21px);
height: px2rem(50px);
}
}
&-content {
font-size: px2rem(15px);
padding-top: px2rem(135px);
}
.scroll-hide {
position: fixed;
top: px2rem(111px);
left: 0;
z-index: 5;
width: px2rem(375px);
height: px2rem(3px);
background: #fff;
}
}
}
.search-container {
display: flex;
position: fixed;
top: 0;
left: 0;
z-index: 3;
width: 100%;
flex-direction: row;
text-align: center;
padding: px2rem(40px) 0 px2rem(12.5px) ;
background: #fff;
border-bottom: 0.5px solid #e7e7e7;
&-img {
/* padding: px2rem(21px) 0 px2rem(10px) px2rem(16px);*/
width: px2rem(20px);
height: px2rem(20px);
font-size: 0;
position: absolute;
bottom: px2rem(18px);
left: px2rem(16px);
// transform: rotate(180deg);
}
// .pt-22 {
// padding-top: px2rem(22px);
// }
&-img2 {
position: absolute;
top: px2rem(10px);
left: px2rem(24px);
z-index: 2;
img {
width: px2rem(22px);
height: px2rem(22px);
}
}
&-img3 {
position: absolute;
top: px2rem(9px);
left: px2rem(274px);
z-index: 2;
img {
width: px2rem(22px);
height: px2rem(22px);
}
}
&-input {
display: inline-flex;
flex: 1;
position: relative;
left: px2rem(0px);
width: px2rem(280px);
height: px2rem(30px);
margin-left: px2rem(0px);
// padding-left: px2rem(26px);
// padding-right: px2rem(28px);
border-radius: px2rem(4px);
background: rgba(246, 246, 246, 1);
font-size: px2rem(13px);
color: #666;
-webkit-appearance: none;
vertical-align: bottom;
}
&-cancle {
position: relative; top: px2rem(-6px);
left: px2rem(4px);
height: px2rem(14px);
line-height: px2rem(14px);
margin-top: px2rem(2px);
font-size: px2rem(14px);
color: #373839;
vertical-align: baseline;
}
.search-content {
margin-left: px2rem(40px);
}
}
.top-bar-height {
position: fixed;
height: px2rem(20px);
width: 100%;
top: 0;
left: 0;
z-index: 2;
background: #fff;
}
input::-webkit-search-decoration,
input::-webkit-search-cancel-button {
display: none;
}
.ios-top {
padding-top: px2rem(22.5px);
}
.pt-170 {
padding-top: px2rem(172px);
}
</style>
<style lang="scss">
@import '@/assets/style/mixin';
// .van-cell__value {
// top: px2rem(2px) !important;
// }
.van-field__control {
margin-top: px2rem(4px) !important;
}
.mint-search {
position: fixed;
top: 0px;
z-index: 2;
height: 66px;
width: 100%;
/* margin: 0 20px; */
border-bottom: 0.5px solid #e7e7e7 !important;
background-color: #fff;
}
.mint-searchbar {
position: relative;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background: #fff;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin: 0 10px;
padding: 30px 10px 8px;
z-index: 1;
}
.mint-searchbar-cancel {
margin-left: 10px;
font-size: 14px;
color: #999;
text-decoration: none;
}
.mint-searchbar-inner {
background: #f5f6f6;
}
.mint-searchbar-core {
color: #555555;
background: #f5f6f6;
}
</style>
plugins/vue-components.js 0 → 100644
浏览文件 @ bbc4f70e
import Vue from 'vue'
import { Dialog, Toast, Popup } from 'vant';
import { BASE_URL } from '@/utils/enumerate';
import '@/utils/rem';
import PicaCallApp from 'pica-call-app';
import PicaTopicStencil from 'pica-topic-stencil';
import WebBuriedPoint, { sendBuriedData } from 'web-buried-point';
import PicaH5Login from 'pica-h5-login';
const cookies = require('cookie-universal')();
Vue.use(PicaCallApp)
.use(PicaTopicStencil)
.use(PicaH5Login)
.use(Dialog)
.use(Toast)
.use(Popup);
const { NUXT_ENV_APP } = process.env;
Vue.use(WebBuriedPoint, {
class_name: `sousuo-home-v2-ssr`,
url: `${BASE_URL[NUXT_ENV_APP]}/file/log/trace1`
});
Vue.prototype.$sendBuriedData = sendBuriedData;
Vue.prototype.$cookies = cookies;
plugins/vue-inject.js 0 → 100644
浏览文件 @ bbc4f70e
import Vue from 'vue'
import rocNative from '@/utils/jsbridge'
Vue.prototype.$rocNative = new rocNative();
server/index.js 0 → 100644
浏览文件 @ bbc4f70e
const Koa = require('koa')
const consola = require('consola')
const { Nuxt, Builder } = require('nuxt')
const app = new Koa()
// Import and Set Nuxt.js options
const config = require('../nuxt.config.js')
config.dev = !(app.env === 'production')
async function start() {
// Instantiate nuxt.js
const nuxt = new Nuxt(config)
const {
host = process.env.HOST || '127.0.0.1',
port = process.env.PORT || 3000
} = nuxt.options.server
// Build in development
if (config.dev) {
const builder = new Builder(nuxt)
await builder.build()
} else {
await nuxt.ready()
}
app.use((ctx) => {
ctx.status = 200
ctx.respond = false // Bypass Koa's built-in response handling
ctx.req.ctx = ctx // This might be useful later on, e.g. in nuxtServerInit or with nuxt-stash
nuxt.render(ctx.req, ctx.res)
})
app.listen(port, host)
consola.ready({
message: `Server listening on http://${host}:${port}`,
badge: true
})
}
start()
service/api.js 0 → 100644
浏览文件 @ bbc4f70e
import Axios from 'axios';
import { Toast } from 'vant';
import { API_CONFIG, REPONSE_CODE } from '@/utils/enumerate';
const { VUE_ENV } = process.env; // server or client
const cookies = require('cookie-universal')();
Axios.interceptors.request.use(
config => {
// 0. Do something before request is sent
// 1. can be add loading
// 2. make sure if need token
const method = config.method.toLocaleLowerCase();
if (method === 'post' || method === 'put' || method === 'delete') {}
if (config.withCredentials) {
if(method === 'post') {
config.headers.token = config.data.token || cookies.get('token') || 'C8D5E10A1F1243D38DFFE9BE5D8C5601'
} else {
config.headers.token = config.params.token || cookies.get('token') || 'C8D5E10A1F1243D38DFFE9BE5D8C5601'
}
}
return config;
},
error => {
// when set loading close it
if (
error.code === 'ECONNABORTED' &&
error.message.indexOf('timeout') !== -1
) {
VUE_ENV === 'client' && Toast({ message: '请求超时', duration: 1000 });
}
return Promise.reject(error);
}
)
export default function(options) {
if (typeof options !== 'object') {
throw new Error('make sure the params options is an Object...');
}
const cf = JSON.parse(JSON.stringify(API_CONFIG));
options = Object.assign(cf, options); // 合并 config
return new Promise((resolve, reject) => {
// console.log(options)
Axios(options)
.then(res => {
const { status, data } = res;
if (status !== 200) {
let cmsg = REPONSE_CODE[status];
let message = cmsg !== undefined ? cmsg : '系统异常。';
throw Error(message);
}
if (!data) throw Error('axios reponse data in not defined.');
if (data.code != '000000') {
// 如果要是有其他特殊需求在此处添加
console.log(`调用后台接口报错，CODE: ${data.code}，MESSAGE: ${data.message}。`);
}
resolve(res.data);
})
.catch(error => {
console.log('axios catch error: ', error.message);
// VUE_ENV === 'client' && Toast({ message: error.message, duration: 1000 });
// reject(error);
})
})
}
\ No newline at end of file
service/index.js 0 → 100644
浏览文件 @ bbc4f70e
import request from './api';
const cookies = require('cookie-universal')();
// 获取热门搜索关键字
export const getHotLabelsService = async ( data ) => {
return request({
// data: data,
params: data,
url: 'contents/searchKeyword/listKeywords',
withCredentials: true
})
}
// 获取个人的历史搜索关键字
export const getListHistorys = async ( data ) => {
return request({
params: data,
url: 'contents/searchHistory/listHistory',
withCredentials: true
})
}
// 批量删除历史搜索关键字
export const delHistorysService = async ( data ) => {
return request({
method: 'post',
data: data,
url: 'contents/searchHistory/deleteHistory',
withCredentials: true
})
}
// 搜索操作
export const sousuoSearch = async ( data ) => {
data.appVersion = cookies.get('appVersion')
return request({
params: data,
url: `contents/searchKeyword/v2/search`,
withCredentials: true
})
}
// 获取推荐课程
export const getRecommendCourseList = async ( data ) => {
return request({
params: data,
url: `contents/courses/recommendCourseList`,
withCredentials: true
})
}
// 收藏/取消收藏课程
export const favorsCourse = async ( data ) => {
return request({
method: 'post',
data: data,
url: `contents/favors`,
withCredentials: true
})
}
static/README.md 0 → 100644
浏览文件 @ bbc4f70e
# STATIC
**This directory is not required, you can delete it if you don't want to use it.**
This directory contains your static files.
Each file inside this directory is mapped to `/`.
Thus you'd want to delete this README.md before deploying to production.
Example: `/static/robots.txt` is mapped as `/robots.txt`.
More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/assets#static).
static/css/common.css 0 → 100644
浏览文件 @ bbc4f70e
@charset "utf-8";
html {
color: #000;
background: #fff;
overflow-y: scroll;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%
}
html * {
outline: 0;
-webkit-text-size-adjust: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}
html,body {
font-family: PingFangSC-Regular, -apple-system-font, Source Han Sans, Helvetica Neue, sans-serif;
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
margin: 0;
padding: 0;
}
/*
input, select, textarea {
font-size: 100%;
}
*/
table {
border-collapse: collapse;
border-spacing: 0;
}
fieldset, img {
border: 0;
}
abbr, acronym {
border: 0;
font-variant: normal;
}
del {
text-decoration: line-through;
}
address, caption, cite, code, dfn, em, th, var {
font-style: normal;
font-weight: 500;
}
ol, ul {
list-style: none;
}
caption, th {
text-align: left;
}
/*
h1, h2, h3, h4, h5, h6 {
font-size: 100%;
font-weight: 500;
}
*/
q:before, q:after {
content: '';
}
sub, sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -.5em;
}
sub {
bottom: -.25em;
}
a:hover {
text-decoration: underline;
}
ins, a {
text-decoration: none;
}
static/js/flexble.js 0 → 100644
浏览文件 @ bbc4f70e
;(function(win, lib) {
var doc = win.document;
var docEl = doc.documentElement;
var metaEl = doc.querySelector('meta[name="viewport"]');
var flexibleEl = doc.querySelector('meta[name="flexible"]');
var dpr = 0;
var scale = 0;
var tid;
var flexible = lib.flexible || (lib.flexible = {});
if (metaEl) {
console.warn('将根据已有的meta标签来设置缩放比例');
var match = metaEl.getAttribute('content').match(/initial\-scale=([\d\.]+)/);
if (match) {
scale = parseFloat(match[1]);
dpr = parseInt(1 / scale);
}
} else if (flexibleEl) {
var content = flexibleEl.getAttribute('content');
if (content) {
var initialDpr = content.match(/initial\-dpr=([\d\.]+)/);
var maximumDpr = content.match(/maximum\-dpr=([\d\.]+)/);
if (initialDpr) {
dpr = parseFloat(initialDpr[1]);
scale = parseFloat((1 / dpr).toFixed(2));
}
if (maximumDpr) {
dpr = parseFloat(maximumDpr[1]);
scale = parseFloat((1 / dpr).toFixed(2));
}
}
}
if (!dpr && !scale) {
var isAndroid = win.navigator.appVersion.match(/android/gi);
var isIPhone = win.navigator.appVersion.match(/iphone/gi);
var devicePixelRatio = win.devicePixelRatio;
if (isIPhone) {
// iOS下，对于2和3的屏，用2倍的方案，其余的用1倍方案
if (devicePixelRatio >= 3 && (!dpr || dpr >= 3)) {
dpr = 3;
} else if (devicePixelRatio >= 2 && (!dpr || dpr >= 2)){
dpr = 2;
} else {
dpr = 1;
}
} else {
// 其他设备下，仍旧使用1倍的方案
dpr = 1;
}
scale = 1 / dpr;
}
docEl.setAttribute('data-dpr', dpr);
if (!metaEl) {
metaEl = doc.createElement('meta');
metaEl.setAttribute('name', 'viewport');
metaEl.setAttribute('content', 'initial-scale=' + scale + ', maximum-scale=' + scale + ', minimum-scale=' + scale + ', user-scalable=no');
if (docEl.firstElementChild) {
docEl.firstElementChild.appendChild(metaEl);
} else {
var wrap = doc.createElement('div');
wrap.appendChild(metaEl);
doc.write(wrap.innerHTML);
}
}
function refreshRem(){
var width = docEl.getBoundingClientRect().width;
if (width / dpr > 540) {
width = 540 * dpr;
}
var rem = width / 10;
docEl.style.fontSize = rem + 'px';
flexible.rem = win.rem = rem;
}
win.addEventListener('resize', function() {
clearTimeout(tid);
tid = setTimeout(refreshRem, 300);
}, false);
win.addEventListener('pageshow', function(e) {
if (e.persisted) {
clearTimeout(tid);
tid = setTimeout(refreshRem, 300);
}
}, false);
if (doc.readyState === 'complete') {
doc.body.style.fontSize = 12 * dpr + 'px';
} else {
doc.addEventListener('DOMContentLoaded', function(e) {
doc.body.style.fontSize = 12 * dpr + 'px';
}, false);
}
refreshRem();
flexible.dpr = win.dpr = dpr;
flexible.refreshRem = refreshRem;
flexible.rem2px = function(d) {
var val = parseFloat(d) * this.rem;
if (typeof d === 'string' && d.match(/rem$/)) {
val += 'px';
}
return val;
}
flexible.px2rem = function(d) {
var val = parseFloat(d) / this.rem;
if (typeof d === 'string' && d.match(/px$/)) {
val += 'rem';
}
return val;
}
})(window, window['lib'] || (window['lib'] = {}));
\ No newline at end of file
store/index.js 0 → 100644
浏览文件 @ bbc4f70e
export const state = () => ({
userInfo: {},
cSearchText: '',
refreshNum: 1,
orderNum: 1,
displayConfig: {
courseDisplayFlag: 0,
courseDisplayContent: '',
courseDisplayParam: [],
educationComtentDisplayFlag: 0,
educationComtentDisplayContent: '',
educationComtentDisplayParam: {id: 1, name: '高血压', seqNo: "1"},
},
allHistoryLabels: [],
})
export const getters = {
userInfo(state) {
return state.userInfo
},
cSearchText(state) {
return state.cSearchText
},
refreshNum(state) {
return state.refreshNum
},
orderNum(state) {
return state.orderNum
},
displayConfig(state) {
return state.displayConfig
},
allHistoryLabels(state) {
return state.allHistoryLabels
}
}
export const mutations = {
SET_USER_INFO(state, userInfo) {
state.userInfo = userInfo
},
SET_C_SEARCH_TEXT(state, cSearchText) {
state.cSearchText = cSearchText
},
SET_REFRESH_NUM(state, refreshNum) {
state.refreshNum = refreshNum
},
SET_ORDER_NUM(state, orderNum) {
state.orderNum = orderNum
},
SET_DISPLAY_CONFIG(state, displayConfig) {
state.displayConfig = displayConfig
},
SET_ALL_HISTORY_LABELS(state, allHistoryLabels) {
state.allHistoryLabels = allHistoryLabels
}
}
export const actions = {
setUserInfo({ commit }, userInfo) {
commit('SET_USER_INFO', userInfo);
},
setCSearchText({ commit }, cSearchText) {
commit('SET_C_SEARCH_TEXT', cSearchText);
},
setRefreshNum({ commit }, refreshNum) {
commit('SET_REFRESH_NUM', refreshNum);
},
setOrderNum({ commit }, orderNum) {
commit('SET_ORDER_NUM', orderNum);
},
setDisplayConfig({ commit }, displayConfig) {
commit('SET_DISPLAY_CONFIG', displayConfig);
},
setAllHistoryLabels({ commit }, allHistoryLabels) {
commit('SET_ALL_HISTORY_LABELS', allHistoryLabels);
},
}
\ No newline at end of file
test/Logo.spec.js 0 → 100644
浏览文件 @ bbc4f70e
import { mount } from '@vue/test-utils'
import Logo from '@/components/Logo.vue'
describe('Logo', () => {
test('is a Vue instance', () => {
const wrapper = mount(Logo)
expect(wrapper.isVueInstance()).toBeTruthy()
})
})
utils/enumerate.js 0 → 100644
浏览文件 @ bbc4f70e
const { NUXT_ENV_APP } = process.env;
export const BASE_URL = {
// dev: 'https://dev-sc.yunqueyi.com',
// dev: 'https://uat-sc.yunqueyi.com',
dev: 'https://test1-sc.yunqueyi.com',
test: 'https://test1-sc.yunqueyi.com',
uat: 'https://uat-sc.yunqueyi.com',
prod: 'https://sc.yunqueyi.com'
};
export const API_CONFIG = {
baseURL: BASE_URL[NUXT_ENV_APP],
headers: {
'X-Requested-With': 'XMLHttpRequest',
'Content-Type': 'application/json;charset=UTF-8'
},
timeout: 10000,
withCredentials: false,
responseType: 'json',
method: 'get'
}
export const REPONSE_CODE = {
400: '发出的请求有错误，服务器没有进行新建或修改数据的操作。',
401: '用户没有权限（登录过期、token错误）',
403: '用户得到授权，但是访问是被禁止的。',
404: '发出的请求针对的是不存在的记录，服务器没有进行操作。',
406: '请求的格式不可得。',
410: '请求的资源被永久删除，且不会再得到的。',
422: '当创建一个对象时，发生一个验证错误。',
500: '服务器发生错误，请检查服务器。',
502: '网关错误。',
503: '服务不可用，服务器暂时过载或维护。',
504: '网关超时。'
};
// 其他的域名 跳转
export const ENV_CONFIG = {
dev: {
apiUrl: 'https://dev-api.yunqueyi.com',
shareUrl: 'https://dev-phome.yunqueyi.com',
topicUrl: 'https://dev-phome.yunqueyi.com/discuss',
appId: 'wxf4e66242d31c81c2', // 用于微信授权登录(张平)
noticeUrl: 'https://dev-notice.yunqueyi.com'
},
test: {
apiUrl: 'https://test1-api.yunqueyi.com',
shareUrl: 'https://test1-phome.yunqueyi.com',
topicUrl: 'https://test1-phome.yunqueyi.com/discuss',
appId: 'wxebc0cc65cca7694b', // 用于微信授权登录(李军)
noticeUrl: 'https://test1-notice.yunqueyi.com'
},
uat: {
apiUrl: 'https://uat-api.yunqueyi.com',
shareUrl: 'https://uat-phome.yunqueyi.com',
topicUrl: 'https://uat-phome.yunqueyi.com/discuss',
appId: 'wx342ef0e5afee54a7', // 用于微信授权登录(于蛟)
noticeUrl: 'https://uat-notice.yunqueyi.com'
},
prod: {
apiUrl: 'https://api.yunqueyi.com',
shareUrl: 'https://phome.yunqueyi.com',
topicUrl: 'https://phome.yunqueyi.com/discuss',
appId: 'wx2c577552a2d28550', // 用于微信授权登录
noticeUrl: 'https://notice.yunqueyi.com'
}
}
utils/index.js 0 → 100644
浏览文件 @ bbc4f70e
import { ENV_CONFIG } from './enumerate';
import { sousuoSearch } from '@/service';
const { NUXT_ENV_APP } = process.env;
export const getSearchByName = name => {
const match = RegExp(`[?&]${name}=([^&]*)`).exec(window.location.href);
return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
};
export const getItem = name => {
if (!name) return;
const v = sessionStorage.getItem(name);
let val = null;
try {
val = JSON.parse(v);
} catch (e) {
// JSON.parse 失败 后 直接赋v给val;
val = v;
}
return val;
};
export const setItem = (name, value) => {
if (!name) return;
if (typeof value !== 'string') {
value = JSON.stringify(value);
}
sessionStorage.setItem(name, value);
};
export const removeItem = name => {
if (!name) return;
sessionStorage.removeItem(name);
};
export const getConfigByEvtType = key => {
return ENV_CONFIG[NUXT_ENV_APP][key];
}
export const getNoticeUrl = url => {
return `${getConfigByEvtType('noticeUrl')}${url}`;
}
export const getShareUrl = url => {
return `${getConfigByEvtType('shareUrl')}${url}`;
}
export const setEventByModuleCode = (itemData, token) => {
let modeCode = itemData.code || '';
let paramList = itemData.paramList ? itemData.paramList : '';
if (modeCode === 'M001' || modeCode === 'M002' || modeCode === 'M003') {
paramList = '';
} else if (
modeCode === 'M100' ||
modeCode === 'M300' ||
modeCode === 'M500' || modeCode === 'M301'
) {
let urlPara = getUrlParmByCode(paramList, token);
paramList[0] && (paramList[0].value += urlPara);
// 前端拼接了数据，原生不用再拼接
paramList = paramList.slice(0, 1)
}
if (typeof paramList === 'string' && !paramList) {
paramList = [];
}
if(paramList.length > 0) {
paramList[0].value = shurpString(paramList[0].value)
}
return paramList;
}
function getUrlParmByCode(paramList, token) {
if (paramList.length <= 1) return `?token=${token}`;
let dataStr = '', list = [];
let str = paramList.length > 0 && paramList[0].value.indexOf('?') > -1 ? '&' : '?';
for (let i = 1; i < paramList.length; i++) {
list.push(paramList[i].key + '=' + encodeURI(paramList[i].value));
}
dataStr = list.join('&');
if (dataStr !== '') return `${str}${dataStr}&token=${token}`;
return `${str}token=${token}`;
}
// 去重
function shurpString(url) {
let preUrl = '', subUrl = '', pSet = null, sArr= [], index = url.indexOf('?');
if(index > 0) {
preUrl = url.substr(0, index);
subUrl = url.substr(index + 1);
if(subUrl.length > 0) {
subUrl = subUrl.replace(/\?/g, '&')
pSet = new Set(subUrl.split('&'))
sArr = Array.from(pSet);
return preUrl + '?' + sArr.join('&')
} else {
return url;
}
} else {
return url;
}
}
// export function setEventByModuleCode(itemData){
// let modeCode = itemData.code || '';
// let paramList = itemData.paramList ? itemData.paramList : ''
// if( modeCode === 'M001' || modeCode === 'M002' || modeCode === 'M003') {
// paramList = ''
// }else if( modeCode === 'M100' || modeCode === 'M300' ) {
// let urlPara = getUrlParmByCode(paramList);
// paramList[0] && (paramList[0].value += urlPara);
// }else if( modeCode === 'M400') {
// let path = paramList[0]['key'];
// let v = paramList[0]['value'];
// let query = setRouterParm(paramList);
// //console.log(Vue);
// // this.$router.push({
// // path: v,
// // query:query
// // })
// }
// if(typeof paramList === 'string' && !paramList){
// paramList = []
// }
// return paramList;
// }
// function getUrlParmByCode(paramList) {
// if ( paramList.length <= 1) {
// return ''
// }
// let dataStr = ''
// let list = [];
// for( let i = 1; i < paramList.length; i ++) {
// list.push(paramList[i].key + '=' + paramList[i].value)
// }
// dataStr = list.join('&')
// if (dataStr !== '') {
// return '?' + dataStr
// }
// return ''
// }
// 获取用户终端信息
export function getTerminalType() {
let brow = 'unknow';
if (navigator.userAgent.indexOf('iPad') > -1) {
return (brow = 'iPad');
}
if (
navigator.userAgent.indexOf('Android') > -1 ||
navigator.userAgent.indexOf('Linux') > -1
) {
return (brow = 'android');
}
if (navigator.userAgent.indexOf('iPhone') > -1) {
return (brow = 'iPhone');
}
if (navigator.userAgent.indexOf('Trident') > -1) {
return (brow = 'PC');
}
if (navigator.userAgent.indexOf('Presto') > -1) {
return (brow = 'PC');
}
if (navigator.userAgent.indexOf('Chrome') > -1) {
return (brow = 'PC');
}
if (navigator.userAgent.indexOf('AppleWebKit') > -1) {
return (brow = 'iPad');
}
if (
navigator.userAgent.indexOf('Gecko') > -1 &&
navigator.userAgent.indexOf('KHTML') == -1
) {
return (brow = 'PC');
}
if (navigator.userAgent.indexOf('Mac OS X') > -1) {
return (brow = 'ios');
}
if (navigator.userAgent.indexOf('Safari') == -1) {
return (brow = 'PC');
}
return brow;
}
// 根据条件排序
export async function searchForOrder(searchCategory = '1', searchValue = '', sortItem = 1, sortDir = 1, pageSize = 10, sourceData = [], token) {
if( pageSize <=0 ) return [];
let str2 = (searchValue || '').replace(/[\-\_\,\!\|\~\`\(\)\#\$\%\^\&\*\{\}\:\;\"\L\<\>\?]/g, '');// 去掉特殊字符
let para = {
searchCategory: searchCategory,
searchValue: str2,
keywordColor: 'rgba(244,122,72,1)',
sortItem: sortItem, // 排序规则 1 学习人数，2 修改时间
dir: sortDir, // 方向 1:asc 2: desc
pageNo: 1,
pageSize: 100,
// pageSize: sortItem == 0 ? 100 : pageSize,
token: token || '',
setEntry: 'headers',
}
let url = 'contents/searchKeyword/v2/search'
let csourceData = await sousuoSearch(para).then(res => {
if (res.code == '000000') {
// 课程
if(searchCategory.indexOf('1') >= 0) {
sourceData = (res.data && res.data.contentAppModels) || []
}
if(searchCategory.indexOf('2') >= 0) {
sourceData = handelFive(res.data.fiveMinutesMedicalContentList || [])
}
if(searchCategory.indexOf('3') >= 0) {
sourceData = (res.data && res.data.pCourseDoctorModels) || []
}
if(searchCategory.indexOf('4') >= 0) {
sourceData = res.data.educationContents
}
}
return sourceData || []
})
return csourceData
}
//处理5分钟数据 初始化播放状态
export function handelFive(d) {
for (let i = 0; i < d.length; i++) {
d[i].play = '0';
}
return d;
}
// 从原数组中提取前num个元素
export function spliceCertenNumData(oriData, num) {
let result = [];
if (oriData.length === 0 || oriData.length < num) {
return oriData;
} else {
for (let i = 0; i < num; i++) {
result.push(oriData[i]);
}
return result.slice();
}
}
utils/jsbridge copy.js 0 → 100644
浏览文件 @ bbc4f70e
/*
* @Author: souse
* @Date: 2019-08-12 18:08:07
* @Last Modified by: souse
* @Last Modified time: 2019-08-13 19:17:00
* @Descript 和app交互的接口调用 单例模式
*/
const ARRAY_CLASS = '[object Array]';
const _toString = Object.prototype.toString;
/**
* set default options
*/
export const JsBridgeOptions = {
GLOBAL_NAME: 'rocNative',
NATIVE_IOS_NAME: 'rociOS',
NATIVE_ANDROID_NAME: '__rocAndroid',
initMethodsWithCallBack: ['getToken', 'getUserInfo'], // value is string
initMethodsWithoutCallBack: ['appInit', 'goBack', 'shareWechat', 'showNativeToast', 'dispatchEventByModuleCode', 'appBuryingPointEntrust', 'openFiveMintusAudio', 'gotoVoiceSearchActivity'] // value is string
}
/**
* @description
* @author souse
* @date 2019-08-12
* @export
* @class PicaJsBridge
*/
export default class PicaJsBridge {
constructor(options = JsBridgeOptions) {
const initMethodsWithCallBack = options.initMethodsWithCallBack;
const initMethodsWithoutCallBack = options.initMethodsWithoutCallBack;
this._callbakFns = {};
this._callbackId = 0;
this._GLOBAL_NAME = options.GLOBAL_NAME;
this._NATIVE_IOS_NAME = options.NATIVE_IOS_NAME;
this._NATIVE_ANDROID_NAME = options.NATIVE_ANDROID_NAME;
this.isIOS = this._isIos();
this.isAndroid = this._isAndroid();
this.isWeb = this._isWeb();
if (_toString.call(initMethodsWithCallBack) === ARRAY_CLASS && initMethodsWithCallBack.length !== 0) {
this.registerMethods(initMethodsWithCallBack, true);
}
if (_toString.call(initMethodsWithoutCallBack) === ARRAY_CLASS && initMethodsWithoutCallBack.length !== 0) {
this.registerMethods(initMethodsWithoutCallBack, false);
}
this.mountToWindow();
}
// is ios flag
_isIos() {
return !!(window.webkit && window.webkit.messageHandlers && window.webkit.messageHandlers[this._NATIVE_IOS_NAME]);
}
// is android flag
_isAndroid() {
return !!window[this._NATIVE_ANDROID_NAME];
}
// is web flag
_isWeb() {
return !this.isIOS && !this.isAndroid;
}
// register method width callback in window
_registerMethod(method) {
const _this = this;
_this[method] = (param) => {
return new Promise((response, reject) => {
_this._callNative(method, param, function(result) {
response(result);
}) ? void 0 : reject(`${method} not handled.`);
});
}
}
// register method widthout callback in window
_registerMethodWithoutMethod(method) {
const _this = this;
_this[method] = (param) => {
return new Promise((response, reject) => {
_this._callNative(method, param, null) ? response('success') : reject(`${method} not handled.`);
});
}
}
// window call app method
_callNative(name, param, callbackFn) {
let callbackId = 0, pm;
if (typeof callbackFn === 'function') {
this._callbackId++;
callbackId = this._callbackId;
this._callbakFns[callbackId] = callbackFn;
}
pm = JSON.stringify({
name,
callbackId: callbackId ? callbackId.toString() : '',
param: param || {}
});
if (this.isAndroid) {
window[this._NATIVE_ANDROID_NAME].postMessage(pm);
return true;
}
if (this.isIOS) {
window.webkit.messageHandlers[this._NATIVE_IOS_NAME].postMessage(pm);
return true;
}
return false;
}
// app call window method
__nativeCall(name, callbackId, result) {
const fun = callbackId && this._callbakFns[callbackId];
delete this._callbakFns[callbackId];
if (fun && typeof fun === 'function') fun(result);
}
// batch register methods
registerMethods(methods = [], widthCallback) {
if (undefined === widthCallback)
throw Error('widthCallback flag not defined, registerMethods should take second param value(true/false) for is not has callback.');
methods.forEach(m => {
widthCallback === true ? this._registerMethod(m) : this._registerMethodWithoutMethod(m)
});
}
// async call app method do not need register
asyncCallNative(method, param) {
const _this = this;
return new Promise(resolve => {
_this._callNative(method, param, function(result) {
resolve(result);
});
});
}
// call app method direct without register and callback
callNative(method, param) {
return this._callNative(method, param, null);
}
// register jsbridge to window
mountToWindow() {
window[this._GLOBAL_NAME] = this;
}
}
\ No newline at end of file
utils/jsbridge.js 0 → 100644
浏览文件 @ bbc4f70e
/*
* @Author: souse
* @Date: 2019-08-12 18:08:07
* @Last Modified by: souse
* @Last Modified time: 2019-08-13 19:17:00
* @Descript 和app交互的接口调用 单例模式
*/
const ARRAY_CLASS = '[object Array]';
const _toString = Object.prototype.toString;
/**
* set default options
*/
export const JsBridgeOptions = {
GLOBAL_NAME: 'rocNative',
NATIVE_IOS_NAME: 'rociOS',
NATIVE_ANDROID_NAME: '__rocAndroid',
initMethodsWithCallBack: ['getToken', 'getUserInfo'], // value is string
initMethodsWithoutCallBack: ['gotoLogin', 'appInit', 'goBack', 'shareWechat', 'showNativeToast', 'dispatchEventByModuleCode', 'appBuryingPointEntrust', 'openFiveMintusAudio', 'gotoVoiceSearchActivity', 'selectHealthcartoonCallBack'] // value is string
}
/**
* @description
* @author souse
* @date 2019-08-12
* @export
* @class PicaJsBridge
*/
export default class PicaJsBridge {
constructor(options = JsBridgeOptions) {
const initMethodsWithCallBack = options.initMethodsWithCallBack;
const initMethodsWithoutCallBack = options.initMethodsWithoutCallBack;
this._callbakFns = {};
this._callbackId = 0;
this._GLOBAL_NAME = options.GLOBAL_NAME;
this._NATIVE_IOS_NAME = options.NATIVE_IOS_NAME;
this._NATIVE_ANDROID_NAME = options.NATIVE_ANDROID_NAME;
this.isIOS = this._isIos();
this.isAndroid = this._isAndroid();
this.isWeb = this._isWeb();
if (_toString.call(initMethodsWithCallBack) === ARRAY_CLASS && initMethodsWithCallBack.length !== 0) {
this.registerMethods(initMethodsWithCallBack, true);
}
if (_toString.call(initMethodsWithoutCallBack) === ARRAY_CLASS && initMethodsWithoutCallBack.length !== 0) {
this.registerMethods(initMethodsWithoutCallBack, false);
}
this.mountToWindow();
}
// is ios flag
_isIos() {
return !!(window.webkit && window.webkit.messageHandlers && window.webkit.messageHandlers[this._NATIVE_IOS_NAME]);
}
// is android flag
_isAndroid() {
return !!window[this._NATIVE_ANDROID_NAME];
}
// is web flag
_isWeb() {
return !this.isIOS && !this.isAndroid;
}
// register method width callback in window
_registerMethod(method) {
const _this = this;
_this[method] = (param) => {
return new Promise((response, reject) => {
_this._callNative(method, param, function(result) {
response(result);
}) ? void 0 : reject(`${method} not handled.`);
});
}
}
// register method widthout callback in window
_registerMethodWithoutMethod(method) {
const _this = this;
_this[method] = (param) => {
return new Promise((response, reject) => {
_this._callNative(method, param, null) ? response('success') : reject(`${method} not handled.`);
});
}
}
// window call app method
_callNative(name, param, callbackFn) {
let callbackId = 0, pm;
if (typeof callbackFn === 'function') {
this._callbackId++;
callbackId = this._callbackId;
this._callbakFns[callbackId] = callbackFn;
}
pm = JSON.stringify({
name,
callbackId: callbackId ? callbackId.toString() : '',
param: param || {}
});
if (this.isAndroid) {
window[this._NATIVE_ANDROID_NAME].postMessage(pm);
return true;
}
if (this.isIOS) {
window.webkit.messageHandlers[this._NATIVE_IOS_NAME].postMessage(pm);
return true;
}
return false;
}
// app call window method
__nativeCall(name, callbackId, result) {
const wFun = window[callbackId];
const fun = callbackId && this._callbakFns[callbackId];
//add by zhangping
if (wFun && typeof wFun === 'function') {
wFun(result);
return;
}
delete this._callbakFns[callbackId];
if (fun && typeof fun === 'function') fun(result);
}
// batch register methods
registerMethods(methods = [], widthCallback) {
if (undefined === widthCallback)
throw Error('widthCallback flag not defined, registerMethods should take second param value(true/false) for is not has callback.');
methods.forEach(m => {
widthCallback === true ? this._registerMethod(m) : this._registerMethodWithoutMethod(m)
});
}
// async call app method do not need register
asyncCallNative(method, param) {
const _this = this;
return new Promise(resolve => {
_this._callNative(method, param, function(result) {
resolve(result);
});
});
}
// call app method direct without register and callback
callNative(method, param) {
return this._callNative(method, param, null);
}
// register jsbridge to window
mountToWindow() {
window[this._GLOBAL_NAME] = this;
}
}
\ No newline at end of file
utils/rem.js 0 → 100644
浏览文件 @ bbc4f70e
(function(doc, win) {
var docEl = doc.documentElement || doc.body,
htmlDom = doc.getElementsByTagName('html')[0],
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function() {
var clientWidth = docEl.clientWidth
if (!clientWidth) return
// docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';
htmlDom.style.fontSize = clientWidth / 10 + 'px'
};
if (!doc.addEventListener) return
win.addEventListener(resizeEvt, recalc, false)
doc.addEventListener('DOMContentLoaded', recalc, false)
})(document, window)
\ No newline at end of file
utils/wxShare.js 0 → 100644
浏览文件 @ bbc4f70e
/* eslint-disable */
import Vue from 'vue'
import request from '@/service/api';
import wx from 'weixin-js-sdk'
/** 注入配置信息 */
export const wxConfig = () => {
// const params = { resetURI: true, url: encodeURIComponent(location.href) };
request({ url: `https://sc.yunqueyi.com/wechats/signs?url=${encodeURIComponent(location.href)}` }).then(res => {
let configs = res.data.signMap;
wx.config({
debug: false,
appId: configs.appId,
nonceStr: configs.nonceStr,
timestamp: configs.timestamp,
signature: configs.signature,
jsApiList: [
'hideMenuItems',
'previewImage',
'checkJsApi',
'chooseWXPay',
'onMenuShareTimeline',
'onMenuShareAppMessage',
'onMenuShareQQ',
'onMenuShareWeibo',
'onMenuShareQZone',
'getLocation',
'openLocation',
'translateVoice'
]
});
});;
};
/**
* wxShare 分享
* @param option
*/
export const wxShare = (option = {}, successCB = () => {}) => {
wx.ready(() => {
// 分享给朋友
wx.onMenuShareAppMessage({
title: option.title,
desc: option.desc,
link: option.link,
imgUrl: option.imgUrl,
success: function(res) {
// 用户确认分享后执行的回调函数
successCB(res);
},
cancel: function() {
// 用户取消分享后执行的回调函数
}
});
// 分享到朋友圈
wx.onMenuShareTimeline({
title: option.friendtitle || option.title, // 标题
desc: option.desc,
link: option.link, // 链接
imgUrl: option.imgUrl, // 分享图标
success: function(res) {
successCB(res);
},
cancel: function() {
// 用户取消分享后执行的回调函数
}
});
});
};
export const wxDisabledShare = () => {
wx.ready(() => {
wx.hideMenuItems({
menuList: [
'menuItem:share:appMessage',
'menuItem:share:timeline',
'menuItem:share:qq',
'menuItem:share:weiboApp',
'menuItem:share:QZone'
]
});
});
};
/**
*
* @param source
* @param option
*/
export const wechatShare = async (option = {}, successCB = () => {}) => {
const shareOption = {
link: location.href,
title: `云鹊医！`,
friendtitle: `讨论进行中，速来围观！`,
desc: '参与讨论，一起畅谈医学那些事！快来看看吧~',
imgUrl: 'https://file.yunqueyi.com/logo.png',
...option
};
wxConfig();
wxShare(shareOption, successCB);
};
Vue.prototype.wechatShare = wechatShare
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或