| | |
| | | <span v-text="item.dTitle1"></span> |
| | | </div> |
| | | <div class="content"> |
| | | <div class="contnt-describe" :id="index"> |
| | | <div class="contnt-describe" :id="index + 'box'"> |
| | | <div :class="index % 2 === 0 ? 'left' : 'right'" style="padding-top: 0.2rem;"> |
| | | <p v-for="(cell, i) in item.SuccessCaseDetail" :key="i" :class="cell.oTitle1 && 'h3'" v-text="cell.oTitle1 || cell.LongText"></p> |
| | | </div> |
| | | <div :class="index % 2 === 1 ? 'left' : 'right'" style="text-align: center;"> |
| | | <div :id="index + 'box' + 'img'" :class="index % 2 === 1 ? 'left' : 'right'" style="text-align: center;"> |
| | | <img :src="item.Images" alt=""> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="wrapper dynamic_b" v-if="data"> |
| | | <p v-if="data.LastTitle"> |
| | | <span :style="data.LastID && 'cursor:pointer;'" @click="jumpmenu(data.LastID)"> |
| | | 上一篇:{{data.LastTitle}} |
| | | <span class="tip" v-text="data.lastTip"></span> |
| | | </span> |
| | | </p> |
| | | <p v-if="data.NextTitle"> |
| | | <span :style="data.NextID && 'cursor:pointer;'" @click="jumpmenu(data.NextID)"> |
| | | 下一篇:{{data.NextTitle}} |
| | | <span class="tip" v-text="data.nextTip"></span> |
| | | </span> |
| | | </p> |
| | | </div> |
| | | </div> |
| | | </template> |
| | |
| | | data () { |
| | | return { |
| | | product: null, |
| | | details: null |
| | | details: null, |
| | | data: null |
| | | } |
| | | }, |
| | | watch: { |
| | | $route () { |
| | | this.menuId = this.$route.params.menuId |
| | | this.load() |
| | | } |
| | | }, |
| | | methods: { |
| | | jumpmenu (menuId) { |
| | | if (!menuId || !this.data.PageType) return |
| | | this.$router.push({name: this.data.PageType.toLowerCase(), params: {menuId: menuId}}) |
| | | }, |
| | | load () { |
| | | let param = { |
| | | func: 'Web_SuccessCaseIndex_GetData', |
| | |
| | | industry: res.Industry, |
| | | time: res.CompletedTime |
| | | } |
| | | let lastTip = res.LastIndustry |
| | | if (lastTip && res.LastPlace) { |
| | | lastTip += ' | ' + res.LastPlace |
| | | } else { |
| | | lastTip += res.LastPlace |
| | | } |
| | | if (lastTip && res.LastCompletedTime) { |
| | | lastTip += ' | ' + res.LastCompletedTime |
| | | } else { |
| | | lastTip += res.LastCompletedTime |
| | | } |
| | | |
| | | let nextTip = res.NextIndustry |
| | | if (nextTip && res.NextPlace) { |
| | | nextTip += ' | ' + res.NextPlace |
| | | } else { |
| | | nextTip += res.NextPlace |
| | | } |
| | | if (nextTip && res.NextCompletedTime) { |
| | | nextTip += ' | ' + res.NextCompletedTime |
| | | } else { |
| | | nextTip += res.NextCompletedTime |
| | | } |
| | | |
| | | this.data = { |
| | | lastTip: lastTip, |
| | | LastID: res.LastID, |
| | | LastTitle: res.LastTitle, |
| | | NextID: res.NextID, |
| | | NextTitle: res.NextTitle, |
| | | nextTip: nextTip, |
| | | PageType: res.PageType |
| | | } |
| | | this.details = res.SuccessCase |
| | | |
| | | this.$nextTick(() => { |
| | | if (document.body.clientWidth < 750) return |
| | | this.details.forEach((item, index) => { |
| | | let boxheight = document.getElementById(index + 'box').offsetHeight - 40 |
| | | document.getElementById(index + 'boximg').style['line-height'] = boxheight + 'px' |
| | | }) |
| | | }) |
| | | }) |
| | | } |
| | | }, |
| | |
| | | margin:0.72rem 0 2.88rem; |
| | | } |
| | | @media (min-width: 751px) { |
| | | .wrapper { |
| | | margin-bottom: 0.4rem; |
| | | } |
| | | .dynamic_b { |
| | | padding: 0; |
| | | margin-bottom: 0.5rem; |
| | | p { |
| | | margin: .1rem 0; |
| | | span.tip { |
| | | font-family: MicrosoftYaHei; |
| | | font-weight: 400; |
| | | color: rgba(175,173,173,1); |
| | | margin-left: 0.2rem; |
| | | } |
| | | } |
| | | } |
| | | .content22 { |
| | | margin-bottom: 0.5rem; |
| | | } |
| | |
| | | } |
| | | .contnt-describe { |
| | | float: left; |
| | | padding: .1rem .2rem 0.3rem; |
| | | padding: .2rem .2rem; |
| | | margin-bottom: .2rem; |
| | | .left { |
| | | float: left; |
| | |
| | | } |
| | | .content_title { |
| | | text-align: center; |
| | | margin: .4rem 0 .5rem; |
| | | span { |
| | | display: inline-block; |
| | | border-bottom: 0.02rem solid; |
| | |
| | | } |
| | | .contnt-describe img { |
| | | display: inline-block; |
| | | margin-top: 0.1rem; |
| | | // margin-top: 0.1rem; |
| | | } |
| | | } |
| | | @media (max-width: 750px) and (min-width: 0) { |
| | | .dynamic_b { |
| | | padding: 0.6rem 0.32rem 0.4rem; |
| | | p { |
| | | margin-bottom: 0.2rem; |
| | | } |
| | | span.tip { |
| | | display: none; |
| | | } |
| | | } |
| | | .p_txt2 { |
| | | width: 4rem; |
| | | margin: 0 auto; |