feat: 首次提交
This commit is contained in:
peerless_hero
168
pages/component/basics/icon/icon.js
Normal file
168
pages/component/basics/icon/icon.js
Normal file
@ -0,0 +1,168 @@
|
||||
// 本文件由FirstUI授权予新疆天衡创新研究院有限公司（手机号：18 6 140 72 54 9，身份证尾号：5A07X5）专用，请尊重知识产权，勿私下传播，违者追究法律责任。
|
||||
export default [
|
||||
"addfriends",
|
||||
"addfriends-fill",
|
||||
"backspace",
|
||||
"backspace-fill",
|
||||
"bankcard",
|
||||
"bankcard-fill",
|
||||
"camera",
|
||||
"camera-fill",
|
||||
"captcha",
|
||||
"captcha-fill",
|
||||
"cart",
|
||||
"cart-fill",
|
||||
"classify",
|
||||
"classify-fill",
|
||||
"comment",
|
||||
"comment-fill",
|
||||
"community",
|
||||
"community-fill",
|
||||
"coupon",
|
||||
"coupon-fill",
|
||||
"delete",
|
||||
"delete-fill",
|
||||
"edit",
|
||||
"edit-fill",
|
||||
"fabulous",
|
||||
"fabulous-fill",
|
||||
"find",
|
||||
"find-fill",
|
||||
"help",
|
||||
"help-fill",
|
||||
"home",
|
||||
"home-fill",
|
||||
"idcard",
|
||||
"idcard-fill",
|
||||
"info",
|
||||
"info-fill",
|
||||
"invite",
|
||||
"invite-fill",
|
||||
"kefu",
|
||||
"kefu-fill",
|
||||
"like",
|
||||
"like-fill",
|
||||
"location",
|
||||
"location-fill",
|
||||
"lock",
|
||||
"lock-fill",
|
||||
"mail",
|
||||
"mail-fill",
|
||||
"message",
|
||||
"message-fill",
|
||||
"mobile",
|
||||
"mobile-fill",
|
||||
"more",
|
||||
"more-fill",
|
||||
"my",
|
||||
"my-fill",
|
||||
"notice",
|
||||
"notice-fill",
|
||||
"order",
|
||||
"order-fill",
|
||||
"picture",
|
||||
"picture-fill",
|
||||
"setup",
|
||||
"setup-fill",
|
||||
"share",
|
||||
"share-fill",
|
||||
"shop",
|
||||
"shop-fill",
|
||||
"star",
|
||||
"starhalf",
|
||||
"star-fill",
|
||||
"stepon",
|
||||
"stepon-fill",
|
||||
"wait",
|
||||
"wait-fill",
|
||||
"warning",
|
||||
"warning-fill",
|
||||
"plus",
|
||||
"plussign",
|
||||
"plussign-fill",
|
||||
"minus",
|
||||
"minussign",
|
||||
"minussign-fill",
|
||||
"close",
|
||||
"clear",
|
||||
"clear-fill",
|
||||
"checkbox-fill",
|
||||
"checkround",
|
||||
"checkbox",
|
||||
"check",
|
||||
"pulldown-fill",
|
||||
"pullup",
|
||||
"pullup-fill",
|
||||
"pulldown",
|
||||
"roundright-fill",
|
||||
"roundright",
|
||||
"arrowright",
|
||||
"arrowleft",
|
||||
"arrowdown",
|
||||
"left",
|
||||
"up",
|
||||
"right",
|
||||
"back",
|
||||
"top",
|
||||
"dropdown",
|
||||
"turningleft",
|
||||
"turningup",
|
||||
"turningright",
|
||||
"turningdown",
|
||||
"refresh",
|
||||
"loading",
|
||||
"search",
|
||||
"rotate",
|
||||
"screen",
|
||||
"signin",
|
||||
"calendar",
|
||||
"scan",
|
||||
"qrcode",
|
||||
"wallet",
|
||||
"telephone",
|
||||
"visible",
|
||||
"invisible",
|
||||
"menu",
|
||||
"operate",
|
||||
"slide",
|
||||
"list",
|
||||
"nonetwork",
|
||||
"partake",
|
||||
"qa",
|
||||
"barchart",
|
||||
"piechart",
|
||||
"linechart",
|
||||
"at",
|
||||
"face",
|
||||
"redpacket",
|
||||
"suspend",
|
||||
"link",
|
||||
"keyboard",
|
||||
"play",
|
||||
"video",
|
||||
"voice",
|
||||
"addressbook",
|
||||
"principal",
|
||||
"sina",
|
||||
"browser",
|
||||
"moments",
|
||||
"qq",
|
||||
"wechat",
|
||||
"balance",
|
||||
"bankcardpay",
|
||||
"wxpay",
|
||||
"alipay",
|
||||
"payment",
|
||||
"receive",
|
||||
"sendout",
|
||||
"evaluate",
|
||||
"aftersale",
|
||||
"warehouse",
|
||||
"transport",
|
||||
"delivery",
|
||||
"switch",
|
||||
"goods",
|
||||
"goods-fill",
|
||||
"",
|
||||
""
|
||||
]
|
||||
87
pages/component/basics/icon/icon.vue
Normal file
87
pages/component/basics/icon/icon.vue
Normal file
@ -0,0 +1,87 @@
|
||||
<!--本文件由FirstUI授权予新疆天衡创新研究院有限公司（手机号：1 86 1 40 72 549，身份证尾号：5A07X5）专用，请尊重知识产权，勿私下传播，违者追究法律责任。-->
|
||||
<template>
|
||||
<view class="fui-wrap">
|
||||
<view class="fui-page__hd">
|
||||
<view class="fui-page__title">Icon</view>
|
||||
<view class="fui-page__desc">Icon 图标，First UI字体图标库，可自行扩展。</view>
|
||||
</view>
|
||||
<view class="fui-page__bd fui-page__spacing">
|
||||
<fui-grid :columns="3" @click="getName">
|
||||
<fui-grid-item v-for="(item, index) in icons" :highlight="item!=''" :index="index" :key="index">
|
||||
<view class="fui-icon__item">
|
||||
<fui-icon :name="item"></fui-icon>
|
||||
<text class="fui-icon__name">{{ item }}</text>
|
||||
</view>
|
||||
</fui-grid-item>
|
||||
</fui-grid>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// #ifdef MP-BAIDU
|
||||
import {
|
||||
mapState
|
||||
} from 'vuex'
|
||||
// #endif
|
||||
import icons from './icon.js';
|
||||
import $fui from '@/components/firstui/fui-clipboard';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
icons: icons
|
||||
}
|
||||
},
|
||||
// #ifdef MP-BAIDU
|
||||
computed: mapState(['status']),
|
||||
// #endif
|
||||
methods: {
|
||||
getName(e) {
|
||||
const name = this.icons[e.detail.index]
|
||||
if (!name) return;
|
||||
// #ifdef MP-BAIDU
|
||||
if (this.status == 1) {
|
||||
$fui.getClipboardData(name, res => {
|
||||
this.fui.toast('图标名称复制成功');
|
||||
}, e);
|
||||
}
|
||||
// #endif
|
||||
|
||||
// #ifndef MP-BAIDU
|
||||
$fui.getClipboardData(name, res => {
|
||||
this.fui.toast('图标名称复制成功');
|
||||
}, e);
|
||||
// #endif
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 头条小程序组件内不能引入字体 */
|
||||
/* #ifdef MP-TOUTIAO */
|
||||
@font-face {
|
||||
font-family: 'fuiFont';
|
||||
src: url("~@/components/firstui/fui-icon/fui-icon.ttf") format("truetype");
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
page {
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
|
||||
.fui-icon__item {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.fui-icon__name {
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
padding-top: 16rpx;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user