Commit bf44a02e authored by 潘永坪's avatar 潘永坪

Merge branch 'album' into develop

# Conflicts:
#	pages/scenic/scenicChooseProduct/scenicChooseProduct.vue
parents 9c486bd3 6da98198
......@@ -196,9 +196,11 @@
}
}
],
//分包加载配置,此配置为小程序的分包加载机制。
"subPackages": [{
"subPackages": [
{
"root": "pages/vlog", //子包的根目录
"pages": [
{
......@@ -321,7 +323,58 @@
}
}
]
}],
},
{
"root":"pages/album",
"pages": [
{
"path" : "albumIndex",
"style" :
{
"navigationBarTitleText": "相册首页",
"enablePullDownRefresh": false,
"navigationStyle": "custom"
}
},
{
"path" : "chooseFavorite",
"style" :
{
"navigationBarTitleText": "景区喜好",
"enablePullDownRefresh": false,
"navigationStyle": "custom"
}
},
{
"path" : "getPortrait",
"style" :
{
"navigationBarTitleText": "获取人像",
"enablePullDownRefresh": false,
"navigationStyle": "custom"
}
}
,{
"path" : "myPhotoAlbum/myPhotoAlbum",
"style" :
{
"navigationBarTitleText": "我的相册",
"enablePullDownRefresh": false
}
}
,{
"path" : "albumOrderdetail/albumOrderdetail",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
]
}
],
"globalStyle" : {
"navigationBarTextStyle" : "white",
"navigationBarTitleText" : "",
......
<template>
<view class="big-box" :style="{'padding-top': statusBarHeight + 'px'}">
<view class="nav-bar" :style="{'top': statusBarHeight + 'px', 'height': navHeight + 'px','line-height': navHeight + 'px'}">
摄影/旅拍
</view>
<view class="body">
<view class="scroll-view" >
<view class="item" @click="jumpToScanFaceClick">
<image class="img" src="./static/album/myAlbum.png"></image>
<text class="title">我的相片</text>
</view>
<view class="item">
<image class="img" src="./static/album/DIY.png"></image>
<text class="title">影像DIY</text>
</view>
<view class="item" @click="jumpToScanFaceClick">
<image class="img" src="./static/album/custom.png"></image>
<text class="title">旅拍定制</text>
</view>
<view class="item" @click="jumptoVlog">
<image class="img" src="./static/album/myVlog.png"></image>
<text class="title">我的Vlog</text>
</view>
</view>
<view class="private-custom">
<view class="title">私人定制</view>
<u-waterfall v-model="list" ref="uWaterfall">
<template v-slot:left="{leftList}">
<view class="left demo-water" v-for="(item, index) in leftList" :key="index" @click="jumpToClick(item.title)">
<image :src="item.image" mode="aspectFill"></image>
<!-- <u-lazy-load threshold="-450" border-radius="10" :image="item.image" :index="index"></u-lazy-load> -->
<view class="info-box" :style="{'background-color': item.color}">
<view class="item-title">{{item.title}}</view>
<view class="slogan">一句宣传语</view>
<view class="bottom">
<view class="img-btn">
点击定制
<u-icon name="arrow-right"></u-icon>
</view>
<text class="count">{{item.count}}</text>
</view>
</view>
</view>
</template>
<template v-slot:right="{rightList}">
<view class="demo-water" v-for="(item, index) in rightList" :key="index" @click="jumpToClick(item.title)">
<image :src="item.image" mode="aspectFill"></image>
<!-- <u-lazy-load threshold="-450" border-radius="10" :image="item.image" :index="index"></u-lazy-load> -->
<view class="info-box" :style="{'background-color': item.color}">
<view class="item-title">{{item.title}}</view>
<view class="slogan">快来定制吧</view>
<view class="bottom">
<view class="img-btn">
点击定制
<u-icon name="arrow-right"></u-icon>
</view>
<text class="count">{{item.count}}</text>
</view>
</view>
</view>
</template>
</u-waterfall>
</view>
</view>
<u-mask :show="showtip" >
<view class="mask">
<view class="img-box">
<image src="./static/album/postcardTip.png" mode="aspectFit"></image>
<u-icon class="close" name="close-circle" @click="showtip = false"></u-icon>
</view>
<u-button type="primary" shape="circle" @click="showtip = false">知道了</u-button>
</view>
</u-mask>
</view>
</template>
<script>
import UWaterfall from '@/uview-ui/components/u-waterfall/u-waterfall.vue'
import ULazyLoad from '@/uview-ui/components/u-lazy-load/u-lazy-load.vue'
import UMask from '@/uview-ui/components/u-mask/u-mask.vue'
export default {
components: {
UWaterfall,
ULazyLoad,
UMask
},
data() {
return {
showtip: false,//领取提示
statusBarHeight: 0,
capsule: 0,
navHeight: 0,
list: [
{
title: '精彩瞬间',
count: '10W+',
image: './static/album/wonderfulMoment.png',
color: '#037EFF'
},
{
title: '网红旅拍',
count: '8W+',
image: './static/album/travalphoto.png',
color: '#826847'
},
{
title: '抱枕DIY',
count: '4W+',
image: './static/album/pillow.png',
color: '#1175B4'
},
{
title: '明信片',
count: '4W+',
image: './static/album/postcard.png',
color: '#3478DC'
},
{
title: '旅游台历定制',
count: '4W+',
image: './static/album/deskCalender.png',
color: '#1A9B45'
},
{
title: '定制相册',
count: '4W+',
image: './static/album/customPic.png',
color: '#D48D46'
}
]
}
},
methods: {
jumpToScanFaceClick() {//---跳转扫脸页面
const openid = uni.getStorageSync('openid')
this.$request('wechatUser/pdFace/checkScanFace',{openid}).then(res => {//创建任务
if (res.code === '00') {
if(res.data.isScanFace === 0) {//未扫脸
uni.navigateTo({
url: './getPortrait'
})
}else if(res.data.isScanFace === 1) {//已扫脸
uni.navigateTo({
url: `./myPhotoAlbum/myPhotoAlbum?faceIds=${JSON.stringify(res.data.faceIds)}`
})
}
}else{
uni.showToast({
title: res.message,
icon: 'none'
})
}
})
},
jumptoVlog() {//---跳转到vlog页面
console.log('fdsa')
uni.redirectTo({
url: '/pages/vlog/vlogIndex/vlogIndex'
})
},
jumpToClick(title) {
if(title === '精彩瞬间' || title === '网红旅拍') {
this.jumpToScanFaceClick()
}
},
recordDeviceInfo() {//---记录设备信息
this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight // 状态栏高度
this.capsule = uni.getMenuButtonBoundingClientRect() // 胶囊大小、位置数据
this.navHeight = (this.capsule.top - this.statusBarHeight) * 2 + this.capsule.height // 导航栏高度
}
},
onLoad(option) {
if(option.tip === 'true') this.showtip = true
this.recordDeviceInfo()
}
}
</script>
<style lang="scss" scoped>
.big-box {
position: relative;
padding: 0 24rpx;
background: linear-gradient(to right bottom, #c778f350, #66ddad50, #68d6de50);
z-index: 0;
&::after {
content: '';
width: 100%;
height: 100%;
position: absolute;
bottom: 0;
left: 0;
z-index: -1;
background: linear-gradient(to top, #f7f7f7, #f7f7f7 80%, transparent 100%);
}
/deep/.u-mask {
display: flex;
justify-content: center;
align-items: center;
}
}
.nav-bar {
font-size: 36rpx;
font-weight: 700;
z-index: 9;
}
.scroll-view {
display: flex;
width: calc(100% + 48rpx);
position: relative;
top: 0;
left: -24rpx;
overflow-x: auto;
padding: 46rpx 0 0 24rpx;
margin-bottom: 48rpx;
&::-webkit-scrollbar {
display: none;
}
.item {
display: flex;
flex-direction: column;
align-items: center;
margin-right: 24rpx;
}
.img {
width: 200rpx;
height: 136rpx;
border-radius: 16rpx;
margin-bottom: 16rpx;
box-shadow: 0px 0px 8px 2px rgba(0,0,0,0.12);
overflow: hidden;
}
.title {
font-size: 28rpx;
font-weight: 700;
}
}
.private-custom {
.title {
position: relative;
margin-bottom: 24rpx;
font-size: 32rpx;
font-weight: 700;
&::after {
content: '';
width: 128rpx;
height: 44rpx;
position: absolute;
left: -8rpx;
bottom: -24rpx;
background: url('@/pages/album/static/album/private-custom.png') no-repeat;
}
}
.demo-water {
image {
border-radius: 16rpx 16rpx 0 0;
height: 458rpx;
width: 100%;
}
/deep/.u-wrap,
/deep/.u-lazy-item {
broder-radius: 16rpx 16rpx 0 0 !important;
}
}
.left.demo-water {
margin-right: 14rpx;
image {
height: 400rpx;
}
}
.info-box {
display: flex;
flex-direction: column;
justify-content: space-between;
height: 170rpx;
position: relative;
top: -16rpx;
padding: 16rpx;
box-sizing: border-box;
border-radius: 0 0 16rpx 16rpx;
color: #fff;
.item-title {
font-size: 28rpx;
font-weight: 700;
}
.slogan {
font-size: 24rpx;
}
.img-btn {
display: flex;
justify-content: center;
align-items: center;
width: 160rpx;
height: 40rpx;
border-radius: 20rpx;
background-color: #E1E1D9;
color: #333;
font-size: 22rpx;
}
.bottom {
display: flex;
justify-content: space-between;
.count {
font-size: 28rpx;
color: #ececec;
}
}
}
}
.mask {
.img-box {
position: relative;
margin-bottom: 32rpx;
.close {
position: absolute;
top: -54rpx;
right: 24rpx;
color: #fff;
&::after {
position: absolute;
content: '';
top: 24rpx;
left: 50%;
transform: translateX(-50%);
width: 0;
height: 32rpx;
border-left: 1px dashed #fff;
}
}
}
image {
width: 504rpx;
height: 720rpx;
}
/deep/.u-btn {
width: 304rpx;
}
}
</style>
\ No newline at end of file
<template>
<view class="order-wrap">
<view class="top">
订单信息
</view>
<view class="middle">
<view>
<text class="grey">
订单编号
</text>
<text style="flex: 1;">
z0016784191206689a18e27162f293ef
</text>
<image @click="copyText(orderInfo.id)" src="@/static/img/my/icon01.png" class="copy-image">
</image>
</view>
<view>
<text class="grey">
产品名称
</text>
长江索道-我的相片
</view>
<view>
<text class="grey">
订单金额
</text>
¥10
</view>
<view>
<text class="grey">
订单数量
</text>
1
</view>
<view>
<text class="grey">
订单时间
</text>
2023-07-07 10:49:49
</view>
<view>
<text class="grey">
支付单号
</text>
2023070722001181651456467459
</view>
<view>
<text class="grey">
支付时间
</text>
2023-07-07 10:50:11
</view>
<view>
<text class="grey">
咨询电话
</text>
023-68567748
</view>
</view>
<view class="bottom">
<view class="bottom-rule">
<text class="grey">退改规则</text>
<text>不可退</text>
</view>
<view class="bottom-btn">
<text class="button-empty">我的影集</text>
<text class="button">下载</text>
<text class="button" @click="showPop=true">打印</text>
</view>
</view>
<!-- 打印弹窗 -->
<u-popup v-model="showPop" mode="bottom" border-radius="14" closeable height="70%">
<view class="pop-head">
<text style="font-size: 32rpx;font-weight: bold;">
打印
</text>
<text>
(现场自取)
</text>
</view>
<view class="pop-middle">
<view>
<text class="middle-tip">
取片电话:
</text>
<input />
</view>
<view>
<text class="middle-tip">
取片地址:
</text>
<text>
重庆市渝中区新华路151号长江索道南站观景台旁
</text>
</view>
<view>
<text class="middle-tip">
运营时间:
</text>
<text>
09:00-22:00
</text>
</view>
<view>
<text class="middle-tip">
咨询电话:
</text>
<text>
023-68567748
</text>
</view>
<view>
<text class="middle-tip">
温馨提示:
</text>
<text style="color: #999999;">
每个订单仅限免费打印一次取片时请向现场工作人员出示订单号或支付单号
</text>
</view>
</view>
<view class="pop-bottom">
<text class="pop-btn">
提交
</text>
</view>
</u-popup>
</view>
</template>
<script>
export default {
data() {
return {
showPop:false,//弹窗显示隐藏
}
},
methods: {
//---复制内容
copyText(value){
uni.setClipboardData({
data:value,
success:function(){
uni.showToast({
title: '复制成功',
icon: 'none'
})
}
})
},
}
}
</script>
<style scoped lang="scss">
.order-wrap{
background: #FFFFFF;
box-shadow: 0px 0px 12rpx 2rpx rgba(0,0,0,0.08);
border-radius: 16rpx;
margin: 24rpx;
}
.top{
height: 92rpx;
line-height: 92rpx;
border-bottom: 1px solid #ececec;
padding: 0 24rpx;
font-size: 32rpx;
color: #191919;
font-weight: bold;
}
.middle{
padding: 0 24rpx 48rpx 24rpx;
border-bottom: 1px solid #ececec;
>view{
display: flex;
margin-top: 32rpx;
}
}
.copy-image{
width: 32rpx;
height: 32rpx;
flex-shrink: 0;
}
.grey{
color: #999999;
flex-shrink: 0;
margin-right: 20rpx;
}
.bottom{
padding: 48rpx 24rpx;
}
.bottom-rule{
display: flex;
justify-content: space-between;
}
.bottom-btn{
display: flex;
justify-content: space-between;
margin-top: 48rpx;
}
.button{
width: 144rpx;
height: 64rpx;
background: $blue;
border-radius:8rpx;
display: inline-block;
color:#ffffff;
text-align: center;
line-height: 64rpx;
}
.button-empty{
width: 144rpx;
height: 64rpx;
border-radius:8rpx;
display: inline-block;
border: 1px solid #999999;
text-align: center;
line-height: 64rpx;
}
// 打印弹窗
.pop-head{
text-align: center;
margin-top: 20rpx;
}
.pop-middle{
padding:0 48rpx 32rpx 48rpx;
view{
display: flex;
margin-top: 32rpx;
}
}
.middle-tip{
font-weight: bold;
flex-shrink: 0;
}
.pop-bottom{
margin-top: 60rpx;
text-align: center;
}
.pop-btn{
display: inline-block;
width: 212rpx;
height: 80rpx;
background:$blue;
border-radius: 44rpx;
text-align: center;
line-height: 80rpx;
color: #ffffff;
font-size: 32rpx;
}
</style>
<template>
<view class="big-box" :style="{'padding-top': statusBarHeight + 'px'}">
<view class="nav-bar" :style="{'height': navHeight + 'px'}">
<picker mode="selector" @change="companyChage" :value="index" :range="companyArr" range-key="name">
<view class="company">{{companyArr[index] ? companyArr[index].name : '请选择公司'}}</view>
</picker>
<u-icon name="arrow-down"></u-icon>
</view>
<view class="outer-container">
<view class="inner-container">
<view class="icon">
<image class="favorite" src="./static/album/favorite.png"></image>
<image class="start" src="./static/album/star.png"></image>
</view>
<view class="img-box">
<view class="item" @click="imageChange(item)" v-for="(item, index) in imgArr" :key="item.id">
<image class="img" :src="item.url" mode="aspectFill"></image>
<u-checkbox class="checkbox" v-model="item.value" shape="circle"></u-checkbox>
</view>
</view>
<button class="btn" @click="saveClick">提交</button>
</view>
</view>
</view>
</template>
<script>
import UCheckbox from '@/uview-ui/components/u-checkbox/u-checkbox.vue'
export default {
components: {
UCheckbox,
},
data() {
return {
statusBarHeight: 0,
capsule: 0,
navHeight: 0,
index: 0,// 选中的公司索引-默认选中第一个
companyArr: [],// 公司枚举
imgArr: [],//图片
value: true,
location: {},//位置信息
option: {},//路由传参
}
},
methods: {
saveClick() {//---提交
const selectedPic = this.imgArr.filter(item => item.value)
const data = {
id: selectedPic[0].id,// 图片id
merchantId: selectedPic[0].merchantId
}
uni.setStorageSync('merchantId', data.merchantId)
this.$request('scenic/V2merchant/submitChoose', data).then(res => {//创建任务
if (res.code === '00') {
uni.showToast({
title: '提交成功',
icon: 'success'
})
uni.navigateTo({
url: './albumIndex?tip=true'
})
}else{
uni.showToast({
title: res.message,
icon: 'none'
})
}
})
},
companyChage(e) {//---公司变化
this.index = Number(e.detail.value)
const merchantId = this.companyArr[this.index].id
this.getPic(merchantId)
},
imageChange(item) {//---图片选择
this.imgArr.forEach(item => item.value = false)
item.value = true
},
recordDeviceInfo() {//---记录设备信息
this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight // 状态栏高度
this.capsule = uni.getMenuButtonBoundingClientRect() // 胶囊大小、位置数据
this.navHeight = (this.capsule.top - this.statusBarHeight) * 2 + this.capsule.height // 导航栏高度
},
getCompany(nearbyId) {//---获取景区列表
this.$request('scenic/newMerchant/findAllMerchant').then(res => {//创建任务
if (res.code === '00') {
if(!res.data.length) return
const id = this.option.merchantId || nearbyId
let index = res.data.findIndex(item => item.id === id)
this.index = index === -1 ? 0 : index
this.companyArr = res.data
this.getPic(this.companyArr[this.index].id)
}else{
uni.showToast({
title: res.message,
icon: 'none'
})
}
})
},
getPic(merchantId) {//---获取景区图片
this.$request('scenic/V2merchant/getImgList',{ merchantId }).then(res => {//创建任务
if (res.code === '00') {
res.data.forEach(item => item.value = false)
this.imgArr = res.data
}else{
uni.showToast({
title: res.message,
icon: 'none'
})
}
})
},
getNearByCompany() {//---获取最近的景区
const data = {
merchantType: 1,
userlatitude: this.location.latitude,//纬度
userlongitude: this.location.longitude//经度
}
this.$request('scenic/newMerchant/findAllMerchant', data).then(res => {//创建任务
if (res.code === '00') {
if(!res.data.length) {
this.getCompany()
return uni.showToast({
title: '获取最近景点失败',
icon: 'none'
})
}
this.getCompany(res.data[0].id)
}else{
uni.showToast({
title: res.message,
icon: 'none'
})
}
})
}
},
onLoad(option) {
this.option = option
this.recordDeviceInfo()
uni.getLocation({//获取定位
type: 'wgs84',
success: res => {
this.location = res
uni.setStorageSync('location', JSON.stringify(res))
if(this.option.merchantId) {//扫码进入则直接加载景区列表,默认显示传入的景区
this.getCompany()
}else {//否则获取并显示距离最近的景点
this.getNearByCompany()
}
},
fail() {
this.getCompany()
uni.showToast({
title: '获取经纬度失败',
icon: 'none'
})
}
})
}
}
</script>
<style lang="scss" scoped>
.big-box {
display: flex;
flex-direction: column;
height: 100%;
background-color: #3688FF;
color: #fff;
}
.nav-bar {
display: flex;
align-items: center;
picker {
max-width: 50%;
}
.company {
margin: 0 12rpx 0 24rpx;
font-size: 36rpx;
font-weight: 700;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
.outer-container {
flex: 1;
margin: 16rpx 16rpx 24rpx 16rpx;
border-radius: 96rpx;
background: url('@/pages/album/static/album/dash-bg.png');
background-size: 100% 100%;
padding: 16rpx;
overflow: hidden;
.inner-container {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
background-color: #3041D7;
border-radius: 96rpx;
}
.img-box {
display: flex;
flex-wrap: wrap;
align-content: flex-start;
overflow-y: auto;
flex: 1;
margin: 42rpx 20rpx;
padding: 24rpx 16rpx;
background-color: #fff;
box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0,0,0,0.16);
border-radius: 16rpx;
.item {
width: 49%;
height: 236rpx;
border-radius: 16rpx;
margin-bottom: 16rpx;
position: relative;
overflow: hidden;
&:nth-child(2n-1) {
margin-right: 2%;
}
.img {
width: 100%;
heigit: 100%;
}
.checkbox {
display: flex;
position: absolute;
right: 12rpx;
top: 12rpx;
width: 36rpx;
height: 36rpx;
}
.u-checkbox__label {
margin: 0;
}
/deep/.u-checkbox__icon-wrap {
border: 1px solid #fff;
}
/deep/.u-checkbox__icon-wrap--checked {
border: 1px solid #2979ff;
}
}
}
.icon {
display: flex;
justify-content: center;
align-items: center;
margin-top: 78rpx;
.favorite {
width: 318rpx;
height: 94rpx;
}
.start {
width: 180rpx;
height: 118rpx
}
}
.btn {
display: flex;
justify-content: center;
align-items: center;
width: 440rpx;
height: 80rpx;
margin-bottom: 24rpx;
background: linear-gradient(90deg, #3688FF 0%, #539FFF 100%);
border-radius: 40rpx 40rpx 40rpx 40rpx;
font-size: 32rpx;
}
}
</style>
\ No newline at end of file
<template>
<view class="big-box" :style="{'padding-top': statusBarHeight + 'px'}">
<view class="nav-bar" :style="{'height': navHeight + 'px'}"></view>
<text class="title">扫脸获取您的照片</text>
<view class="scan">
<camera class="circle" device-position="front" flash="off" @error="error"></camera>
<view class="surface" v-if="show">
<view class="camera-tip">请正对镜头</view>
<text>{{text}}</text>
</view>
<image class="photo" v-show="src" :src="src"></image>
</view>
<view class="icon-box">
<view class="item">
<image src="./static/album/will-lit.png"></image>
<text>保持光线充足</text>
</view>
<view class="item">
<image src="./static/album/face-screen.png"></image>
<text>请面对屏幕</text>
</view>
<view class="item">
<image src="./static/album/no-shelter.png"></image>
<text>不得遮挡面部</text>
</view>
</view>
<text class="tip">获取照片需先在拍摄点摄影</text>
<u-mask :show="maskShow" @click="maskShow = false">
<view class="mask">
<text class="countdown">{{maskCount}}s</text>
<view class="tip">
<view>未找到您的照片</view>
<view class="small">请在拍摄点拍摄后重试</view>
</view>
<u-button type="info" size="mini" shape="circle" @click="maskShow = false">返回</u-button>
</view>
</u-mask>
</view>
</template>
<script>
import UMask from '@/uview-ui/components/u-mask/u-mask.vue'
export default {
components: {
UMask
},
data() {
return {
statusBarHeight: 0,
capsule: 0,
navHeight: 0,
src: '', //照片
text: 3, //倒计时
show: false, //摄像头倒计时文本
base64: '', //照片base64
maskShow: false,//弹窗显示
maskCount: 3,//弹窗倒计时
queryData: {},//查询参数
defaultBrightness: 0.5,//屏幕亮度
}
},
methods: {
recordDeviceInfo() {//---记录设备信息
this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight // 状态栏高度
this.capsule = uni.getMenuButtonBoundingClientRect() // 胶囊大小、位置数据
this.navHeight = (this.capsule.top - this.statusBarHeight) * 2 + this.capsule.height // 导航栏高度
},
openCamera() { //---用户首次进入打开权限
uni.authorize({ //摄像头
scope: 'scope.camera',
success: (res) => {
console.log('已打开摄像头权限')
this.getQueryField()
},
fail: (res) => {
uni.showModal({
content: '检测到您没打开摄像头权限,是否去设置打开?',
confirmText: '确认',
cancelText: '取消',
success: (res) => {
if (res.confirm) {
uni.openSetting({
success: (res) => {
console.log(res)
this.getQueryField()
},
fail: (err) => {
console.log(err)
}
})
} else {
uni.navigateBack({
delta: 1
})
}
}
})
}
})
uni.authorize({
scope: 'scope.writePhotosAlbum',
success: (res) => {
console.log('已打开保存到相册权限')
},
fail: (res) => {
uni.showModal({
content: '检测到您没打开相册权限,是否去设置打开?',
confirmText: '确认',
cancelText: '取消',
success: (res) => {
if (res.confirm) {
uni.openSetting({
success: (res) => {
console.log('已打开保存到相册权限')
},
fail: (err) => {
console.log('保存到相册权限打开失败' + err)
}
})
} else {
uni.navigateBack({
delta: 1
})
}
}
})
}
})
},
getQueryField() {//---获取查询参数
const merchantId = uni.getStorageSync('merchantId')
this.$request('scenic/albumConfig/getAlbumConfig',{merchantId}).then(res => {//创建任务
if (res.code === '00') {
this.queryData = res.data
this.takePhoto()
}else{
uni.showToast({
title: '查询参数获取失败',
icon: 'none'
})
}
})
},
query() { //人脸查询
uni.showLoading({
title: '人脸识别中'
})
let data = {
openid: uni.getStorageSync('openid'), //openid
uri: this.base64, //人脸图片base64编码
...this.queryData
}
this.$request('wechatUser/aliFace/faceSearch',data).then(res => {//创建任务
uni.hideLoading()
if (res.code === '00') {
if(res.data.faceIds && res.data.faceIds.length) {
uni.setScreenBrightness({
value: this.defaultBrightness, //屏幕亮度值,范围 0~1,0 最暗,1 最亮
})
uni.navigateTo({
url: `./myPhotoAlbum/myPhotoAlbum?faceIds=${JSON.stringify(res.data.faceIds)}`
})
}else {
this.handleNotFound()
}
}else{
this.handleNotFound()
}
})
},
handleNotFound() {//---处理没有找到照片或返回错误的逻辑
this.maskShow = true
var loop = setInterval(() => {
this.maskCount -= 1
if(this.maskCount <= -1) {
this.maskShow = false
this.src = ''
clearInterval(loop)
uni.navigateBack({
delta: 1
})
uni.setScreenBrightness({
value: this.defaultBrightness, //屏幕亮度值,范围 0~1,0 最暗,1 最亮
})
}
},1000)
},
takePhoto() { //扫脸
this.src = ''
this.text = 3
this.show = true
var test = setInterval(() => {
this.text = this.text - 1
if (this.text === 0) {
clearInterval(test)
this.show = false
const ctx = uni.createCameraContext()
ctx.takePhoto({
quality: 'high',
success: (res) => {
this.src = res.tempImagePath
uni.getFileSystemManager().readFile({ //图片转base64
filePath: res.tempImagePath, //选择图片返回的相对路径
encoding: 'base64', //编码格式
success: res => { //成功的回调
this.base64 = res.data
this.query()
}
})
}
})
}
}, 1000)
},
error(e) { //相机报错
uni.showModal({
title: '提示',
content: e.detail,
showCancel: false
})
},
},
onLoad() {
this.recordDeviceInfo()
uni.getScreenBrightness({//获取屏幕亮度
success(res) {
this.defaultBrightness = res.value
},
fail() {
this.defaultBrightness = 0.5//如果获取失败设置亮度为中间值
}
})
uni.setScreenBrightness({
value: 0.8, //屏幕亮度值,范围 0~1,0 最暗,1 最亮
})
this.openCamera()
}
}
</script>
<style lang="scss" scope>
.big-box {
display: flex;
flex-direction: column;
align-items: center;
height: 100%;
background-color: #fff;
.title {
font-size: 32rpx;
margin: 30rpx 0 62rpx 0;
}
.scan {
position: relative;
width: 468rpx;
height: 468rpx;
margin-bottom: 20%;
z-index: 1;
.circle,
.surface,
.photo {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
border-radius: 50%;
}
.circle {
border: 1px dashed #999;
box-sizing: border-box;
background-color: #fff;
// z-index: 100;
}
.surface {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
color: #fff;
font-size: 48rpx;
z-index: 200;
.camera-tip {
margin-bottom: 48rpx;
}
}
.photo {
z-index: 200;
}
&::before,
&::after {
position: absolute;
left: -12rpx;
top: 0;
content: '';
width: 100%;
height: 100%;
border-radius: 50%;
background-color: #ECF5FF;
z-index: -1;
}
&::after {
left: 12rpx;
background-color: #CEE5FF;
}
}
.icon-box {
display: flex;
justify-content: space-evenly;
align-self: stretch;
margin-bottom: 20%;
.item {
display: flex;
flex-direction: column;
align-items: center;
text {
font-size: 24rpx;
font-weight: 700;
color: #191919;
}
}
image {
width: 88rpx;
height: 88rpx;
margin-bottom: 20rpx;
}
}
.tip {
font-size: 32rpx;
font-weight: 700;
color: #3688FF;
}
/deep/.u-mask {
display: flex;
justify-content: center;
align-items: center;
}
}
.mask {
display: flex;
flex-direction: column;
align-items: center;
width: 70%;
padding: 16rpx;
border-radius: 16rpx;
background-color: #fff;
.countdown {
align-self: flex-end;
}
.tip {
font-size: 36rpx;
color: #3688FF;
margin: 32rpx 0 24rpx 0;
text-align: center;
.small {
font-size: 28rpx;
color: #333;
}
}
}
</style>
\ No newline at end of file
<template>
<view class="albumBox">
<!--头部-->
<view class="album-address">
<view class="address-left">
<view class="left-name">照片来源</view>
<view class="left-picker" @click="orderShow=true">
<i>{{cityName}}</i>
<image src="../../../static/img/album/myPhoto01.png"></image>
</view>
<u-picker mode="selector" v-model="orderShow" :default-selector="[orderType]" :range="option" range-key="cateName" @confirm="industrysTypeConfirm($event)" @cancel="cancel"></u-picker>
<view class="left-project" :class="[projectCheck==0?'left-projectDe':'']" @click="projectClick(0)" >
长江索道
<i>6</i>
</view>
<view class="left-project" :class="[projectCheck==1?'left-projectDe':'']" @click="projectClick(1)" >
定制旅拍
<i>8</i>
</view>
</view>
<view class="address-right" @click="projectMoreFun()">
<u-icon name="more-dot-fill"></u-icon>
</view>
</view>
<!--头部更多-->
<view class="album-addressMore" v-if="projectMoreType==true">
<view class="addressMore-name">长江索道(6)</view>
<view class="addressMore-name">定制旅拍(8)</view>
</view>
<!--全选按钮-->
<view class="album-checkAll">
<u-checkbox v-model="checkProjectAll" >全选</u-checkbox>
<view class="checkAll-tips">未下载影像保留15天</view>
</view>
<!--主体循环-->
<view class="album-subject">
<view class="subject-List">
<image class="list-image" src="../../../static/img/hghg/dialog.png"></image>
<u-checkbox v-model="checkProjectAll" shape="circle" class="list-uCheck" ></u-checkbox>
<view class="list-mask">预览</view>
</view>
<view class="subject-List">
<image class="list-image" src="../../../static/img/hghg/dialog.png"></image>
<u-checkbox v-model="checkProjectAll" shape="circle" class="list-uCheck" ></u-checkbox>
<view class="list-mask">预览</view>
</view>
<view class="subject-List">
<image class="list-image" src="../../../static/img/hghg/dialog.png"></image>
<u-checkbox v-model="checkProjectAll" shape="circle" class="list-uCheck" ></u-checkbox>
<view class="list-mask">预览</view>
</view>
<view class="subject-List">
<image class="list-image" src="../../../static/img/hghg/dialog.png"></image>
<u-checkbox v-model="checkProjectAll" shape="circle" class="list-uCheck" ></u-checkbox>
<view class="list-mask">预览</view>
</view>
<view class="subject-List">
<image class="list-image" src="../../../static/img/hghg/dialog.png"></image>
<u-checkbox v-model="checkProjectAll" shape="circle" class="list-uCheck" ></u-checkbox>
<view class="list-mask">预览</view>
</view>
<view class="subject-List">
<image class="list-image" src="../../../static/img/hghg/dialog.png"></image>
<u-checkbox v-model="checkProjectAll" shape="circle" class="list-uCheck" ></u-checkbox>
<view class="list-mask">预览</view>
</view>
</view>
<!--脚部-->
<view class="album-bottom">
<view class="bottom-left" v-if="maskDetail==false">
<view class="left-oldMoney">¥15.00</view>
<view class="left-newMoney">¥10.00</view>
<view class="left-detail" @click="maskDetail=true">
<text>明细</text>
<u-icon name="arrow-up"></u-icon>
</view>
<view class="left-num">1</view>
<view class="left-mask">
多够更省
<view class="mask-transparent"></view>
</view>
</view>
<view class="bottom-Detail" v-if="maskDetail==true">
<view class="detail-total">合计:¥8.00</view>
<view class="detail-favorable">优惠减:¥2.00</view>
</view>
<view class="bootom-btn">去下载</view>
</view>
<!--预览-->
<view class="album-maskPreview">
<view class="maskPreview-Num">{{previewNum+1}}/{{previewData.length}}</view>
<view class="maskPreview-img" @touchstart="start" @touchend="end" @touchmove="move">
<template v-if="previewData.length==1">
<image class="img-center" :src="previewData[previewNum].src"></image>
</template>
<template v-else>
<image class="img-left" v-if="previewNum==0" :src="previewData[previewData.length-1].src"></image>
<image class="img-left" v-else :src="previewData[previewNum-1].src"></image>
<image class="img-center" :style="{'right':touchRight,'left':touchLeft}" :src="previewData[previewNum].src"></image>
<image class="img-right" v-if="previewNum==previewData.length-1" :src="previewData[0].src"></image>
<image class="img-right" v-else :src="previewData[previewNum+1].src"></image>
</template>
</view>
<view class="maskPreview-check">
<u-checkbox v-model="previewData[previewNum].type" shape="circle" class="maskPreview-Check" ></u-checkbox>
</view>
</view>
<!--明细-->
<view class="album-maskDetail" v-if="maskDetail==true">
<view class="maskDetail-content">
<view class="content-title">
明细
<u-icon class="title-close" name="close-circle" @click="maskDetail=false" ></u-icon>
</view>
<view class="content-label">我的相片</view>
<view class="content-money">
<view class="money-name">相片</view>
<view class="money-text">1*10.00=10.00</view>
</view>
<view class="content-favorable">
<view class="favorable-name">优惠</view>
<view class="favorable-text">-¥2.00</view>
</view>
</view>
</view>
</view>
</template>
<script>
import uPicker from '@/uview-ui/components/u-picker/u-picker.vue'
import uCheckboxGroup from '@/uview-ui/components/u-checkbox-group/u-checkbox-group.vue'
import uCheckbox from '@/uview-ui/components/u-checkbox/u-checkbox'
export default {
components: {
uPicker,
uCheckboxGroup,
uCheckbox,
},
data() {
return {
orderShow:false,//头部城市选择
option: [
{ cateName: '全部', id: 0 },
{ cateName: '景区', id: 1 },
{ cateName: '酒店', id: 2 },
{ cateName: '餐饮', id: 3 },
{ cateName: '特产', id: 4 },
// { cateName: '运营车', id: 5 },
// { cateName: '组合订单', id: 10 },
],
cityName:'重庆',
projectCheck:0,//当前选择的产品
projectMoreType:false,//是否显示更多产品
checkProjectAll:false,//所有产品全选
maskDetail:false,
previewData:[//图片预览
{
type:false,
src:'../../../static/img/hghg/dialog.png'
},
{
type:false,
src:'../../../static/img/coupon/coupon.jpg'
},
{
type:false,
src:'../../../static/img/common/getTicketBg.jpg'
},
],
previewNum:0,//当前是第几张图片
//左右滑动监听开始
startData: {
clientX: '',
clientY: '',
},
transition:'',
touch: {},
touchLeft:0,
touchRight:0,
//左右滑动 监听结束
}
},
onLoad(option) {
},
methods: {
industrysTypeConfirm(e) {//单列----分类 点击确定 城市
this.cityName = this.option[e].cateName
},
cancel() {//单列 点击取消
this.orderShow = false
},
projectClick(num){//产品选择
this.projectCheck = num
},
projectMoreFun(){//更多产品显示
if(this.projectMoreType==false){
this.projectMoreType = true
}else{
this.projectMoreType = false
}
},
// 触摸touch事件
start(e){ //@touchstart 触摸开始
this.transition = '.1s'
this.startData.clientX = e.changedTouches[0].clientX //手指按下时的X坐标
this.startData.clientY = e.changedTouches[0].clientY //手指按下时的Y坐标
},
end(e){ //@touchend触摸结束
this.transition = '.5s'
if(Math.abs(this.touch.clientX-this.startData.clientX) > 100) { //在事件结束时,判断滑动的距离是否达到出发需要执行事件的要求
console.log('执行查看跳转事件')
// this.touch = {};
} else {
console.log('滑动距离不够,不执行跳转')
// this.touch = {};
}
},
move(event) { //@touchmove触摸移动
let touch = event.touches[0] //滑动过程中,手指滑动的坐标信息 返回的是Objcet对象
this.touch = touch
let data = touch.clientX - this.startData.clientX
if(touch.clientX < this.startData.clientX) { //向左移动
console.log('左滑动')
console.log(touch.clientX)
console.log(this.startData.clientX)
this.touchRight = touch.clientX-this.startData.clientX
}
if(touch.clientX > this.startData.clientX) { //向右移动
console.log('右滑动')
console.log(touch.clientX)
console.log(this.startData.clientX)
this.touchLeft = touch.clientX-this.startData.clientX
}
},
}
}
</script>
<style scoped lang="scss">
page{
background-color: #F7F7F7;
}
.albumBox{ // 76=16 - 44 - 16 98 =34 - 32 - 32
display: flex;
flex-direction: column;
height: 100%;
background-color: #F7F7F7;
padding-bottom: 98rpx;
padding-top: 174rpx;
overflow: auto;
}
.album-address{
display: flex;
justify-content: space-between;
width: 100%;
height: 76rpx;
padding: 0 24rpx 0 24rpx;
background-color: #FFFFFF;
box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.1);
overflow: hidden;
position: fixed;
top: 0;
left: 0;
z-index: 20;
.address-left{
display: flex;
flex: 1;
box-shadow: inset -16px 0px 8px 0px rgba(255, 255, 255, 0.2);
overflow-x: auto;
.left-name{
font-size: 32rpx;
color: #999999;
line-height: 76rpx;
margin-right: 48rpx
}
.left-picker{
display: flex;
font-size: 32rpx;
color: #333333;
line-height: 76rpx;
margin-right: 24rpx;
image{
width: 26rpx;
height: 26rpx;
margin-top: 25rpx;
margin-left: 8rpx;
}
}
.left-project{
font-size: 32rpx;
color: #333333;
line-height: 76rpx;
margin-right: 48rpx;
position: relative;
i{
display: block;
width: 24rpx;
height: 24rpx;
font-size: 16rpx;
color: #FFFFFF;
line-height: 24rpx;
text-align: center;
background-color: #EE520E;
border-radius: 50%;
position: absolute;
top: 12rpx;
right: -24rpx;
}
}
.left-projectDe{
color: #3688FF;
font-weight: bold;
}
}
.address-right{
display: flex;
}
}
.album-address::-webkit-scrollbar{
display: none;
}
.album-addressMore{
width: 232rpx;
padding: 24rpx 24rpx 0 24rpx;
box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.1);
position: fixed;
top: 76rpx;
right: 0;
z-index: 20;
.addressMore-name{
font-size: 32rpx;
color: #333333;
line-height: 44rpx;
margin-bottom: 24rpx;
}
}
.album-checkAll{
display: flex;
width: 100%;
height: 98rpx;
padding: 32rpx 24rpx 0 24rpx;
overflow: hidden;
position: fixed;
top: 76rpx;
left: 0;
z-index: 20;
/deep/ .u-checkbox{
line-height: 34rpx !important;
}
/deep/ .u-checkbox__label{
font-size: 24rpx !important;
}
.checkAll-tips{
font-size: 24rpx;
color: #999999;
line-height: 46rpx;
margin-left: 24rpx;
}
}
.album-subject{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
flex: 1;
padding: 0 24rpx 0 24rpx;
overflow: auto;
.subject-List{
width: 344rpx;
height: 460rpx;
margin-bottom: 24rpx;
border-radius: 16rpx;
overflow: hidden;
position: relative;
.list-image{
display: block;
width: 344rpx;
height: 460rpx;
}
.list-mask{
width: 344rpx;
height: 64rpx;
background-color: rgba(0, 0, 0, 0.2);
font-size: 28rpx;
color: #fff;
line-height: 64rpx;
text-align: center;
position: absolute;
left: 0;
bottom: 0;
}
.list-uCheck{
position: absolute;
right: 0;
top: 24rpx;
}
}
}
.album-bottom{
display: flex;
justify-content: space-between;
width: 100%;
height: 98rpx;
padding: 0 0 0 24rpx;
box-shadow: 0rpx -2rpx 8rpx 2rpx rgba(0,0,0,0.08);
position: fixed;
bottom: 0;
left: 0;
z-index: 22;
.bottom-left{
flex: 1;
display: flex;
line-height: 98rpx;
.left-oldMoney{
font-size: 24rpx;
color: #999999;
text-decoration: line-through;
line-height: 110rpx;
margin-right: 8rpx;
}
.left-newMoney{
font-size: 40rpx;
color: #EE520E;
font-weight: bold;
margin-right: 68rpx;
}
.left-detail{
display: flex;
color: #333333;
margin-right: 20rpx;
text{
font-size: 28rpx;
line-height: 98rpx;
margin-right: 10rpx;
}
}
.left-num{
width: 32rpx;
height: 32rpx;
border-radius: 50%;
background-color: #EE520E;
text-align: center;
line-height: 32rpx;
font-size: 20rpx;
font-weight: bold;
color: #fff;
margin-top: 34rpx;
}
.left-mask{
width: 128rpx;
height: 48rpx;
font-size: 24rpx;
color: #FFFFFF;
line-height: 48rpx;
text-align: center;
background-color: #EE520E;
border-radius: 28rpx;
opacity: 0.5;
position: absolute;
left: 350rpx;
top: -24rpx;
.mask-transparent{
width:0px;
height:0px;
border:10rpx solid transparent;/*以下四个样式对应四种三角形,任选其一即可实现*/
border-top-color:#EE520E;
/* border-left-color:lightseagreen; */
/* border-right-color:lightseagreen; */
// border-bottom-color:lightseagreen;
position: absolute;
right: 15rpx;
bottom: -17rpx;
}
}
}
.bottom-Detail{
flex: 1;
display: flex;
flex-direction: column;
.detail-total{
font-size: 28rpx;
line-height: 40rpx;
color: 191919;
margin-bottom: 4rpx;
margin-top: 16rpx;
}
.detail-favorable{
font-size: 16rpx;
color: #FF4308;
line-height: 22rpx;
}
}
.bootom-btn{
width: 240rpx;
height: 98rpx;
background-color: #3688FF;
font-size: 32rpx;
color: #fff;
font-weight: bold;
text-align: center;
line-height: 98rpx;
}
}
.album-maskDetail{
position: fixed;
top: 0;
right: 0;
bottom: 98rpx;
left: 0;
z-index: 19;
background-color: rgba(0,0,0,.3);
.maskDetail-content{
width: 100%;
padding: 32rpx;
background-color: #fff;
border-radius: 16rpx 16rpx 0 0;
position: fixed;
left: 0;
bottom: 98rpx;
.content-title{
width: 100%;
font-size: 36rpx;
color: #333333;
line-height: 50rpx;
margin-bottom: 38rpx;
text-align: center;
font-weight: bold;
position: relative;
.title-close{
position: absolute;
top: 8rpx;
right: 0;
}
}
.content-label{
font-size: 36rpx;
color: #191919;
font-weight: bold;
line-height: 50rpx;
margin-bottom: 32rpx;
}
.content-money{
display: flex;
justify-content: space-between;
margin-bottom: 8rpx;
.money-name{
font-size: 32rpx;
color: #191919;
line-height: 44rpx;
}
.money-text{
font-size: 32rpx;
color: #333333;
line-height: 44rpx;
font-weight: bold;
}
}
.content-favorable{
display: flex;
justify-content: space-between;
.favorable-name{
font-size: 28rpx;
color: #FC771D;
line-height: 40rpx;
}
.favorable-text{
font-size: 28rpx;
color: #FC771D;
line-height: 40rpx;
}
}
}
}
.album-maskPreview{
position: fixed;
top: 0;
right: 0;
bottom: 98rpx;
left: 0;
z-index: 22;
background-color: rgba(0,0,0,.3);
.maskPreview-Num{
font-size: 28rpx;
color: #FFFFFF;
line-height: 40rpx;
position: fixed;
top: 72rpx;
right: 32rpx;
}
.maskPreview-img{
display: flex;
width: 100%;
height: 794rpx;
position: fixed;
top: 152rpx;
left: 0;
.img-left{
width: 520rpx;
height: 692rpx;
border-radius: 16rpx 16rpx 16rpx 16rpx;
margin: auto;
position: absolute;
left: -466rpx;
top: 0;
bottom: 0;
}
.img-right{
width: 520rpx;
height: 692rpx;
border-radius: 16rpx 16rpx 16rpx 16rpx;
margin: auto;
position: absolute;
right: -466rpx;
top: 0;
bottom: 0;
}
.img-center{
width: 596rpx;
height: 794rpx;
border-radius: 16rpx 16rpx 16rpx 16rpx;
margin: auto;
position: absolute;
right: 0;
top: 0;
bottom: 0;
left: 0;
}
}
.maskPreview-check{
width: 48rpx;
height: 48rpx;
margin: auto;
position: fixed;
top: 968rpx;
left: 0;
right: 0;
/deep/ .u-checkbox__icon-wrap{
width: 50rpx !important;
height: 50rpx !important;
color: #fff !important;
border:solid 2px #fff;
}
}
}
</style>
<template>
</template>
<script>
</script>
<style>
</style>
\ No newline at end of file
......@@ -5,7 +5,7 @@
<!-- 4.如果企业微信码停用,走公众号流程 -->
<!-- 5.暂时没用,用的公众号 -->
<view class="bigBox">
<image src="../../../static/img/common/getTicketBg.jpg" class="bigImg"></image>
<!-- <image src="../../../static/img/common/getTicketBg.jpg" class="bigImg"></image> -->
<view class="title">获取电子门票</view>
<!-- 企业微信流程 -->
<view v-if="showCompany">
......
static/img/coupon/coupon.jpg

160 KB | W: | H:

static/img/coupon/coupon.jpg

115 KB | W: | H:

static/img/coupon/coupon.jpg
static/img/coupon/coupon.jpg
static/img/coupon/coupon.jpg
static/img/coupon/coupon.jpg
  • 2-up
  • Swipe
  • Onion skin
## 1.3.5(2022-01-24)
- 优化 size 属性可以传入不带单位的字符串数值
## 1.3.4(2022-01-24)
- 优化 size 支持其他单位
## 1.3.3(2022-01-17)
- 修复 nvue 有些图标不显示的bug,兼容老版本图标
## 1.3.2(2021-12-01)
- 优化 示例可复制图标名称
## 1.3.1(2021-11-23)
- 优化 兼容旧组件 type 值
## 1.3.0(2021-11-19)
- 新增 更多图标
- 优化 自定义图标使用方式
- 优化 组件UI,并提供设计资源,详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-icons](https://uniapp.dcloud.io/component/uniui/uni-icons)
## 1.1.7(2021-11-08)
## 1.2.0(2021-07-30)
- 组件兼容 vue3,如何创建vue3项目,详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.1.5(2021-05-12)
- 新增 组件示例地址
## 1.1.4(2021-02-05)
- 调整为uni_modules目录规范
export default {
"id": "2852637",
"name": "uniui图标库",
"font_family": "uniicons",
"css_prefix_text": "uniui-",
"description": "",
"glyphs": [
{
"icon_id": "25027049",
"name": "yanse",
"font_class": "color",
"unicode": "e6cf",
"unicode_decimal": 59087
},
{
"icon_id": "25027048",
"name": "wallet",
"font_class": "wallet",
"unicode": "e6b1",
"unicode_decimal": 59057
},
{
"icon_id": "25015720",
"name": "settings-filled",
"font_class": "settings-filled",
"unicode": "e6ce",
"unicode_decimal": 59086
},
{
"icon_id": "25015434",
"name": "shimingrenzheng-filled",
"font_class": "auth-filled",
"unicode": "e6cc",
"unicode_decimal": 59084
},
{
"icon_id": "24934246",
"name": "shop-filled",
"font_class": "shop-filled",
"unicode": "e6cd",
"unicode_decimal": 59085
},
{
"icon_id": "24934159",
"name": "staff-filled-01",
"font_class": "staff-filled",
"unicode": "e6cb",
"unicode_decimal": 59083
},
{
"icon_id": "24932461",
"name": "VIP-filled",
"font_class": "vip-filled",
"unicode": "e6c6",
"unicode_decimal": 59078
},
{
"icon_id": "24932462",
"name": "plus_circle_fill",
"font_class": "plus-filled",
"unicode": "e6c7",
"unicode_decimal": 59079
},
{
"icon_id": "24932463",
"name": "folder_add-filled",
"font_class": "folder-add-filled",
"unicode": "e6c8",
"unicode_decimal": 59080
},
{
"icon_id": "24932464",
"name": "yanse-filled",
"font_class": "color-filled",
"unicode": "e6c9",
"unicode_decimal": 59081
},
{
"icon_id": "24932465",
"name": "tune-filled",
"font_class": "tune-filled",
"unicode": "e6ca",
"unicode_decimal": 59082
},
{
"icon_id": "24932455",
"name": "a-rilidaka-filled",
"font_class": "calendar-filled",
"unicode": "e6c0",
"unicode_decimal": 59072
},
{
"icon_id": "24932456",
"name": "notification-filled",
"font_class": "notification-filled",
"unicode": "e6c1",
"unicode_decimal": 59073
},
{
"icon_id": "24932457",
"name": "wallet-filled",
"font_class": "wallet-filled",
"unicode": "e6c2",
"unicode_decimal": 59074
},
{
"icon_id": "24932458",
"name": "paihangbang-filled",
"font_class": "medal-filled",
"unicode": "e6c3",
"unicode_decimal": 59075
},
{
"icon_id": "24932459",
"name": "gift-filled",
"font_class": "gift-filled",
"unicode": "e6c4",
"unicode_decimal": 59076
},
{
"icon_id": "24932460",
"name": "fire-filled",
"font_class": "fire-filled",
"unicode": "e6c5",
"unicode_decimal": 59077
},
{
"icon_id": "24928001",
"name": "refreshempty",
"font_class": "refreshempty",
"unicode": "e6bf",
"unicode_decimal": 59071
},
{
"icon_id": "24926853",
"name": "location-ellipse",
"font_class": "location-filled",
"unicode": "e6af",
"unicode_decimal": 59055
},
{
"icon_id": "24926735",
"name": "person-filled",
"font_class": "person-filled",
"unicode": "e69d",
"unicode_decimal": 59037
},
{
"icon_id": "24926703",
"name": "personadd-filled",
"font_class": "personadd-filled",
"unicode": "e698",
"unicode_decimal": 59032
},
{
"icon_id": "24923351",
"name": "back",
"font_class": "back",
"unicode": "e6b9",
"unicode_decimal": 59065
},
{
"icon_id": "24923352",
"name": "forward",
"font_class": "forward",
"unicode": "e6ba",
"unicode_decimal": 59066
},
{
"icon_id": "24923353",
"name": "arrowthinright",
"font_class": "arrow-right",
"unicode": "e6bb",
"unicode_decimal": 59067
},
{
"icon_id": "24923353",
"name": "arrowthinright",
"font_class": "arrowthinright",
"unicode": "e6bb",
"unicode_decimal": 59067
},
{
"icon_id": "24923354",
"name": "arrowthinleft",
"font_class": "arrow-left",
"unicode": "e6bc",
"unicode_decimal": 59068
},
{
"icon_id": "24923354",
"name": "arrowthinleft",
"font_class": "arrowthinleft",
"unicode": "e6bc",
"unicode_decimal": 59068
},
{
"icon_id": "24923355",
"name": "arrowthinup",
"font_class": "arrow-up",
"unicode": "e6bd",
"unicode_decimal": 59069
},
{
"icon_id": "24923355",
"name": "arrowthinup",
"font_class": "arrowthinup",
"unicode": "e6bd",
"unicode_decimal": 59069
},
{
"icon_id": "24923356",
"name": "arrowthindown",
"font_class": "arrow-down",
"unicode": "e6be",
"unicode_decimal": 59070
},{
"icon_id": "24923356",
"name": "arrowthindown",
"font_class": "arrowthindown",
"unicode": "e6be",
"unicode_decimal": 59070
},
{
"icon_id": "24923349",
"name": "arrowdown",
"font_class": "bottom",
"unicode": "e6b8",
"unicode_decimal": 59064
},{
"icon_id": "24923349",
"name": "arrowdown",
"font_class": "arrowdown",
"unicode": "e6b8",
"unicode_decimal": 59064
},
{
"icon_id": "24923346",
"name": "arrowright",
"font_class": "right",
"unicode": "e6b5",
"unicode_decimal": 59061
},
{
"icon_id": "24923346",
"name": "arrowright",
"font_class": "arrowright",
"unicode": "e6b5",
"unicode_decimal": 59061
},
{
"icon_id": "24923347",
"name": "arrowup",
"font_class": "top",
"unicode": "e6b6",
"unicode_decimal": 59062
},
{
"icon_id": "24923347",
"name": "arrowup",
"font_class": "arrowup",
"unicode": "e6b6",
"unicode_decimal": 59062
},
{
"icon_id": "24923348",
"name": "arrowleft",
"font_class": "left",
"unicode": "e6b7",
"unicode_decimal": 59063
},
{
"icon_id": "24923348",
"name": "arrowleft",
"font_class": "arrowleft",
"unicode": "e6b7",
"unicode_decimal": 59063
},
{
"icon_id": "24923334",
"name": "eye",
"font_class": "eye",
"unicode": "e651",
"unicode_decimal": 58961
},
{
"icon_id": "24923335",
"name": "eye-filled",
"font_class": "eye-filled",
"unicode": "e66a",
"unicode_decimal": 58986
},
{
"icon_id": "24923336",
"name": "eye-slash",
"font_class": "eye-slash",
"unicode": "e6b3",
"unicode_decimal": 59059
},
{
"icon_id": "24923337",
"name": "eye-slash-filled",
"font_class": "eye-slash-filled",
"unicode": "e6b4",
"unicode_decimal": 59060
},
{
"icon_id": "24923305",
"name": "info-filled",
"font_class": "info-filled",
"unicode": "e649",
"unicode_decimal": 58953
},
{
"icon_id": "24923299",
"name": "reload-01",
"font_class": "reload",
"unicode": "e6b2",
"unicode_decimal": 59058
},
{
"icon_id": "24923195",
"name": "mic_slash_fill",
"font_class": "micoff-filled",
"unicode": "e6b0",
"unicode_decimal": 59056
},
{
"icon_id": "24923165",
"name": "map-pin-ellipse",
"font_class": "map-pin-ellipse",
"unicode": "e6ac",
"unicode_decimal": 59052
},
{
"icon_id": "24923166",
"name": "map-pin",
"font_class": "map-pin",
"unicode": "e6ad",
"unicode_decimal": 59053
},
{
"icon_id": "24923167",
"name": "location",
"font_class": "location",
"unicode": "e6ae",
"unicode_decimal": 59054
},
{
"icon_id": "24923064",
"name": "starhalf",
"font_class": "starhalf",
"unicode": "e683",
"unicode_decimal": 59011
},
{
"icon_id": "24923065",
"name": "star",
"font_class": "star",
"unicode": "e688",
"unicode_decimal": 59016
},
{
"icon_id": "24923066",
"name": "star-filled",
"font_class": "star-filled",
"unicode": "e68f",
"unicode_decimal": 59023
},
{
"icon_id": "24899646",
"name": "a-rilidaka",
"font_class": "calendar",
"unicode": "e6a0",
"unicode_decimal": 59040
},
{
"icon_id": "24899647",
"name": "fire",
"font_class": "fire",
"unicode": "e6a1",
"unicode_decimal": 59041
},
{
"icon_id": "24899648",
"name": "paihangbang",
"font_class": "medal",
"unicode": "e6a2",
"unicode_decimal": 59042
},
{
"icon_id": "24899649",
"name": "font",
"font_class": "font",
"unicode": "e6a3",
"unicode_decimal": 59043
},
{
"icon_id": "24899650",
"name": "gift",
"font_class": "gift",
"unicode": "e6a4",
"unicode_decimal": 59044
},
{
"icon_id": "24899651",
"name": "link",
"font_class": "link",
"unicode": "e6a5",
"unicode_decimal": 59045
},
{
"icon_id": "24899652",
"name": "notification",
"font_class": "notification",
"unicode": "e6a6",
"unicode_decimal": 59046
},
{
"icon_id": "24899653",
"name": "staff",
"font_class": "staff",
"unicode": "e6a7",
"unicode_decimal": 59047
},
{
"icon_id": "24899654",
"name": "VIP",
"font_class": "vip",
"unicode": "e6a8",
"unicode_decimal": 59048
},
{
"icon_id": "24899655",
"name": "folder_add",
"font_class": "folder-add",
"unicode": "e6a9",
"unicode_decimal": 59049
},
{
"icon_id": "24899656",
"name": "tune",
"font_class": "tune",
"unicode": "e6aa",
"unicode_decimal": 59050
},
{
"icon_id": "24899657",
"name": "shimingrenzheng",
"font_class": "auth",
"unicode": "e6ab",
"unicode_decimal": 59051
},
{
"icon_id": "24899565",
"name": "person",
"font_class": "person",
"unicode": "e699",
"unicode_decimal": 59033
},
{
"icon_id": "24899566",
"name": "email-filled",
"font_class": "email-filled",
"unicode": "e69a",
"unicode_decimal": 59034
},
{
"icon_id": "24899567",
"name": "phone-filled",
"font_class": "phone-filled",
"unicode": "e69b",
"unicode_decimal": 59035
},
{
"icon_id": "24899568",
"name": "phone",
"font_class": "phone",
"unicode": "e69c",
"unicode_decimal": 59036
},
{
"icon_id": "24899570",
"name": "email",
"font_class": "email",
"unicode": "e69e",
"unicode_decimal": 59038
},
{
"icon_id": "24899571",
"name": "personadd",
"font_class": "personadd",
"unicode": "e69f",
"unicode_decimal": 59039
},
{
"icon_id": "24899558",
"name": "chatboxes-filled",
"font_class": "chatboxes-filled",
"unicode": "e692",
"unicode_decimal": 59026
},
{
"icon_id": "24899559",
"name": "contact",
"font_class": "contact",
"unicode": "e693",
"unicode_decimal": 59027
},
{
"icon_id": "24899560",
"name": "chatbubble-filled",
"font_class": "chatbubble-filled",
"unicode": "e694",
"unicode_decimal": 59028
},
{
"icon_id": "24899561",
"name": "contact-filled",
"font_class": "contact-filled",
"unicode": "e695",
"unicode_decimal": 59029
},
{
"icon_id": "24899562",
"name": "chatboxes",
"font_class": "chatboxes",
"unicode": "e696",
"unicode_decimal": 59030
},
{
"icon_id": "24899563",
"name": "chatbubble",
"font_class": "chatbubble",
"unicode": "e697",
"unicode_decimal": 59031
},
{
"icon_id": "24881290",
"name": "upload-filled",
"font_class": "upload-filled",
"unicode": "e68e",
"unicode_decimal": 59022
},
{
"icon_id": "24881292",
"name": "upload",
"font_class": "upload",
"unicode": "e690",
"unicode_decimal": 59024
},
{
"icon_id": "24881293",
"name": "weixin",
"font_class": "weixin",
"unicode": "e691",
"unicode_decimal": 59025
},
{
"icon_id": "24881274",
"name": "compose",
"font_class": "compose",
"unicode": "e67f",
"unicode_decimal": 59007
},
{
"icon_id": "24881275",
"name": "qq",
"font_class": "qq",
"unicode": "e680",
"unicode_decimal": 59008
},
{
"icon_id": "24881276",
"name": "download-filled",
"font_class": "download-filled",
"unicode": "e681",
"unicode_decimal": 59009
},
{
"icon_id": "24881277",
"name": "pengyouquan",
"font_class": "pyq",
"unicode": "e682",
"unicode_decimal": 59010
},
{
"icon_id": "24881279",
"name": "sound",
"font_class": "sound",
"unicode": "e684",
"unicode_decimal": 59012
},
{
"icon_id": "24881280",
"name": "trash-filled",
"font_class": "trash-filled",
"unicode": "e685",
"unicode_decimal": 59013
},
{
"icon_id": "24881281",
"name": "sound-filled",
"font_class": "sound-filled",
"unicode": "e686",
"unicode_decimal": 59014
},
{
"icon_id": "24881282",
"name": "trash",
"font_class": "trash",
"unicode": "e687",
"unicode_decimal": 59015
},
{
"icon_id": "24881284",
"name": "videocam-filled",
"font_class": "videocam-filled",
"unicode": "e689",
"unicode_decimal": 59017
},
{
"icon_id": "24881285",
"name": "spinner-cycle",
"font_class": "spinner-cycle",
"unicode": "e68a",
"unicode_decimal": 59018
},
{
"icon_id": "24881286",
"name": "weibo",
"font_class": "weibo",
"unicode": "e68b",
"unicode_decimal": 59019
},
{
"icon_id": "24881288",
"name": "videocam",
"font_class": "videocam",
"unicode": "e68c",
"unicode_decimal": 59020
},
{
"icon_id": "24881289",
"name": "download",
"font_class": "download",
"unicode": "e68d",
"unicode_decimal": 59021
},
{
"icon_id": "24879601",
"name": "help",
"font_class": "help",
"unicode": "e679",
"unicode_decimal": 59001
},
{
"icon_id": "24879602",
"name": "navigate-filled",
"font_class": "navigate-filled",
"unicode": "e67a",
"unicode_decimal": 59002
},
{
"icon_id": "24879603",
"name": "plusempty",
"font_class": "plusempty",
"unicode": "e67b",
"unicode_decimal": 59003
},
{
"icon_id": "24879604",
"name": "smallcircle",
"font_class": "smallcircle",
"unicode": "e67c",
"unicode_decimal": 59004
},
{
"icon_id": "24879605",
"name": "minus-filled",
"font_class": "minus-filled",
"unicode": "e67d",
"unicode_decimal": 59005
},
{
"icon_id": "24879606",
"name": "micoff",
"font_class": "micoff",
"unicode": "e67e",
"unicode_decimal": 59006
},
{
"icon_id": "24879588",
"name": "closeempty",
"font_class": "closeempty",
"unicode": "e66c",
"unicode_decimal": 58988
},
{
"icon_id": "24879589",
"name": "clear",
"font_class": "clear",
"unicode": "e66d",
"unicode_decimal": 58989
},
{
"icon_id": "24879590",
"name": "navigate",
"font_class": "navigate",
"unicode": "e66e",
"unicode_decimal": 58990
},
{
"icon_id": "24879591",
"name": "minus",
"font_class": "minus",
"unicode": "e66f",
"unicode_decimal": 58991
},
{
"icon_id": "24879592",
"name": "image",
"font_class": "image",
"unicode": "e670",
"unicode_decimal": 58992
},
{
"icon_id": "24879593",
"name": "mic",
"font_class": "mic",
"unicode": "e671",
"unicode_decimal": 58993
},
{
"icon_id": "24879594",
"name": "paperplane",
"font_class": "paperplane",
"unicode": "e672",
"unicode_decimal": 58994
},
{
"icon_id": "24879595",
"name": "close",
"font_class": "close",
"unicode": "e673",
"unicode_decimal": 58995
},
{
"icon_id": "24879596",
"name": "help-filled",
"font_class": "help-filled",
"unicode": "e674",
"unicode_decimal": 58996
},
{
"icon_id": "24879597",
"name": "plus-filled",
"font_class": "paperplane-filled",
"unicode": "e675",
"unicode_decimal": 58997
},
{
"icon_id": "24879598",
"name": "plus",
"font_class": "plus",
"unicode": "e676",
"unicode_decimal": 58998
},
{
"icon_id": "24879599",
"name": "mic-filled",
"font_class": "mic-filled",
"unicode": "e677",
"unicode_decimal": 58999
},
{
"icon_id": "24879600",
"name": "image-filled",
"font_class": "image-filled",
"unicode": "e678",
"unicode_decimal": 59000
},
{
"icon_id": "24855900",
"name": "locked-filled",
"font_class": "locked-filled",
"unicode": "e668",
"unicode_decimal": 58984
},
{
"icon_id": "24855901",
"name": "info",
"font_class": "info",
"unicode": "e669",
"unicode_decimal": 58985
},
{
"icon_id": "24855903",
"name": "locked",
"font_class": "locked",
"unicode": "e66b",
"unicode_decimal": 58987
},
{
"icon_id": "24855884",
"name": "camera-filled",
"font_class": "camera-filled",
"unicode": "e658",
"unicode_decimal": 58968
},
{
"icon_id": "24855885",
"name": "chat-filled",
"font_class": "chat-filled",
"unicode": "e659",
"unicode_decimal": 58969
},
{
"icon_id": "24855886",
"name": "camera",
"font_class": "camera",
"unicode": "e65a",
"unicode_decimal": 58970
},
{
"icon_id": "24855887",
"name": "circle",
"font_class": "circle",
"unicode": "e65b",
"unicode_decimal": 58971
},
{
"icon_id": "24855888",
"name": "checkmarkempty",
"font_class": "checkmarkempty",
"unicode": "e65c",
"unicode_decimal": 58972
},
{
"icon_id": "24855889",
"name": "chat",
"font_class": "chat",
"unicode": "e65d",
"unicode_decimal": 58973
},
{
"icon_id": "24855890",
"name": "circle-filled",
"font_class": "circle-filled",
"unicode": "e65e",
"unicode_decimal": 58974
},
{
"icon_id": "24855891",
"name": "flag",
"font_class": "flag",
"unicode": "e65f",
"unicode_decimal": 58975
},
{
"icon_id": "24855892",
"name": "flag-filled",
"font_class": "flag-filled",
"unicode": "e660",
"unicode_decimal": 58976
},
{
"icon_id": "24855893",
"name": "gear-filled",
"font_class": "gear-filled",
"unicode": "e661",
"unicode_decimal": 58977
},
{
"icon_id": "24855894",
"name": "home",
"font_class": "home",
"unicode": "e662",
"unicode_decimal": 58978
},
{
"icon_id": "24855895",
"name": "home-filled",
"font_class": "home-filled",
"unicode": "e663",
"unicode_decimal": 58979
},
{
"icon_id": "24855896",
"name": "gear",
"font_class": "gear",
"unicode": "e664",
"unicode_decimal": 58980
},
{
"icon_id": "24855897",
"name": "smallcircle-filled",
"font_class": "smallcircle-filled",
"unicode": "e665",
"unicode_decimal": 58981
},
{
"icon_id": "24855898",
"name": "map-filled",
"font_class": "map-filled",
"unicode": "e666",
"unicode_decimal": 58982
},
{
"icon_id": "24855899",
"name": "map",
"font_class": "map",
"unicode": "e667",
"unicode_decimal": 58983
},
{
"icon_id": "24855825",
"name": "refresh-filled",
"font_class": "refresh-filled",
"unicode": "e656",
"unicode_decimal": 58966
},
{
"icon_id": "24855826",
"name": "refresh",
"font_class": "refresh",
"unicode": "e657",
"unicode_decimal": 58967
},
{
"icon_id": "24855808",
"name": "cloud-upload",
"font_class": "cloud-upload",
"unicode": "e645",
"unicode_decimal": 58949
},
{
"icon_id": "24855809",
"name": "cloud-download-filled",
"font_class": "cloud-download-filled",
"unicode": "e646",
"unicode_decimal": 58950
},
{
"icon_id": "24855810",
"name": "cloud-download",
"font_class": "cloud-download",
"unicode": "e647",
"unicode_decimal": 58951
},
{
"icon_id": "24855811",
"name": "cloud-upload-filled",
"font_class": "cloud-upload-filled",
"unicode": "e648",
"unicode_decimal": 58952
},
{
"icon_id": "24855813",
"name": "redo",
"font_class": "redo",
"unicode": "e64a",
"unicode_decimal": 58954
},
{
"icon_id": "24855814",
"name": "images-filled",
"font_class": "images-filled",
"unicode": "e64b",
"unicode_decimal": 58955
},
{
"icon_id": "24855815",
"name": "undo-filled",
"font_class": "undo-filled",
"unicode": "e64c",
"unicode_decimal": 58956
},
{
"icon_id": "24855816",
"name": "more",
"font_class": "more",
"unicode": "e64d",
"unicode_decimal": 58957
},
{
"icon_id": "24855817",
"name": "more-filled",
"font_class": "more-filled",
"unicode": "e64e",
"unicode_decimal": 58958
},
{
"icon_id": "24855818",
"name": "undo",
"font_class": "undo",
"unicode": "e64f",
"unicode_decimal": 58959
},
{
"icon_id": "24855819",
"name": "images",
"font_class": "images",
"unicode": "e650",
"unicode_decimal": 58960
},
{
"icon_id": "24855821",
"name": "paperclip",
"font_class": "paperclip",
"unicode": "e652",
"unicode_decimal": 58962
},
{
"icon_id": "24855822",
"name": "settings",
"font_class": "settings",
"unicode": "e653",
"unicode_decimal": 58963
},
{
"icon_id": "24855823",
"name": "search",
"font_class": "search",
"unicode": "e654",
"unicode_decimal": 58964
},
{
"icon_id": "24855824",
"name": "redo-filled",
"font_class": "redo-filled",
"unicode": "e655",
"unicode_decimal": 58965
},
{
"icon_id": "24841702",
"name": "list",
"font_class": "list",
"unicode": "e644",
"unicode_decimal": 58948
},
{
"icon_id": "24841489",
"name": "mail-open-filled",
"font_class": "mail-open-filled",
"unicode": "e63a",
"unicode_decimal": 58938
},
{
"icon_id": "24841491",
"name": "hand-thumbsdown-filled",
"font_class": "hand-down-filled",
"unicode": "e63c",
"unicode_decimal": 58940
},
{
"icon_id": "24841492",
"name": "hand-thumbsdown",
"font_class": "hand-down",
"unicode": "e63d",
"unicode_decimal": 58941
},
{
"icon_id": "24841493",
"name": "hand-thumbsup-filled",
"font_class": "hand-up-filled",
"unicode": "e63e",
"unicode_decimal": 58942
},
{
"icon_id": "24841494",
"name": "hand-thumbsup",
"font_class": "hand-up",
"unicode": "e63f",
"unicode_decimal": 58943
},
{
"icon_id": "24841496",
"name": "heart-filled",
"font_class": "heart-filled",
"unicode": "e641",
"unicode_decimal": 58945
},
{
"icon_id": "24841498",
"name": "mail-open",
"font_class": "mail-open",
"unicode": "e643",
"unicode_decimal": 58947
},
{
"icon_id": "24841488",
"name": "heart",
"font_class": "heart",
"unicode": "e639",
"unicode_decimal": 58937
},
{
"icon_id": "24839963",
"name": "loop",
"font_class": "loop",
"unicode": "e633",
"unicode_decimal": 58931
},
{
"icon_id": "24839866",
"name": "pulldown",
"font_class": "pulldown",
"unicode": "e632",
"unicode_decimal": 58930
},
{
"icon_id": "24813798",
"name": "scan",
"font_class": "scan",
"unicode": "e62a",
"unicode_decimal": 58922
},
{
"icon_id": "24813786",
"name": "bars",
"font_class": "bars",
"unicode": "e627",
"unicode_decimal": 58919
},
{
"icon_id": "24813788",
"name": "cart-filled",
"font_class": "cart-filled",
"unicode": "e629",
"unicode_decimal": 58921
},
{
"icon_id": "24813790",
"name": "checkbox",
"font_class": "checkbox",
"unicode": "e62b",
"unicode_decimal": 58923
},
{
"icon_id": "24813791",
"name": "checkbox-filled",
"font_class": "checkbox-filled",
"unicode": "e62c",
"unicode_decimal": 58924
},
{
"icon_id": "24813794",
"name": "shop",
"font_class": "shop",
"unicode": "e62f",
"unicode_decimal": 58927
},
{
"icon_id": "24813795",
"name": "headphones",
"font_class": "headphones",
"unicode": "e630",
"unicode_decimal": 58928
},
{
"icon_id": "24813796",
"name": "cart",
"font_class": "cart",
"unicode": "e631",
"unicode_decimal": 58929
}
]
}
<template>
<!-- #ifdef APP-NVUE -->
<text :style="{ color: color, 'font-size': iconSize }" class="uni-icons" @click="_onClick">{{unicode}}</text>
<!-- #endif -->
<!-- #ifndef APP-NVUE -->
<text :style="{ color: color, 'font-size': iconSize }" class="uni-icons" :class="['uniui-'+type,customPrefix,customPrefix?type:'']" @click="_onClick"></text>
<!-- #endif -->
</template>
<script>
import icons from './icons.js';
const getVal = (val) => {
const reg = /^[0-9]*$/g
return (typeof val === 'number' || reg.test(val) )? val + 'px' : val;
}
// #ifdef APP-NVUE
var domModule = weex.requireModule('dom');
import iconUrl from './uniicons.ttf'
domModule.addRule('fontFace', {
'fontFamily': "uniicons",
'src': "url('"+iconUrl+"')"
});
// #endif
/**
* Icons 图标
* @description 用于展示 icons 图标
* @tutorial https://ext.dcloud.net.cn/plugin?id=28
* @property {Number} size 图标大小
* @property {String} type 图标图案,参考示例
* @property {String} color 图标颜色
* @property {String} customPrefix 自定义图标
* @event {Function} click 点击 Icon 触发事件
*/
export default {
name: 'UniIcons',
emits:['click'],
props: {
type: {
type: String,
default: ''
},
color: {
type: String,
default: '#333333'
},
size: {
type: [Number, String],
default: 16
},
customPrefix:{
type: String,
default: ''
}
},
data() {
return {
icons: icons.glyphs
}
},
computed:{
unicode(){
let code = this.icons.find(v=>v.font_class === this.type)
if(code){
return unescape(`%u${code.unicode}`)
}
return ''
},
iconSize(){
return getVal(this.size)
}
},
methods: {
_onClick() {
this.$emit('click')
}
}
}
</script>
<style lang="scss">
/* #ifndef APP-NVUE */
@import './uniicons.css';
@font-face {
font-family: uniicons;
src: url('./uniicons.ttf') format('truetype');
}
/* #endif */
.uni-icons {
font-family: uniicons;
text-decoration: none;
text-align: center;
}
</style>
.uniui-color:before {
content: "\e6cf";
}
.uniui-wallet:before {
content: "\e6b1";
}
.uniui-settings-filled:before {
content: "\e6ce";
}
.uniui-auth-filled:before {
content: "\e6cc";
}
.uniui-shop-filled:before {
content: "\e6cd";
}
.uniui-staff-filled:before {
content: "\e6cb";
}
.uniui-vip-filled:before {
content: "\e6c6";
}
.uniui-plus-filled:before {
content: "\e6c7";
}
.uniui-folder-add-filled:before {
content: "\e6c8";
}
.uniui-color-filled:before {
content: "\e6c9";
}
.uniui-tune-filled:before {
content: "\e6ca";
}
.uniui-calendar-filled:before {
content: "\e6c0";
}
.uniui-notification-filled:before {
content: "\e6c1";
}
.uniui-wallet-filled:before {
content: "\e6c2";
}
.uniui-medal-filled:before {
content: "\e6c3";
}
.uniui-gift-filled:before {
content: "\e6c4";
}
.uniui-fire-filled:before {
content: "\e6c5";
}
.uniui-refreshempty:before {
content: "\e6bf";
}
.uniui-location-filled:before {
content: "\e6af";
}
.uniui-person-filled:before {
content: "\e69d";
}
.uniui-personadd-filled:before {
content: "\e698";
}
.uniui-back:before {
content: "\e6b9";
}
.uniui-forward:before {
content: "\e6ba";
}
.uniui-arrow-right:before {
content: "\e6bb";
}
.uniui-arrowthinright:before {
content: "\e6bb";
}
.uniui-arrow-left:before {
content: "\e6bc";
}
.uniui-arrowthinleft:before {
content: "\e6bc";
}
.uniui-arrow-up:before {
content: "\e6bd";
}
.uniui-arrowthinup:before {
content: "\e6bd";
}
.uniui-arrow-down:before {
content: "\e6be";
}
.uniui-arrowthindown:before {
content: "\e6be";
}
.uniui-bottom:before {
content: "\e6b8";
}
.uniui-arrowdown:before {
content: "\e6b8";
}
.uniui-right:before {
content: "\e6b5";
}
.uniui-arrowright:before {
content: "\e6b5";
}
.uniui-top:before {
content: "\e6b6";
}
.uniui-arrowup:before {
content: "\e6b6";
}
.uniui-left:before {
content: "\e6b7";
}
.uniui-arrowleft:before {
content: "\e6b7";
}
.uniui-eye:before {
content: "\e651";
}
.uniui-eye-filled:before {
content: "\e66a";
}
.uniui-eye-slash:before {
content: "\e6b3";
}
.uniui-eye-slash-filled:before {
content: "\e6b4";
}
.uniui-info-filled:before {
content: "\e649";
}
.uniui-reload:before {
content: "\e6b2";
}
.uniui-micoff-filled:before {
content: "\e6b0";
}
.uniui-map-pin-ellipse:before {
content: "\e6ac";
}
.uniui-map-pin:before {
content: "\e6ad";
}
.uniui-location:before {
content: "\e6ae";
}
.uniui-starhalf:before {
content: "\e683";
}
.uniui-star:before {
content: "\e688";
}
.uniui-star-filled:before {
content: "\e68f";
}
.uniui-calendar:before {
content: "\e6a0";
}
.uniui-fire:before {
content: "\e6a1";
}
.uniui-medal:before {
content: "\e6a2";
}
.uniui-font:before {
content: "\e6a3";
}
.uniui-gift:before {
content: "\e6a4";
}
.uniui-link:before {
content: "\e6a5";
}
.uniui-notification:before {
content: "\e6a6";
}
.uniui-staff:before {
content: "\e6a7";
}
.uniui-vip:before {
content: "\e6a8";
}
.uniui-folder-add:before {
content: "\e6a9";
}
.uniui-tune:before {
content: "\e6aa";
}
.uniui-auth:before {
content: "\e6ab";
}
.uniui-person:before {
content: "\e699";
}
.uniui-email-filled:before {
content: "\e69a";
}
.uniui-phone-filled:before {
content: "\e69b";
}
.uniui-phone:before {
content: "\e69c";
}
.uniui-email:before {
content: "\e69e";
}
.uniui-personadd:before {
content: "\e69f";
}
.uniui-chatboxes-filled:before {
content: "\e692";
}
.uniui-contact:before {
content: "\e693";
}
.uniui-chatbubble-filled:before {
content: "\e694";
}
.uniui-contact-filled:before {
content: "\e695";
}
.uniui-chatboxes:before {
content: "\e696";
}
.uniui-chatbubble:before {
content: "\e697";
}
.uniui-upload-filled:before {
content: "\e68e";
}
.uniui-upload:before {
content: "\e690";
}
.uniui-weixin:before {
content: "\e691";
}
.uniui-compose:before {
content: "\e67f";
}
.uniui-qq:before {
content: "\e680";
}
.uniui-download-filled:before {
content: "\e681";
}
.uniui-pyq:before {
content: "\e682";
}
.uniui-sound:before {
content: "\e684";
}
.uniui-trash-filled:before {
content: "\e685";
}
.uniui-sound-filled:before {
content: "\e686";
}
.uniui-trash:before {
content: "\e687";
}
.uniui-videocam-filled:before {
content: "\e689";
}
.uniui-spinner-cycle:before {
content: "\e68a";
}
.uniui-weibo:before {
content: "\e68b";
}
.uniui-videocam:before {
content: "\e68c";
}
.uniui-download:before {
content: "\e68d";
}
.uniui-help:before {
content: "\e679";
}
.uniui-navigate-filled:before {
content: "\e67a";
}
.uniui-plusempty:before {
content: "\e67b";
}
.uniui-smallcircle:before {
content: "\e67c";
}
.uniui-minus-filled:before {
content: "\e67d";
}
.uniui-micoff:before {
content: "\e67e";
}
.uniui-closeempty:before {
content: "\e66c";
}
.uniui-clear:before {
content: "\e66d";
}
.uniui-navigate:before {
content: "\e66e";
}
.uniui-minus:before {
content: "\e66f";
}
.uniui-image:before {
content: "\e670";
}
.uniui-mic:before {
content: "\e671";
}
.uniui-paperplane:before {
content: "\e672";
}
.uniui-close:before {
content: "\e673";
}
.uniui-help-filled:before {
content: "\e674";
}
.uniui-paperplane-filled:before {
content: "\e675";
}
.uniui-plus:before {
content: "\e676";
}
.uniui-mic-filled:before {
content: "\e677";
}
.uniui-image-filled:before {
content: "\e678";
}
.uniui-locked-filled:before {
content: "\e668";
}
.uniui-info:before {
content: "\e669";
}
.uniui-locked:before {
content: "\e66b";
}
.uniui-camera-filled:before {
content: "\e658";
}
.uniui-chat-filled:before {
content: "\e659";
}
.uniui-camera:before {
content: "\e65a";
}
.uniui-circle:before {
content: "\e65b";
}
.uniui-checkmarkempty:before {
content: "\e65c";
}
.uniui-chat:before {
content: "\e65d";
}
.uniui-circle-filled:before {
content: "\e65e";
}
.uniui-flag:before {
content: "\e65f";
}
.uniui-flag-filled:before {
content: "\e660";
}
.uniui-gear-filled:before {
content: "\e661";
}
.uniui-home:before {
content: "\e662";
}
.uniui-home-filled:before {
content: "\e663";
}
.uniui-gear:before {
content: "\e664";
}
.uniui-smallcircle-filled:before {
content: "\e665";
}
.uniui-map-filled:before {
content: "\e666";
}
.uniui-map:before {
content: "\e667";
}
.uniui-refresh-filled:before {
content: "\e656";
}
.uniui-refresh:before {
content: "\e657";
}
.uniui-cloud-upload:before {
content: "\e645";
}
.uniui-cloud-download-filled:before {
content: "\e646";
}
.uniui-cloud-download:before {
content: "\e647";
}
.uniui-cloud-upload-filled:before {
content: "\e648";
}
.uniui-redo:before {
content: "\e64a";
}
.uniui-images-filled:before {
content: "\e64b";
}
.uniui-undo-filled:before {
content: "\e64c";
}
.uniui-more:before {
content: "\e64d";
}
.uniui-more-filled:before {
content: "\e64e";
}
.uniui-undo:before {
content: "\e64f";
}
.uniui-images:before {
content: "\e650";
}
.uniui-paperclip:before {
content: "\e652";
}
.uniui-settings:before {
content: "\e653";
}
.uniui-search:before {
content: "\e654";
}
.uniui-redo-filled:before {
content: "\e655";
}
.uniui-list:before {
content: "\e644";
}
.uniui-mail-open-filled:before {
content: "\e63a";
}
.uniui-hand-down-filled:before {
content: "\e63c";
}
.uniui-hand-down:before {
content: "\e63d";
}
.uniui-hand-up-filled:before {
content: "\e63e";
}
.uniui-hand-up:before {
content: "\e63f";
}
.uniui-heart-filled:before {
content: "\e641";
}
.uniui-mail-open:before {
content: "\e643";
}
.uniui-heart:before {
content: "\e639";
}
.uniui-loop:before {
content: "\e633";
}
.uniui-pulldown:before {
content: "\e632";
}
.uniui-scan:before {
content: "\e62a";
}
.uniui-bars:before {
content: "\e627";
}
.uniui-cart-filled:before {
content: "\e629";
}
.uniui-checkbox:before {
content: "\e62b";
}
.uniui-checkbox-filled:before {
content: "\e62c";
}
.uniui-shop:before {
content: "\e62f";
}
.uniui-headphones:before {
content: "\e630";
}
.uniui-cart:before {
content: "\e631";
}
{
"id": "uni-icons",
"displayName": "uni-icons 图标",
"version": "1.3.5",
"description": "图标组件,用于展示移动端常见的图标,可自定义颜色、大小。",
"keywords": [
"uni-ui",
"uniui",
"icon",
"图标"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": "^3.2.14"
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"category": [
"前端组件",
"通用组件"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
},
"uni_modules": {
"dependencies": ["uni-scss"],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}
\ No newline at end of file
## Icons 图标
> **组件名:uni-icons**
> 代码块: `uIcons`
用于展示 icons 图标 。
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-icons)
#### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839
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