Skip to content

C
CFFP-HB
Commit c7d6cd9a by yuzhenWang
Options

切换分支

parent de413fa6
Showing with 597 additions and 350 deletions
components/search/search.vue
<template>
<view class="search">
<text class="iconfont icon-sousuo" @click="searchBtn()"></text>
<input
class="searchInput"
type="text"
......@@ -9,9 +10,6 @@
@confirm="searchBtn()"
@input="handleInput"
/>
<text class="iconfont icon-sousuo" @click="searchBtn()"></text>
<!-- <text class="iconfont icon-xiaoxi"></text>
<text class="system_msg" @click="jumpToSystemMsg()">{{messageUnreadCount}}</text> -->
</view>
</template>
......@@ -105,23 +103,24 @@
}
</script>
<style lang="scss">
<style lang="scss" scoped>
.search{
display: flex;
margin: 30rpx auto;
align-items: center;
justify-content: space-between;
background: linear-gradient(to right,#E6F5FC,#FDE9F2);
border-radius: 60rpx;
background-color: rgba(255, 255, 255, 0.5);
border-radius: 15rpx;
padding: 0 15rpx;
.searchInput{
margin-right: 20rpx;
margin-left: 20rpx;
width: 85%;
padding: 15rpx;
color: #fff;
}
.icon-sousuo{
font-size: 50rpx;
margin-right: 10rpx;
opacity: .7;
color: #fff;
}
.icon-xiaoxi{
font-size: 50rpx;
......
environments/environment.ts
......@@ -37,7 +37,7 @@ const config = {
stage,
prod
}
let env = 'prod';
let env = 'dev';
let baseURL = config[env].base_url;
let apiURL = config[env].api_url;
......
manifest.json
......@@ -169,7 +169,7 @@
"vueVersion" : "3",
"h5" : {
"router" : {
"base" : "/appYdhomeoffice/",
"base" : "/cffp/",
"mode" : "history"
},
"devServer" : {
......
pages/index/index.vue
<template>
<view class="container">
<view class="homeHeader">
<view class="top">
<view class="one">
<search
ref="searchRef"
:isSearch="0"
:userId="userId"
:initialQuery.sync="searchQuery"
v-if="showSearch"
></search>
</view>
<view class="two">
<text class="iconfont icon-gongsi" @click="getIntroduce('center')"></text>
</view>
</view>
<view class="bottom">
<view class="content">
<view class="featureContent">
<view class="nav_wrapper">
<view class="nav_content" v-for="featureItem in featureLists" :key="featureItem.key"
@click="featureSelect(featureItem)">
<view class="imgbox">
<view class="iconfont iconSize" :class="`${featureItem.icon}`"></view>
</view>
<view style="font-size: 26rpx;color: #fff;">{{featureItem.name}}</view>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="carouselBox">
<view class="swiperBox">
<swiper
style="height:250rpx;"
circular
:indicator-dots="true"
:autoplay="true"
:interval="3000"
:duration="1000"
>
<swiper-item v-for="(bannerItem,index) in cffpUserInfo.fileUploadItemList" :key="index">
<view class="swiperItemBox">
<view class="swiperBtn" @click="jumpUrl(bannerItem.destinationAddress)">
立即查看
</view>
<image class="swiperImg" :src="bannerItem.filePath" mode="widthFix" ></image>
</view>
</swiper-item>
</swiper>
</view>
</view>
<!-- 产品区域 -->
<view class="productBox">
<view class="productTitle">
<view class="titleTxt">
<text style="font-size: 30rpx;font-weight: 500;">推荐产品</text>
<text class="more">更多 <text class="iconfont icon-youjiantou"></text> </text>
</view>
</view>
<view class="productList" v-if="cffpCourseInfos.length>0">
<view class="productListBox">
<view class="productListItem" v-for="item in cffpCourseInfos" :key="item.fileId" @click="goDetail(item)">
<view class="top">
<image class="productImg" :src="item.displayImage" alt="" mode="widthFix"></image>
<view class="productDes">
</view>
</view>
<view class="bottom">
</view>
</view>
</view>
</view>
</view>
<!-- 以前的代码 -->
<view class="top">
<view class="compony">
<!-- <view class="compony">
<image src="@/static/logo1.png" mode="widthFix" style="width: 120rpx !important;"></image>
<text class="name">{{cffpUserInfo.name}}</text>
<text class="iconfont icon-31tishi" @click="getIntroduce('center')"></text>
</view>
<!--搜索组件-->
<!-- <search
:isSearch="0"
:userId="userId"
></search> -->
<search
</view> -->
<!-- <search
ref="searchRef"
:isSearch="0"
:userId="userId"
:initialQuery.sync="searchQuery"
v-if="showSearch"
></search>
></search> -->
<!--轮播组件-->
<view class="banner" style="overflow: none;">
<!-- <view class="banner" style="overflow: none;">
<view class="uni-margin-wrap">
<carousel :carouselList="cffpUserInfo.fileUploadItemList" ></carousel>
</view>
</view>
</view> -->
</view>
<view class="message" @click="jumpToAnnouncement()">
<!-- <view class="message" @click="jumpToAnnouncement()">
<view style="display: flex;align-items: center;">
<text class="iconfont icon-gonggao"></text>
<text style="font-size: 27rpx;">{{announcementInfo}}</text>
</view>
<text class="iconfont icon-youjiantou iconStyle"></text>
</view>
<view class="content">
</view> -->
<!-- <view class="content">
<view class="featureContent">
<!-- 模块导航 -->
<view class="nav_wrapper">
<view class="nav_content" v-for="featureItem in featureLists" :key="featureItem.key"
@click="featureSelect(featureItem)">
<!-- <view style="width: 120rpx;text-align: center;">
<image :src="'/static/moduleIcon/'+featureItem.icon + '.png'" alt="" srcset=""
mode="widthFix"></image>
</view> -->
<view class="imgbox">
<view class="iconfont iconSize" :class="`${featureItem.icon}`"></view>
</view>
......@@ -50,32 +119,39 @@
</view>
</view>
</view>
</view>
<view class="course_content">
</view> -->
<!-- <view class="course_content">
<view class="tag">
<h4>推荐产品</h4>
<view @click="goToCourselist()" style="font-size: 30rpx;">更多<text class="iconfont icon-youjiantou iconStyle"></text></view>
</view>
<!-- <courselist :onlyShowList="0"></courselist> -->
<view class="ulBox" v-if="cffpCourseInfos.length>0">
<view class="liBox" v-for="item in cffpCourseInfos" :key="item.fileId" @click="goDetail(item)">
<!-- :tagList="{v1:item.fileLecturerRanks,v2:item.fileLecturerName}" -->
<course-item :thumbnailPath="item.displayImage" :title="item.fileTitle"
:summaryBox="item.fileSynopsis"
:dataList="{coursePrice:item.coursePrice,salesNumber:item.salesNumber}"
></course-item>
</view>
</view>
</view>
<view class="" style="text-align: center;color: #666666;font-size: 24rpx;margin-top: 20rpx;">
</view> -->
<!-- <view class="" style="text-align: center;color: #666666;font-size: 24rpx;margin-top: 20rpx;">
由{{companyFullName}}提供
</view>
</view> -->
<!-- <tabBar :currentPage="currentPage"></tabBar> -->
</view>
<uni-popup ref="popup" type="top" background-color="#fff">
<view class="description">
{{cffpUserInfo.description}}
<view class="descriptionBox">
<view class="popupClose">
<text class="iconfont icon-guanbi" @click="$refs.popup.close()"></text>
</view>
<view class="imageBox">
<image src="@/static/logo1.png" mode="widthFix" style="width: 120rpx !important;"></image>
</view>
<view class="description">
{{cffpUserInfo.description}}
</view>
</view>
</uni-popup>
</template>
......@@ -215,7 +291,17 @@
uni.$off('loginUpdate', this.queryAreaCenterInfo);
},
methods: {
jumpUrl(url) {
if (!url) {
return false
} else {
const match = url.match(/fileId=([^&]*)/);
const fileId = match ? match[1] : null;
uni.navigateTo({
url: `/pages/courseDetail/courseDetail?fileId=${fileId}`
})
}
},
init() {
if (uni.getStorageSync('isLogin')) {
let loginType = uni.getStorageSync('loginType')
......@@ -403,41 +489,175 @@
</script>
<style lang="scss" scoped>
::v-deep .uni-popup .uni-popup__wrapper{
margin: 0 !important;
border-radius: 30rpx;
}
.container {
padding: 30rpx 30rpx 20rpx;
height: auto;
overflow-y: auto; /* 关键属性 */
-webkit-overflow-scrolling: touch; /* 优化移动端滚动 */
.top {
.compony {
overflow-y: auto; /* 关键属性 */
-webkit-overflow-scrolling: touch; /* 优化移动端滚动 */
background-color: rgba(238, 238, 238, 1);
.homeHeader{
box-sizing: border-box;
width: 100%;
background: linear-gradient(225deg, rgba(65, 69, 188, 1) 0%, rgba(29, 30, 125, 1) 100%);
padding: 15rpx 30rpx;
.top{
width: 100%;
display: flex;
align-items: center;
// max-height: 150rpx;
// overflow: hidden;
.name {
font-size: 36rpx;
justify-content: space-between;
.one{
width: 80%;
}
image {
margin-right: 40rpx;
.two{
.icon-gongsi{
font-size: 40rpx;
color: #fff;
}
}
}
.bottom{
.content {
overflow: hidden;
position: relative;
.featureContent {
box-sizing: border-box;
padding: 30rpx 0;
.nav_wrapper {
display: flex;
align-items: center;
justify-content: space-around;
flex-wrap: wrap;
width: 100%;
box-sizing: border-box;
.nav_content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
flex: 0 0 20%;
font-size: 14px;
color: rgba(51, 51, 51, 1);
image {
max-width: 80%;
}
.imgbox{
margin-bottom: 10rpx;
.iconSize{
font-size: 40rpx;
color: #fff;
}
}
}
}
}
}
.icon-31tishi {
font-size: 40rpx;
}
}
.carouselBox{
width: 100%;
background-color: #fff;
padding: 15rpx;
box-sizing: border-box;
overflow: hidden;
.swiperBox{
.swiperItemBox{
position: relative;
.swiperBtn{
position: absolute;
left: 10%;
bottom: 20%;
padding: 15rpx 30rpx;
border-radius: 50rpx;
z-index: 2;
color: #fff;
font-size: 26rpx;
background: linear-gradient(180deg, rgba(111, 156, 255, 1) 0%, rgba(34, 96, 251, 1) 100%);
}
.swiperImg{
width: 100%;
height: 100%;
border-radius: 50rpx;
}
}
}
.banner {
border-radius: 20rpx;
overflow: hidden;
margin-bottom: 30rpx;
.swiper{
height:250rpx;
}
.productBox{
background-color: #fff;
margin-top: 15rpx;
box-sizing: border-box;
.productTitle{
border-bottom: 1rpx solid rgba(238, 238, 238, 1);
padding-bottom: 10rpx;
.titleTxt{
padding: 15rpx 30rpx;
display: flex;
justify-content: space-between;
align-items: center;
}
.more{
font-size: 26rpx;
color: rgba(84, 84, 84, 1);
}
}
.productList{
.productListBox{
padding: 30rpx 40rpx;
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
.productListItem{
width: 48%;
margin-bottom: 20rpx;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
.top{
width: 290rpx;
.productImg{
border-radius: 20rpx;
}
}
}
}
}
}
// 之前的样式
// .top {
// .compony {
// display: flex;
// align-items: center;
// .name {
// font-size: 36rpx;
// }
// image {
// margin-right: 40rpx;
// }
// .icon-31tishi {
// font-size: 40rpx;
// }
// }
// .banner {
// border-radius: 20rpx;
// overflow: hidden;
// margin-bottom: 30rpx;
// .swiper{
// height:250rpx;
// }
// }
// }
.message {
display: flex;
......@@ -459,46 +679,46 @@
}
}
.content {
margin-bottom: 20rpx;
overflow: hidden;
background: #fff;
position: relative;
// .content {
// margin-bottom: 20rpx;
// overflow: hidden;
// background: #fff;
// position: relative;
.featureContent {
box-sizing: border-box;
padding: 30rpx 0;
.nav_wrapper {
display: flex;
align-items: center;
justify-content: space-around;
flex-wrap: wrap;
width: 100%;
box-sizing: border-box;
// padding: 10rpx;
.nav_content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
flex: 0 0 20%;
font-size: 14px;
color: rgba(51, 51, 51, 1);
// margin: 10px 2%;
// .featureContent {
// box-sizing: border-box;
// padding: 30rpx 0;
// .nav_wrapper {
// display: flex;
// align-items: center;
// justify-content: space-around;
// flex-wrap: wrap;
// width: 100%;
// box-sizing: border-box;
// // padding: 10rpx;
// .nav_content {
// display: flex;
// flex-direction: column;
// align-items: center;
// justify-content: center;
// flex: 0 0 20%;
// font-size: 14px;
// color: rgba(51, 51, 51, 1);
// // margin: 10px 2%;
image {
max-width: 80%;
}
.imgbox{
margin-bottom: 10rpx;
.iconSize{
font-size: 40rpx;
}
}
}
}
}
}
// image {
// max-width: 80%;
// }
// .imgbox{
// margin-bottom: 10rpx;
// .iconSize{
// font-size: 40rpx;
// }
// }
// }
// }
// }
// }
.course_content {
position: relative;
......@@ -533,12 +753,34 @@
}
}
}
.descriptionBox {
width: 550rpx;
padding: 40rpx;
.popupClose{
display: flex;
align-items: center;
justify-content: flex-end;
.icon-guanbi{
font-size: 28rpx;
}
}
.imageBox{
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 20rpx;
}
.description{
color: rgba(56, 56, 56, 1);
font-size: 26rpx;
line-height: 1.5;
}
}
.ulBox {
flex-direction: column;
width: 100%;
box-sizing: border-box;
// background-color: #20279b;
}
.liBox {
......@@ -550,7 +792,5 @@
width: 100%;
}
.description {
padding: 40rpx;
}
</style>
\ No newline at end of file
pages/personalCenter/personalCenter.vue
......@@ -6,7 +6,6 @@
class="avatar"
:style="{backgroundImage: 'url(' + (customerBasicInfo.headPicture || companyLogo) + ')'}"
>
<!-- <image :src="customerBasicInfo.headPicture?customerBasicInfo.headPicture:companyLogo" alt="" mode="widthFix" ></image> -->
</view>
<view class="headerInfo">
<view class="headerTop">
......@@ -18,16 +17,15 @@
{{customerBasicInfo.partnerType}}
</view>
</view>
<view class="nickName">
<!--昵称：{{loginornot == true ?customerBasicInfo.nickName :'游客'}} -->
<!-- <view class="nickName">
<text v-if="loginornot && customerBasicInfo.nickName">昵称：{{customerBasicInfo.nickName}}</text>
<text v-if="!loginornot">昵称：游客</text>
</view>
</view> -->
</view>
</view>
<view class="right" @click="goDetail(settingItem)">
<view class="iconfont icon-shezhi iconColor" style="font-size: 40rpx;"></view>
<view class="iconfont icon-shezhi " style="font-size: 40rpx;color: #fff;"></view>
</view>
</view>
<view class="myContent">
......@@ -65,74 +63,24 @@
</view>
</view>
</view>
<!-- 头部信息 -->
<!-- <view class="basicInfoBox">
<view class="avatar">
<image :src="customerBasicInfo.headPicture?customerBasicInfo.headPicture:companyLogo" alt="" srcset="" ></image>
</view>
<view class="infoBox">
<view class="firstLineBox">
<view>
<strong>{{loginornot == true ?customerBasicInfo.realName :'游客'}}</strong>
<text class="csTag" v-if="customerBasicInfo.partnerType">{{customerBasicInfo.partnerType}}</text>
</view>
<view class="personalInfoBtn" @click="userinfo()">
<text>个人资料</text>
<i class="iconfont icon-bianji"></i>
</view>
<uni-popup ref="joinPopup" type="center" background-color="#fff">
<view class="joinContent">
<view class="joinHeader">
<view class="iconfont icon-hezuo" style="font-size: 35rpx;color: #fff;"></view>
</view>
<view>昵称：{{loginornot == true ?customerBasicInfo.nickName :'游客'}}</view>
<view>{{customerBasicInfo.userDescription}}</view>
</view>
</view -->
<!-- 主要菜单 -->
<!-- <view class="mainMenuBox">
<view class="item" v-for="mainMenu in mainMenuLists" :key="mainMenu.id">
<h4>{{mainMenu.categoryName}}</h4>
<view class="menuItemBox">
<view class="mainMenuItem" v-for="menuItem in mainMenu.children.filter(v=>v.isShow)" :key="menuItem.title" @click="goDetail(menuItem)">
<image :src="'/static/moduleIcon/'+menuItem.icon+'.png'" alt="" srcset="" mode="widthFix"></image>
<text>{{menuItem.title}}</text>
<view class="joinCon">
<view class="one">
您还未加盟为合伙人
</view>
</view>
</view>
</view> -->
<!-- 个人信息 -->
<!-- <view class="personalInfo">
<view class="ulBox">
<view v-for="item in minorMenuLists.filter(v=>v.isShow)" :key="item.title" @click="goDetail(item)" class="liBox">
<view class="infoBox">
<image :src="'/static/moduleIcon/'+item.icon+'.png'" alt="" srcset="" mode="widthFix"></image>
<text>{{item.title}}</text>
</view>
<view class="iconBox">
<i class="iconfont icon-youjiantou"></i>
<view class="two">
成为合伙人后，分享商品，好友购物得收益
</view>
</view>
</view>
</view> -->
<!-- <tabBar :currentPage="currentPage"></tabBar> -->
<!-- 我的邀请码 -->
<!-- <view class="inviteQrcodeContainer">
<uni-popup ref="popup1" background-color="#fff">
<view class="popup1-content">
<view class="title">
<text></text>
<text>我的邀请码</text>
<i class="iconfont icon-guanbi" @click="closePopup()"></i>
</view>
<view class="content">
<view class="contentBox">
<h3>{{inviteEqrode}}</h3>
</view>
<view class="confirmBtn" @click="copy()">
一键复制
</view>
</view>
<view class="joinFotter" @click="gotoApply">
去加盟拿收益
</view>
</uni-popup>
</view> -->
</view>
</uni-popup>
</view>
</template>
......@@ -260,6 +208,13 @@
},
methods: {
gotoApply(){
uni.navigateTo({
url: '/pages/application-process/basic-info'
})
this.$refs.joinPopup.close()
},
querySystemMessage(){
if(this.userId){
api.querySystemMessage({systemType:1,userId:uni.getStorageSync('cffp_userId')}).then((res)=>{
......@@ -317,8 +272,6 @@
},
// 菜单跳转页面
goDetail(item){
console.log('item',item);
if(!this.loginornot&& !item.islogin){
this.isLogin()
return
......@@ -335,11 +288,12 @@
},
ckidentity(item){
if(item.identity == true && this.customerBasicInfo.partnerType ==null){
uni.showToast({
title: "您本人尚未加盟，您加盟后可邀请加盟",
duration: 2000,
icon: 'none'
});
this.$refs.joinPopup.open()
// uni.showToast({
// title: "您本人尚未加盟，您加盟后可邀请加盟",
// duration: 2000,
// icon: 'none'
// });
return false
}else if(item.title == '邀请加盟'){
uni.navigateTo({
......@@ -425,6 +379,10 @@
</script>
<style lang="scss" scoped>
::v-deep .uni-popup .uni-popup__wrapper{
margin: 0 !important;
border-radius: 30rpx;
}
.container{
box-sizing:border-box;
background-color: #f7f7f7;
......@@ -439,9 +397,7 @@
box-sizing: border-box;
width: 100%;
height: 250rpx;
background-image: url('/static/mySelfBg.png');
background-size: cover;
background-repeat: no-repeat;
background: linear-gradient(225deg, rgba(65, 69, 188, 1) 0%, rgba(29, 30, 125, 1) 100%);
display: flex;
align-items: center;
justify-content: space-between;
......@@ -452,8 +408,8 @@
align-items: center;
.avatar{
flex-grow: 0;
width: 150rpx;
height: 150rpx;
width: 130rpx;
height: 130rpx;
border-radius: 50%;
overflow: hidden;
/* 背景图设置 */
......@@ -485,26 +441,14 @@
flex-direction: column;
justify-content: flex-start;
.headerTop{
display: flex;
align-items: center;
justify-content: flex-start;
color:#fff;
}
// .myName{
// // width: 200rpx;
// min-width: 0;
// white-space: nowrap;
// overflow: hidden;
// text-overflow: ellipsis;
// font-size: 32rpx;
// }
.desBox{
border: 1px solid rgba(102, 102, 102, 1);
border-radius: 8rpx;
padding: 0 2rpx;
color: rgba(102, 102, 102, 1);
font-size: 23rpx;
font-size: 24rpx;
font-weight: normal;
text-align: center;
}
.nickName{
font-size: 27rpx;
......@@ -600,161 +544,54 @@
margin-bottom: 100rpx;
}
}
}
.avatar {
width: 90rpx;
height: 80rpx;
/* border: 1rpx solid aqua; */
margin-right: 17rpx;
border-radius: 50%;
}
.avatar image {
width: 100%;
height: 100%;
border-radius: 50%;
}
.loading{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.basicInfoBox{
display: flex;
padding: 67rpx 20rpx 60rpx 28rpx;
background:linear-gradient(26deg, #D8E2E5 0%, #F0E6DD 31%, #E7DBDF 100%);
// .avatar{
// width: 0;
// height: 80rpx;
// border-radius: 50%;
// margin-right: 17rpx;
// background-color: #fff;
// flex: 0 0 80rpx;
// }
.infoBox{
width:100%;
color: #666666;
strong{
color: #333;
}
view{
margin-bottom: 8rpx;
.csTag{
border-radius: 10rpx;
border:1rpx solid #666;
padding: 4rpx 10rpx;
margin-left: 10rpx;
font-size: 24rpx;
}
.personalInfoBtn{
border-radius: 10rpx;
background-color:#5359CD;
color: #fff;
text-align: center;
padding: 6rpx 7rpx;
font-size: 24rpx;
.iconfont{
font-size: 24rpx;
margin-left: 4rpx;
}
}
}
.firstLineBox{
display: flex;
justify-content: space-between;
align-items: center;
}
}
}
.mainMenuBox{
background-color: #fff;
width: 95%;
margin: -60rpx auto 30rpx;
border-radius: 10rpx;
padding: 12rpx 30rpx;
box-sizing: border-box;
h4{
font-size: 30rpx;
color: #333;
margin-bottom: 10rpx;
}
.item{
margin-bottom: 30rpx;
}
.menuItemBox{
.joinContent{
width: 500rpx;
// height: 300rpx;
border-radius: 30rpx;
background-color: #ffff;
padding: 30rpx;
box-sizing: border-box;
display: flex;
flex-wrap: wrap;
.mainMenuItem{
align-items: center;
flex-direction: column;
.joinHeader{
width: 60rpx;
height: 60rpx;
border-radius: 50%;
background: rgba(54, 57, 169, 1);
display: flex;
flex-direction: column;
align-items: center;
max-width: 20%;
flex: 1;
uni-image{
width: 100rpx!important;
}
text{
font-size: 28rpx;
color: #333;
}
justify-content: center;
margin-bottom: 20rpx;
}
}
}
.personalInfo{
background: #fff;
width: 95%;
margin: 6rpx auto 0;
.ulBox{
padding: 0 30rpx;
.liBox{
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #E6E6E6;
height: 92rpx;
.infoBox{
display: flex;
align-items: center;
image{
width: 52rpx !important;
height: 52rpx;
}
}
&:last-child{
border:none;
.joinCon{
// padding: 20rpx 0;
.one{
font-size: 30rpx;
color: rgba(38, 41, 44, 1);
font-weight: 600;
text-align: center;
}
}
}
}
.inviteQrcodeContainer{
.popup1-content{
.title{
display: flex;
justify-content: space-between;
align-items: center;
}
.content{
.contentBox{
.two{
color: rgba(145, 144, 148, 1);
font-size: 26rpx;
text-align: center;
h3{
padding: 30rpx;
}
margin-top: 10rpx;
margin-bottom: 20rpx;
}
}
.confirmBtn{
border-radius: 80rpx;
height: 80rpx;
width: 60%;
background-color: #20269B;
.joinFotter{
width: 100%;
color: #fff;
margin: 64rpx auto 0;
display: flex;
justify-content: center;
align-items: center;
justify-content: center;
box-sizing: border-box;
padding: 10rpx 0;
background: rgba(54, 57, 169, 1);
border-radius: 60rpx;
}
}
}
</style>
static/font1/demo_index.html
......@@ -55,6 +55,36 @@
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont">&#xe641;</span>
<div class="name">雷电</div>
<div class="code-name">&amp;#xe641;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe610;</span>
<div class="name">信息</div>
<div class="code-name">&amp;#xe610;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe759;</span>
<div class="name">搜索</div>
<div class="code-name">&amp;#xe759;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe6be;</span>
<div class="name">使用教程</div>
<div class="code-name">&amp;#xe6be;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe65e;</span>
<div class="name">公司</div>
<div class="code-name">&amp;#xe65e;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe115;</span>
<div class="name">下箭头</div>
<div class="code-name">&amp;#xe115;</div>
......@@ -228,9 +258,9 @@
<pre><code class="language-css"
>@font-face {
font-family: 'iconfont';
src: url('iconfont.woff2?t=1749031328434') format('woff2'),
url('iconfont.woff?t=1749031328434') format('woff'),
url('iconfont.ttf?t=1749031328434') format('truetype');
src: url('iconfont.woff2?t=1750063346486') format('woff2'),
url('iconfont.woff?t=1750063346486') format('woff'),
url('iconfont.ttf?t=1750063346486') format('truetype');
}
</code></pre>
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
......@@ -257,6 +287,51 @@
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont icon-leidian"></span>
<div class="name">
雷电
</div>
<div class="code-name">.icon-leidian
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xinxi"></span>
<div class="name">
信息
</div>
<div class="code-name">.icon-xinxi
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-sousuo"></span>
<div class="name">
搜索
</div>
<div class="code-name">.icon-sousuo
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shiyongjiaocheng"></span>
<div class="name">
使用教程
</div>
<div class="code-name">.icon-shiyongjiaocheng
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-gongsi"></span>
<div class="name">
公司
</div>
<div class="code-name">.icon-gongsi
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xiajiantou"></span>
<div class="name">
下箭头
......@@ -519,6 +594,46 @@
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-leidian"></use>
</svg>
<div class="name">雷电</div>
<div class="code-name">#icon-leidian</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xinxi"></use>
</svg>
<div class="name">信息</div>
<div class="code-name">#icon-xinxi</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-sousuo"></use>
</svg>
<div class="name">搜索</div>
<div class="code-name">#icon-sousuo</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shiyongjiaocheng"></use>
</svg>
<div class="name">使用教程</div>
<div class="code-name">#icon-shiyongjiaocheng</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-gongsi"></use>
</svg>
<div class="name">公司</div>
<div class="code-name">#icon-gongsi</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xiajiantou"></use>
</svg>
<div class="name">下箭头</div>
......
static/font1/iconfont.css
@font-face {
font-family: "iconfont"; /* Project id 4933433 */
src: url('iconfont.woff2?t=1749031328434') format('woff2'),
url('iconfont.woff?t=1749031328434') format('woff'),
url('iconfont.ttf?t=1749031328434') format('truetype');
src: url('iconfont.woff2?t=1750063346486') format('woff2'),
url('iconfont.woff?t=1750063346486') format('woff'),
url('iconfont.ttf?t=1750063346486') format('truetype');
}
.iconfont {
......@@ -13,6 +13,26 @@
-moz-osx-font-smoothing: grayscale;
}
.icon-leidian:before {
content: "\e641";
}
.icon-xinxi:before {
content: "\e610";
}
.icon-sousuo:before {
content: "\e759";
}
.icon-shiyongjiaocheng:before {
content: "\e6be";
}
.icon-gongsi:before {
content: "\e65e";
}
.icon-xiajiantou:before {
content: "\e115";
}
......
static/font1/iconfont.js
This source diff could not be displayed because it is too large. You can view the blob instead.
static/font1/iconfont.json
......@@ -6,6 +6,41 @@
"description": "",
"glyphs": [
{
"icon_id": "39934155",
"name": "雷电",
"font_class": "leidian",
"unicode": "e641",
"unicode_decimal": 58945
},
{
"icon_id": "4550364",
"name": "信息",
"font_class": "xinxi",
"unicode": "e610",
"unicode_decimal": 58896
},
{
"icon_id": "4933408",
"name": "搜索",
"font_class": "sousuo",
"unicode": "e759",
"unicode_decimal": 59225
},
{
"icon_id": "29085756",
"name": "使用教程",
"font_class": "shiyongjiaocheng",
"unicode": "e6be",
"unicode_decimal": 59070
},
{
"icon_id": "29941060",
"name": "公司",
"font_class": "gongsi",
"unicode": "e65e",
"unicode_decimal": 58974
},
{
"icon_id": "9021520",
"name": "下箭头",
"font_class": "xiajiantou",
......
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 to comment