prxhap34i
/
test
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

初始

Browse Source
cqq
你çšcqq 1 month ago
parent 3ec17c7256
commit 9e5de09591
2 changed files with 667 additions and 464 deletions
Show Stats Download Patch File Download Diff File

720
src/main/java/com/controller/CommonController.java
View File

File diff suppressed because it is too large Load Diff

411
target/classes/front/front/pages/home/home.html
Unescape View File

@ -1,25 +1,41 @@
<!DOCTYPE html>
<html>
<head lang="en">
<!-- 设置字符编码为 UTF-8 -->
<meta charset="utf-8">
<!-- 设置网页标题 -->
<title>首页</title>
<!-- 设置网页描述信息 -->
<meta name="description" content=""/>
<!-- 设置网页关键词 -->
<meta name="keywords" content=""/>
<!-- 设置网页作者 -->
<meta name="author" content="order by mobanxiu.cn"/>
<!-- 指定使用 WebKit 渲染引擎 -->
<meta name="renderer" content="webkit">
<!-- 让 IE 浏览器使用最新的渲染模式 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<!-- 设置页面在不同设备上的显示效果 -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<!-- 引入 layui 框架的 CSS 文件 -->
<link rel="stylesheet" href="../../layui/css/layui.css">
<!-- 引入自定义的公共 CSS 文件 -->
<link rel="stylesheet" href="../../xznstatic/css/common.css"/>
<!-- 引入自定义的样式 CSS 文件 -->
<link rel="stylesheet" href="../../xznstatic/css/style.css"/>
<!-- 引入 swiper 插件的 CSS 文件 -->
<link rel="stylesheet" href="../../xznstatic/css/swiper.min.css"/>
<!-- 引入 jQuery 库 -->
<script src="../../xznstatic/js/jquery-1.11.3.min.js"></script>
<!-- 引入 SuperSlide 插件 -->
<script src="../../xznstatic/js/jquery.SuperSlide.2.1.1.js"></script>
<!-- 引入 Bootstrap 框架的 CSS 文件 -->
<link rel="stylesheet" href="../../xznstatic/css/bootstrap.min.css" />
<!-- 引入自定义的主题 CSS 文件 -->
<link rel="stylesheet" href="../../css/theme.css"/>
</head>
<style>
/* 为 HTML 元素添加背景样式 */
html::after {
position: fixed;
top: 0;
@ -33,10 +49,12 @@
background-position: center;
}
/* 设置轮播图容器的样式 */
#test1 {
overflow: hidden;
}
/* 设置轮播图指示器的样式 */
#test1 .layui-carousel-ind li {
width: 20px;
height: 10px;
@ -48,6 +66,7 @@
box-shadow: 0 0 6px rgba(255, 0, 0, .8);
}
/* 设置当前激活的轮播图指示器的样式 */
#test1 .layui-carousel-ind li.layui-this {
width: 30px;
height: 10px;
@ -57,6 +76,7 @@
border-radius: 6px;
}
/* 设置推荐区域的样式 */
.recommend {
padding: 10px 0;
display: flex;
@ -66,10 +86,12 @@
background-size: cover;
}
/* 设置推荐区域内容盒子的样式 */
.recommend .box {
width: 1014px;
}
/* 设置推荐区域标题的样式 */
.recommend .box .title {
padding: 10px 5px;
display: flex;
@ -78,22 +100,26 @@
flex-direction: column;
}
/* 设置推荐区域标题文字的样式 */
.recommend .box .title span {
padding: 0 10px;
line-height: 1.4;
}
/* 设置推荐区域列表的样式 */
.recommend .box .list {
display: flex;
flex-wrap: wrap;
}
/* 设置推荐区域列表项的样式，使用变量 var1 控制宽度 */
.index-pv1 .box .list .list-item {
flex: 0 0 ${var1}%;
padding: 0 5px;
box-sizing: border-box;
}
/* 设置推荐区域列表项主体的样式 */
.recommend .box .list .list-item-body {
border: 1px solid rgba(0, 0, 0, 3);
padding: 5px;
@ -101,6 +127,7 @@
cursor: pointer;
}
/* 设置推荐区域列表项图片的样式 */
.recommend .box .list img {
width: 100%;
height: 100px;
@ -110,6 +137,7 @@
max-width: 100%;
}
/* 设置推荐区域列表项名称的样式 */
.recommend .box .list .name {
padding-top: 5px;
color: red;
@ -118,6 +146,7 @@
box-sizing: border-box;
}
/* 设置推荐区域列表项不同布局的宽度 */
.recommend .box .list .list-item1 {
flex: 0 0 100%;
}
@ -139,28 +168,33 @@
}
/* 商品推荐-样式4-开始 */
/* 设置推荐区域样式4的列表样式 */
.recommend .list-4 {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
/* 设置推荐区域样式4的列表主体样式 */
.recommend .list-4 .list-4-body {
display: flex;
flex-direction: column;
}
/* 设置推荐区域样式4的列表项样式 */
.recommend .list-4 .list-4-item {
position: relative;
z-index: 1;
}
/* 设置推荐区域样式4的列表项1的样式 */
.recommend .list-4 .list-4-item.item-1 {
width: 400px;
height: 400px;
margin-right: 20px;
}
/* 设置推荐区域样式4的列表项2的样式 */
.recommend .list-4 .list-4-item.item-2 {
width: 220px;
height: 190px;
@ -168,6 +202,7 @@
margin-bottom: 20px;
}
/* 设置推荐区域样式4的列表项3的样式 */
.recommend .list-4 .list-4-item.item-3 {
width: 220px;
height: 190px;
@ -175,6 +210,7 @@
margin-bottom: 0;
}
/* 设置推荐区域样式4的列表项4的样式 */
.recommend .list-4 .list-4-item.item-4 {
width: 190px;
height: 190px;
@ -182,6 +218,7 @@
margin-bottom: 20px;
}
/* 设置推荐区域样式4的列表项5的样式 */
.recommend .list-4 .list-4-item.item-5 {
width: 190px;
height: 190px;
@ -189,6 +226,7 @@
margin-bottom: 0;
}
/* 设置推荐区域样式4的列表项图片的样式 */
.recommend .list-4 .list-4-item img {
width: 100%;
height: 100%;
@ -196,6 +234,7 @@
display: block;
}
/* 设置推荐区域样式4的列表项中心区域的样式 */
.recommend .list-4 .list-4-item .list-4-item-center {
position: absolute;
bottom: 0;
@ -207,6 +246,7 @@
background-color: rgba(0, 0, 0, .3);
}
/* 设置推荐区域样式4的列表项标题的样式 */
.recommend .list-4 .list-4-item .list-4-item-center .list-4-item-title {
width: 50%;
text-align: left;
@ -216,6 +256,7 @@
padding: 0 6px;
}
/* 设置推荐区域样式4的列表项价格的样式 */
.recommend .list-4 .list-4-item .list-4-item-center .list-4-item-price {
width: 50%;
text-align: right;
@ -227,40 +268,49 @@
/* 商品推荐-样式4-结束 */
/* 商品推荐-样式5-开始 */
/* 设置推荐区域样式5的 swiper 分页器的样式 */
.recommend #recommend-five-swiper.swiper-container-horizontal > .swiper-pagination-bullets {
line-height: 1;
}
/* 设置推荐区域样式5的 swiper 上一个幻灯片的样式 */
.recommend #recommend-five-swiper .swiper-slide.swiper-slide-prev {
z-index: 5;
}
/* 设置推荐区域样式5的 swiper 下一个幻灯片的样式 */
.recommend #recommend-five-swiper .swiper-slide.swiper-slide-next {
z-index: 5;
}
/* 设置推荐区域样式5的 swiper 当前激活幻灯片的样式 */
.recommend #recommend-five-swiper .swiper-slide.swiper-slide-active {
z-index: 9;
}
/* 设置推荐区域样式5的另一个 swiper 分页器的样式 */
.recommend #lists-five-swiper.swiper-container-horizontal > .swiper-pagination-bullets {
line-height: 1;
}
/* 设置推荐区域样式5的另一个 swiper 上一个幻灯片的样式 */
.recommend #lists-five-swiper .swiper-slide.swiper-slide-prev {
z-index: 5;
}
/* 设置推荐区域样式5的另一个 swiper 下一个幻灯片的样式 */
.recommend #lists-five-swiper .swiper-slide.swiper-slide-next {
z-index: 5;
}
/* 设置推荐区域样式5的另一个 swiper 当前激活幻灯片的样式 */
.recommend #lists-five-swiper .swiper-slide.swiper-slide-active {
z-index: 9;
}
/* 商品推荐-样式5-结束 */
/* 设置新闻区域的样式 */
.news {
padding: 10px 0;
display: flex;
@ -271,10 +321,12 @@
width: 100%;
}
/* 设置新闻区域内容盒子的样式 */
.news .box {
width: 1014px;
}
/* 设置新闻区域标题的样式 */
.news .box .title {
padding: 10px 5px;
display: flex;
@ -283,22 +335,26 @@
flex-direction: column;
}
/* 设置新闻区域标题文字的样式 */
.news .box .title span {
padding: 0 10px;
line-height: 1.4;
}
/* 设置新闻区域列表的样式 */
.news .box .list {
display: flex;
flex-wrap: wrap;
}
/* 设置新闻区域列表项的样式 */
.index-pv2 .box .list .list-item {
flex: 0 0 25%;
padding: 0 10px;
box-sizing: border-box;
}
/* 设置新闻区域列表项主体的样式 */
.news .box .list .list-item .list-item-body {
border: 1px solid rgba(0, 0, 0, 3);
padding: 10px;
@ -307,6 +363,7 @@
cursor: pointer;
}
/* 设置新闻区域列表项图片的样式 */
.news .box .list .list-item .list-item-body img {
width: 120px;
height: 100%;
@ -316,6 +373,7 @@
max-width: 100%;
}
/* 设置新闻区域列表项信息区域的样式 */
.news .box .list .list-item .list-item-body .item-info {
flex: 1;
display: flex;
@ -325,6 +383,7 @@
box-sizing: border-box;
}
/* 设置新闻区域列表项名称的样式 */
.news .box .list .list-item .list-item-body .item-info .name {
padding-top: 5px;
color: red;
@ -337,6 +396,7 @@
-webkit-box-orient: vertical;
}
/* 设置新闻区域列表项时间的样式 */
.news .box .list .list-item .list-item-body .item-info .time {
padding-top: 5px;
color: red;
@ -348,6 +408,7 @@
-webkit-box-orient: vertical;
}
/* 设置新闻区域列表项不同布局的宽度 */
.news .box .list .list-item1 {
flex: 0 0 100%;
}
@ -360,6 +421,7 @@
flex: 0 0 25%;
}
/* 设置列表区域的样式 */
.lists {
padding: 10px 0;
display: flex;
@ -369,11 +431,13 @@
background-size: cover;
}
/* 设置列表区域内容盒子的样式 */
.lists .box {
width: 1014px;
overflow: hidden;
}
/* 设置列表区域标题的样式 */
.lists .box .title {
padding: 10px 5px;
display: flex;
@ -382,21 +446,25 @@
flex-direction: column;
}
/* 设置列表区域标题文字的样式 */
.lists .box .title span {
padding: 0 10px;
line-height: 1.4;
}
/* 设置列表区域 swiper 幻灯片的样式 */
.lists .box .swiper-slide {
box-sizing: border-box;
cursor: pointer;
}
/* 设置列表区域 swiper 幻灯片图片盒子的样式 */
.lists .box .swiper-slide .img-box {
width: 100%;
overflow: hidden;
}
/* 设置列表区域 swiper 幻灯片图片的样式 */
.lists .box .swiper-slide .img-box img {
width: 100%;
height: 100%;
@ -404,6 +472,7 @@
max-width: 100%;
}
/* 设置不同布局下动画盒子的悬停样式 */
.index-pv1 .animation-box:hover {
transform: perspective(10px) translate3d(-10px, -10px, 0px) scale(1) rotate(0deg) skew(0deg, 0deg);
transition: all 0.3s;
@ -411,18 +480,19 @@
position: relative;
}
.index-pv2 .animation-box:hover {
transform: perspective(10px) translate3d(-10px, -10px, 0px) scale(1) rotate(0deg) skew(0deg, 0deg);
transition: all 0.3s;
z-index: 2;
position: relative;
transform: perspective(10px) translate3d(-10px, -10px, 0px) scale(1) rotate(0deg) skew(0deg, 0deg);
transition: all 0.3s;
z-index: 2;
position: relative;
}
.index-pv3 .animation-box:hover {
transform: perspective(10px) translate3d(-10px, -10px, 0px) scale(1) rotate(0deg) skew(0deg, 0deg);
transition: all 0.3s;
z-index: 2;
position: relative;
transform: perspective(10px) translate3d(-10px, -10px, 0px) scale(1) rotate(0deg) skew(0deg, 0deg);
transition: all 0.3s;
z-index: 2;
position: relative;
}
/* 设置新列表6的 swiper 滑动过渡效果为线性 */
#new-list-6 .swiper-wrapper {
-webkit-transition-timing-function: linear;
-moz-transition-timing-function: linear;
@ -432,11 +502,14 @@
}
</style>
<body>
<!-- Vue 实例挂载的根元素 -->
<div id="app">
<!-- 轮播图区域 -->
<div class="banner">
<div class="layui-carousel" id="test1"
:style='{"boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 auto","borderColor":"rgba(0,0,0,.3)","borderRadius":"0px","borderWidth":"0","width":"100%","borderStyle":"solid"}'>
<div carousel-item>
<!-- 循环渲染轮播图列表 -->
<div v-for="(item,index) in swiperList" :key="index">
<img style="width: 100%;height: 100%;object-fit:cover;" :src="item.img"/>
</div>
@ -444,95 +517,117 @@
</div>
</div>
<!-- 内容区域 -->
<div id="content">
<!-- 新闻区域 -->
<div class="news index-pv2" style="display: flex;justify-content: center;width:100%"
:style='{"padding":"10px 0 10px 0","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"10px 0 0 0","borderColor":"rgba(0,0,0,.3)","backgroundColor":"rgba(255, 0, 0, 0)","borderRadius":"0","borderWidth":"0","borderStyle":"solid"}'>
:style='{"padding":"10px 0 10px 0","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"10px 0 0 0","borderColor":"rgba(0,0,0,.3)","backgroundColor":"rgba(255, 0, 0, 0)","borderRadius":"0","borderWidth":"0","borderStyle":"solid"}'>
<div class="box" style='width:80%'>
<div class="title main_backgroundColor sub_borderColor"
:style='{"padding":"10px 0 10px 0","boxShadow":"0 0 3px ","margin":"10px 0 10px 0","color":"rgba(23, 22, 23, 1)","borderRadius":"0px","alignItems":"flex-start","borderWidth":"0 10px","fontSize":"17px","borderStyle":"solid"}'>
<span>NEWS</span>
<span>公告信息展示</span>
</div>
<!-- 新闻区域标题 -->
<div class="title main_backgroundColor sub_borderColor"
:style='{"padding":"10px 0 10px 0","boxShadow":"0 0 3px ","margin":"10px 0 10px 0","color":"rgba(23, 22, 23, 1)","borderRadius":"0px","alignItems":"flex-start","borderWidth":"0 10px","fontSize":"17px","borderStyle":"solid"}'>
<span>NEWS</span>
<span>公告信息展示</span>
</div>
<!-- 新闻列表 -->
<div class="list">
<div v-for="(item,index) in newsList" :key="index" class="list-item list-item5" @click="jump('../news/detail.html?id='+item.id)">
<div class="list-item-body animation-box sub_borderColor" :style='{"padding":"0","margin":"10px 6px 20px 6px","borderColor":"rgba(0,0,0,.3)","backgroundColor":"#fff","borderRadius":"6px","borderWidth":"0","borderStyle":"solid"}'>
<img :style='{"boxShadow":"","borderColor":"rgba(0,0,0,.3)","borderRadius":"0","borderWidth":"0","width":"60%","borderStyle":"solid","height":"220px"}' :src="item.newsPhoto" alt="" />
<div class="item-info">
<div v-if='true' :style='{"isshow":true,"padding":"2px","margin":"8px 0 0 0","backgroundColor":"rgba(0,0,0,0)","color":"rgba(51, 51, 51, 1)","borderRadius":"0","textAlign":"center","fontSize":"16px"}' class="name">{{item.newsName}}</div>
<div :style='{"padding":"0","margin":"0","backgroundColor":"rgba(0,0,0,0)","color":"#999","borderRadius":"0","textAlign":"left","fontSize":"12px"}' class="time">{{item.insertTime}}</div>
</div>
</div>
</div>
<!-- 循环渲染新闻列表项 -->
<div v-for="(item,index) in newsList" :key="index" class="list-item list-item5" @click="jump('../news/detail.html?id='+item.id)">
<div class="list-item-body animation-box sub_borderColor" :style='{"padding":"0","margin":"10px 6px 20px 6px","borderColor":"rgba(0,0,0,.3)","backgroundColor":"#fff","borderRadius":"6px","borderWidth":"0","borderStyle":"solid"}'>
<img :style='{"boxShadow":"","borderColor":"rgba(0,0,0,.3)","borderRadius":"0","borderWidth":"0","width":"60%","borderStyle":"solid","height":"220px"}' :src="item.newsPhoto" alt="" />
<div class="item-info">
<!-- 新闻名称 -->
<div v-if='true' :style='{"isshow":true,"padding":"2px","margin":"8px 0 0 0","backgroundColor":"rgba(0,0,0,0)","color":"rgba(51, 51, 51, 1)","borderRadius":"0","textAlign":"center","fontSize":"16px"}' class="name">{{item.newsName}}</div>
<!-- 新闻发布时间 -->
<div :style='{"padding":"0","margin":"0","backgroundColor":"rgba(0,0,0,0)","color":"#999","borderRadius":"0","textAlign":"left","fontSize":"12px"}' class="time">{{item.insertTime}}</div>
</div>
</div>
</div>
</div>
<div class="clear"></div>
<div style="text-align: center;">
<!-- 查看更多新闻按钮 -->
<button @click="jump('../news/list.html')" style="display: block;cursor: pointer;" type="button"
:style='{"padding":"0 15px","boxShadow":"0 0 6px rgba(255,0,0,0)","margin":"4px auto","borderColor":"#ccc","backgroundColor":"#fff","color":"rgba(160, 67, 26, 1)","borderRadius":"6px","borderWidth":"0","width":"auto","fontSize":"14px","borderStyle":"solid","height":"34px"}'>
查看更多
:style='{"padding":"0 15px","boxShadow":"0 0 6px rgba(255,0,0,0)","margin":"4px auto","borderColor":"#ccc","backgroundColor":"#fff","color":"rgba(160, 67, 26, 1)","borderRadius":"6px","borderWidth":"0","width":"auto","fontSize":"14px","borderStyle":"solid","height":"34px"}'>
查看更多
<i v-if="true" :style='{"isshow":true,"padding":"0 0 0 1px","fontSize":"14px","color":"rgba(160, 67, 26, 1)"}' class="layui-icon layui-icon-next"></i>
</button>
</div>
</div>
</div>
<!-- 医生展示区域 -->
<div class="recommend index-pv3"
:style='{"padding":"10px 0 10px 0","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"10px 0 0 0","borderColor":"rgba(0,0,0,.3)","backgroundColor":"rgba(255, 0, 0, 0)","borderRadius":"4px","borderWidth":"0","borderStyle":"solid"}'>
<div class="box" style='width:80%'>
<div class="title main_backgroundColor sub_borderColor"
:style='{"padding":"10px 0 10px 0","boxShadow":"0 0 3px ","margin":"10px 0 10px 0","color":"rgba(23, 22, 23, 1)","borderRadius":"0px","alignItems":"flex-start","borderWidth":"0 10px","fontSize":"17px","borderStyle":"solid"}'>
<span>DATA SHOW</span>
<span>医生展示</span>
</div>
<!-- 医生展示区域标题 -->
<div class="title main_backgroundColor sub_borderColor"
:style='{"padding":"10px 0 10px 0","boxShadow":"0 0 3px ","margin":"10px 0 10px 0","color":"rgba(23, 22, 23, 1)","borderRadius":"0px","alignItems":"flex-start","borderWidth":"0 10px","fontSize":"17px","borderStyle":"solid"}'>
<span>DATA SHOW</span>
<span>医生展示</span>
</div>
<div class="show-reel row">
<div v-for="(item,index) in yishengList" v-bind:key="index" class="col-md-3 agile-gallery-grid">
<div class="agile-gallery">
<a @click="jumpCheck('../yisheng/detail.html?id='+item.id , item.aaaaaaaaaa == null?'':item.aaaaaaaaaa , item.shangxiaTypes == null?'':item.shangxiaTypes)" class="lsb-preview" data-lsb-group="header">
<img :src="item.yishengPhoto?item.yishengPhoto.split(',')[0]:''" style="height: 350px;width:100%;" />
<div class="agileits-caption">
<h4>{{item.yishengName}}</h4>
<p v-if="item.yishengNewMoney != null" >￥{{item.yishengNewMoney}}</p>
</div>
</a>
</div>
<!-- 医生展示列表 -->
<div class="show-reel row">
<!-- 循环渲染医生列表项 -->
<div v-for="(item,index) in yishengList" v-bind:key="index" class="col-md-3 agile-gallery-grid">
<div class="agile-gallery">
<a @click="jumpCheck('../yisheng/detail.html?id='+item.id , item.aaaaaaaaaa == null?'':item.aaaaaaaaaa , item.shangxiaTypes == null?'':item.shangxiaTypes)" class="lsb-preview" data-lsb-group="header">
<img :src="item.yishengPhoto?item.yishengPhoto.split(',')[0]:''" style="height: 350px;width:100%;" />
<div class="agileits-caption">
<!-- 医生姓名 -->
<h4>{{item.yishengName}}</h4>
<!-- 医生价格 -->
<p v-if="item.yishengNewMoney != null" >￥{{item.yishengNewMoney}}</p>
</div>
</a>
</div>
</div>
</div>
<div class="clear"></div>
<div style="text-align: center;">
<!-- 查看更多医生按钮 -->
<button @click="jump('../yisheng/list.html')" style="display: block;cursor: pointer;" type="button"
:style='{"padding":"0 15px","boxShadow":"0 0 6px rgba(255,0,0,0)","margin":"4px auto","borderColor":"#ccc","backgroundColor":"#fff","color":"rgba(160, 67, 26, 1)","borderRadius":"6px","borderWidth":"0","width":"auto","fontSize":"14px","borderStyle":"solid","height":"34px"}'>
查看更多<i v-if="true"
:style='{"isshow":true,"padding":"0 0 0 1px","fontSize":"14px","color":"rgba(160, 67, 26, 1)"}'
class="layui-icon layui-icon-next"></i></button>
:style='{"isshow":true,"padding":"0 0 0 1px","fontSize":"14px","color":"rgba(160, 67, 26, 1)"}'
class="layui-icon layui-icon-next"></i></button>
</div>
</div>
</div>
<!-- 健康教育展示区域 -->
<div class="news index-pv2" style="display: flex;justify-content: center;width:100%"
:style='{"padding":"10px 0 10px 0","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"10px 0 0 0","borderColor":"rgba(0,0,0,.3)","backgroundColor":"rgba(255, 0, 0, 0)","borderRadius":"0","borderWidth":"0","borderStyle":"solid"}'>
:style='{"padding":"10px 0 10px 0","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"10px 0 0 0","borderColor":"rgba(0,0,0,.3)","backgroundColor":"rgba(255, 0, 0, 0)","borderRadius":"0","borderWidth":"0","borderStyle":"solid"}'>
<div class="box" style='width:80%'>
<div class="title main_backgroundColor sub_borderColor"
:style='{"padding":"10px 0 10px 0","boxShadow":"0 0 3px ","margin":"10px 0 10px 0","color":"rgba(23, 22, 23, 1)","borderRadius":"0px","alignItems":"flex-start","borderWidth":"0 10px","fontSize":"17px","borderStyle":"solid"}'>
<span>DATA SHOW</span>
<span>健康教育展示</span>
</div>
<!-- 健康教育展示区域标题 -->
<div class="title main_backgroundColor sub_borderColor"
:style='{"padding":"10px 0 10px 0","boxShadow":"0 0 3px ","margin":"10px 0 10px 0","color":"rgba(23, 22, 23, 1)","borderRadius":"0px","alignItems":"flex-start","borderWidth":"0 10px","fontSize":"17px","borderStyle":"solid"}'>
<span>DATA SHOW</span>
<span>健康教育展示</span>
</div>
<!-- 健康教育列表 -->
<div class="list">
<div v-for="(item,index) in jiankangjiaoyuList" :key="index" class="list-item list-item5" @click="jump('../jiankangjiaoyu/detail.html?id='+item.id)">
<div class="list-item-body animation-box sub_borderColor" :style='{"padding":"0","margin":"10px 6px 20px 6px","borderColor":"rgba(0,0,0,.3)","backgroundColor":"#fff","borderRadius":"6px","borderWidth":"0","borderStyle":"solid"}'>
<img :style='{"boxShadow":"","borderColor":"rgba(0,0,0,.3)","borderRadius":"0","borderWidth":"0","width":"60%","borderStyle":"solid","height":"220px"}' :src="item.jiankangjiaoyuPhoto" alt="" />
<div class="item-info">
<div v-if='true' :style='{"isshow":true,"padding":"2px","margin":"8px 0 0 0","backgroundColor":"rgba(0,0,0,0)","color":"rgba(51, 51, 51, 1)","borderRadius":"0","textAlign":"center","fontSize":"16px"}' class="name">{{item.jiankangjiaoyuName}}</div>
<div :style='{"padding":"0","margin":"0","backgroundColor":"rgba(0,0,0,0)","color":"#999","borderRadius":"0","textAlign":"left","fontSize":"12px"}' class="time">{{item.insertTime}}</div>
</div>
</div>
</div>
<!-- 循环渲染健康教育列表项 -->
<div v-for="(item,index) in jiankangjiaoyuList" :key="index" class="list-item list-item5" @click="jump('../jiankangjiaoyu/detail.html?id='+item.id)">
<div class="list-item-body animation-box sub_borderColor" :style='{"padding":"0","margin":"10px 6px 20px 6px","borderColor":"rgba(0,0,0,.3)","backgroundColor":"#fff","borderRadius":"6px","borderWidth":"0","borderStyle":"solid"}'>
<img :style='{"boxShadow":"","borderColor":"rgba(0,0,0,.3)","borderRadius":"0","borderWidth":"0","width":"60%","borderStyle":"solid","height":"220px"}' :src="item.jiankangjiaoyuPhoto" alt="" />
<div class="item-info">
<!-- 健康教育名称 -->
<div v-if='true' :style='{"isshow":true,"padding":"2px","margin":"8px 0 0 0","backgroundColor":"rgba(0,0,0,0)","color":"rgba(51, 51, 51, 1)","borderRadius":"0","textAlign":"center","fontSize":"16px"}' class="name">{{item.jiankangjiaoyuName}}</div>
<!-- 健康教育发布时间 -->
<div :style='{"padding":"0","margin":"0","backgroundColor":"rgba(0,0,0,0)","color":"#999","borderRadius":"0","textAlign":"left","fontSize":"12px"}' class="time">{{item.insertTime}}</div>
</div>
</div>
</div>
</div>
<div class="clear"></div>
<div style="text-align: center;">
<!-- 查看更多健康教育按钮 -->
<button @click="jump('../jiankangjiaoyu/list.html')" style="display: block;cursor: pointer;" type="button"
:style='{"padding":"0 15px","boxShadow":"0 0 6px rgba(255,0,0,0)","margin":"4px auto","borderColor":"#ccc","backgroundColor":"#fff","color":"rgba(160, 67, 26, 1)","borderRadius":"6px","borderWidth":"0","width":"auto","fontSize":"14px","borderStyle":"solid","height":"34px"}'>
查看更多
:style='{"padding":"0 15px","boxShadow":"0 0 6px rgba(255,0,0,0)","margin":"4px auto","borderColor":"#ccc","backgroundColor":"#fff","color":"rgba(160, 67, 26, 1)","borderRadius":"6px","borderWidth":"0","width":"auto","fontSize":"14px","borderStyle":"solid","height":"34px"}'>
查看更多
<i v-if="true" :style='{"isshow":true,"padding":"0 0 0 1px","fontSize":"14px","color":"rgba(160, 67, 26, 1)"}' class="layui-icon layui-icon-next"></i>
</button>
</div>
@ -542,32 +637,45 @@
</div>
</div>
<!-- 引入 Bootstrap 框架的 JavaScript 文件 -->
<script src="../../xznstatic/js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
<!-- 引入 layui 框架的 JavaScript 文件 -->
<script src="../../layui/layui.js"></script>
<!-- 引入 Vue.js 库 -->
<script src="../../js/vue.js"></script>
<!-- 引入element组件库 -->
<!-- 引入 Element 组件库 -->
<script src="../../xznstatic/js/element.min.js"></script>
<!-- 引入element样式 -->
<!-- 引入 Element 组件库的样式文件 -->
<link rel="stylesheet" href="../../xznstatic/css/element.min.css">
<!-- 引入 swiper 插件的 JavaScript 文件 -->
<script src="../../xznstatic/js/swiper.min.js"></script>
<!-- 引入自定义的配置 JavaScript 文件 -->
<script src="../../js/config.js"></script>
<!-- 引入自定义的模块配置 JavaScript 文件 -->
<script src="../../modules/config.js"></script>
<!-- 引入自定义的工具 JavaScript 文件 -->
<script src="../../js/utils.js"></script>
<script type="text/javascript">
// 创建 Vue 实例
var vue = new Vue({
// 挂载点
el: '#app',
// 数据对象
data: {
swiperList: [],
swiperList: [], // 轮播图列表
// dianyingRecommend: [],
newsList: [],
yishengList: [],
jiankangjiaoyuList: [],
newsList: [], // 新闻列表
yishengList: [], // 医生列表
jiankangjiaoyuList: [], // 健康教育列表
},
// 过滤器
filters: {
newsDesc: function (val) {
if (val) {
// 去除 HTML 标签和 undefined 字符串
val = val.replace(/<[^<>]+>/g, '').replace(/undefined/g, '');
if (val.length > 60) {
// 截取前 60 个字符
val = val.substring(0, 60);
}
@ -576,31 +684,41 @@
return '';
}
},
// 方法
methods: {
// 页面跳转方法
jump(url) {
jump(url)
}
,jumpCheck(url,check1,check2) {
if(check1 == "2" || check1 == 2){//级联表的逻辑删除字段[1:未删除 2:已删除]
},
// 带检查的页面跳转方法
jumpCheck(url, check1, check2) {
if (check1 == "2" || check1 == 2) {//级联表的逻辑删除字段[1:未删除 2:已删除]
// 弹出提示框
layui.layer.msg("已经被删除", {
time: 2000,
icon: 2
});
return false;
}
if(check2 == "2" || check2 == 2){//是否下架[1:上架 2:下架]
if (check2 == "2" || check2 == 2) {//是否下架[1:上架 2:下架]
// 弹出提示框
layui.layer.msg("已经下架", {
time: 2000,
icon: 2
});
return false;
}
// 调用 jump 方法进行页面跳转
this.jump(url);
}
}
});
layui.use(['layer', 'form', 'element', 'carousel', 'http', 'jquery'], function () {
// 使用 layui 加载所需的模块
layui.use(['layer', 'form', 'element', 'carousel', 'http', 'jquery'
], function () {
// 从 layui 中获取所需的模块实例
var layer = layui.layer;
var element = layui.element;
var form = layui.form;
@ -608,75 +726,86 @@
var http = layui.http;
var jquery = layui.jquery;
// 获取轮播图 数据
// 发送 HTTP 请求获取轮播图数据
http.request('config/list', 'get', {
page: 1,
limit: 5
}, function (res) {
if (res.data.list.length > 0) {
let swiperList = [];
res.data.list.forEach(element => {
if(element.value != null
)
{
swiperList.push({
img: element.value
});
}
})
;
vue.swiperList = swiperList;
vue.$nextTick(() => {
carousel.render({
elem: '#test1',
width: '100%',
height: '450px',
arrow: 'hover',
anim: 'default',
autoplay: 'true',
interval: '3000',
indicator: 'inside'
});
})
// vue.$nextTick(()=>{
// window.xznSlide();
// });
}
});
page: 1,
limit: 5
}, function (res) {
// 检查响应数据中列表是否有内容
if (res.data.list.length > 0) {
// 用于存储轮播图数据的数组
let swiperList = [];
// 遍历响应数据中的列表项
res.data.list.forEach(element => {
// 检查当前项的 value 属性是否不为 null
if (element.value != null) {
// 将符合条件的项添加到 swiperList 数组中
swiperList.push({
img: element.value
});
}
});
// 将处理后的轮播图数据赋值给 Vue 实例的 swiperList
vue.swiperList = swiperList;
// 等待 Vue 实例更新 DOM 后执行回调函数
vue.$nextTick(() => {
// 渲染轮播图组件
carousel.render({
elem: '#test1',
width: '100%',
height: '450px',
arrow: 'hover',
anim: 'default',
autoplay: 'true',
interval: '3000',
indicator: 'inside'
});
});
// 注释掉的代码，原本用于调用自定义的幻灯片函数
// vue.$nextTick(() => {
// window.xznSlide();
// });
}
});
// 发送 HTTP 请求获取新闻列表数据
http.request('news/list', 'get', {
page: 1,
limit: 8,
}, function (res) {
vue.newsList = res.data.list;
page: 1,
limit: 8,
}, function (res) {
// 将响应数据中的列表赋值给 Vue 实例的 newsList
vue.newsList = res.data.list;
});
});
// 发送 HTTP 请求获取医生列表数据
http.request('yisheng/list', 'get', {
page: 1,
limit: 8,
}, function (res) {
vue.yishengList = res.data.list;
page: 1,
limit: 8,
}, function (res) {
// 将响应数据中的列表赋值给 Vue 实例的 yishengList
vue.yishengList = res.data.list;
});
});
// 发送 HTTP 请求获取健康教育列表数据
http.request('jiankangjiaoyu/list', 'get', {
page: 1,
limit: 8,
jiankangjiaoyuDelete: 1,
}, function (res) {
vue.jiankangjiaoyuList = res.data.list;
});
page: 1,
limit: 8,
jiankangjiaoyuDelete: 1,
}, function (res) {
// 将响应数据中的列表赋值给 Vue 实例的 jiankangjiaoyuList
vue.jiankangjiaoyuList = res.data.list;
});
})
;
window.xznSlide = function () {
// 定义自定义的幻灯片函数
window.xznSlide = function () {
// 注释掉的代码，原本用于初始化 .banner 元素的幻灯片效果
// jQuery(".banner").slide({mainCell:".bd ul",autoPlay:true,interTime:5000});
// 初始化 #ifocus 元素的图片幻灯片效果
jQuery("#ifocus").slide({
titCell: "#ifocus_btn li",
mainCell: "#ifocus_piclist ul",
@ -685,18 +814,20 @@
autoPlay: true,
triggerTime: 0
});
// 初始化 #ifocus 元素的文本幻灯片效果
jQuery("#ifocus").slide({titCell: "#ifocus_btn li", mainCell: "#ifocus_tx ul", delayTime: 0, autoPlay: true});
// 初始化 .product_list 元素的幻灯片效果
jQuery(".product_list").slide({
mainCell: ".bd ul",
autoPage: true,
effect: "leftLoop",
autoPlay: true,
vis: 5,
trigger: "click",
interTime: 4000
});
mainCell: ".bd ul",
autoPage: true,
effect: "leftLoop",
autoPlay: true,
vis: 5,
trigger: "click",
interTime: 4000
});
};
</script>
<script src="../../xznstatic/js/index.js"></script>
</body>
</html>
</html>
Write Preview
Loading…
Cancel
Save