From 7e1e46ff062dcffe4549da8892fed754fa768594 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期四, 18 二月 2021 12:15:58 +0800
Subject: [PATCH] 增加新闻分页
---
src/views/successCase/caseSolution.vue | 216 +++++++++++++++--------------------------------------
1 files changed, 61 insertions(+), 155 deletions(-)
diff --git a/src/views/successCase/caseSolution.vue b/src/views/successCase/caseSolution.vue
index a134a74..1b6b386 100644
--- a/src/views/successCase/caseSolution.vue
+++ b/src/views/successCase/caseSolution.vue
@@ -1,131 +1,36 @@
<template>
<div id="wrap">
<div class="banner" style="margin-bottom: 1rem;">
- <img src="../../img/solve.png" alt="" class="m_hide">
- <img src="../../img/jiejue.png" alt="" class="p_hide">
+ <img src="../../img/solve.jpg" alt="">
</div>
<div class="wrapper">
- <div class="content_title"><span>鏁板瓧鍖栬В鍐虫柟妗�</span></div>
- <p class="p_txt">AI涓嶪oT鎶�鏈渶缁堜細灏嗙墿鐞嗕笘鐣屾敼閫犱负涓囩墿浜掕仈涓栫晫锛屽悓鏃跺缓绔嬩竴涓叏鏂扮殑鏁板瓧鍖栦笘鐣屻�傚熀浜庤嚜韬牳蹇冪殑AI绠楁硶鑳藉姏涓庤蒋纭欢缁撳悎鑳藉姏锛屾槑绉戦潰鍚戞牳蹇冨簲鐢ㄥ満鏅紝鏋勫缓浜嗕粨鍌ㄧ墿娴併�佹櫤鑳藉埗閫犲拰鍟嗗煄钀ラ攢涓夊ぇ涓氬姟浣撶郴锛屽悓鏃朵篃閫氳繃寮�鏀惧熀纭�浜哄伐鏅鸿兘绠楁硶璧嬭兘寮�鍙戣�呭疄鐜板簲鐢ㄥ垱鏂般��</p>
+ <div class="content_title" v-if="title"><span v-text="title"></span></div>
+ <p class="p_txt" v-text="description"></p>
<div class="content_solution">
- <dl class="solution_box">
+ <dl class="solution_box" v-for="(item, index) in datalist" :key="index">
<dt class="solution_box_in">
- <h3><span>浠撳偍鐗╂祦</span></h3>
- <router-link to="/caseDetail" style="margin-right: 0.3rem;">
- <p style="line-height: 0.22rem;">缁煎悎浜嗚蒋浠剁郴缁熴�� 鏉＄爜搴旂敤銆佺‖浠剁郴缁熴�佹棤绾跨綉缁溿�佺郴缁熸墿灞曟帴 鍙ｇ瓑澶氱鎶�鏈紝閫氳繃鏃犵嚎绉诲姩缁堢璁惧锛屾櫤鑳戒俊鎭寲搴旂敤娓楅�忓埌浠撳簱浣滀笟鐨勬瘡涓粏鑺傚強浠撳簱鐜板満</p>
- </router-link>
+ <h3><span v-text="item.SubjClasName"></span></h3>
+ <p style="line-height: 0.22rem; margin-right: 0.3rem;font-size: 0.16rem;" v-text="item.Remark"></p>
<div class="title">
- <router-link to="/caseDetail" style="margin-right: 0.3rem;">鏅烘収浠撳偍</router-link>
- <router-link to="/caseDetail" style="margin-right: 0.3rem;">渚涘簲鍟嗗崗鍚�</router-link>
- <router-link to="/caseDetail">缁忛攢鍟嗙鐞�</router-link>
+ <a href="javascript:;" style="margin-right: 0.3rem;" v-for="(menu, i) in item.Subject" :key="i"
+ v-text="menu.Title1" @click="jumpmenu(menu)"></a>
</div>
</dt>
<dd>
- <img src="../../img/cang.png" alt="">
- </dd>
- </dl>
- <dl class="solution_box">
- <dt class="solution_box_in">
- <h3><span>鏅鸿兘鍒堕��</span></h3>
- <router-link to="/caseDetail" style="margin-right: 0.3rem;">
- <p style="line-height: 0.22rem;">浼佷笟瑕佸疄鐜版櫤鑳藉埗閫狅紝蹇呴』瑕佸厛瀹炵幇鑷姩鍖栵紝瑕佸疄鐜拌嚜鍔ㄥ寲锛屽氨瑕佸疄鐜颁汉涓庤澶囩殑浜や簰锛岀敱浜鸿繙绋嬫搷鎺� 鎴栬�呯敱璁惧鑷姩鎰熷簲杩愯锛屽苟閫氳繃浜烘満浜や簰鍑忓皯浜轰负鎿嶄綔锛屽疄鐜扮敓浜ц嚜鍔ㄥ寲</p>
- </router-link>
- <div class="title">
- <router-link to="/caseDetail" style="margin-right: 0.3rem;">鏅鸿兘鍒堕��</router-link>
- <router-link to="/caseDetail">璐ㄩ噺杩芥函</router-link>
- </div>
- </dt>
- <dd>
- <img src="../../img/solution.png" alt="">
- </dd>
- </dl>
- <dl class="solution_box">
- <dt class="solution_box_in">
- <h3><span>鍩庡競钀ラ攢</span></h3>
- <router-link to="/caseDetail">
- <p style="line-height: 0.22rem;">浠2B2C鐨勭悊蹇靛嚭鍙戯紝鍒涙柊妯″潡鍖栬璁℃暣鍚堣繍钀ュ晢锛屽煄甯傜珯鐐癸紝渚涜揣 鍟嗭紝鎵瑰彂鍟嗭紝鍏ラ┗鍟嗭紝鍒嗛攢鍟嗭紝闂ㄥ簵浜庝竴浣擄紝鍚勪釜妯″潡鍙嚜鐢辨媶鍒嗙粍鍚堬紝鍙互璁╁晢瀹跺湪杩欎釜鐢� 鍟嗗鏍峰寲鐨勬椂浠ｄ笅闅忔椂璋冩暣杩愯惀鏂规</p>
- </router-link>
- <div class="title">
- <router-link to="/caseDetail" style="margin-right: 0.3rem;">寰俊鍟嗗煄</router-link>
- <router-link to="/caseDetail" style="margin-right: 0.3rem;">绾㈠寘鎶藉</router-link>
- <router-link to="/caseDetail">鐢靛晢ERP</router-link>
- </div>
- </dt>
- <dd>
- <img src="../../img/c33.png" alt="">
- </dd>
- </dl>
- <dl class="solution_box">
- <dt class="solution_box_in">
- <h3><span>鏄庣鍟嗕笟鏅鸿兘寮�鏀惧钩鍙�</span></h3>
- <router-link to="/caseDetail">
- <p style="line-height: 0.22rem;">MingKeOS鏄敱鏄庣浜戣绠椾簨涓氶儴鐮斿彂鐨勫彲閰嶇疆浜哄伐鏅鸿兘寮�鍙戝钩鍙帮紝濂瑰彲浠ヨ鐢ㄦ埛閫氳繃绠�鍗曢厤缃�佽嚜鐒惰瑷�瀵硅瘽鐨勪氦浜掓柟寮忥紝鍗冲彲瀹炵幇浼佷笟绠＄悊杩囩▼涓鏉傜殑涓氬姟閫昏緫澶勭悊</p>
- </router-link>
- <div class="title">
- <router-link to="/caseDetail">MingKeOS</router-link>
- </div>
- </dt>
- <dd>
- <img src="../../img/ai4.png" alt="">
+ <img style="width: 100%;" :src="item.Images" alt="">
</dd>
</dl>
<!-- 绉诲姩绔牱寮� -->
- <div class="wrapper industry">
- <div class="content_industry_card">
- <h3>浠撳偍鐗╂祦</h3>
- <router-link to="/caseDetail">
- <p>缁煎悎浜嗚蒋浠剁郴缁熴�� 鏉＄爜搴旂敤銆佺‖浠剁郴缁熴�佹棤绾跨綉缁溿�佺郴缁熸墿灞曟帴 鍙ｇ瓑澶氱鎶�鏈紝閫氳繃鏃犵嚎绉诲姩缁堢璁惧锛屾櫤鑳戒俊鎭寲搴旂敤娓楅�忓埌浠撳簱浣滀笟鐨勬瘡涓粏鑺傚強浠撳簱鐜板満銆�</p>
- </router-link>
+ <div class="wrapper industry" style="width: 100%;">
+ <div class="content_industry_card" v-for="(item, index) in datalist" :key="index">
+ <h3 v-text="item.SubjClasName"></h3>
+ <p v-text="item.Remark"></p>
<div class="content_industry_list">
<ul>
- <li @click="jump('/caseDetail')">鏅烘収浠撳偍</li>
- <li @click="jump('/caseDetail')">渚涘簲鍟嗗崗鍚�</li>
- <li @click="jump('/caseDetail')">缁忛攢鍟嗙鐞�</li>
+ <li style="font-size: 0.26rem;" v-for="(menu, i) in item.Subject" :key="i" @click="jumpmenu(menu)" v-text="menu.Title1"></li>
</ul>
- <img src="../../img/wu1.png" alt="">
- </div>
- </div>
-
- <div class="content_industry_card">
- <h3>鏅鸿兘鍒堕��</h3>
- <router-link to="/caseDetail">
- <p>浼佷笟瑕佸疄鐜版櫤鑳藉埗閫狅紝蹇呴』瑕佸厛瀹炵幇鑷姩鍖栵紝瑕佸疄鐜拌嚜鍔ㄥ寲灏辫瀹炵幇浜轰笌璁惧鐨勪氦浜掞紝鐢变汉杩滅▼鎿嶆帶 鎴栬�呯敱璁惧鑷姩鎰熷簲杩愯锛屽苟閫氳繃浜烘満浜や簰鍑忓皯浜轰负鎿嶄綔锛屽疄鐜扮敓浜ц嚜鍔ㄥ寲銆�</p>
- </router-link>
- <div class="content_industry_list">
- <img src="../../img/wu2.png" alt="">
- <ul>
- <li @click="jump('/caseDetail')">鏅鸿兘鍒堕��</li>
- <li @click="jump('/caseDetail')">璐ㄩ噺杩芥函</li>
- </ul>
- </div>
- </div>
-
- <div class="content_industry_card">
- <h3>鍩庡競钀ラ攢</h3>
- <router-link to="/caseDetail">
- <p>浠2B2C鐨勭悊蹇靛嚭鍙戯紝鍒涙柊妯″潡鍖栬璁℃暣鍚堣繍钀ュ晢锛屽煄甯傜珯鐐癸紝渚涜揣 鍟嗭紝鎵瑰彂鍟嗭紝鍏ラ┗鍟嗭紝鍒嗛攢鍟嗭紝闂ㄥ簵浜庝竴浣擄紝鍚勪釜妯″潡鍙嚜鐢辨媶鍒嗙粍鍚堬紝鍙互璁╁晢瀹跺湪杩欎釜鐢� 鍟嗗鏍峰寲鐨勬椂浠ｄ笅闅忔椂璋冩暣杩愯惀鏂规</p>
- </router-link>
- <div class="content_industry_list">
- <ul>
- <li @click="jump('/caseDetail')">寰俊鍟嗗煄</li>
- <li @click="jump('/caseDetail')">绾㈠寘鎶藉</li>
- <li @click="jump('/caseDetail')">鐢靛晢ERP</li>
- </ul>
- <img src="../../img/wu3.png" alt="">
- </div>
- </div>
-
- <div class="content_industry_card">
- <h3>鏄庣鏅鸿兘寮�鏀惧钩鍙�</h3>
- <router-link to="/caseDetail">
- <p>MingKeOS鏄敱鏄庣浜戣绠椾簨涓氶儴鐮斿彂鐨勫彲閰嶇疆浜哄伐鏅鸿兘寮�鍙戝钩鍙帮紝濂瑰彲浠ヨ鐢ㄦ埛閫氳繃绠�鍗曢厤缃�佽嚜鐒惰瑷�瀵硅瘽鐨勪氦浜掓柟寮忥紝鍗冲彲瀹炵幇浼佷笟绠＄悊杩囩▼涓鏉傜殑涓氬姟閫昏緫澶勭悊</p>
- </router-link>
- <div class="content_industry_list">
- <img src="../../img/wu4.png" alt="">
- <ul>
- <li @click="jump('/caseDetail')">MingKeOS</li>
- </ul>
+ <img :src="item.Images" alt="">
</div>
</div>
</div>
@@ -136,22 +41,43 @@
</template>
<script>
export default {
- data(){
- return{
-
+ data() {
+ return {
+ title: null,
+ description: null,
+ datalist: null
}
},
- methods:{
- jump(u){
- this.$router.push(u)
+ methods: {
+ jumpmenu (menu) {
+ let _menuId = menu.ID
+ _menuId = _menuId + '.html'
+ this.$router.push({name: menu.PageType.toLowerCase(), params: {menuId: _menuId}})
+ },
+ load () {
+ let param = {
+ func: 'Web_Center_GetData',
+ Centertype: 'Solution'
+ }
+ this.Service.getParamData(param).then(res => {
+ this.title = res.HeadField
+ this.description = res.LongText
+ this.datalist = res.data
+ })
}
+ },
+ mounted () {
+ this.load()
}
}
</script>
<style lang="less" scoped>
+ .wrap {
+ min-height: 80vh;
+ }
@media (min-width: 751px) {
- .banner_txt{
+ .banner_txt {
font-size: 0.6rem;
font-family: SourceHanSansCN-Bold;
font-weight: bold;
@@ -160,31 +86,27 @@
top: 41%;
left: 42%;
}
- .p_hide{
+ .p_hide {
display: none;
}
- .industry{
+ .industry {
display: none;
}
.content_title {
margin-top: .5rem
}
-
p {
padding: .4rem .4rem 0;
color: #676767;
- font-size: .15rem;
+ font-size: .16rem;
line-height: 0.26rem;
}
-
.solution_box-m {
display: none;
}
-
.content_solution {
margin-top: 1rem;
}
-
.solution_box {
float: left;
padding: .3rem .4rem;
@@ -207,12 +129,10 @@
color:rgba(59,59,60,1);
}
}
-
p {
padding: .3rem 0;
color: #3E3E3E;
}
-
.title {
width: 100%;
@@ -223,7 +143,6 @@
}
}
}
-
dd {
width: 30%;
height: 80%;
@@ -237,12 +156,10 @@
dd {
float: left;
}
-
dt {
float: right;
}
}
-
.solution_box_in>h3>span:after {
content: '';
position: absolute;
@@ -256,29 +173,27 @@
}
@media (max-width: 750px) and (min-width: 0) {
- .m_hide{
- display: none;
+ .banner {
+ margin-top: 1.13rem;
+ img {
+ max-width: 150%;
+ margin-left: -19%;
+ }
}
- .banner{
- margin-top: 1.14rem;
- }
- .m_hide{
- display: none;
- }
- .p_txt{
+ .p_txt {
font-size:0.24rem;
font-family:PingFang-SC-Regular;
font-weight:400;
color:rgba(62,62,62,1);
line-height:0.44rem;
}
- .content_industry_card{
+ .content_industry_card {
background: #f4f4f4;
padding: 0.3rem;
margin-top: 0.4rem;
h3{
- font-size:0.4rem;
+ font-size: 0.36rem;
font-family:PingFang-SC-Bold;
font-weight:bold;
color:rgba(59,59,60,1);
@@ -296,19 +211,18 @@
left: calc(50% - 0.57rem);
}
- p{
+ p {
margin: 0.32rem 0;
color: #676767;
}
-
- .content_industry_list{
+ .content_industry_list {
display: flex;
font-size: 0.24rem;
-
- ul{
+
+ ul {
flex: 1;
margin-top: 0.3rem;
- li{
+ li {
color: #676767;
margin-bottom: 0.4rem;
font-size:0.24rem;
@@ -319,23 +233,19 @@
text-align: center;
}
}
- img{
+ img {
width: 3.6rem;
height: 2rem;
margin: auto 0;
}
}
}
-
-
.center {
padding-top: .6rem;
}
-
.solution_box {
display: none;
}
-
.content_solution {
margin-top: .6rem;
@@ -371,7 +281,6 @@
.dd-img {
width: 70%;
}
-
.title {
width: 30%;
text-align: center;
@@ -389,13 +298,10 @@
}
}
}
-
}
-
.content_title {
margin: 1rem 0 .3rem 0;
}
-
.solution_box_in>h3>span:after {
content: '';
position: absolute;
--
Gitblit v1.8.0