Skip to content

肖康 / H5_2.0

Go to a project
Commit a90ae592 by LJM
Options

新闻

parent a34526f5
Inline Side-by-side
Showing with 78 additions and 29 deletions
assets/css/mine/news.scss
......@@ -117,9 +117,11 @@
}
}
.label {
flex-wrap: wrap;
.box {
padding: 0 16rpx;
margin-right: 14rpx;
margin-bottom: 14rpx;
height: 34rpx;
background: #ffffff;
border-radius: 17rpx;
......@@ -135,8 +137,8 @@
font-size: 26rpx;
color: #484b59;
line-height: 50rpx;
image {
max-width: 100%;
img {
max-width: 100% !important;
}
}
}
......@@ -160,6 +162,9 @@
margin-bottom: 24rpx;
font-size: 24rpx;
color: #484b59;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
&.curr {
color: #1969f9;
}
......
components/nav.vue
<template>
<view class="h5-nav row avarage verCenter">
<text class="iconfont icon-arrleft" v-back></text>
<text class="title">{{ title }}</text>
<text class="title" @click="change()">{{ title }}</text>
<view class="bar"><slot name="title-bar"></slot></view>
</view>
</template>
......@@ -18,7 +18,11 @@ export default {
data() {
return {};
},
methods: {}
methods: {
change() {
this.$emit('clickChange', this.title);
}
}
};
</script>
......
pages/mine/article.vue
<template>
<view class="page-news-detail">
<navElement title="新闻详情">
<navElement :title="title" @clickChange="handleChangeTitle">
<template slot="title-bar">
<view style="text-align: right;" @click="open()"><text class="iconfont icon-juxing5"></text></view>
<view style="text-align: right;" @click.stop="open()"><text class="iconfont icon-juxing5"></text></view>
</template>
</navElement>
<view class="detail">
<view class="title">猎芯以数字化方式构建全新质检体系，保障企业用“芯”无忧</view>
<view class="title">{{ detail.title }}</view>
<view class="info row bothSide verCenter">
<view class="tt">
<text style="margin-right: 100rpx;">来源：网络整理</text>
<text>阅读 232</text>
<text style="margin-right: 100rpx;">来源：{{ detail.writer }}</text>
<text>阅读 {{ detail.click }}</text>
</view>
<view class="time">2023-04-12 11:16</view>
<view class="time">{{ detail.publish_time }}</view>
</view>
<view class="label row">
<view class="box row rowCenter verCenter">专用传感器</view>
<view class="box row rowCenter verCenter">美仁</view>
<view class="box row rowCenter verCenter">猎芯动态</view>
<view class="box row rowCenter verCenter" v-for="(item, index) in detail.tag" :key="item.tag_id">{{ item.tag }}</view>
<view class="box row rowCenter verCenter" v-for="(item, index) in detail.function_tags" :key="index">{{ item.name }}</view>
</view>
<view class="content">近日，猎芯质检中心完成检测设备与综合配套能力的全面升级！伴随着整体的质检场地扩容以及整套标准化质检程序的完善，猎芯质检中心现已具备对芯片等主动器件进行全量数据比对、外观检测、电气性能测试、可焊性测试、X-RAY无损透视检测、烘烤、真空包装等能力。同时拥有LCR测量，支持对电感、电容、电阻等被动器件全外观及标签的全功能电性功能检测能力。通过多设备多程序及系统作业，一方面确保猎芯质检中心基于基础器件检测结果的专业性，同时整体提升了质检全流程在交易履约服务中的应用效率！</view>
<view class="content" v-html="detail.content"></view>
</view>
<view class="hot-article">
<view class="title row verCenter">
<text class="t1">热门文章</text>
<text class="iconfont icon-a-juxing1"></text>
</view>
<view class="list">
<view class="box curr">1. 猎芯以数字化方式构建全新质检体系，保障企业用“芯”无忧</view>
<view class="box curr">2. 猎芯以数字化方式构建全新质检体系，保障企业用“芯”无忧</view>
<view class="box curr">3. 猎芯以数字化方式构建全新质检体系，保障企业用“芯”无忧</view>
<view class="box">4. 猎芯以数字化方式构建全新质检体系，保障企业用“芯”无忧</view>
<view class="box">5. 猎芯以数字化方式构建全新质检体系，保障企业用“芯”无忧</view>
<view class="list" v-if="detail.hot_article_list && detail.hot_article_list.length > 0">
<view class="box" v-for="(item, index) in detail.hot_article_list" :key="index">{{ index + 1 }}. {{ item.title }}</view>
</view>
</view>
<view class="ad"><image src="https://img.ichunt.com/images/ichunt/202305/20/ffa1060a38803d5b436b33259fe142d0.jpg" mode="aspectFill"></image></view>
<view class="ad" v-if="detail.h5_news_detail_ad && detail.h5_news_detail_ad.length > 0"><image v-for="(item, index) in detail.h5_news_detail_ad" :key="index" :src="item.images"></image></view>
<uni-popup ref="share" type="share" safeArea backgroundColor="#fff"><uni-popup-share></uni-popup-share></uni-popup>
</view>
</template>
......@@ -42,17 +37,58 @@
<script>
import { Api_Url } from '@/util/api.js';
import navElement from '@/components/nav.vue';
export default {
components: {
navElement
},
data() {
return {};
return {
title: '',
detail: {},
searchParams: {
art_id: ''
}
};
},
onLoad(options) {
this.searchParams.art_id = this.$route.params.art_id;
},
onShow() {
this.getData();
},
filters: {
formatDate(value) {
// 过滤器函数
const date = new Date(value * 1000);
const year = date.getFullYear();
const month = ('0' + (date.getMonth() + 1)).slice(-2);
const day = ('0' + date.getDate()).slice(-2);
const hour = ('0' + date.getHours()).slice(-2);
const minute = ('0' + date.getMinutes()).slice(-2);
const second = ('0' + date.getSeconds()).slice(-2);
return `${year}-${month}-${day} ${hour}:${minute}:${second}`;
}
},
onShow() {},
methods: {
handleChangeTitle(e) {
console.log(e);
},
open() {
this.$refs.share.open('bottom');
},
getData() {
this.request(Api_Url + '/article/articleDetail', 'POST', this.searchParams, true, true).then(res => {
if (res.err_code === 0) {
this.title = res.data.type_name;
this.detail = res.data;
} else {
uni.showToast({
title: res.err_msg,
icon: 'none'
});
}
});
}
}
};
......@@ -60,4 +96,7 @@ export default {
<style lang="scss">
@import '@/assets/css/mine/news.scss';
.content /deep/ img {
max-width: 100%;
}
</style>
pages/mine/news.vue
<template>
<view class="page-news">
<navElement title="新闻资讯">
<navElement title="新闻资讯" @change="sortChange()">
<template slot="title-bar">
<view style="text-align: right;"><text class="iconfont icon-search"></text></view>
</template>
......@@ -9,7 +9,7 @@
<text class="box" v-for="(item, index) in cat_list" :key="index" :class="{ curr: curr == index }" @click.stop="tab(index)">{{ item.cat_name }}</text>
</view>
<view class="list" v-if="content_list.length > 0">
<a class="box" :href="'/#/article/' + item.art_id" v-for="(item, index) in content_list" :key="index">
<a class="box column" :href="'/#/article/' + item.art_id" v-for="(item, index) in content_list" :key="index">
<view class="pic">
<image mode="aspectFill" :src="item.litpic || 'https://img.ichunt.com/images/ichunt/202305/26/e512c97ccd155a504e972c7c27d75a35.jpg'" :mode="mode" lazy-load="true"></image>
<view class="uni-text">
......
router/index.js
......@@ -174,22 +174,23 @@ const router = new Router({
aliasPath: '/news',
meta: {
title: '新闻',
auth: true
auth: false
}
},
{
path: '/pages/mine/article',
aliasPath: '/article/:cat_id',
aliasPath: '/article/:art_id',
meta: {
title: '新闻详情',
auth: true
auth: false
}
},
{
path: '/pages/mine/about',
aliasPath: '/about',
meta: {
title: '关于我们'
title: '关于我们',
auth: false
}
},
{
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment