Skip to content

肖康 / H5_2.0

Go to a project
Commit b02afc75 by LJM
Options

css

parent 97297a79
Expand all
Inline Side-by-side
Showing with 716 additions and 3 deletions
assets/css/font/iconfont.json
......@@ -6,6 +6,20 @@
"description": "",
"glyphs": [
{
"icon_id": "35716547",
"name": "矩形",
"font_class": "juxing6",
"unicode": "e7a3",
"unicode_decimal": 59299
},
{
"icon_id": "35716548",
"name": "矩形 (1)",
"font_class": "a-juxing11",
"unicode": "e7a4",
"unicode_decimal": 59300
},
{
"icon_id": "35644729",
"name": "矩形 (5)",
"font_class": "a-juxing5",
......
assets/css/mine/dome.scss 0 → 100644
.page-dome {
padding-top: 88rpx;
.icon-juxing5 {
font-size: 44rpx;
color: #fff;
}
.bg {
height: 455rpx;
background: url('https://static.ichunt.com/dist/res/home/images/dome/bg1.png') no-repeat center;
background-size: cover;
margin-bottom: 20rpx;
}
.section {
position: relative;
top: -172rpx;
}
.brand {
height: 305rpx;
background: #ffffff;
border-radius: 10rpx;
margin: 0 24rpx;
.uni-swiper-wrap {
padding: 0 24rpx;
height: 305rpx;
.swiper {
width: 100%;
height: 305rpx;
border-radius: 10px;
swiper-item {
width: 100%;
height: 305rpx;
border-radius: 10px;
box-sizing: border-box;
.head-box {
margin-top: 16rpx;
margin-bottom: 4rpx;
.left {
.pic {
width: 180rpx;
height: 101rpx;
}
.t1 {
font-size: 28rpx;
color: #292b33;
font-weight: 600;
margin-left: 12rpx;
}
}
.right {
.t1 {
font-size: 24rpx;
color: #919399;
}
.iconfont {
font-size: 32rpx;
color: #c9cbd2;
}
}
}
.text-desc {
font-size: 24rpx;
color: #919399;
line-height: 40rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: normal;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
}
}
}
}
.faebtn {
padding-top: 32rpx;
.box {
width: 222rpx;
height: 174rpx;
background: #ffffff;
border-radius: 10rpx;
.pic {
width: 164rpx;
height: 100rpx;
}
.tt {
margin-top: 16rpx;
font-size: 22rpx;
color: #484b59;
}
}
}
.cooperation {
height: 254rpx;
background: #ffffff;
border-radius: 10rpx;
margin: 0 24rpx;
.uni-swiper-wrap {
padding: 0 24rpx;
height: 254rpx;
margin-bottom: 16rpx;
.swiper {
width: 100%;
height: 254rpx;
border-radius: 10px;
swiper-item {
width: 100%;
height: 254rpx;
border-radius: 10px;
box-sizing: border-box;
.box {
padding: 24rpx;
box-sizing: border-box;
flex-wrap: wrap;
.pic {
width: 144rpx;
height: 81rpx;
margin-bottom: 16rpx;
box-sizing: border-box;
}
}
}
}
}
}
.title {
font-size: 28rpx;
color: #292b33;
height: 104rpx;
font-weight: 600;
}
.content {
margin: 0 24rpx 16rpx 24rpx;
padding: 24rpx;
background: #ffffff;
border-radius: 10rpx;
.head {
margin-bottom: 34rpx;
.left {
.pic {
width: 60rpx;
height: 60rpx;
}
.tt {
margin-left: 28rpx;
font-size: 28rpx;
color: #292b33;
font-weight: 600;
}
}
.right {
.iconfont {
font-size: 40rpx;
color: #fa8826;
}
.tt {
font-size: 22rpx;
color: #919399;
margin-left: 4rpx;
}
}
}
.list {
flex-wrap: wrap;
.box {
width: 50%;
margin-bottom: 20rpx;
.index-class {
font-size: 24rpx;
color: #919399;
}
.text {
margin-left: 20rpx;
.t1 {
font-size: 26rpx;
color: #1969f9;
margin-bottom: 2rpx;
}
.t2 {
font-size: 24rpx;
color: #919399;
}
}
}
}
}
}
assets/css/mine/download.scss 0 → 100644
.page-download {
padding-top: 104rpx;
background: linear-gradient(200deg, #d6e8ff 0%, #f5f5f7 277px);
.download-head {
position: fixed;
top: 0;
left: 0;
right: 0;
padding: 0 32rpx;
width: 100%;
height: 88rpx;
z-index: 9999;
background: linear-gradient(200deg, #d6e8ff 0%, #f5f5f7 277px);
.icon-arrleft {
font-size: 44rpx;
color: #919399;
}
.input-box {
margin-left: 22rpx;
padding-left: 16rpx;
width: 538rpx;
height: 66rpx;
background: #ffffff;
border-radius: 33rpx;
.iconfont {
font-size: 34r px;
}
.uni-input {
height: 66rpx;
margin-left: 11rpx;
font-size: 24rpx;
}
}
.btn {
font-size: 28rpx;
color: #1969f9;
}
}
.uni-swiper-wrap {
padding: 0 24rpx;
height: 302rpx;
margin-bottom: 16rpx;
.swiper {
width: 100%;
height: 302rpx;
border-radius: 10px;
swiper-item {
width: 100%;
height: 302rpx;
border-radius: 10px;
image {
width: 100%;
height: 302rpx;
border-radius: 10rpx;
}
}
}
}
.content {
padding: 24rpx 24rpx 0 24rpx;
background: #ffffff;
border-radius: 10rpx 10rpx 0px 0px;
.head {
margin-bottom: 24rpx;
.title {
font-size: 26rpx;
color: #292b33;
font-weight: 600;
}
.t1 {
font-size: 22rpx;
color: #919399;
}
.t2 {
font-size: 22rpx;
color: #1969f9;
}
}
.tab {
flex-wrap: wrap;
.box {
padding: 0 24rpx;
height: 48rpx;
background: #f5f5f7;
border-radius: 27rpx;
font-size: 24rpx;
color: #484b59;
margin-right: 16rpx;
margin-bottom: 16rpx;
&.curr {
background: #1969f9;
color: #fff;
}
}
}
.list {
margin-top: 24rpx;
border-top: 1px solid #f0f0f2;
.box {
padding: 24rpx 0;
border-bottom: 1px solid #f0f0f2;
.iconfont {
font-size: 48rpx;
color: #484b59;
}
.btn {
width: 142rpx;
height: 48rpx;
background: #ffffff;
border-radius: 6rpx;
border: 1px solid #1969f9;
font-size: 22rpx;
color: #1969f9;
}
.text {
margin-left: 12rpx;
.t1 {
font-size: 24rpx;
color: #484b59;
white-space: nowrap;
text-overflow: ellipsis;
white-space: nowrap;
}
.t2 {
font-size: 22rpx;
color: #919399;
}
}
}
}
.more {
height: 80rpx;
.t1 {
font-size: 24rpx;
color: #1969f9;
margin-right: 12rpx;
}
.iconfont {
font-size: 32rpx;
color: #1969f9;
}
}
}
.desc {
height: 77rpx;
font-size: 22rpx;
color: #919399;
background: #f5f5f7;
}
.messgae {
padding: 0 24rpx 50rpx 24rpx;
background: #ffffff;
border-radius: 10rpx 10rpx 0px 0px;
.head {
height: 84rpx;
.title {
font-size: 26rpx;
color: #292b33;
font-weight: 600;
}
.iconfont {
font-size: 32rpx;
color: #1969f9;
margin-right: 6rpx;
}
.t1 {
font-size: 24rpx;
color: #1969f9;
}
}
.list {
border-top: 1px solid #f0f0f2;
.box {
padding: 24rpx 0;
border-bottom: 1px solid #f0f0f2;
&:last-child {
border-bottom: none;
}
.pic {
width: 74rpx;
height: 74rpx;
border-radius: 50%;
image {
width: 74rpx;
height: 74rpx;
border-radius: 50%;
}
}
.message-content {
margin-left: 15rpx;
.t1 {
font-size: 24rpx;
color: #1969f9;
font-weight: 600;
}
.t2 {
font-size: 24rpx;
color: #484b59;
}
.time {
font-size: 22rpx;
color: #919399;
}
.iconfont {
font-size: 32rpx;
color: #919399;
}
.t3 {
font-size: 24rpx;
color: #919399;
margin-left: 8rpx;
}
.dianzan {
&.curr {
.iconfont {
color: #1969f9;
}
.t3 {
color: #1969f9;
}
}
}
}
}
}
}
}
.layer-box {
background: linear-gradient(180deg, #f0f6ff 0%, #ffffff 88rpx);
padding: 0 24rpx 24rpx 24rpx;
border-radius: 10rpx 10rpx 0px 0px;
.title {
height: 88rpx;
margin-bottom: 13rpx;
.left {
.t1 {
font-size: 32rpx;
color: #292b33;
font-weight: bold;
}
.t2 {
margin-left: 12rpx;
font-size: 22rpx;
color: #919399;
}
}
.right {
.iconfont {
font-size: 40rpx;
color: #c2c4cc;
}
}
}
.textarea-box {
height: 144rpx;
background: #f5f5f7;
border-radius: 10rpx;
.uni-textarea {
height: 144rpx;
padding: 24rpx;
font-size: 14px;
box-sizing: border-box;
}
}
.save {
margin-top: 32rpx;
height: 68rpx;
background: #1969f9;
border-radius: 10rpx;
font-size: 28rpx;
color: #fff;
}
}
assets/css/mine/news.scss
......@@ -9,13 +9,20 @@
height: 66rpx;
background: #ffffff;
border-radius: 33rpx;
border: 2rpx solid #1969f9;
border: 2rpx solid #c6c7cc;
padding-left: 16rpx;
transition: all 0.4s ease;
.iconfont {
font-size: 34rpx;
}
.uni-input {
height: 66rpx;
margin-left: 11rpx;
font-size: 24rpx;
}
&:focus-within {
border: 2rpx solid #1969f9;
}
}
.icon-search {
font-size: 44rpx;
......@@ -23,7 +30,7 @@
}
.icon-xxx {
font-size: 44rpx;
color: #484b59;
color: #919399;
}
.uni-margin-wrap {
background-color: #ffffff;
......
pages.json
......@@ -226,6 +226,24 @@
"style": {
"navigationBarTitleText": "编辑发票"
}
},
{
"path": "pages/mine/download",
"style": {
"navigationBarTitleText": "白皮书"
}
},
{
"path": "pages/mine/dome",
"style": {
"navigationBarTitleText": "国产替代"
}
},
{
"path": "pages/mine/fae",
"style": {
"navigationBarTitleText": "FAE技术支持申请"
}
}
],
"globalStyle": {
......
pages/mine/download.vue 0 → 100644
<template>
<view class="page-download">
<view class="download-head row verCenter bothSide">
<view class="row verCenter">
<text class="iconfont icon-arrleft" v-back></text>
<view class="input-box row verCenter">
<text class="iconfont icon-search"></text>
<input type="text" placeholder="请输入文章关键字查找" class="uni-input" />
</view>
</view>
<view class="btn">搜索</view>
</view>
<view class="uni-swiper-wrap">
<swiper class="swiper" circular :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration">
<swiper-item v-for="(item, index) in ad" :key="index"><image mode="aspectFill" :src="item" lazy-load="true"></image></swiper-item>
</swiper>
</view>
<view class="content">
<view class="row bothSide verCenter head">
<text class="title">资料类目</text>
<view class="row verCenter">
<text class="t1">每日</text>
<text class="t2">5</text>
<text class="t1">次，当前剩下下载数量：</text>
<text class="t2">5</text>
</view>
</view>
<view class="tab row">
<view class="box row rowCenter verCenter curr">全部</view>
<view class="box row rowCenter verCenter">电子技术</view>
<view class="box row rowCenter verCenter">5G与无线</view>
<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">大数据与云</view>
<view class="box row rowCenter verCenter">行业趋势</view>
<view class="box row rowCenter verCenter">采购必备</view>
<view class="box row rowCenter verCenter">行业资料</view>
</view>
<view class="list">
<view class="box row bothSide verCenter" v-for="(item, index) in 10" :key="index">
<view class="row verCenter">
<text class="iconfont icon-juxing6"></text>
<view class="text">
<text class="t1" style="margin-bottom: 10rpx;">半导体布局正当时，关注三大投资主线</text>
<view>
<text class="t2">已下载</text>
<text class="t1" style="padding: 0 4rpx;">40</text>
<text class="t2">次</text>
</view>
</view>
</view>
<view class="btn row rowCenter verCenter">下载</view>
</view>
</view>
<view class="more row rowCenter verCenter">
<text class="t1">查看更多</text>
<text class="iconfont icon-arrbot"></text>
</view>
</view>
<view class="desc row rowCenter verCenter">*法律声明：本资料库的文档为网络收集，仅供学习使用，勿做商用</view>
<view class="messgae">
<view class="head row bothSide verCenter">
<text class="title">精选留言</text>
<view class="row verCenter">
<text class="iconfont icon-news"></text>
<text class="t1" @click="open()">写留言</text>
</view>
</view>
<view class="list">
<view class="box row" v-for="(item, index) in 3" :key="index">
<view class="pic"><image src="https://img.ichunt.com/images/ichunt/202305/27/58c2e7a3d42ed265a2c763bf704d807a.jpg" mode="aspectFill"></image></view>
<view class="message-content">
<view class="t1" style="margin-bottom: 12rpx;">匿名用户</view>
<view class="t2" style="margin-bottom: 13rpx;">如果你既不热爱你的工作，也不对之嗤之以鼻，那说明你做的还不够多</view>
<view class="row bothSide verCenter">
<view class="time">2023-04-19 11:30:30 广东</view>
<view class="row verCenter dianzan curr">
<text class="iconfont icon-a-juxing11"></text>
<text class="t3">9</text>
</view>
</view>
<view class="row" style="margin-top: 26rpx;">
<view class="pic"><image src="https://img.ichunt.com/images/ichunt/202305/27/58c2e7a3d42ed265a2c763bf704d807a.jpg" mode="aspectFill"></image></view>
<view class="message-content">
<view class="t1" style="margin-bottom: 12rpx;">管理员</view>
<view class="t2" style="margin-bottom: 13rpx;">如果你既不热爱你的工作，也不对之嗤之以鼻，那说明你做的还不够多</view>
<view class="row bothSide verCenter">
<view class="time">2023-04-19 11:30:30 广东</view>
<view class="row verCenter dianzan curr">
<text class="iconfont icon-a-juxing11"></text>
<text class="t3">9</text>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 留言 -->
<uni-popup ref="popup" type="bottom">
<view class="layer-box">
<view class="title row verCenter bothSide">
<view class="left">
<text class="t1">写留言</text>
<text class="t2">可以许愿你想要的资料哦</text>
</view>
<view class="right row"><text class="iconfont icon-xxx" @click="close()"></text></view>
</view>
<view class="textarea-box row bothSide verCenter"><textarea placeholder="输入你的留言内容" class="uni-textarea"></textarea></view>
<view class="save row rowCenter verCenter">留言</view>
</view>
</uni-popup>
</view>
</template>
<script>
import { Api_Url } from '@/util/api.js';
export default {
data() {
return {
indicatorDots: true,
autoplay: true,
interval: 2000,
duration: 500,
ad: ['https://img.ichunt.com/images/ichunt/202305/27/58c2e7a3d42ed265a2c763bf704d807a.jpg', 'https://img.ichunt.com/images/ichunt/202305/27/2ddce4486082a8b825f3026fe3e715aa.jpg']
};
},
onShow() {
this.getData();
},
methods: {
open() {
this.$refs.popup.open('bottom');
},
close() {
this.$refs.popup.close();
},
getData() {
this.request(Api_Url + '/Activity/Cube/getActivityCenterData', 'GET', {}, true, true).then(res => {
if (res.err_code === 0) {
this.activity_list = res.data.activity_list;
}
});
}
}
};
</script>
<style lang="scss">
@import '@/assets/css/mine/download.scss';
</style>
pages/mine/fae.vue 0 → 100644
<template>
<view class="page-dome"><navElement title="FAE技术申请"></navElement></view>
</template>
<script>
import { Api_Url } from '@/util/api.js';
import navElement from '@/components/nav.vue';
export default {
components: {
navElement
},
data() {
return {};
},
onLoad(options) {},
onShow() {
this.getData();
},
methods: {
getData(type) {
this.request(Api_Url + '/article/getArticleList', 'POST', this.searchParams, true, true).then(res => {
if (res.err_code === 0) {
} else {
}
});
}
}
};
</script>
<style lang="scss">
@import '@/assets/css/mine/dome.scss';
</style>
pages/mine/news.vue
......@@ -34,7 +34,7 @@
</view>
<view class="no-data column rowCenter verCenter" v-else>
<image src="../../static/nodate.png"></image>
<text class="tt">暂无新闻信息</text>
<text class="tt">抱歉，没有找到相关新闻资讯</text>
</view>
</view>
</template>
......
router/index.js
......@@ -304,6 +304,30 @@ const router = new Router({
title: '编辑发票',
auth: true
}
},
{
path: '/pages/mine/download',
aliasPath: '/download',
meta: {
title: '白皮书',
auth: false
}
},
{
path: '/pages/mine/dome',
aliasPath: '/dome',
meta: {
title: '国产替代',
auth: false
}
},
{
path: '/pages/mine/fae',
aliasPath: '/fae',
meta: {
title: 'FAE技术支持申请',
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