This commit is contained in:
pengxiaolong
2025-05-21 17:03:19 +08:00
parent 829199a197
commit 0b9353de84
96 changed files with 9172 additions and 30 deletions

View File

@@ -0,0 +1,256 @@
const NationalDictionary = {
AD : "安道尔",
AE : "阿拉伯联合酋长国",
AF : "阿富汗",
AG : "安提瓜和巴布达",
AI : "安圭拉",
AL : "阿尔巴尼亚",
AM : "亚美尼亚",
AO : "安哥拉",
AQ : "南极洲",
AR : "阿根廷",
AS : "美属萨摩亚",
AT : "奥地利",
AU : "澳大利亚",
AW : "阿鲁巴",
AX : "奥兰群岛",
AZ : "阿塞拜疆",
BA : "波斯尼亚和黑塞哥维那",
BB : "巴巴多斯",
BD : "孟加拉国",
BE : "比利时",
BF : "布基纳法索",
BG : "保加利亚",
BH : "巴林",
BI : "布隆迪",
BJ : "贝宁",
BL : "圣巴泰勒米",
BM : "百慕大群岛",
BN : "文莱达鲁萨兰国",
BO : "玻利维亚",
BQ : "博奈尔、圣尤斯特歇斯和萨巴",
BR : "巴西",
BS : "巴哈马",
BT : "不丹",
BV : "布韦岛",
BW : "博茨瓦纳",
BY : "白俄罗斯",
BZ : "伯利兹",
CA : "加拿大",
CC : "科科斯(基林)群岛",
CD : "刚果民主共和国",
CF : "中非共和国",
CG : "刚果共和国",
CH : "瑞士",
CI : "科特迪瓦",
CK : "库克群岛",
CL : "智利",
CM : "喀麦隆",
CN : "中国",
CO : "哥伦比亚",
CR : "哥斯达黎加",
CU : "古巴",
CV : "佛得角",
CW : "库拉索",
CX : "圣诞岛",
CY : "塞浦路斯",
CZ : "捷克共和国",
DE : "德国",
DG : "迪戈加西亚岛",
DJ : "吉布提",
DK : "丹麦",
DM : "多米尼克",
DO : "多米尼加共和国",
DZ : "阿尔及利亚",
EC : "厄瓜多尔",
EE : "爱沙尼亚",
EG : "埃及",
EH : "西撒哈拉",
ER : "厄立特里亚",
ES : "西班牙",
ET : "埃塞俄比亚",
FI : "芬兰",
FJ : "斐济",
FK : "福克兰群岛",
FM : "密克罗尼西亚",
FO : "法罗群岛",
FR : "法国",
GA : "加蓬",
GB : "英国",
GD : "格林纳达",
GE : "格鲁吉亚",
GF : "法属圭亚那",
GG : "根西岛",
GH : "加纳",
GI : "直布罗陀",
GL : "格陵兰",
GM : "冈比亚",
GN : "几内亚",
GP : "瓜德罗普",
GQ : "赤道几内亚",
GR : "希腊",
GS : "南乔治亚和南桑德威奇群岛",
GT : "危地马拉",
GU : "关岛",
GW : "几内亚比绍",
GY : "圭亚那",
HK : "中国香港特别行政区",
HM : "赫德岛和麦克唐纳群岛",
HN : "洪都拉斯",
HR : "克罗地亚",
HT : "海地",
HU : "匈牙利",
ID : "印度尼西亚",
IE : "爱尔兰",
IL : "以色列",
IM : "马恩岛",
IN : "印度",
IO : "英属印度洋领地",
IQ : "伊拉克",
IR : "伊朗",
IS : "冰岛",
IT : "意大利",
JE : "泽西岛",
JM : "牙买加",
JO : "约旦",
JP : "日本",
KE : "肯尼亚",
KG : "吉尔吉斯斯坦",
KH : "柬埔寨",
KI : "基里巴斯",
KM : "科摩罗",
KN : "圣基茨和尼维斯",
KP : "朝鲜",
KR : "韩国",
KW : "科威特",
KY : "开曼群岛",
KZ : "哈萨克斯坦",
LA : "老挝",
LB : "黎巴嫩",
LC : "圣卢西亚",
LI : "列支敦士登",
LK : "斯里兰卡",
LR : "利比里亚",
LS : "莱索托",
LT : "立陶宛",
LU : "卢森堡",
LV : "拉脱维亚",
LY : "利比亚",
MA : "摩洛哥",
MC : "摩纳哥",
MD : "摩尔多瓦",
ME : "黑山",
MF : "圣马丁",
MG : "马达加斯加",
MH : "马绍尔群岛",
MK : "北马其顿",
ML : "马里",
MM : "缅甸",
MN : "蒙古",
MO : "中国澳门特别行政区",
MP : "北马里亚纳群岛",
MQ : "马提尼克",
MR : "毛里塔尼亚",
MS : "蒙特塞拉特",
MT : "马耳他",
MU : "毛里求斯",
MV : "马尔代夫",
MW : "马拉维",
MX : "墨西哥",
MY : "马来西亚",
MZ : "莫桑比克",
NA : "纳米比亚",
NC : "新喀里多尼亚",
NE : "尼日尔",
NF : "诺福克岛",
NG : "尼日利亚",
NI : "尼加拉瓜",
NL : "荷兰",
NO : "挪威",
NP : "尼泊尔",
NR : "瑙鲁",
NU : "纽埃",
NZ : "新西兰",
OM : "阿曼",
PA : "巴拿马",
PE : "秘鲁",
PF : "法属玻利尼西亚",
PG : "巴布亚新几内亚",
PH : "菲律宾",
PK : "巴基斯坦",
PL : "波兰",
PM : "圣皮埃尔和密克隆群岛",
PN : "皮特凯恩群岛",
PR : "波多黎各",
PS : "巴勒斯坦",
PT : "葡萄牙",
PW : "帕劳",
PY : "巴拉圭",
QA : "卡塔尔",
RE : "留尼汪",
RO : "罗马尼亚",
RS : "塞尔维亚",
RU : "俄罗斯",
RW : "卢旺达",
SA : "沙特阿拉伯",
SB : "索罗门群岛",
SC : "塞舌尔",
SD : "苏丹",
SE : "瑞典",
SG : "新加坡",
SI : "斯洛文尼亚",
SJ : "斯瓦尔巴和扬马延",
SK : "斯洛伐克",
SL : "塞拉利昂",
SM : "圣马利诺",
SN : "塞内加尔",
SO : "索马里",
SR : "苏里南",
SS : "南苏丹",
ST : "圣多美和普林西比",
SV : "萨尔瓦多",
SX : "荷属圣马丁",
SY : "叙利亚",
SZ : "斯威士兰",
TC : "特克斯和凯科斯群岛",
TD : "乍得",
TF : "法属南部领地",
TG : "多哥",
TH : "泰国",
TJ : "塔吉克斯坦",
TK : "托克劳群岛",
TL : "东帝汶",
TM : "土库曼斯坦",
TN : "突尼斯",
TO : "汤加",
TR : "土耳其",
TT : "特立尼达和多巴哥",
TV : "图瓦卢",
TW : "台湾",
TZ : "坦桑尼亚",
UA : "乌克兰",
UG : "乌干达",
UM : "美国本土外小岛屿",
US : "美国",
UY : "乌拉圭",
UZ : "乌兹别克斯坦",
VA : "梵蒂冈",
VC : "圣文森特",
VE : "委内瑞拉",
VG : "英属维尔京群岛",
VI : "美属维尔京群岛",
VN : "越南",
VU : "瓦努阿图",
WS : "萨摩亚",
YE : "也门",
YT : "马约特岛",
ZA : "南非",
ZM : "赞比亚",
ZW : "津巴布韦",
UK : "英国",
WF : "瓦利斯",
}
const countryNamesArray = Object.values(NationalDictionary);
export default countryNamesArray;

View File

@@ -24,12 +24,12 @@
</li>
</ul>
<view @touchmove.stop.prevent="disabledScroll"> </view>
<!-- <moduleSelect ref="createModule"></moduleSelect> -->
<NewAddedPk class="createModule" ref="createModule"></NewAddedPk>
</view>
</template>
<script setup>
// import moduleSelect from './moduleSelect.vue'
import NewAddedPk from '../../pages/NewAddedPk/NewAddedPk.vue'
import { getCurrentInstance, defineProps, onMounted, reactive, ref } from "vue";
let showMiddleButton = ref(false);
@@ -95,11 +95,11 @@ function setTabBar() {
tabList[middleIndex].middleClass = "mid-button";
}
}
const createModule = ref();
const createModule = ref()
function openPopupQuantity() {
createModule.value.open();
}
function openPopupQuantity() {
createModule.value.open()
}
//组件返回关闭指令
function closeSuccess() {
// addSuccess.value.close();
@@ -110,6 +110,12 @@ const disabledScroll = () => {
};
//tab点击事件
function handlePush(item, index) {
if (index === 2) {
//打开弹窗
// addSuccess.value.open();
openPopupQuantity()
return;
}
if (item.text === "消息") {
uni.navigateTo({ url: "/TUIKit/components/TUIConversation/index" });
}else {
@@ -148,7 +154,6 @@ function handlePush(item, index) {
position: relative;
position: fixed;
bottom: 0;
// left: 0;
z-index: 999;
background-size: contain;
width: 100vw;
@@ -160,7 +165,13 @@ function handlePush(item, index) {
padding: 0; //解决偏移
z-index: 0;
}
.createModule{
position: fixed;
bottom: 0;
right: 0;
z-index: 998;
width: 100vw;
}
.tab-list-default {
background-color: #ffffff;
border-top: 1px #dddddd solid;

View File

@@ -32,7 +32,14 @@
"style": {
"navigationBarTitleText": "设置"
}
},
{
"path": "pages/NewAddedPk/NewAddedPk",
"style": {
"navigationBarTitleText": "新增PK"
}
}
],
"subPackages": [
{
@@ -130,7 +137,6 @@
"pagePath": "pages/index/index",
"text": "聊天"
}
]
}
}

View File

@@ -0,0 +1,201 @@
<template>
<view v-if="Display" class="Mask" @click="open()">
<view @click.stop>
<view class="container" >
<image
class="Fork"
@click="open()"
src="../../static/Fork.png"
mode="scaleToFill"
/>
<view class="Title">发布新PK</view>
<view class="Individual">
<view class="NameAnchor">
<input class="NameAnchorcss" @input="NameAnchor" placeholder="主播名称" />
</view>
<view class="Gender">
<uni-combox
class="Gendercss"
:candidates="Gender"
placeholder="请选择性别"
v-model="gender"
></uni-combox>
</view>
</view>
<view class="Accountnumber">
<wht-select v-model="country" :options="options" placeholder="请选择国家" />
<view class="Coins">
<uni-number-box class="number-box" v-model="numberCoins"></uni-number-box>
</view>
</view>
<view class="Remarkscss" >
<uni-easyinput type="textarea" v-model="remarks" placeholder="备注"></uni-easyinput>
</view>
<view class="Publish">
<button @click="Publish()" class="Publishcss">发布</button>
</view>
</view>
</view>
</view>
</template>
<script>
import countryNamesArray from "../../components/NationalDictionary.js"
export default {
data() {
return {
gender: "",
Gender: ["男", "女"],
Country:countryNamesArray,
country: "",
nameAnchor: "",
numberCoins: "",
remarks: "",
Display: false,
options: [
{ label: '选项一', value: '1' },
{ label: '选项二', value: '2' },
{ label: '选项三', value: '3' }
]
};
},
onLoad() {
uni.getStorage({
key: "userinfo",
success: (res) => {
},
});
},
methods: {
handleOverlayClick(event) {
if (event.target === this.$el) {
this.Display = false;
}
},
open(){
if (this.Display) {
this.Display = false;
} else {
this.Display = true;
}
},
//获取主播名称
NameAnchor: function (event) {
this.nameAnchor = event.target.value;
},
Publish(){
console.log( this.nameAnchor, this.gender,this.country, this.numberCoins, this.remarks);
}
},
};
</script>
<style scoped>
.Mask{
width: 100vw;
height: 100vh;
background: #00000076;
display: flex;
flex-direction: column-reverse;
}
.container {
display: flex;
background-color: #fff;
flex-direction: column;
width: 100%;
height: 900rpx;
}
.Fork{
width: 50rpx;
height: 50rpx;
margin-top: 20rpx;
/* margin-bottom: 40rpx; */
margin-left: 90%;
}
.Title{
width: 100%;
height: 30rpx;
font-size: 50rpx;
font-weight: bold;
text-align: center;
margin-top: 40rpx;
margin-bottom: 40rpx;
}
.Individual{
display: flex;
/* justify-content: center; */
}
.NameAnchor{
margin: 40rpx;
}
.NameAnchorcss{
width: 300rpx;
height: 85rpx;
border: 1rpx solid #ccc;
border-radius: 10rpx;
text-align: center;
}
.Gender{
margin: 40rpx;
}
.Gendercss{
width: 300rpx;
height: 80rpx;
text-align: center;
}
.Accountnumber{
display: flex;
}
.Country{
}
.Countrycss{
margin: 40rpx;
width: 300rpx;
height: 65rpx;
text-align: center;
}
.Coins{
margin: 40rpx;
width: 300rpx;
height: 65rpx;
display: flex;
justify-content: center;
align-items: center;
}
.number-box {
text-align: center;
}
.Remarkscss{
width: 90%;
margin-top: 30rpx;
margin-left: 5%;
margin-right: 5%;
margin-bottom: 50rpx;
border-radius: 10rpx;
}
.Publish{
margin-bottom: 50rpx;
width: 90%;
margin-left: 5%;
}
.Publishcss{
background-color: #0048ff94;
}
</style>

BIN
static/Fork.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.4 KiB

View File

@@ -0,0 +1,17 @@
## 1.0.22024-09-21
- 新增 clearAble属性
## 1.0.12021-11-23
- 优化 label、label-width 属性
## 1.0.02021-11-19
- 优化 组件UI并提供设计资源详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-combox](https://uniapp.dcloud.io/component/uniui/uni-combox)
## 0.1.02021-07-30
- 组件兼容 vue3如何创建vue3项目详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 0.0.62021-05-12
- 新增 组件示例地址
## 0.0.52021-04-21
- 优化 添加依赖 uni-icons, 导入后自动下载依赖
## 0.0.42021-02-05
- 优化 组件引用关系通过uni_modules引用组件
## 0.0.32021-02-04
- 调整为uni_modules目录规范

View File

@@ -0,0 +1,294 @@
<template>
<view class="uni-combox" :class="border ? '' : 'uni-combox__no-border'">
<view v-if="label" class="uni-combox__label" :style="labelStyle">
<text>{{label}}</text>
</view>
<view class="uni-combox__input-box">
<input class="uni-combox__input" type="text" :placeholder="placeholder" placeholder-class="uni-combox__input-plac"
v-model="inputVal" @input="onInput" @focus="onFocus" @blur="onBlur" />
<uni-icons v-if="!inputVal || !clearAble" :type="showSelector? 'top' : 'bottom'" size="30" color="#999" @click="toggleSelector">
</uni-icons>
<uni-icons v-if="inputVal && clearAble" type="clear" size="24" color="#999" width="60rpx" height="60rpx" @click="clean">
</uni-icons>
</view>
<view class="uni-combox__selector" v-if="showSelector">
<view class="uni-popper__arrow"></view>
<scroll-view scroll-y="true" class="uni-combox__selector-scroll">
<view class="uni-combox__selector-empty" v-if="filterCandidatesLength === 0">
<text>{{emptyTips}}</text>
</view>
<view class="uni-combox__selector-item" v-for="(item,index) in filterCandidates" :key="index"
@click="onSelectorClick(index)">
<text>{{item}}</text>
</view>
</scroll-view>
</view>
</view>
</template>
<script>
/**
* Combox 组合输入框
* @description 组合输入框一般用于既可以输入也可以选择的场景
* @tutorial https://ext.dcloud.net.cn/plugin?id=1261
* @property {String} label 左侧文字
* @property {String} labelWidth 左侧内容宽度
* @property {String} placeholder 输入框占位符
* @property {Array} candidates 候选项列表
* @property {String} emptyTips 筛选结果为空时显示的文字
* @property {String} value 组合框的值
*/
export default {
name: 'uniCombox',
emits: ['input', 'update:modelValue'],
props: {
clearAble: {
type: Boolean,
default: false
},
border: {
type: Boolean,
default: true
},
label: {
type: String,
default: ''
},
labelWidth: {
type: String,
default: 'auto'
},
placeholder: {
type: String,
default: ''
},
candidates: {
type: Array,
default () {
return []
}
},
emptyTips: {
type: String,
default: '无匹配项'
},
// #ifndef VUE3
value: {
type: [String, Number],
default: ''
},
// #endif
// #ifdef VUE3
modelValue: {
type: [String, Number],
default: ''
},
// #endif
},
data() {
return {
showSelector: false,
inputVal: ''
}
},
computed: {
labelStyle() {
if (this.labelWidth === 'auto') {
return ""
}
return `width: ${this.labelWidth}`
},
filterCandidates() {
return this.candidates.filter((item) => {
return item.toString().indexOf(this.inputVal) > -1
})
},
filterCandidatesLength() {
return this.filterCandidates.length
}
},
watch: {
// #ifndef VUE3
value: {
handler(newVal) {
this.inputVal = newVal
},
immediate: true
},
// #endif
// #ifdef VUE3
modelValue: {
handler(newVal) {
this.inputVal = newVal
},
immediate: true
},
// #endif
},
methods: {
toggleSelector() {
this.showSelector = !this.showSelector
},
onFocus() {
this.showSelector = true
},
onBlur() {
setTimeout(() => {
this.showSelector = false
}, 153)
},
onSelectorClick(index) {
this.inputVal = this.filterCandidates[index]
this.showSelector = false
this.$emit('input', this.inputVal)
this.$emit('update:modelValue', this.inputVal)
},
onInput() {
setTimeout(() => {
this.$emit('input', this.inputVal)
this.$emit('update:modelValue', this.inputVal)
})
},
clean() {
this.inputVal = ''
this.onInput()
}
}
}
</script>
<style lang="scss" scoped>
.uni-combox {
font-size: 14px;
border: 1px solid #DCDFE6;
border-radius: 4px;
padding: 6px 10px;
position: relative;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
// height: 40px;
flex-direction: row;
align-items: center;
// border-bottom: solid 1px #DDDDDD;
}
.uni-combox__icon{
border: 1px solid #004cff;
width: 70rpx;
height: 70rpx;
}
.uni-combox__label {
font-size: 16px;
line-height: 22px;
padding-right: 10px;
color: #999999;
}
.uni-combox__input-box {
position: relative;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex: 1;
flex-direction: row;
align-items: center;
// width: 100rpx;
// height: 60rpx;
// border: 1px solid #004cff;
}
.uni-combox__input {
flex: 1;
font-size: 14px;
height: 22px;
line-height: 22px;
}
.uni-combox__input-plac {
font-size: 14px;
color: #999;
}
.uni-combox__selector {
/* #ifndef APP-NVUE */
box-sizing: border-box;
/* #endif */
position: absolute;
top: calc(100% + 12px);
left: 0;
width: 100%;
background-color: #FFFFFF;
border: 1px solid #EBEEF5;
border-radius: 6px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
z-index: 2;
padding: 4px 0;
}
.uni-combox__selector-scroll {
position: relative;
z-index: 999;
/* #ifndef APP-NVUE */
max-height: 200px;
box-sizing: border-box;
/* #endif */
}
.uni-combox__selector-empty,
.uni-combox__selector-item {
/* #ifndef APP-NVUE */
display: flex;
cursor: pointer;
/* #endif */
line-height: 36px;
font-size: 14px;
text-align: center;
// border-bottom: solid 1px #DDDDDD;
padding: 0px 10px;
}
.uni-combox__selector-item:hover {
background-color: #f9f9f9;
}
.uni-combox__selector-empty:last-child,
.uni-combox__selector-item:last-child {
/* #ifndef APP-NVUE */
border-bottom: none;
/* #endif */
}
// picker 弹出层通用的指示小三角
.uni-popper__arrow,
.uni-popper__arrow::after {
position: absolute;
display: block;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
border-width: 6px;
}
.uni-popper__arrow {
filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03));
top: -6px;
left: 10%;
margin-right: 3px;
border-top-width: 0;
border-bottom-color: #EBEEF5;
}
.uni-popper__arrow::after {
content: " ";
top: 1px;
margin-left: -6px;
border-top-width: 0;
border-bottom-color: #fff;
}
.uni-combox__no-border {
border: none;
}
</style>

View File

@@ -0,0 +1,88 @@
{
"id": "uni-combox",
"displayName": "uni-combox 组合框",
"version": "1.0.2",
"description": "可以选择也可以输入的表单项 ",
"keywords": [
"uni-ui",
"uniui",
"combox",
"组合框",
"select"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
"type": "component-vue"
},
"uni_modules": {
"dependencies": [
"uni-scss",
"uni-icons"
],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y",
"alipay": "n"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "n"
},
"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"
}
}
}
}
}

View File

@@ -0,0 +1,11 @@
## Combox 组合框
> **组件名uni-combox**
> 代码块: `uCombox`
组合框组件。
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-combox)
#### 如使用过程中有任何问题或者您对uni-ui有一些好的建议欢迎加入 uni-ui 交流群871950839

View File

@@ -0,0 +1,115 @@
## 1.1.192024-07-18
- 修复 初始值传入 null 导致input报错的bug
## 1.1.182024-04-11
- 修复 easyinput组件双向绑定问题
## 1.1.172024-03-28
- 修复 在头条小程序下丢失事件绑定的问题
## 1.1.162024-03-20
- 修复 在密码输入情况下 清除和小眼睛覆盖bug 在edge浏览器下显示双眼睛bug
## 1.1.152024-02-21
- 新增 左侧插槽left
## 1.1.142024-02-19
- 修复 onBlur的emit传值错误
## 1.1.122024-01-29
- 补充 adjust-position文档属性补充
## 1.1.112024-01-29
- 补充 adjust-position属性传递值Boolean当键盘弹起时是否自动上推页面
## 1.1.102024-01-22
- 去除 移除无用的log输出
## 1.1.92023-04-11
- 修复 vue3 下 keyboardheightchange 事件报错的bug
## 1.1.82023-03-29
- 优化 trim 属性默认值
## 1.1.72023-03-29
- 新增 cursor-spacing 属性
## 1.1.62023-01-28
- 新增 keyboardheightchange 事件,可监听键盘高度变化
## 1.1.52022-11-29
- 优化 主题样式
## 1.1.42022-10-27
- 修复 props 中背景颜色无默认值的bug
## 1.1.02022-06-30
- 新增 在 uni-forms 1.4.0 中使用可以在 blur 时校验内容
- 新增 clear 事件,点击右侧叉号图标触发
- 新增 change 事件 ,仅在输入框失去焦点或用户按下回车时触发
- 优化 组件样式,组件获取焦点时高亮显示,图标颜色调整等
## 1.0.52022-06-07
- 优化 clearable 显示策略
## 1.0.42022-06-07
- 优化 clearable 显示策略
## 1.0.32022-05-20
- 修复 关闭图标某些情况下无法取消的 bug
## 1.0.22022-04-12
- 修复 默认值不生效的 bug
## 1.0.12022-04-02
- 修复 value 不能为 0 的 bug
## 1.0.02021-11-19
- 优化 组件 UI并提供设计资源详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-easyinput](https://uniapp.dcloud.io/component/uniui/uni-easyinput)
## 0.1.42021-08-20
- 修复 在 uni-forms 的动态表单中默认值校验不通过的 bug
## 0.1.32021-08-11
- 修复 在 uni-forms 中重置表单,错误信息无法清除的问题
## 0.1.22021-07-30
- 优化 vue3 下事件警告的问题
## 0.1.1
- 优化 errorMessage 属性支持 Boolean 类型
## 0.1.02021-07-13
- 组件兼容 vue3如何创建 vue3 项目,详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 0.0.162021-06-29
- 修复 confirmType 属性(仅 type="text" 生效)导致多行文本框无法换行的 bug
## 0.0.152021-06-21
- 修复 passwordIcon 属性拼写错误的 bug
## 0.0.142021-06-18
- 新增 passwordIcon 属性,当 type=password 时是否显示小眼睛图标
- 修复 confirmType 属性不生效的问题
## 0.0.132021-06-04
- 修复 disabled 状态可清出内容的 bug
## 0.0.122021-05-12
- 新增 组件示例地址
## 0.0.112021-05-07
- 修复 input-border 属性不生效的问题
## 0.0.102021-04-30
- 修复 ios 遮挡文字、显示一半的问题
## 0.0.92021-02-05
- 调整为 uni_modules 目录规范
- 优化 兼容 nvue 页面

View File

@@ -0,0 +1,54 @@
/**
* @desc 函数防抖
* @param func 目标函数
* @param wait 延迟执行毫秒数
* @param immediate true - 立即执行, false - 延迟执行
*/
export const debounce = function(func, wait = 1000, immediate = true) {
let timer;
return function() {
let context = this,
args = arguments;
if (timer) clearTimeout(timer);
if (immediate) {
let callNow = !timer;
timer = setTimeout(() => {
timer = null;
}, wait);
if (callNow) func.apply(context, args);
} else {
timer = setTimeout(() => {
func.apply(context, args);
}, wait)
}
}
}
/**
* @desc 函数节流
* @param func 函数
* @param wait 延迟执行毫秒数
* @param type 1 使用表时间戳,在时间段开始的时候触发 2 使用表定时器,在时间段结束的时候触发
*/
export const throttle = (func, wait = 1000, type = 1) => {
let previous = 0;
let timeout;
return function() {
let context = this;
let args = arguments;
if (type === 1) {
let now = Date.now();
if (now - previous > wait) {
func.apply(context, args);
previous = now;
}
} else if (type === 2) {
if (!timeout) {
timeout = setTimeout(() => {
timeout = null;
func.apply(context, args)
}, wait)
}
}
}
}

View File

@@ -0,0 +1,676 @@
<template>
<view class="uni-easyinput" :class="{ 'uni-easyinput-error': msg }" :style="boxStyle">
<view class="uni-easyinput__content" :class="inputContentClass" :style="inputContentStyle">
<uni-icons v-if="prefixIcon" class="content-clear-icon" :type="prefixIcon" color="#c0c4cc" @click.stop="onClickIcon('prefix')" size="22"></uni-icons>
<slot name="left">
</slot>
<!-- #ifdef MP-ALIPAY -->
<textarea :enableNative="enableNative" v-if="type === 'textarea'" class="uni-easyinput__content-textarea" :class="{ 'input-padding': inputBorder }" :name="name" :value="val" :placeholder="placeholder" :placeholderStyle="placeholderStyle" :disabled="disabled" placeholder-class="uni-easyinput__placeholder-class" :maxlength="inputMaxlength" :focus="focused" :autoHeight="autoHeight" :cursor-spacing="cursorSpacing" :adjust-position="adjustPosition" @input="onInput" @blur="_Blur" @focus="_Focus" @confirm="onConfirm" @keyboardheightchange="onkeyboardheightchange"></textarea>
<input :enableNative="enableNative" v-else :type="type === 'password' ? 'text' : type" class="uni-easyinput__content-input" :style="inputStyle" :name="name" :value="val" :password="!showPassword && type === 'password'" :placeholder="placeholder" :placeholderStyle="placeholderStyle" placeholder-class="uni-easyinput__placeholder-class" :disabled="disabled" :maxlength="inputMaxlength" :focus="focused" :confirmType="confirmType" :cursor-spacing="cursorSpacing" :adjust-position="adjustPosition" @focus="_Focus" @blur="_Blur" @input="onInput" @confirm="onConfirm" @keyboardheightchange="onkeyboardheightchange" />
<!-- #endif -->
<!-- #ifndef MP-ALIPAY -->
<textarea v-if="type === 'textarea'" class="uni-easyinput__content-textarea" :class="{ 'input-padding': inputBorder }" :name="name" :value="val" :placeholder="placeholder" :placeholderStyle="placeholderStyle" :disabled="disabled" placeholder-class="uni-easyinput__placeholder-class" :maxlength="inputMaxlength" :focus="focused" :autoHeight="autoHeight" :cursor-spacing="cursorSpacing" :adjust-position="adjustPosition" @input="onInput" @blur="_Blur" @focus="_Focus" @confirm="onConfirm" @keyboardheightchange="onkeyboardheightchange"></textarea>
<input v-else :type="type === 'password' ? 'text' : type" class="uni-easyinput__content-input" :style="inputStyle" :name="name" :value="val" :password="!showPassword && type === 'password'" :placeholder="placeholder" :placeholderStyle="placeholderStyle" placeholder-class="uni-easyinput__placeholder-class" :disabled="disabled" :maxlength="inputMaxlength" :focus="focused" :confirmType="confirmType" :cursor-spacing="cursorSpacing" :adjust-position="adjustPosition" @focus="_Focus" @blur="_Blur" @input="onInput" @confirm="onConfirm" @keyboardheightchange="onkeyboardheightchange" />
<!-- #endif -->
<template v-if="type === 'password' && passwordIcon">
<!-- 开启密码时显示小眼睛 -->
<uni-icons v-if="isVal" class="content-clear-icon" :class="{ 'is-textarea-icon': type === 'textarea' }" :type="showPassword ? 'eye-slash-filled' : 'eye-filled'" :size="22" :color="focusShow ? primaryColor : '#c0c4cc'" @click="onEyes"></uni-icons>
</template>
<template v-if="suffixIcon">
<uni-icons v-if="suffixIcon" class="content-clear-icon" :type="suffixIcon" color="#c0c4cc" @click.stop="onClickIcon('suffix')" size="22"></uni-icons>
</template>
<template v-else>
<uni-icons v-if="clearable && isVal && !disabled && type !== 'textarea'" class="content-clear-icon" :class="{ 'is-textarea-icon': type === 'textarea' }" type="clear" :size="clearSize" :color="msg ? '#dd524d' : focusShow ? primaryColor : '#c0c4cc'" @click="onClear"></uni-icons>
</template>
<slot name="right"></slot>
</view>
</view>
</template>
<script>
/**
* Easyinput 输入框
* @description 此组件可以实现表单的输入与校验,包括 "text" 和 "textarea" 类型。
* @tutorial https://ext.dcloud.net.cn/plugin?id=3455
* @property {String} value 输入内容
* @property {String } type 输入框的类型默认text password/text/textarea/..
* @value text 文本输入键盘
* @value textarea 多行文本输入键盘
* @value password 密码输入键盘
* @value number 数字输入键盘注意iOS上app-vue弹出的数字键盘并非9宫格方式
* @value idcard 身份证输入键盘信、支付宝、百度、QQ小程序
* @value digit 带小数点的数字键盘 App的nvue页面、微信、支付宝、百度、头条、QQ小程序支持
* @property {Boolean} clearable 是否显示右侧清空内容的图标控件点击可清空输入框内容默认true
* @property {Boolean} autoHeight 是否自动增高输入区域type为textarea时有效默认true
* @property {String } placeholder 输入框的提示文字
* @property {String } placeholderStyle placeholder的样式(内联样式,字符串),如"color: #ddd"
* @property {Boolean} focus 是否自动获得焦点默认false
* @property {Boolean} disabled 是否禁用默认false
* @property {Number } maxlength 最大输入长度,设置为 -1 的时候不限制最大长度默认140
* @property {String } confirmType 设置键盘右下角按钮的文字仅在type="text"时生效默认done
* @property {Number } clearSize 清除图标的大小单位px默认15
* @property {String} prefixIcon 输入框头部图标
* @property {String} suffixIcon 输入框尾部图标
* @property {String} primaryColor 设置主题色(默认#2979ff
* @property {Boolean} trim 是否自动去除两端的空格
* @property {Boolean} cursorSpacing 指定光标与键盘的距离,单位 px
* @property {Boolean} ajust-position 当键盘弹起时是否上推内容默认值true
* @value both 去除两端空格
* @value left 去除左侧空格
* @value right 去除右侧空格
* @value start 去除左侧空格
* @value end 去除右侧空格
* @value all 去除全部空格
* @value none 不去除空格
* @property {Boolean} inputBorder 是否显示input输入框的边框默认true
* @property {Boolean} passwordIcon type=password时是否显示小眼睛图标
* @property {Object} styles 自定义颜色
* @event {Function} input 输入框内容发生变化时触发
* @event {Function} focus 输入框获得焦点时触发
* @event {Function} blur 输入框失去焦点时触发
* @event {Function} confirm 点击完成按钮时触发
* @event {Function} iconClick 点击图标时触发
* @example <uni-easyinput v-model="mobile"></uni-easyinput>
*/
function obj2strClass(obj) {
let classess = '';
for (let key in obj) {
const val = obj[key];
if (val) {
classess += `${key} `;
}
}
return classess;
}
function obj2strStyle(obj) {
let style = '';
for (let key in obj) {
const val = obj[key];
style += `${key}:${val};`;
}
return style;
}
export default {
name: 'uni-easyinput',
emits: [
'click',
'iconClick',
'update:modelValue',
'input',
'focus',
'blur',
'confirm',
'clear',
'eyes',
'change',
'keyboardheightchange'
],
model: {
prop: 'modelValue',
event: 'update:modelValue'
},
options: {
// #ifdef MP-TOUTIAO
virtualHost: false,
// #endif
// #ifndef MP-TOUTIAO
virtualHost: true
// #endif
},
inject: {
form: {
from: 'uniForm',
default: null
},
formItem: {
from: 'uniFormItem',
default: null
}
},
props: {
name: String,
value: [Number, String],
modelValue: [Number, String],
type: {
type: String,
default: 'text'
},
clearable: {
type: Boolean,
default: true
},
autoHeight: {
type: Boolean,
default: false
},
placeholder: {
type: String,
default: ' '
},
placeholderStyle: String,
focus: {
type: Boolean,
default: false
},
disabled: {
type: Boolean,
default: false
},
maxlength: {
type: [Number, String],
default: 140
},
confirmType: {
type: String,
default: 'done'
},
clearSize: {
type: [Number, String],
default: 24
},
inputBorder: {
type: Boolean,
default: true
},
prefixIcon: {
type: String,
default: ''
},
suffixIcon: {
type: String,
default: ''
},
trim: {
type: [Boolean, String],
default: false
},
cursorSpacing: {
type: Number,
default: 0
},
passwordIcon: {
type: Boolean,
default: true
},
adjustPosition: {
type: Boolean,
default: true
},
primaryColor: {
type: String,
default: '#2979ff'
},
styles: {
type: Object,
default () {
return {
color: '#333',
backgroundColor: '#fff',
disableColor: '#F7F6F6',
borderColor: '#e5e5e5'
};
}
},
errorMessage: {
type: [String, Boolean],
default: ''
},
// #ifdef MP-ALIPAY
enableNative: {
type: Boolean,
default: false
}
// #endif
},
data() {
return {
focused: false,
val: '',
showMsg: '',
border: false,
isFirstBorder: false,
showClearIcon: false,
showPassword: false,
focusShow: false,
localMsg: '',
isEnter: false // 用于判断当前是否是使用回车操作
};
},
computed: {
// 输入框内是否有值
isVal() {
const val = this.val;
// fixed by mehaotian 处理值为0的情况字符串0不在处理范围
if (val || val === 0) {
return true;
}
return false;
},
msg() {
// console.log('computed', this.form, this.formItem);
// if (this.form) {
// return this.errorMessage || this.formItem.errMsg;
// }
// TODO 处理头条 formItem 中 errMsg 不更新的问题
return this.localMsg || this.errorMessage;
},
// 因为uniapp的input组件的maxlength组件必须要数值这里转为数值用户可以传入字符串数值
inputMaxlength() {
return Number(this.maxlength);
},
// 处理外层样式的style
boxStyle() {
return `color:${
this.inputBorder && this.msg ? '#e43d33' : this.styles.color
};`;
},
// input 内容的类和样式处理
inputContentClass() {
return obj2strClass({
'is-input-border': this.inputBorder,
'is-input-error-border': this.inputBorder && this.msg,
'is-textarea': this.type === 'textarea',
'is-disabled': this.disabled,
'is-focused': this.focusShow
});
},
inputContentStyle() {
const focusColor = this.focusShow ?
this.primaryColor :
this.styles.borderColor;
const borderColor =
this.inputBorder && this.msg ? '#dd524d' : focusColor;
return obj2strStyle({
'border-color': borderColor || '#e5e5e5',
'background-color': this.disabled ?
this.styles.disableColor : this.styles.backgroundColor
});
},
// input右侧样式
inputStyle() {
const paddingRight =
this.type === 'password' || this.clearable || this.prefixIcon ?
'' :
'10px';
return obj2strStyle({
'padding-right': paddingRight,
'padding-left': this.prefixIcon ? '' : '10px'
});
}
},
watch: {
value(newVal) {
// fix by mehaotian 解决 值为null的情况下input报错的bug
if (newVal === null) {
this.val = '';
return
}
this.val = newVal;
},
modelValue(newVal) {
if (newVal === null) {
this.val = '';
return
}
this.val = newVal;
},
focus(newVal) {
this.$nextTick(() => {
this.focused = this.focus;
this.focusShow = this.focus;
});
}
},
created() {
this.init();
// TODO 处理头条vue3 computed 不监听 inject 更改的问题formItem.errMsg
if (this.form && this.formItem) {
this.$watch('formItem.errMsg', newVal => {
this.localMsg = newVal;
});
}
},
mounted() {
this.$nextTick(() => {
this.focused = this.focus;
this.focusShow = this.focus;
});
},
methods: {
/**
* 初始化变量值
*/
init() {
if (this.value || this.value === 0) {
this.val = this.value;
} else if (
this.modelValue ||
this.modelValue === 0 ||
this.modelValue === ''
) {
this.val = this.modelValue;
} else {
// fix by ht 如果初始值为null则input报错待框架修复
this.val = '';
}
},
/**
* 点击图标时触发
* @param {Object} type
*/
onClickIcon(type) {
this.$emit('iconClick', type);
},
/**
* 显示隐藏内容,密码框时生效
*/
onEyes() {
this.showPassword = !this.showPassword;
this.$emit('eyes', this.showPassword);
},
/**
* 输入时触发
* @param {Object} event
*/
onInput(event) {
let value = event.detail.value;
// 判断是否去除空格
if (this.trim) {
if (typeof this.trim === 'boolean' && this.trim) {
value = this.trimStr(value);
}
if (typeof this.trim === 'string') {
value = this.trimStr(value, this.trim);
}
}
if (this.errMsg) this.errMsg = '';
this.val = value;
// TODO 兼容 vue2
this.$emit('input', value);
// TODO 兼容 vue3
this.$emit('update:modelValue', value);
},
/**
* 外部调用方法
* 获取焦点时触发
* @param {Object} event
*/
onFocus() {
this.$nextTick(() => {
this.focused = true;
});
this.$emit('focus', null);
},
_Focus(event) {
this.focusShow = true;
this.$emit('focus', event);
},
/**
* 外部调用方法
* 失去焦点时触发
* @param {Object} event
*/
onBlur() {
this.focused = false;
this.$emit('blur', null);
},
_Blur(event) {
let value = event.detail.value;
this.focusShow = false;
this.$emit('blur', event);
// 根据类型返回值在event中获取的值理论上讲都是string
if (this.isEnter === false) {
this.$emit('change', this.val);
}
// 失去焦点时参与表单校验
if (this.form && this.formItem) {
const { validateTrigger } = this.form;
if (validateTrigger === 'blur') {
this.formItem.onFieldChange();
}
}
},
/**
* 按下键盘的发送键
* @param {Object} e
*/
onConfirm(e) {
this.$emit('confirm', this.val);
this.isEnter = true;
this.$emit('change', this.val);
this.$nextTick(() => {
this.isEnter = false;
});
},
/**
* 清理内容
* @param {Object} event
*/
onClear(event) {
this.val = '';
// TODO 兼容 vue2
this.$emit('input', '');
// TODO 兼容 vue2
// TODO 兼容 vue3
this.$emit('update:modelValue', '');
// 点击叉号触发
this.$emit('clear');
},
/**
* 键盘高度发生变化的时候触发此事件
* 兼容性微信小程序2.7.0+、App 3.1.0+
* @param {Object} event
*/
onkeyboardheightchange(event) {
this.$emit('keyboardheightchange', event);
},
/**
* 去除空格
*/
trimStr(str, pos = 'both') {
if (pos === 'both') {
return str.trim();
} else if (pos === 'left') {
return str.trimLeft();
} else if (pos === 'right') {
return str.trimRight();
} else if (pos === 'start') {
return str.trimStart();
} else if (pos === 'end') {
return str.trimEnd();
} else if (pos === 'all') {
return str.replace(/\s+/g, '');
} else if (pos === 'none') {
return str;
}
return str;
}
}
};
</script>
<style lang="scss">
$uni-error: #e43d33;
$uni-border-1: #dcdfe6 !default;
.uni-easyinput {
/* #ifndef APP-NVUE */
width: 100%;
/* #endif */
flex: 1;
position: relative;
text-align: left;
color: #333;
font-size: 14px;
}
.uni-easyinput__content {
flex: 1;
/* #ifndef APP-NVUE */
width: 100%;
display: flex;
box-sizing: border-box;
// min-height: 36px;
/* #endif */
flex-direction: row;
align-items: center;
// 处理border动画刚开始显示黑色的问题
border-color: #fff;
transition-property: border-color;
transition-duration: 0.3s;
}
.uni-easyinput__content-input {
/* #ifndef APP-NVUE */
width: auto;
/* #endif */
position: relative;
overflow: hidden;
flex: 1;
line-height: 1;
font-size: 14px;
height: 35px;
// min-height: 36px;
/*ifdef H5*/
& ::-ms-reveal {
display: none;
}
& ::-ms-clear {
display: none;
}
& ::-o-clear {
display: none;
}
/*endif*/
}
.uni-easyinput__placeholder-class {
color: #999;
font-size: 12px;
// font-weight: 200;
}
.is-textarea {
align-items: flex-start;
}
.is-textarea-icon {
margin-top: 5px;
}
.uni-easyinput__content-textarea {
position: relative;
overflow: hidden;
flex: 1;
line-height: 1.5;
font-size: 14px;
margin: 6px;
margin-left: 0;
height: 80px;
min-height: 80px;
/* #ifndef APP-NVUE */
min-height: 80px;
width: auto;
/* #endif */
}
.input-padding {
padding-left: 10px;
}
.content-clear-icon {
padding: 0 5px;
}
.label-icon {
margin-right: 5px;
margin-top: -1px;
}
// 显示边框
.is-input-border {
/* #ifndef APP-NVUE */
display: flex;
box-sizing: border-box;
/* #endif */
flex-direction: row;
align-items: center;
border: 1px solid $uni-border-1;
border-radius: 4px;
/* #ifdef MP-ALIPAY */
overflow: hidden;
/* #endif */
}
.uni-error-message {
position: absolute;
bottom: -17px;
left: 0;
line-height: 12px;
color: $uni-error;
font-size: 12px;
text-align: left;
}
.uni-error-msg--boeder {
position: relative;
bottom: 0;
line-height: 22px;
}
.is-input-error-border {
border-color: $uni-error;
.uni-easyinput__placeholder-class {
color: mix(#fff, $uni-error, 50%);
}
}
.uni-easyinput--border {
margin-bottom: 0;
padding: 10px 15px;
// padding-bottom: 0;
border-top: 1px #eee solid;
}
.uni-easyinput-error {
padding-bottom: 0;
}
.is-first-border {
/* #ifndef APP-NVUE */
border: none;
/* #endif */
/* #ifdef APP-NVUE */
border-width: 0;
/* #endif */
}
.is-disabled {
background-color: #f7f6f6;
color: #d5d5d5;
.uni-easyinput__placeholder-class {
color: #d5d5d5;
font-size: 12px;
}
}
</style>

View File

@@ -0,0 +1,88 @@
{
"id": "uni-easyinput",
"displayName": "uni-easyinput 增强输入框",
"version": "1.1.19",
"description": "Easyinput 组件是对原生input组件的增强",
"keywords": [
"uni-ui",
"uniui",
"input",
"uni-easyinput",
"输入框"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
"type": "component-vue"
},
"uni_modules": {
"dependencies": [
"uni-scss",
"uni-icons"
],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y",
"alipay": "n"
},
"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"
}
}
}
}
}

View File

@@ -0,0 +1,11 @@
### Easyinput 增强输入框
> **组件名uni-easyinput**
> 代码块: `uEasyinput`
easyinput 组件是对原生input组件的增强 ,是专门为配合表单组件[uni-forms](https://ext.dcloud.net.cn/plugin?id=2773)而设计的easyinput 内置了边框,图标等,同时包含 input 所有功能
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-easyinput)
#### 如使用过程中有任何问题或者您对uni-ui有一些好的建议欢迎加入 uni-ui 交流群871950839

View File

@@ -0,0 +1,42 @@
## 2.0.102024-06-07
- 优化 uni-app x 中size 属性的类型
## 2.0.92024-01-12
fix: 修复图标大小默认值错误的问题
## 2.0.82023-12-14
- 修复 项目未使用 ts 情况下打包报错的bug
## 2.0.72023-12-14
- 修复 size 属性为 string 时不加单位导致尺寸异常的bug
## 2.0.62023-12-11
- 优化 兼容老版本icon类型如 top bottom 等
## 2.0.52023-12-11
- 优化 兼容老版本icon类型如 top bottom 等
## 2.0.42023-12-06
- 优化 uni-app x 下示例项目图标排序
## 2.0.32023-12-06
- 修复 nvue下引入组件报错的bug
## 2.0.22023-12-05
-优化 size 属性支持单位
## 2.0.12023-12-05
- 新增 uni-app x 支持定义图标
## 1.3.52022-01-24
- 优化 size 属性可以传入不带单位的字符串数值
## 1.3.42022-01-24
- 优化 size 支持其他单位
## 1.3.32022-01-17
- 修复 nvue 有些图标不显示的bug兼容老版本图标
## 1.3.22021-12-01
- 优化 示例可复制图标名称
## 1.3.12021-11-23
- 优化 兼容旧组件 type 值
## 1.3.02021-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.72021-11-08
## 1.2.02021-07-30
- 组件兼容 vue3如何创建vue3项目详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.1.52021-05-12
- 新增 组件示例地址
## 1.1.42021-02-05
- 调整为uni_modules目录规范

View File

@@ -0,0 +1,91 @@
<template>
<text class="uni-icons" :style="styleObj">
<slot>{{unicode}}</slot>
</text>
</template>
<script>
import { fontData, IconsDataItem } from './uniicons_file'
/**
* Icons 图标
* @description 用于展示 icon 图标
* @tutorial https://ext.dcloud.net.cn/plugin?id=28
* @property {Number,String} size 图标大小
* @property {String} type 图标图案,参考示例
* @property {String} color 图标颜色
* @property {String} customPrefix 自定义图标
* @event {Function} click 点击 Icon 触发事件
*/
export default {
name: "uni-icons",
props: {
type: {
type: String,
default: ''
},
color: {
type: String,
default: '#333333'
},
size: {
type: [Number, String],
default: 16
},
fontFamily: {
type: String,
default: ''
}
},
data() {
return {};
},
computed: {
unicode() : string {
let codes = fontData.find((item : IconsDataItem) : boolean => { return item.font_class == this.type })
if (codes !== null) {
return codes.unicode
}
return ''
},
iconSize() : string {
const size = this.size
if (typeof size == 'string') {
const reg = /^[0-9]*$/g
return reg.test(size as string) ? '' + size + 'px' : '' + size;
// return '' + this.size
}
return this.getFontSize(size as number)
},
styleObj() : UTSJSONObject {
if (this.fontFamily !== '') {
return { color: this.color, fontSize: this.iconSize, fontFamily: this.fontFamily }
}
return { color: this.color, fontSize: this.iconSize }
}
},
created() { },
methods: {
/**
* 字体大小
*/
getFontSize(size : number) : string {
return size + 'px';
},
},
}
</script>
<style scoped>
@font-face {
font-family: UniIconsFontFamily;
src: url('./uniicons.ttf');
}
.uni-icons {
font-family: UniIconsFontFamily;
font-size: 18px;
font-style: normal;
color: #333;
}
</style>

View File

@@ -0,0 +1,110 @@
<template>
<!-- #ifdef APP-NVUE -->
<text :style="styleObj" class="uni-icons" @click="_onClick">{{unicode}}</text>
<!-- #endif -->
<!-- #ifndef APP-NVUE -->
<text :style="styleObj" class="uni-icons" :class="['uniui-'+type,customPrefix,customPrefix?type:'']" @click="_onClick">
<slot></slot>
</text>
<!-- #endif -->
</template>
<script>
import { fontData } from './uniicons_file_vue.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: ''
},
fontFamily: {
type: String,
default: ''
}
},
data() {
return {
icons: fontData
}
},
computed: {
unicode() {
let code = this.icons.find(v => v.font_class === this.type)
if (code) {
return code.unicode
}
return ''
},
iconSize() {
return getVal(this.size)
},
styleObj() {
if (this.fontFamily !== '') {
return `color: ${this.color}; font-size: ${this.iconSize}; font-family: ${this.fontFamily};`
}
return `color: ${this.color}; font-size: ${this.iconSize};`
}
},
methods: {
_onClick() {
this.$emit('click')
}
}
}
</script>
<style lang="scss">
/* #ifndef APP-NVUE */
@import './uniicons.css';
@font-face {
font-family: uniicons;
src: url('./uniicons.ttf');
}
/* #endif */
.uni-icons {
font-family: uniicons;
text-decoration: none;
text-align: center;
}
</style>

View File

@@ -0,0 +1,664 @@
.uniui-cart-filled:before {
content: "\e6d0";
}
.uniui-gift-filled:before {
content: "\e6c4";
}
.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-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-arrowthinleft:before {
content: "\e6d2";
}
.uniui-arrowthinup:before {
content: "\e6d3";
}
.uniui-arrowthindown:before {
content: "\e6d4";
}
.uniui-back:before {
content: "\e6b9";
}
.uniui-forward:before {
content: "\e6ba";
}
.uniui-arrow-right:before {
content: "\e6bb";
}
.uniui-arrow-left:before {
content: "\e6bc";
}
.uniui-arrow-up:before {
content: "\e6bd";
}
.uniui-arrow-down:before {
content: "\e6be";
}
.uniui-arrowthinright:before {
content: "\e6d1";
}
.uniui-down:before {
content: "\e6b8";
}
.uniui-bottom:before {
content: "\e6b8";
}
.uniui-arrowright:before {
content: "\e6d5";
}
.uniui-right:before {
content: "\e6b5";
}
.uniui-up:before {
content: "\e6b6";
}
.uniui-top:before {
content: "\e6b6";
}
.uniui-left:before {
content: "\e6b7";
}
.uniui-arrowup:before {
content: "\e6d6";
}
.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-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";
}

View File

@@ -0,0 +1,664 @@
export type IconsData = {
id : string
name : string
font_family : string
css_prefix_text : string
description : string
glyphs : Array<IconsDataItem>
}
export type IconsDataItem = {
font_class : string
unicode : string
}
export const fontData = [
{
"font_class": "arrow-down",
"unicode": "\ue6be"
},
{
"font_class": "arrow-left",
"unicode": "\ue6bc"
},
{
"font_class": "arrow-right",
"unicode": "\ue6bb"
},
{
"font_class": "arrow-up",
"unicode": "\ue6bd"
},
{
"font_class": "auth",
"unicode": "\ue6ab"
},
{
"font_class": "auth-filled",
"unicode": "\ue6cc"
},
{
"font_class": "back",
"unicode": "\ue6b9"
},
{
"font_class": "bars",
"unicode": "\ue627"
},
{
"font_class": "calendar",
"unicode": "\ue6a0"
},
{
"font_class": "calendar-filled",
"unicode": "\ue6c0"
},
{
"font_class": "camera",
"unicode": "\ue65a"
},
{
"font_class": "camera-filled",
"unicode": "\ue658"
},
{
"font_class": "cart",
"unicode": "\ue631"
},
{
"font_class": "cart-filled",
"unicode": "\ue6d0"
},
{
"font_class": "chat",
"unicode": "\ue65d"
},
{
"font_class": "chat-filled",
"unicode": "\ue659"
},
{
"font_class": "chatboxes",
"unicode": "\ue696"
},
{
"font_class": "chatboxes-filled",
"unicode": "\ue692"
},
{
"font_class": "chatbubble",
"unicode": "\ue697"
},
{
"font_class": "chatbubble-filled",
"unicode": "\ue694"
},
{
"font_class": "checkbox",
"unicode": "\ue62b"
},
{
"font_class": "checkbox-filled",
"unicode": "\ue62c"
},
{
"font_class": "checkmarkempty",
"unicode": "\ue65c"
},
{
"font_class": "circle",
"unicode": "\ue65b"
},
{
"font_class": "circle-filled",
"unicode": "\ue65e"
},
{
"font_class": "clear",
"unicode": "\ue66d"
},
{
"font_class": "close",
"unicode": "\ue673"
},
{
"font_class": "closeempty",
"unicode": "\ue66c"
},
{
"font_class": "cloud-download",
"unicode": "\ue647"
},
{
"font_class": "cloud-download-filled",
"unicode": "\ue646"
},
{
"font_class": "cloud-upload",
"unicode": "\ue645"
},
{
"font_class": "cloud-upload-filled",
"unicode": "\ue648"
},
{
"font_class": "color",
"unicode": "\ue6cf"
},
{
"font_class": "color-filled",
"unicode": "\ue6c9"
},
{
"font_class": "compose",
"unicode": "\ue67f"
},
{
"font_class": "contact",
"unicode": "\ue693"
},
{
"font_class": "contact-filled",
"unicode": "\ue695"
},
{
"font_class": "down",
"unicode": "\ue6b8"
},
{
"font_class": "bottom",
"unicode": "\ue6b8"
},
{
"font_class": "download",
"unicode": "\ue68d"
},
{
"font_class": "download-filled",
"unicode": "\ue681"
},
{
"font_class": "email",
"unicode": "\ue69e"
},
{
"font_class": "email-filled",
"unicode": "\ue69a"
},
{
"font_class": "eye",
"unicode": "\ue651"
},
{
"font_class": "eye-filled",
"unicode": "\ue66a"
},
{
"font_class": "eye-slash",
"unicode": "\ue6b3"
},
{
"font_class": "eye-slash-filled",
"unicode": "\ue6b4"
},
{
"font_class": "fire",
"unicode": "\ue6a1"
},
{
"font_class": "fire-filled",
"unicode": "\ue6c5"
},
{
"font_class": "flag",
"unicode": "\ue65f"
},
{
"font_class": "flag-filled",
"unicode": "\ue660"
},
{
"font_class": "folder-add",
"unicode": "\ue6a9"
},
{
"font_class": "folder-add-filled",
"unicode": "\ue6c8"
},
{
"font_class": "font",
"unicode": "\ue6a3"
},
{
"font_class": "forward",
"unicode": "\ue6ba"
},
{
"font_class": "gear",
"unicode": "\ue664"
},
{
"font_class": "gear-filled",
"unicode": "\ue661"
},
{
"font_class": "gift",
"unicode": "\ue6a4"
},
{
"font_class": "gift-filled",
"unicode": "\ue6c4"
},
{
"font_class": "hand-down",
"unicode": "\ue63d"
},
{
"font_class": "hand-down-filled",
"unicode": "\ue63c"
},
{
"font_class": "hand-up",
"unicode": "\ue63f"
},
{
"font_class": "hand-up-filled",
"unicode": "\ue63e"
},
{
"font_class": "headphones",
"unicode": "\ue630"
},
{
"font_class": "heart",
"unicode": "\ue639"
},
{
"font_class": "heart-filled",
"unicode": "\ue641"
},
{
"font_class": "help",
"unicode": "\ue679"
},
{
"font_class": "help-filled",
"unicode": "\ue674"
},
{
"font_class": "home",
"unicode": "\ue662"
},
{
"font_class": "home-filled",
"unicode": "\ue663"
},
{
"font_class": "image",
"unicode": "\ue670"
},
{
"font_class": "image-filled",
"unicode": "\ue678"
},
{
"font_class": "images",
"unicode": "\ue650"
},
{
"font_class": "images-filled",
"unicode": "\ue64b"
},
{
"font_class": "info",
"unicode": "\ue669"
},
{
"font_class": "info-filled",
"unicode": "\ue649"
},
{
"font_class": "left",
"unicode": "\ue6b7"
},
{
"font_class": "link",
"unicode": "\ue6a5"
},
{
"font_class": "list",
"unicode": "\ue644"
},
{
"font_class": "location",
"unicode": "\ue6ae"
},
{
"font_class": "location-filled",
"unicode": "\ue6af"
},
{
"font_class": "locked",
"unicode": "\ue66b"
},
{
"font_class": "locked-filled",
"unicode": "\ue668"
},
{
"font_class": "loop",
"unicode": "\ue633"
},
{
"font_class": "mail-open",
"unicode": "\ue643"
},
{
"font_class": "mail-open-filled",
"unicode": "\ue63a"
},
{
"font_class": "map",
"unicode": "\ue667"
},
{
"font_class": "map-filled",
"unicode": "\ue666"
},
{
"font_class": "map-pin",
"unicode": "\ue6ad"
},
{
"font_class": "map-pin-ellipse",
"unicode": "\ue6ac"
},
{
"font_class": "medal",
"unicode": "\ue6a2"
},
{
"font_class": "medal-filled",
"unicode": "\ue6c3"
},
{
"font_class": "mic",
"unicode": "\ue671"
},
{
"font_class": "mic-filled",
"unicode": "\ue677"
},
{
"font_class": "micoff",
"unicode": "\ue67e"
},
{
"font_class": "micoff-filled",
"unicode": "\ue6b0"
},
{
"font_class": "minus",
"unicode": "\ue66f"
},
{
"font_class": "minus-filled",
"unicode": "\ue67d"
},
{
"font_class": "more",
"unicode": "\ue64d"
},
{
"font_class": "more-filled",
"unicode": "\ue64e"
},
{
"font_class": "navigate",
"unicode": "\ue66e"
},
{
"font_class": "navigate-filled",
"unicode": "\ue67a"
},
{
"font_class": "notification",
"unicode": "\ue6a6"
},
{
"font_class": "notification-filled",
"unicode": "\ue6c1"
},
{
"font_class": "paperclip",
"unicode": "\ue652"
},
{
"font_class": "paperplane",
"unicode": "\ue672"
},
{
"font_class": "paperplane-filled",
"unicode": "\ue675"
},
{
"font_class": "person",
"unicode": "\ue699"
},
{
"font_class": "person-filled",
"unicode": "\ue69d"
},
{
"font_class": "personadd",
"unicode": "\ue69f"
},
{
"font_class": "personadd-filled",
"unicode": "\ue698"
},
{
"font_class": "personadd-filled-copy",
"unicode": "\ue6d1"
},
{
"font_class": "phone",
"unicode": "\ue69c"
},
{
"font_class": "phone-filled",
"unicode": "\ue69b"
},
{
"font_class": "plus",
"unicode": "\ue676"
},
{
"font_class": "plus-filled",
"unicode": "\ue6c7"
},
{
"font_class": "plusempty",
"unicode": "\ue67b"
},
{
"font_class": "pulldown",
"unicode": "\ue632"
},
{
"font_class": "pyq",
"unicode": "\ue682"
},
{
"font_class": "qq",
"unicode": "\ue680"
},
{
"font_class": "redo",
"unicode": "\ue64a"
},
{
"font_class": "redo-filled",
"unicode": "\ue655"
},
{
"font_class": "refresh",
"unicode": "\ue657"
},
{
"font_class": "refresh-filled",
"unicode": "\ue656"
},
{
"font_class": "refreshempty",
"unicode": "\ue6bf"
},
{
"font_class": "reload",
"unicode": "\ue6b2"
},
{
"font_class": "right",
"unicode": "\ue6b5"
},
{
"font_class": "scan",
"unicode": "\ue62a"
},
{
"font_class": "search",
"unicode": "\ue654"
},
{
"font_class": "settings",
"unicode": "\ue653"
},
{
"font_class": "settings-filled",
"unicode": "\ue6ce"
},
{
"font_class": "shop",
"unicode": "\ue62f"
},
{
"font_class": "shop-filled",
"unicode": "\ue6cd"
},
{
"font_class": "smallcircle",
"unicode": "\ue67c"
},
{
"font_class": "smallcircle-filled",
"unicode": "\ue665"
},
{
"font_class": "sound",
"unicode": "\ue684"
},
{
"font_class": "sound-filled",
"unicode": "\ue686"
},
{
"font_class": "spinner-cycle",
"unicode": "\ue68a"
},
{
"font_class": "staff",
"unicode": "\ue6a7"
},
{
"font_class": "staff-filled",
"unicode": "\ue6cb"
},
{
"font_class": "star",
"unicode": "\ue688"
},
{
"font_class": "star-filled",
"unicode": "\ue68f"
},
{
"font_class": "starhalf",
"unicode": "\ue683"
},
{
"font_class": "trash",
"unicode": "\ue687"
},
{
"font_class": "trash-filled",
"unicode": "\ue685"
},
{
"font_class": "tune",
"unicode": "\ue6aa"
},
{
"font_class": "tune-filled",
"unicode": "\ue6ca"
},
{
"font_class": "undo",
"unicode": "\ue64f"
},
{
"font_class": "undo-filled",
"unicode": "\ue64c"
},
{
"font_class": "up",
"unicode": "\ue6b6"
},
{
"font_class": "top",
"unicode": "\ue6b6"
},
{
"font_class": "upload",
"unicode": "\ue690"
},
{
"font_class": "upload-filled",
"unicode": "\ue68e"
},
{
"font_class": "videocam",
"unicode": "\ue68c"
},
{
"font_class": "videocam-filled",
"unicode": "\ue689"
},
{
"font_class": "vip",
"unicode": "\ue6a8"
},
{
"font_class": "vip-filled",
"unicode": "\ue6c6"
},
{
"font_class": "wallet",
"unicode": "\ue6b1"
},
{
"font_class": "wallet-filled",
"unicode": "\ue6c2"
},
{
"font_class": "weibo",
"unicode": "\ue68b"
},
{
"font_class": "weixin",
"unicode": "\ue691"
}
] as IconsDataItem[]
// export const fontData = JSON.parse<IconsDataItem>(fontDataJson)

View File

@@ -0,0 +1,649 @@
export const fontData = [
{
"font_class": "arrow-down",
"unicode": "\ue6be"
},
{
"font_class": "arrow-left",
"unicode": "\ue6bc"
},
{
"font_class": "arrow-right",
"unicode": "\ue6bb"
},
{
"font_class": "arrow-up",
"unicode": "\ue6bd"
},
{
"font_class": "auth",
"unicode": "\ue6ab"
},
{
"font_class": "auth-filled",
"unicode": "\ue6cc"
},
{
"font_class": "back",
"unicode": "\ue6b9"
},
{
"font_class": "bars",
"unicode": "\ue627"
},
{
"font_class": "calendar",
"unicode": "\ue6a0"
},
{
"font_class": "calendar-filled",
"unicode": "\ue6c0"
},
{
"font_class": "camera",
"unicode": "\ue65a"
},
{
"font_class": "camera-filled",
"unicode": "\ue658"
},
{
"font_class": "cart",
"unicode": "\ue631"
},
{
"font_class": "cart-filled",
"unicode": "\ue6d0"
},
{
"font_class": "chat",
"unicode": "\ue65d"
},
{
"font_class": "chat-filled",
"unicode": "\ue659"
},
{
"font_class": "chatboxes",
"unicode": "\ue696"
},
{
"font_class": "chatboxes-filled",
"unicode": "\ue692"
},
{
"font_class": "chatbubble",
"unicode": "\ue697"
},
{
"font_class": "chatbubble-filled",
"unicode": "\ue694"
},
{
"font_class": "checkbox",
"unicode": "\ue62b"
},
{
"font_class": "checkbox-filled",
"unicode": "\ue62c"
},
{
"font_class": "checkmarkempty",
"unicode": "\ue65c"
},
{
"font_class": "circle",
"unicode": "\ue65b"
},
{
"font_class": "circle-filled",
"unicode": "\ue65e"
},
{
"font_class": "clear",
"unicode": "\ue66d"
},
{
"font_class": "close",
"unicode": "\ue673"
},
{
"font_class": "closeempty",
"unicode": "\ue66c"
},
{
"font_class": "cloud-download",
"unicode": "\ue647"
},
{
"font_class": "cloud-download-filled",
"unicode": "\ue646"
},
{
"font_class": "cloud-upload",
"unicode": "\ue645"
},
{
"font_class": "cloud-upload-filled",
"unicode": "\ue648"
},
{
"font_class": "color",
"unicode": "\ue6cf"
},
{
"font_class": "color-filled",
"unicode": "\ue6c9"
},
{
"font_class": "compose",
"unicode": "\ue67f"
},
{
"font_class": "contact",
"unicode": "\ue693"
},
{
"font_class": "contact-filled",
"unicode": "\ue695"
},
{
"font_class": "down",
"unicode": "\ue6b8"
},
{
"font_class": "bottom",
"unicode": "\ue6b8"
},
{
"font_class": "download",
"unicode": "\ue68d"
},
{
"font_class": "download-filled",
"unicode": "\ue681"
},
{
"font_class": "email",
"unicode": "\ue69e"
},
{
"font_class": "email-filled",
"unicode": "\ue69a"
},
{
"font_class": "eye",
"unicode": "\ue651"
},
{
"font_class": "eye-filled",
"unicode": "\ue66a"
},
{
"font_class": "eye-slash",
"unicode": "\ue6b3"
},
{
"font_class": "eye-slash-filled",
"unicode": "\ue6b4"
},
{
"font_class": "fire",
"unicode": "\ue6a1"
},
{
"font_class": "fire-filled",
"unicode": "\ue6c5"
},
{
"font_class": "flag",
"unicode": "\ue65f"
},
{
"font_class": "flag-filled",
"unicode": "\ue660"
},
{
"font_class": "folder-add",
"unicode": "\ue6a9"
},
{
"font_class": "folder-add-filled",
"unicode": "\ue6c8"
},
{
"font_class": "font",
"unicode": "\ue6a3"
},
{
"font_class": "forward",
"unicode": "\ue6ba"
},
{
"font_class": "gear",
"unicode": "\ue664"
},
{
"font_class": "gear-filled",
"unicode": "\ue661"
},
{
"font_class": "gift",
"unicode": "\ue6a4"
},
{
"font_class": "gift-filled",
"unicode": "\ue6c4"
},
{
"font_class": "hand-down",
"unicode": "\ue63d"
},
{
"font_class": "hand-down-filled",
"unicode": "\ue63c"
},
{
"font_class": "hand-up",
"unicode": "\ue63f"
},
{
"font_class": "hand-up-filled",
"unicode": "\ue63e"
},
{
"font_class": "headphones",
"unicode": "\ue630"
},
{
"font_class": "heart",
"unicode": "\ue639"
},
{
"font_class": "heart-filled",
"unicode": "\ue641"
},
{
"font_class": "help",
"unicode": "\ue679"
},
{
"font_class": "help-filled",
"unicode": "\ue674"
},
{
"font_class": "home",
"unicode": "\ue662"
},
{
"font_class": "home-filled",
"unicode": "\ue663"
},
{
"font_class": "image",
"unicode": "\ue670"
},
{
"font_class": "image-filled",
"unicode": "\ue678"
},
{
"font_class": "images",
"unicode": "\ue650"
},
{
"font_class": "images-filled",
"unicode": "\ue64b"
},
{
"font_class": "info",
"unicode": "\ue669"
},
{
"font_class": "info-filled",
"unicode": "\ue649"
},
{
"font_class": "left",
"unicode": "\ue6b7"
},
{
"font_class": "link",
"unicode": "\ue6a5"
},
{
"font_class": "list",
"unicode": "\ue644"
},
{
"font_class": "location",
"unicode": "\ue6ae"
},
{
"font_class": "location-filled",
"unicode": "\ue6af"
},
{
"font_class": "locked",
"unicode": "\ue66b"
},
{
"font_class": "locked-filled",
"unicode": "\ue668"
},
{
"font_class": "loop",
"unicode": "\ue633"
},
{
"font_class": "mail-open",
"unicode": "\ue643"
},
{
"font_class": "mail-open-filled",
"unicode": "\ue63a"
},
{
"font_class": "map",
"unicode": "\ue667"
},
{
"font_class": "map-filled",
"unicode": "\ue666"
},
{
"font_class": "map-pin",
"unicode": "\ue6ad"
},
{
"font_class": "map-pin-ellipse",
"unicode": "\ue6ac"
},
{
"font_class": "medal",
"unicode": "\ue6a2"
},
{
"font_class": "medal-filled",
"unicode": "\ue6c3"
},
{
"font_class": "mic",
"unicode": "\ue671"
},
{
"font_class": "mic-filled",
"unicode": "\ue677"
},
{
"font_class": "micoff",
"unicode": "\ue67e"
},
{
"font_class": "micoff-filled",
"unicode": "\ue6b0"
},
{
"font_class": "minus",
"unicode": "\ue66f"
},
{
"font_class": "minus-filled",
"unicode": "\ue67d"
},
{
"font_class": "more",
"unicode": "\ue64d"
},
{
"font_class": "more-filled",
"unicode": "\ue64e"
},
{
"font_class": "navigate",
"unicode": "\ue66e"
},
{
"font_class": "navigate-filled",
"unicode": "\ue67a"
},
{
"font_class": "notification",
"unicode": "\ue6a6"
},
{
"font_class": "notification-filled",
"unicode": "\ue6c1"
},
{
"font_class": "paperclip",
"unicode": "\ue652"
},
{
"font_class": "paperplane",
"unicode": "\ue672"
},
{
"font_class": "paperplane-filled",
"unicode": "\ue675"
},
{
"font_class": "person",
"unicode": "\ue699"
},
{
"font_class": "person-filled",
"unicode": "\ue69d"
},
{
"font_class": "personadd",
"unicode": "\ue69f"
},
{
"font_class": "personadd-filled",
"unicode": "\ue698"
},
{
"font_class": "personadd-filled-copy",
"unicode": "\ue6d1"
},
{
"font_class": "phone",
"unicode": "\ue69c"
},
{
"font_class": "phone-filled",
"unicode": "\ue69b"
},
{
"font_class": "plus",
"unicode": "\ue676"
},
{
"font_class": "plus-filled",
"unicode": "\ue6c7"
},
{
"font_class": "plusempty",
"unicode": "\ue67b"
},
{
"font_class": "pulldown",
"unicode": "\ue632"
},
{
"font_class": "pyq",
"unicode": "\ue682"
},
{
"font_class": "qq",
"unicode": "\ue680"
},
{
"font_class": "redo",
"unicode": "\ue64a"
},
{
"font_class": "redo-filled",
"unicode": "\ue655"
},
{
"font_class": "refresh",
"unicode": "\ue657"
},
{
"font_class": "refresh-filled",
"unicode": "\ue656"
},
{
"font_class": "refreshempty",
"unicode": "\ue6bf"
},
{
"font_class": "reload",
"unicode": "\ue6b2"
},
{
"font_class": "right",
"unicode": "\ue6b5"
},
{
"font_class": "scan",
"unicode": "\ue62a"
},
{
"font_class": "search",
"unicode": "\ue654"
},
{
"font_class": "settings",
"unicode": "\ue653"
},
{
"font_class": "settings-filled",
"unicode": "\ue6ce"
},
{
"font_class": "shop",
"unicode": "\ue62f"
},
{
"font_class": "shop-filled",
"unicode": "\ue6cd"
},
{
"font_class": "smallcircle",
"unicode": "\ue67c"
},
{
"font_class": "smallcircle-filled",
"unicode": "\ue665"
},
{
"font_class": "sound",
"unicode": "\ue684"
},
{
"font_class": "sound-filled",
"unicode": "\ue686"
},
{
"font_class": "spinner-cycle",
"unicode": "\ue68a"
},
{
"font_class": "staff",
"unicode": "\ue6a7"
},
{
"font_class": "staff-filled",
"unicode": "\ue6cb"
},
{
"font_class": "star",
"unicode": "\ue688"
},
{
"font_class": "star-filled",
"unicode": "\ue68f"
},
{
"font_class": "starhalf",
"unicode": "\ue683"
},
{
"font_class": "trash",
"unicode": "\ue687"
},
{
"font_class": "trash-filled",
"unicode": "\ue685"
},
{
"font_class": "tune",
"unicode": "\ue6aa"
},
{
"font_class": "tune-filled",
"unicode": "\ue6ca"
},
{
"font_class": "undo",
"unicode": "\ue64f"
},
{
"font_class": "undo-filled",
"unicode": "\ue64c"
},
{
"font_class": "up",
"unicode": "\ue6b6"
},
{
"font_class": "top",
"unicode": "\ue6b6"
},
{
"font_class": "upload",
"unicode": "\ue690"
},
{
"font_class": "upload-filled",
"unicode": "\ue68e"
},
{
"font_class": "videocam",
"unicode": "\ue68c"
},
{
"font_class": "videocam-filled",
"unicode": "\ue689"
},
{
"font_class": "vip",
"unicode": "\ue6a8"
},
{
"font_class": "vip-filled",
"unicode": "\ue6c6"
},
{
"font_class": "wallet",
"unicode": "\ue6b1"
},
{
"font_class": "wallet-filled",
"unicode": "\ue6c2"
},
{
"font_class": "weibo",
"unicode": "\ue68b"
},
{
"font_class": "weixin",
"unicode": "\ue691"
}
]
// export const fontData = JSON.parse<IconsDataItem>(fontDataJson)

View File

@@ -0,0 +1,89 @@
{
"id": "uni-icons",
"displayName": "uni-icons 图标",
"version": "2.0.10",
"description": "图标组件,用于展示移动端常见的图标,可自定义颜色、大小。",
"keywords": [
"uni-ui",
"uniui",
"icon",
"图标"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": "^3.2.14"
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
"type": "component-vue"
},
"uni_modules": {
"dependencies": ["uni-scss"],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y",
"alipay": "n"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y",
"app-uvue": "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",
"钉钉": "y",
"快手": "y",
"飞书": "y",
"京东": "y"
},
"快应用": {
"华为": "y",
"联盟": "y"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

View File

@@ -0,0 +1,8 @@
## Icons 图标
> **组件名uni-icons**
> 代码块: `uIcons`
用于展示 icons 图标 。
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-icons)
#### 如使用过程中有任何问题或者您对uni-ui有一些好的建议欢迎加入 uni-ui 交流群871950839

View File

@@ -0,0 +1,39 @@
## 1.2.82024-04-26
- 修复 在vue2下H5黑边的bug
## 1.2.72024-04-26
- 修复 在vue2手动输入后失焦导致清空数值的严重bug
## 1.2.62024-02-22
- 新增 设置宽度属性width(单位px)
## 1.2.52024-02-21
- 修复 step步长小于1时键盘类型为number的bug
## 1.2.42024-02-02
- 修复 加减号垂直位置偏移样式问题
## 1.2.32023-05-23
- 更新示例工程
## 1.2.22023-05-08
- 修复 change 事件执行顺序错误的问题
## 1.2.12021-11-22
- 修复 vue3中某些scss变量无法找到的问题
## 1.2.02021-11-19
- 优化 组件UI并提供设计资源详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-number-box](https://uniapp.dcloud.io/component/uniui/uni-number-box)
## 1.1.22021-11-09
- 新增 提供组件设计资源,组件样式调整
## 1.1.12021-07-30
- 优化 vue3下事件警告的问题
## 1.1.02021-07-13
- 组件兼容 vue3如何创建vue3项目详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.0.72021-05-12
- 新增 组件示例地址
## 1.0.62021-04-20
- 修复 uni-number-box 浮点数运算不精确的 bug
- 修复 uni-number-box change 事件触发不正确的 bug
- 新增 uni-number-box v-model 双向绑定
## 1.0.52021-02-05
- 调整为uni_modules目录规范
## 1.0.72021-02-05
- 调整为uni_modules目录规范
- 新增 支持 v-model
- 新增 支持 focus、blur 事件
- 新增 支持 PC 端

View File

@@ -0,0 +1,232 @@
<template>
<view class="uni-numbox">
<view @click="_calcValue('minus')" class="uni-numbox__minus uni-numbox-btns" :style="{background}">
<text class="uni-numbox--text" :class="{ 'uni-numbox--disabled': inputValue <= min || disabled }"
:style="{color}">-</text>
</view>
<input :disabled="disabled" @focus="_onFocus" @blur="_onBlur" class="uni-numbox__value"
:type="step<1?'digit':'number'" v-model="inputValue" :style="{background, color, width:widthWithPx}" />
<view @click="_calcValue('plus')" class="uni-numbox__plus uni-numbox-btns" :style="{background}">
<text class="uni-numbox--text" :class="{ 'uni-numbox--disabled': inputValue >= max || disabled }"
:style="{color}">+</text>
</view>
</view>
</template>
<script>
/**
* NumberBox 数字输入框
* @description 带加减按钮的数字输入框
* @tutorial https://ext.dcloud.net.cn/plugin?id=31
* @property {Number} value 输入框当前值
* @property {Number} min 最小值
* @property {Number} max 最大值
* @property {Number} step 每次点击改变的间隔大小
* @property {String} background 背景色
* @property {String} color 字体颜色(前景色)
* @property {Number} width 输入框宽度(单位:px)
* @property {Boolean} disabled = [true|false] 是否为禁用状态
* @event {Function} change 输入框值改变时触发的事件,参数为输入框当前的 value
* @event {Function} focus 输入框聚焦时触发的事件,参数为 event 对象
* @event {Function} blur 输入框失焦时触发的事件,参数为 event 对象
*/
export default {
name: "UniNumberBox",
emits: ['change', 'input', 'update:modelValue', 'blur', 'focus'],
props: {
value: {
type: [Number, String],
default: 1
},
modelValue: {
type: [Number, String],
default: 1
},
min: {
type: Number,
default: 0
},
max: {
type: Number,
default: 100
},
step: {
type: Number,
default: 1
},
background: {
type: String,
default: '#f5f5f5'
},
color: {
type: String,
default: '#333'
},
disabled: {
type: Boolean,
default: false
},
width: {
type: Number,
default: 40,
}
},
data() {
return {
inputValue: 0
};
},
watch: {
value(val) {
this.inputValue = +val;
},
modelValue(val) {
this.inputValue = +val;
}
},
computed: {
widthWithPx() {
return this.width + 'px';
}
},
created() {
if (this.value === 1) {
this.inputValue = +this.modelValue;
}
if (this.modelValue === 1) {
this.inputValue = +this.value;
}
},
methods: {
_calcValue(type) {
if (this.disabled) {
return;
}
const scale = this._getDecimalScale();
let value = this.inputValue * scale;
let step = this.step * scale;
if (type === "minus") {
value -= step;
if (value < (this.min * scale)) {
return;
}
if (value > (this.max * scale)) {
value = this.max * scale
}
}
if (type === "plus") {
value += step;
if (value > (this.max * scale)) {
return;
}
if (value < (this.min * scale)) {
value = this.min * scale
}
}
this.inputValue = (value / scale).toFixed(String(scale).length - 1);
// TODO vue2 兼容
this.$emit("input", +this.inputValue);
// TODO vue3 兼容
this.$emit("update:modelValue", +this.inputValue);
this.$emit("change", +this.inputValue);
},
_getDecimalScale() {
let scale = 1;
// 浮点型
if (~~this.step !== this.step) {
scale = Math.pow(10, String(this.step).split(".")[1].length);
}
return scale;
},
_onBlur(event) {
this.$emit('blur', event)
let value = event.detail.value;
if (isNaN(value)) {
this.inputValue = this.value;
return;
}
value = +value;
if (value > this.max) {
value = this.max;
} else if (value < this.min) {
value = this.min;
}
const scale = this._getDecimalScale();
this.inputValue = value.toFixed(String(scale).length - 1);
this.$emit("input", +this.inputValue);
this.$emit("update:modelValue", +this.inputValue);
this.$emit("change", +this.inputValue);
},
_onFocus(event) {
this.$emit('focus', event)
}
}
};
</script>
<style lang="scss">
$box-height: 26px;
$bg: #f5f5f5;
$br: 2px;
$color: #333;
.uni-numbox {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
}
.uni-numbox-btns {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0 8px;
background-color: $bg;
/* #ifdef H5 */
cursor: pointer;
/* #endif */
}
.uni-numbox__value {
margin: 0 2px;
background-color: $bg;
width: 40px;
height: $box-height;
text-align: center;
font-size: 14px;
border-width: 0;
color: $color;
}
.uni-numbox__minus {
border-top-left-radius: $br;
border-bottom-left-radius: $br;
}
.uni-numbox__plus {
border-top-right-radius: $br;
border-bottom-right-radius: $br;
}
.uni-numbox--text {
// fix nvue
line-height: 20px;
margin-bottom: 2px;
font-size: 20px;
font-weight: 300;
color: $color;
}
.uni-numbox .uni-numbox--disabled {
color: #c0c0c0 !important;
/* #ifdef H5 */
cursor: not-allowed;
/* #endif */
}
</style>

View File

@@ -0,0 +1,83 @@
{
"id": "uni-number-box",
"displayName": "uni-number-box 数字输入框",
"version": "1.2.8",
"description": "NumberBox 带加减按钮的数字输入框组件,用户可以控制每次点击增加的数值,支持小数。",
"keywords": [
"uni-ui",
"uniui",
"数字输入框"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
"type": "component-vue"
},
"uni_modules": {
"dependencies": ["uni-scss"],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y",
"alipay": "n"
},
"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"
}
}
}
}
}

View File

@@ -0,0 +1,13 @@
## NumberBox 数字输入框
> **组件名uni-number-box**
> 代码块: `uNumberBox`
带加减按钮的数字输入框。
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-number-box)
#### 如使用过程中有任何问题或者您对uni-ui有一些好的建议欢迎加入 uni-ui 交流群871950839

View File

@@ -0,0 +1,8 @@
## 1.0.32022-01-21
- 优化 组件示例
## 1.0.22021-11-22
- 修复 / 符号在 vue 不同版本兼容问题引起的报错问题
## 1.0.12021-11-22
- 修复 vue3中scss语法兼容问题
## 1.0.02021-11-18
- init

View File

@@ -0,0 +1 @@
@import './styles/index.scss';

View File

@@ -0,0 +1,82 @@
{
"id": "uni-scss",
"displayName": "uni-scss 辅助样式",
"version": "1.0.3",
"description": "uni-sass是uni-ui提供的一套全局样式 通过一些简单的类名和sass变量实现简单的页面布局操作比如颜色、边距、圆角等。",
"keywords": [
"uni-scss",
"uni-ui",
"辅助样式"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": "^3.1.0"
},
"dcloudext": {
"category": [
"JS SDK",
"通用 SDK"
],
"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": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "u"
},
"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"
},
"快应用": {
"华为": "n",
"联盟": "n"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

View File

@@ -0,0 +1,4 @@
`uni-sass``uni-ui`提供的一套全局样式 ,通过一些简单的类名和`sass`变量,实现简单的页面布局操作,比如颜色、边距、圆角等。
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-sass)
#### 如使用过程中有任何问题或者您对uni-ui有一些好的建议欢迎加入 uni-ui 交流群871950839

View File

@@ -0,0 +1,7 @@
@import './setting/_variables.scss';
@import './setting/_border.scss';
@import './setting/_color.scss';
@import './setting/_space.scss';
@import './setting/_radius.scss';
@import './setting/_text.scss';
@import './setting/_styles.scss';

View File

@@ -0,0 +1,3 @@
.uni-border {
border: 1px $uni-border-1 solid;
}

View File

@@ -0,0 +1,66 @@
// TODO 暂时不需要 class ,需要用户使用变量实现 ,如果使用类名其实并不推荐
// @mixin get-styles($k,$c) {
// @if $k == size or $k == weight{
// font-#{$k}:#{$c}
// }@else{
// #{$k}:#{$c}
// }
// }
$uni-ui-color:(
// 主色
primary: $uni-primary,
primary-disable: $uni-primary-disable,
primary-light: $uni-primary-light,
// 辅助色
success: $uni-success,
success-disable: $uni-success-disable,
success-light: $uni-success-light,
warning: $uni-warning,
warning-disable: $uni-warning-disable,
warning-light: $uni-warning-light,
error: $uni-error,
error-disable: $uni-error-disable,
error-light: $uni-error-light,
info: $uni-info,
info-disable: $uni-info-disable,
info-light: $uni-info-light,
// 中性色
main-color: $uni-main-color,
base-color: $uni-base-color,
secondary-color: $uni-secondary-color,
extra-color: $uni-extra-color,
// 背景色
bg-color: $uni-bg-color,
// 边框颜色
border-1: $uni-border-1,
border-2: $uni-border-2,
border-3: $uni-border-3,
border-4: $uni-border-4,
// 黑色
black:$uni-black,
// 白色
white:$uni-white,
// 透明
transparent:$uni-transparent
) !default;
@each $key, $child in $uni-ui-color {
.uni-#{"" + $key} {
color: $child;
}
.uni-#{"" + $key}-bg {
background-color: $child;
}
}
.uni-shadow-sm {
box-shadow: $uni-shadow-sm;
}
.uni-shadow-base {
box-shadow: $uni-shadow-base;
}
.uni-shadow-lg {
box-shadow: $uni-shadow-lg;
}
.uni-mask {
background-color:$uni-mask;
}

View File

@@ -0,0 +1,55 @@
@mixin radius($r,$d:null ,$important: false){
$radius-value:map-get($uni-radius, $r) if($important, !important, null);
// Key exists within the $uni-radius variable
@if (map-has-key($uni-radius, $r) and $d){
@if $d == t {
border-top-left-radius:$radius-value;
border-top-right-radius:$radius-value;
}@else if $d == r {
border-top-right-radius:$radius-value;
border-bottom-right-radius:$radius-value;
}@else if $d == b {
border-bottom-left-radius:$radius-value;
border-bottom-right-radius:$radius-value;
}@else if $d == l {
border-top-left-radius:$radius-value;
border-bottom-left-radius:$radius-value;
}@else if $d == tl {
border-top-left-radius:$radius-value;
}@else if $d == tr {
border-top-right-radius:$radius-value;
}@else if $d == br {
border-bottom-right-radius:$radius-value;
}@else if $d == bl {
border-bottom-left-radius:$radius-value;
}
}@else{
border-radius:$radius-value;
}
}
@each $key, $child in $uni-radius {
@if($key){
.uni-radius-#{"" + $key} {
@include radius($key)
}
}@else{
.uni-radius {
@include radius($key)
}
}
}
@each $direction in t, r, b, l,tl, tr, br, bl {
@each $key, $child in $uni-radius {
@if($key){
.uni-radius-#{"" + $direction}-#{"" + $key} {
@include radius($key,$direction,false)
}
}@else{
.uni-radius-#{$direction} {
@include radius($key,$direction,false)
}
}
}
}

View File

@@ -0,0 +1,56 @@
@mixin fn($space,$direction,$size,$n) {
@if $n {
#{$space}-#{$direction}: #{$size*$uni-space-root}px
} @else {
#{$space}-#{$direction}: #{-$size*$uni-space-root}px
}
}
@mixin get-styles($direction,$i,$space,$n){
@if $direction == t {
@include fn($space, top,$i,$n);
}
@if $direction == r {
@include fn($space, right,$i,$n);
}
@if $direction == b {
@include fn($space, bottom,$i,$n);
}
@if $direction == l {
@include fn($space, left,$i,$n);
}
@if $direction == x {
@include fn($space, left,$i,$n);
@include fn($space, right,$i,$n);
}
@if $direction == y {
@include fn($space, top,$i,$n);
@include fn($space, bottom,$i,$n);
}
@if $direction == a {
@if $n {
#{$space}:#{$i*$uni-space-root}px;
} @else {
#{$space}:#{-$i*$uni-space-root}px;
}
}
}
@each $orientation in m,p {
$space: margin;
@if $orientation == m {
$space: margin;
} @else {
$space: padding;
}
@for $i from 0 through 16 {
@each $direction in t, r, b, l, x, y, a {
.uni-#{$orientation}#{$direction}-#{$i} {
@include get-styles($direction,$i,$space,true);
}
.uni-#{$orientation}#{$direction}-n#{$i} {
@include get-styles($direction,$i,$space,false);
}
}
}
}

View File

@@ -0,0 +1,167 @@
/* #ifndef APP-NVUE */
$-color-white:#fff;
$-color-black:#000;
@mixin base-style($color) {
color: #fff;
background-color: $color;
border-color: mix($-color-black, $color, 8%);
&:not([hover-class]):active {
background: mix($-color-black, $color, 10%);
border-color: mix($-color-black, $color, 20%);
color: $-color-white;
outline: none;
}
}
@mixin is-color($color) {
@include base-style($color);
&[loading] {
@include base-style($color);
&::before {
margin-right:5px;
}
}
&[disabled] {
&,
&[loading],
&:not([hover-class]):active {
color: $-color-white;
border-color: mix(darken($color,10%), $-color-white);
background-color: mix($color, $-color-white);
}
}
}
@mixin base-plain-style($color) {
color:$color;
background-color: mix($-color-white, $color, 90%);
border-color: mix($-color-white, $color, 70%);
&:not([hover-class]):active {
background: mix($-color-white, $color, 80%);
color: $color;
outline: none;
border-color: mix($-color-white, $color, 50%);
}
}
@mixin is-plain($color){
&[plain] {
@include base-plain-style($color);
&[loading] {
@include base-plain-style($color);
&::before {
margin-right:5px;
}
}
&[disabled] {
&,
&:active {
color: mix($-color-white, $color, 40%);
background-color: mix($-color-white, $color, 90%);
border-color: mix($-color-white, $color, 80%);
}
}
}
}
.uni-btn {
margin: 5px;
color: #393939;
border:1px solid #ccc;
font-size: 16px;
font-weight: 200;
background-color: #F9F9F9;
// TODO 暂时处理边框隐藏一边的问题
overflow: visible;
&::after{
border: none;
}
&:not([type]),&[type=default] {
color: #999;
&[loading] {
background: none;
&::before {
margin-right:5px;
}
}
&[disabled]{
color: mix($-color-white, #999, 60%);
&,
&[loading],
&:active {
color: mix($-color-white, #999, 60%);
background-color: mix($-color-white,$-color-black , 98%);
border-color: mix($-color-white, #999, 85%);
}
}
&[plain] {
color: #999;
background: none;
border-color: $uni-border-1;
&:not([hover-class]):active {
background: none;
color: mix($-color-white, $-color-black, 80%);
border-color: mix($-color-white, $-color-black, 90%);
outline: none;
}
&[disabled]{
&,
&[loading],
&:active {
background: none;
color: mix($-color-white, #999, 60%);
border-color: mix($-color-white, #999, 85%);
}
}
}
}
&:not([hover-class]):active {
color: mix($-color-white, $-color-black, 50%);
}
&[size=mini] {
font-size: 16px;
font-weight: 200;
border-radius: 8px;
}
&.uni-btn-small {
font-size: 14px;
}
&.uni-btn-mini {
font-size: 12px;
}
&.uni-btn-radius {
border-radius: 999px;
}
&[type=primary] {
@include is-color($uni-primary);
@include is-plain($uni-primary)
}
&[type=success] {
@include is-color($uni-success);
@include is-plain($uni-success)
}
&[type=error] {
@include is-color($uni-error);
@include is-plain($uni-error)
}
&[type=warning] {
@include is-color($uni-warning);
@include is-plain($uni-warning)
}
&[type=info] {
@include is-color($uni-info);
@include is-plain($uni-info)
}
}
/* #endif */

View File

@@ -0,0 +1,24 @@
@mixin get-styles($k,$c) {
@if $k == size or $k == weight{
font-#{$k}:#{$c}
}@else{
#{$k}:#{$c}
}
}
@each $key, $child in $uni-headings {
/* #ifndef APP-NVUE */
.uni-#{$key} {
@each $k, $c in $child {
@include get-styles($k,$c)
}
}
/* #endif */
/* #ifdef APP-NVUE */
.container .uni-#{$key} {
@each $k, $c in $child {
@include get-styles($k,$c)
}
}
/* #endif */
}

View File

@@ -0,0 +1,146 @@
// @use "sass:math";
@import '../tools/functions.scss';
// 间距基础倍数
$uni-space-root: 2 !default;
// 边框半径默认值
$uni-radius-root:5px !default;
$uni-radius: () !default;
// 边框半径断点
$uni-radius: map-deep-merge(
(
0: 0,
// TODO 当前版本暂时不支持 sm 属性
// 'sm': math.div($uni-radius-root, 2),
null: $uni-radius-root,
'lg': $uni-radius-root * 2,
'xl': $uni-radius-root * 6,
'pill': 9999px,
'circle': 50%
),
$uni-radius
);
// 字体家族
$body-font-family: 'Roboto', sans-serif !default;
// 文本
$heading-font-family: $body-font-family !default;
$uni-headings: () !default;
$letterSpacing: -0.01562em;
$uni-headings: map-deep-merge(
(
'h1': (
size: 32px,
weight: 300,
line-height: 50px,
// letter-spacing:-0.01562em
),
'h2': (
size: 28px,
weight: 300,
line-height: 40px,
// letter-spacing: -0.00833em
),
'h3': (
size: 24px,
weight: 400,
line-height: 32px,
// letter-spacing: normal
),
'h4': (
size: 20px,
weight: 400,
line-height: 30px,
// letter-spacing: 0.00735em
),
'h5': (
size: 16px,
weight: 400,
line-height: 24px,
// letter-spacing: normal
),
'h6': (
size: 14px,
weight: 500,
line-height: 18px,
// letter-spacing: 0.0125em
),
'subtitle': (
size: 12px,
weight: 400,
line-height: 20px,
// letter-spacing: 0.00937em
),
'body': (
font-size: 14px,
font-weight: 400,
line-height: 22px,
// letter-spacing: 0.03125em
),
'caption': (
'size': 12px,
'weight': 400,
'line-height': 20px,
// 'letter-spacing': 0.03333em,
// 'text-transform': false
)
),
$uni-headings
);
// 主色
$uni-primary: #2979ff !default;
$uni-primary-disable:lighten($uni-primary,20%) !default;
$uni-primary-light: lighten($uni-primary,25%) !default;
// 辅助色
// 除了主色外的场景色,需要在不同的场景中使用(例如危险色表示危险的操作)。
$uni-success: #18bc37 !default;
$uni-success-disable:lighten($uni-success,20%) !default;
$uni-success-light: lighten($uni-success,25%) !default;
$uni-warning: #f3a73f !default;
$uni-warning-disable:lighten($uni-warning,20%) !default;
$uni-warning-light: lighten($uni-warning,25%) !default;
$uni-error: #e43d33 !default;
$uni-error-disable:lighten($uni-error,20%) !default;
$uni-error-light: lighten($uni-error,25%) !default;
$uni-info: #8f939c !default;
$uni-info-disable:lighten($uni-info,20%) !default;
$uni-info-light: lighten($uni-info,25%) !default;
// 中性色
// 中性色用于文本、背景和边框颜色。通过运用不同的中性色,来表现层次结构。
$uni-main-color: #3a3a3a !default; // 主要文字
$uni-base-color: #6a6a6a !default; // 常规文字
$uni-secondary-color: #909399 !default; // 次要文字
$uni-extra-color: #c7c7c7 !default; // 辅助说明
// 边框颜色
$uni-border-1: #F0F0F0 !default;
$uni-border-2: #EDEDED !default;
$uni-border-3: #DCDCDC !default;
$uni-border-4: #B9B9B9 !default;
// 常规色
$uni-black: #000000 !default;
$uni-white: #ffffff !default;
$uni-transparent: rgba($color: #000000, $alpha: 0) !default;
// 背景色
$uni-bg-color: #f7f7f7 !default;
/* 水平间距 */
$uni-spacing-sm: 8px !default;
$uni-spacing-base: 15px !default;
$uni-spacing-lg: 30px !default;
// 阴影
$uni-shadow-sm:0 0 5px rgba($color: #d8d8d8, $alpha: 0.5) !default;
$uni-shadow-base:0 1px 8px 1px rgba($color: #a5a5a5, $alpha: 0.2) !default;
$uni-shadow-lg:0px 1px 10px 2px rgba($color: #a5a4a4, $alpha: 0.5) !default;
// 蒙版
$uni-mask: rgba($color: #000000, $alpha: 0.4) !default;

View File

@@ -0,0 +1,19 @@
// 合并 map
@function map-deep-merge($parent-map, $child-map){
$result: $parent-map;
@each $key, $child in $child-map {
$parent-has-key: map-has-key($result, $key);
$parent-value: map-get($result, $key);
$parent-type: type-of($parent-value);
$child-type: type-of($child);
$parent-is-map: $parent-type == map;
$child-is-map: $child-type == map;
@if (not $parent-has-key) or ($parent-type != $child-type) or (not ($parent-is-map and $child-is-map)){
$result: map-merge($result, ( $key: $child ));
}@else {
$result: map-merge($result, ( $key: map-deep-merge($parent-value, $child) ));
}
}
@return $result;
};

View File

@@ -0,0 +1,31 @@
// 间距基础倍数
$uni-space-root: 2;
// 边框半径默认值
$uni-radius-root:5px;
// 主色
$uni-primary: #2979ff;
// 辅助色
$uni-success: #4cd964;
// 警告色
$uni-warning: #f0ad4e;
// 错误色
$uni-error: #dd524d;
// 描述色
$uni-info: #909399;
// 中性色
$uni-main-color: #303133;
$uni-base-color: #606266;
$uni-secondary-color: #909399;
$uni-extra-color: #C0C4CC;
// 背景色
$uni-bg-color: #f5f5f5;
// 边框颜色
$uni-border-1: #DCDFE6;
$uni-border-2: #E4E7ED;
$uni-border-3: #EBEEF5;
$uni-border-4: #F2F6FC;
// 常规色
$uni-black: #000000;
$uni-white: #ffffff;
$uni-transparent: rgba($color: #000000, $alpha: 0);

View File

@@ -0,0 +1,62 @@
@import './styles/setting/_variables.scss';
// 间距基础倍数
$uni-space-root: 2;
// 边框半径默认值
$uni-radius-root:5px;
// 主色
$uni-primary: #2979ff;
$uni-primary-disable:mix(#fff,$uni-primary,50%);
$uni-primary-light: mix(#fff,$uni-primary,80%);
// 辅助色
// 除了主色外的场景色,需要在不同的场景中使用(例如危险色表示危险的操作)。
$uni-success: #18bc37;
$uni-success-disable:mix(#fff,$uni-success,50%);
$uni-success-light: mix(#fff,$uni-success,80%);
$uni-warning: #f3a73f;
$uni-warning-disable:mix(#fff,$uni-warning,50%);
$uni-warning-light: mix(#fff,$uni-warning,80%);
$uni-error: #e43d33;
$uni-error-disable:mix(#fff,$uni-error,50%);
$uni-error-light: mix(#fff,$uni-error,80%);
$uni-info: #8f939c;
$uni-info-disable:mix(#fff,$uni-info,50%);
$uni-info-light: mix(#fff,$uni-info,80%);
// 中性色
// 中性色用于文本、背景和边框颜色。通过运用不同的中性色,来表现层次结构。
$uni-main-color: #3a3a3a; // 主要文字
$uni-base-color: #6a6a6a; // 常规文字
$uni-secondary-color: #909399; // 次要文字
$uni-extra-color: #c7c7c7; // 辅助说明
// 边框颜色
$uni-border-1: #F0F0F0;
$uni-border-2: #EDEDED;
$uni-border-3: #DCDCDC;
$uni-border-4: #B9B9B9;
// 常规色
$uni-black: #000000;
$uni-white: #ffffff;
$uni-transparent: rgba($color: #000000, $alpha: 0);
// 背景色
$uni-bg-color: #f7f7f7;
/* 水平间距 */
$uni-spacing-sm: 8px;
$uni-spacing-base: 15px;
$uni-spacing-lg: 30px;
// 阴影
$uni-shadow-sm:0 0 5px rgba($color: #d8d8d8, $alpha: 0.5);
$uni-shadow-base:0 1px 8px 1px rgba($color: #a5a5a5, $alpha: 0.2);
$uni-shadow-lg:0px 1px 10px 2px rgba($color: #a5a4a4, $alpha: 0.5);
// 蒙版
$uni-mask: rgba($color: #000000, $alpha: 0.4);

View File

@@ -0,0 +1,9 @@
## 1.0.12024-12-06
- 新增 搜索功能,支持输入关键词筛选选项
## 1.0.02024-12-05
- 基础选择器功能
- 默认值支持
- 可清除功能
- 禁用选项和禁用状态
- 样式定制功能,支持自定义高度、颜色等
- 暗黑模式适配

View File

@@ -0,0 +1,407 @@
<template>
<view class="wht-select-wrapper" :class="{ 'is-disabled': disabled }">
<view
class="wht-select-inner"
:class="{
'is-active': isOpen,
'is-placeholder': !currentValue
}"
:style="{
height: height + 'px',
backgroundColor: backgroundColor,
borderColor: borderColor,
borderRadius: borderRadius + 'px'
}"
@click="togglePicker"
>
<view class="wht-select-value">
<input
v-if="filterable"
class="wht-select-input"
v-model="searchQuery"
:placeholder="currentValue ? currentLabel : placeholder"
:style="{
fontSize: fontSize + 'px',
color: currentValue ? textColor : placeholderColor
}"
@click.stop
@input="onSearch"
@focus="handleFocus"
/>
<text
v-else
:style="{
fontSize: fontSize + 'px',
color: currentValue ? textColor : placeholderColor
}"
>{{ currentLabel || placeholder }}</text>
</view>
<view class="wht-select-suffix">
<view
v-if="clearable && currentValue && !disabled"
class="wht-select-clear"
@click.stop="clearValue"
>×</view>
<view
v-else
class="wht-select-arrow"
:style="{ borderTopColor: placeholderColor }"
></view>
</view>
</view>
<view v-if="isOpen" class="select-dropdown">
<view class="select-dropdown-mask" @click.stop="togglePicker"></view>
<view
class="select-dropdown-content"
:style="{
backgroundColor: backgroundColor,
borderRadius: borderRadius + 'px'
}"
>
<template v-if="filteredOptions.length > 0">
<view
v-for="(item, index) in filteredOptions"
:key="item.value"
:class="{
'disabled': item.disabled,
'active': currentValue === item.value
}"
:style="{
fontSize: fontSize + 'px',
color: item.disabled ? placeholderColor : textColor,
backgroundColor: currentValue === item.value ? activeColor + '20' : backgroundColor
}"
@click.stop="selectOption(item, index)"
>
{{ item.label }}
</view>
</template>
<view
v-else
class="select-dropdown-empty"
:style="{
fontSize: fontSize + 'px',
color: placeholderColor
}"
>
暂无数据
</view>
</view>
</view>
</view>
</template>
<script>
export default {
name: 'wht-select',
props: {
options: {
type: Array,
default: () => []
},
value: {
type: [String, Number],
default: ''
},
placeholder: {
type: String,
default: '请选择'
},
disabled: {
type: Boolean,
default: false
},
clearable: {
type: Boolean,
default: false
},
// 样式相关的props
height: {
type: Number,
default: 40
},
fontSize: {
type: Number,
default: 14
},
borderColor: {
type: String,
default: '#dcdfe6'
},
borderRadius: {
type: Number,
default: 4
},
backgroundColor: {
type: String,
default: '#ffffff'
},
textColor: {
type: String,
default: '#606266'
},
placeholderColor: {
type: String,
default: '#c0c4cc'
},
activeColor: {
type: String,
default: '#409eff'
},
filterable: {
type: Boolean,
default: false
},
searchPlaceholder: {
type: String,
default: '请输入搜索内容'
}
},
data() {
return {
currentValue: '',
isOpen: false,
searchQuery: ''
}
},
computed: {
currentLabel() {
const option = this.options.find(item => item.value === this.currentValue)
return option ? option.label : ''
},
filteredOptions() {
if (!this.filterable || !this.searchQuery) {
return this.options
}
return this.options.filter(item =>
item.label.toLowerCase().includes(this.searchQuery.toLowerCase())
)
}
},
watch: {
value: {
handler(newVal) {
this.currentValue = newVal
},
immediate: true
}
},
methods: {
togglePicker() {
if (this.disabled) return
this.isOpen = !this.isOpen
if (!this.isOpen) {
this.searchQuery = ''
}
},
selectOption(item, index) {
if (item.disabled) return
this.currentValue = item.value
this.searchQuery = ''
this.$emit('input', item.value)
this.$emit('change', item)
this.isOpen = false
},
clearValue(e) {
this.currentValue = ''
this.searchQuery = ''
this.$emit('input', '')
this.$emit('change', null)
this.$emit('clear')
},
onSearch() {
this.$emit('search', this.searchQuery)
},
handleFocus() {
if (!this.disabled) {
this.isOpen = true
}
}
}
}
</script>
<style lang="scss" scoped>
.wht-select-wrapper {
width: 100%;
position: relative;
.wht-select-inner {
position: relative;
width: 100%;
border-width: 1px;
border-style: solid;
transition: all 0.2s;
cursor: pointer;
&.is-active {
.wht-select-arrow {
transform: rotate(180deg);
}
}
}
.wht-select-value {
position: absolute;
left: 12px;
right: 30px;
top: 50%;
transform: translateY(-50%);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
height: 100%;
display: flex;
align-items: center;
}
.wht-select-suffix {
position: absolute;
right: 8px;
top: 50%;
transform: translateY(-50%);
display: flex;
align-items: center;
}
.wht-select-clear {
width: 16px;
height: 16px;
line-height: 16px;
text-align: center;
border-radius: 50%;
background-color: #c0c4cc;
color: #fff;
font-size: 12px;
cursor: pointer;
transition: all 0.2s;
&:hover {
background-color: #909399;
}
}
.wht-select-arrow {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 5px solid;
transition: transform 0.2s;
}
.select-dropdown {
position: absolute;
top: 100%;
left: 0;
width: 100%;
margin-top: 4px;
z-index: 999;
}
.select-dropdown-mask {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 998;
}
.select-dropdown-content {
position: relative;
max-height: 240px;
border: 1px solid #e4e7ed;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
z-index: 999;
overflow-y: auto;
&::-webkit-scrollbar {
width: 6px;
}
&::-webkit-scrollbar-thumb {
background-color: #e4e7ed;
border-radius: 3px;
}
> view {
padding: 0 12px;
height: 36px;
line-height: 36px;
cursor: pointer;
&.disabled {
cursor: not-allowed;
}
}
.select-dropdown-search {
padding: 8px;
border-bottom: 1px solid #e4e7ed;
input {
width: 100%;
height: 32px;
padding: 0 8px;
border: 1px solid #dcdfe6;
border-radius: 4px;
font-size: 14px;
&:focus {
border-color: #409eff;
outline: none;
}
}
}
.select-dropdown-empty {
padding: 12px;
text-align: center;
}
}
.wht-select-input {
width: 100%;
height: 100%;
background: transparent;
border: none;
outline: none;
padding: 0;
margin: 0;
line-height: normal;
&::placeholder {
color: inherit;
line-height: normal;
}
}
}
// 暗黑模式适配
@media (prefers-color-scheme: dark) {
.wht-select-wrapper {
.select-dropdown-content {
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.3);
&::-webkit-scrollbar-thumb {
background-color: #48484a;
}
.select-dropdown-search {
border-bottom-color: #48484a;
input {
border-color: #48484a;
background-color: #1c1c1e;
color: #fff;
&:focus {
border-color: #409eff;
}
}
}
}
}
}
</style>

View File

@@ -0,0 +1,87 @@
{
"id": "wht-select",
"displayName": "wht-select 增强下拉选择器组件",
"version": "1.0.1",
"description": "一个简单易用的下拉选择器组件,支持丰富的样式定制",
"keywords": [
"select",
"选择器",
"下拉选择",
"表单"
],
"repository": "https://gitee.com/funnywuss/uniapp-plugins.git wht-select",
"engines": {
"HBuilderX": "^3.1.0"
},
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "",
"type": "component-vue"
},
"uni_modules": {
"dependencies": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y",
"alipay": "n"
},
"client": {
"Vue": {
"vue2": "y",
"vue3": "y"
},
"App": {
"app-vue": "y",
"app-nvue": "n",
"app-harmony": "u",
"app-uvue": "u"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "n",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y",
"钉钉": "y",
"快手": "y",
"飞书": "y",
"京东": "y"
},
"快应用": {
"华为": "y",
"联盟": "y"
}
}
}
}
}

View File

@@ -0,0 +1,109 @@
# wht-select 选择器组件
## 介绍
一个简单易用的下拉选择器组件,支持丰富的样式定制。
## 使用方法
```vue
<template>
<wht-select v-model="value" :options="options" placeholder="请选择" />
</template>
<script>
export default {
data() {
return {
value: '',
options: [
{ label: '选项一', value: '1' },
{ label: '选项二', value: '2' },
{ label: '选项三', value: '3' }
]
}
}
}
</script>
```
## Props 属性说明
| 参数 | 说明 | 类型 | 默认值 |
|------|------|------|--------|
| value/v-model | 绑定值 | string/number | - |
| options | 选项数据 | array | [] |
| placeholder | 占位符 | string | '请选择' |
| disabled | 是否禁用 | boolean | false |
| clearable | 是否可清除 | boolean | false |
| height | 选择器高度 | number | 40 |
| fontSize | 字体大小 | number | 14 |
| borderColor | 边框颜色 | string | '#dcdfe6' |
| borderRadius | 圆角大小 | number | 4 |
| backgroundColor | 背景颜色 | string | '#ffffff' |
| textColor | 文字颜色 | string | '#606266' |
| placeholderColor | 占位符颜色 | string | '#c0c4cc' |
| activeColor | 激活状态颜色 | string | '#409eff' |
| filterable | 是否开启搜索功能 | Boolean | false |
## Events 事件说明
| 事件名 | 说明 | 回调参数 |
|--------|------|----------|
| change | 选中值发生变化时触发 | 目前选中的值 |
| clear | 点击清除按钮时触发 | - |
| search | 搜索输入时触发 | (query: string) 搜索关键词 |
### Options 数据结构
```js
{
label: string, // 显示的文本
value: string/number, // 选项的值
disabled?: boolean // 是否禁用该选项
}
```
## 代码示例
### 基础用法
```vue
<template>
<wht-select v-model="value" :options="options" placeholder="请选择" />
</template>
<script>
export default {
data() {
return {
value: '',
options: [
{ label: '选项一', value: '1' },
{ label: '选项二', value: '2' },
{ label: '选项三', value: '3' }
]
}
}
}
</script>
```
### 可搜索
```vue
<template>
<wht-select v-model="value" :options="options" placeholder="请选择" filterable />
</template>
<script>
export default {
data() {
return {
value: '',
options: [
{ label: '选项一', value: '1' },
{ label: '选项二', value: '2' },
{ label: '选项三', value: '3' }
]
}
}
}
</script>
```

File diff suppressed because one or more lines are too long

View File

@@ -1 +1 @@
{"version":3,"file":"app.js","sources":["App.vue","main.js"],"sourcesContent":["<script lang=\"ts\">\r\n\r\n\r\n\r\n\r\n\r\n\r\n// Required information\r\n// You can get userSig from TencentCloud chat console for Testing TUIKit.\r\n// Deploy production environment please get it from your server.\r\n// View https://cloud.tencent.com/document/product/269/32688\r\n\r\nexport default {\r\n data() {\r\n return {\r\n info: {},\r\n userSig: \"\",\r\n chatInfo: {},\r\n };\r\n },\r\n onLoad(option) {\r\n uni.getStorage({\r\n key: \"userinfo\",\r\n success: (res) => {\r\n this.info = res.data;\r\n },\r\n });\r\n uni.getStorage({\r\n key: \"userSig\",\r\n success: (res) => {\r\n this.userSig = res.data;\r\n },\r\n });\r\n uni.getStorage({\r\n key: \"chatInfo\",\r\n success: (res) => {\r\n this.chatInfo = res.data;\r\n },\r\n });\r\n if (this.userSig) {\r\n TUIlogin(this.chatInfo.appId, this.info.userChatId, this.userSig);\r\n }\r\n },\r\n provide() {\r\n return {\r\n $global: {\r\n lastPage: null,\r\n },\r\n };\r\n },\r\n};\r\n</script>\r\n<style>\r\n/* common css for page */\r\nuni-page-body,\r\nhtml,\r\nbody,\r\npage {\r\n width: 100% !important;\r\n height: 100% !important;\r\n overflow: hidden;\r\n}\r\n</style>\r\n","import App from './App'\r\n\r\n// #ifndef VUE3\r\nimport Vue from 'vue'\r\nimport './uni.promisify.adaptor'\r\nVue.config.productionTip = false\r\nApp.mpType = 'app'\r\nconst app = new Vue({\r\n ...App\r\n})\r\napp.$mount()\r\n// #endif\r\n\r\n// #ifdef VUE3\r\nimport { createSSRApp } from 'vue'\r\nexport function createApp() {\r\n const app = createSSRApp(App)\r\n return {\r\n app\r\n }\r\n}\r\n// #endif"],"names":["uni","createSSRApp","App"],"mappings":";;;;;;;;;;;;;;;;;;;AAYA,MAAe,YAAA;AAAA,EACb,OAAO;AACE,WAAA;AAAA,MACL,MAAM,CAAC;AAAA,MACP,SAAS;AAAA,MACT,UAAU,CAAC;AAAA,IAAA;AAAA,EAEf;AAAA,EACA,OAAO,QAAQ;AACbA,kBAAAA,MAAI,WAAW;AAAA,MACb,KAAK;AAAA,MACL,SAAS,CAAC,QAAQ;AAChB,aAAK,OAAO,IAAI;AAAA,MAClB;AAAA,IAAA,CACD;AACDA,kBAAAA,MAAI,WAAW;AAAA,MACb,KAAK;AAAA,MACL,SAAS,CAAC,QAAQ;AAChB,aAAK,UAAU,IAAI;AAAA,MACrB;AAAA,IAAA,CACD;AACDA,kBAAAA,MAAI,WAAW;AAAA,MACb,KAAK;AAAA,MACL,SAAS,CAAC,QAAQ;AAChB,aAAK,WAAW,IAAI;AAAA,MACtB;AAAA,IAAA,CACD;AACD,QAAI,KAAK,SAAS;AAChB,eAAS,KAAK,SAAS,OAAO,KAAK,KAAK,YAAY,KAAK,OAAO;AAAA,IAClE;AAAA,EACF;AAAA,EACA,UAAU;AACD,WAAA;AAAA,MACL,SAAS;AAAA,QACP,UAAU;AAAA,MACZ;AAAA,IAAA;AAAA,EAEJ;AACF;ACnCO,SAAS,YAAY;AAC1B,QAAM,MAAMC,cAAY,aAACC,SAAG;AAC5B,SAAO;AAAA,IACL;AAAA,EACD;AACH;;;"}
{"version":3,"file":"app.js","sources":["App.vue","main.js"],"sourcesContent":["<script lang=\"ts\">\r\n\r\n\r\n\r\n\r\n\r\n\r\n// Required information\r\n// You can get userSig from TencentCloud chat console for Testing TUIKit.\r\n// Deploy production environment please get it from your server.\r\n// View https://cloud.tencent.com/document/product/269/32688\r\n\r\nexport default {\r\n data() {\r\n return {\r\n info: {},\r\n userSig: \"\",\r\n chatInfo: {},\r\n };\r\n },\r\n onLoad(option) {\r\n uni.getStorage({\r\n key: \"userinfo\",\r\n success: (res) => {\r\n this.info = res.data;\r\n },\r\n });\r\n uni.getStorage({\r\n key: \"userSig\",\r\n success: (res) => {\r\n this.userSig = res.data;\r\n },\r\n });\r\n uni.getStorage({\r\n key: \"chatInfo\",\r\n success: (res) => {\r\n this.chatInfo = res.data;\r\n },\r\n });\r\n if (this.userSig) {\r\n TUIlogin(this.chatInfo.appId, this.info.userChatId, this.userSig);\r\n }\r\n },\r\n provide() {\r\n return {\r\n $global: {\r\n lastPage: null,\r\n },\r\n };\r\n },\r\n};\r\n</script>\r\n<style>\r\n/* common css for page */\r\nuni-page-body,\r\nhtml,\r\nbody,\r\npage {\r\n width: 100% !important;\r\n height: 100% !important;\r\n overflow: hidden;\r\n}\r\n</style>\r\n","import App from './App'\r\n\r\n// #ifndef VUE3\r\nimport Vue from 'vue'\r\nimport './uni.promisify.adaptor'\r\nVue.config.productionTip = false\r\nApp.mpType = 'app'\r\nconst app = new Vue({\r\n ...App\r\n})\r\napp.$mount()\r\n// #endif\r\n\r\n// #ifdef VUE3\r\nimport { createSSRApp } from 'vue'\r\nexport function createApp() {\r\n const app = createSSRApp(App)\r\n return {\r\n app\r\n }\r\n}\r\n// #endif"],"names":["uni","createSSRApp","App"],"mappings":";;;;;;;;;;;;;;;;;;;;AAYA,MAAe,YAAA;AAAA,EACb,OAAO;AACE,WAAA;AAAA,MACL,MAAM,CAAC;AAAA,MACP,SAAS;AAAA,MACT,UAAU,CAAC;AAAA,IAAA;AAAA,EAEf;AAAA,EACA,OAAO,QAAQ;AACbA,kBAAAA,MAAI,WAAW;AAAA,MACb,KAAK;AAAA,MACL,SAAS,CAAC,QAAQ;AAChB,aAAK,OAAO,IAAI;AAAA,MAClB;AAAA,IAAA,CACD;AACDA,kBAAAA,MAAI,WAAW;AAAA,MACb,KAAK;AAAA,MACL,SAAS,CAAC,QAAQ;AAChB,aAAK,UAAU,IAAI;AAAA,MACrB;AAAA,IAAA,CACD;AACDA,kBAAAA,MAAI,WAAW;AAAA,MACb,KAAK;AAAA,MACL,SAAS,CAAC,QAAQ;AAChB,aAAK,WAAW,IAAI;AAAA,MACtB;AAAA,IAAA,CACD;AACD,QAAI,KAAK,SAAS;AAChB,eAAS,KAAK,SAAS,OAAO,KAAK,KAAK,YAAY,KAAK,OAAO;AAAA,IAClE;AAAA,EACF;AAAA,EACA,UAAU;AACD,WAAA;AAAA,MACL,SAAS;AAAA,QACP,UAAU;AAAA,MACZ;AAAA,IAAA;AAAA,EAEJ;AACF;ACnCO,SAAS,YAAY;AAC1B,QAAM,MAAMC,cAAY,aAACC,SAAG;AAC5B,SAAO;AAAA,IACL;AAAA,EACD;AACH;;;"}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1 @@
{"version":3,"file":"NewAddedPk.js","sources":["../../HBuilderX/plugins/uniapp-cli-vite/uniPage:/cGFnZXMvTmV3QWRkZWRQay9OZXdBZGRlZFBrLnZ1ZQ"],"sourcesContent":["import MiniProgramPage from 'D:/项目/tk-mini-program/pages/NewAddedPk/NewAddedPk.vue'\nwx.createPage(MiniProgramPage)"],"names":["MiniProgramPage"],"mappings":";;AACA,GAAG,WAAWA,WAAe,eAAA;"}

View File

@@ -0,0 +1 @@
{"version":3,"file":"NewAddedPk2.js","sources":["../../HBuilderX/plugins/uniapp-cli-vite/uniPage:/RDov6aG555uuL3RrLW1pbmktcHJvZ3JhbS9wYWdlcy9OZXdBZGRlZFBrL05ld0FkZGVkUGsudnVl"],"sourcesContent":["import MiniProgramPage from 'D:/项目/tk-mini-program/pages/NewAddedPk/NewAddedPk.vue'\nwx.createPage(MiniProgramPage)"],"names":["MiniProgramPage"],"mappings":";;AACA,GAAG,WAAWA,WAAe,eAAA;"}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1 @@
{"version":3,"file":"uni-icons.js","sources":["uni_modules/uni-icons/components/uni-icons/uni-icons.vue","../../HBuilderX/plugins/uniapp-cli-vite/uniComponent:/RDov6aG555uuL3RrLW1pbmktcHJvZ3JhbS91bmlfbW9kdWxlcy91bmktaWNvbnMvY29tcG9uZW50cy91bmktaWNvbnMvdW5pLWljb25zLnZ1ZQ"],"sourcesContent":["<template>\r\n\t<!-- #ifdef APP-NVUE -->\r\n\t<text :style=\"styleObj\" class=\"uni-icons\" @click=\"_onClick\">{{unicode}}</text>\r\n\t<!-- #endif -->\r\n\t<!-- #ifndef APP-NVUE -->\r\n\t<text :style=\"styleObj\" class=\"uni-icons\" :class=\"['uniui-'+type,customPrefix,customPrefix?type:'']\" @click=\"_onClick\">\r\n\t\t<slot></slot>\r\n\t</text>\r\n\t<!-- #endif -->\r\n</template>\r\n\r\n<script>\r\n\timport { fontData } from './uniicons_file_vue.js';\r\n\r\n\tconst getVal = (val) => {\r\n\t\tconst reg = /^[0-9]*$/g\r\n\t\treturn (typeof val === 'number' || reg.test(val)) ? val + 'px' : val;\r\n\t}\r\n\r\n\t// #ifdef APP-NVUE\r\n\tvar domModule = weex.requireModule('dom');\r\n\timport iconUrl from './uniicons.ttf'\r\n\tdomModule.addRule('fontFace', {\r\n\t\t'fontFamily': \"uniicons\",\r\n\t\t'src': \"url('\" + iconUrl + \"')\"\r\n\t});\r\n\t// #endif\r\n\r\n\t/**\r\n\t * Icons 图标\r\n\t * @description 用于展示 icons 图标\r\n\t * @tutorial https://ext.dcloud.net.cn/plugin?id=28\r\n\t * @property {Number} size 图标大小\r\n\t * @property {String} type 图标图案,参考示例\r\n\t * @property {String} color 图标颜色\r\n\t * @property {String} customPrefix 自定义图标\r\n\t * @event {Function} click 点击 Icon 触发事件\r\n\t */\r\n\texport default {\r\n\t\tname: 'UniIcons',\r\n\t\temits: ['click'],\r\n\t\tprops: {\r\n\t\t\ttype: {\r\n\t\t\t\ttype: String,\r\n\t\t\t\tdefault: ''\r\n\t\t\t},\r\n\t\t\tcolor: {\r\n\t\t\t\ttype: String,\r\n\t\t\t\tdefault: '#333333'\r\n\t\t\t},\r\n\t\t\tsize: {\r\n\t\t\t\ttype: [Number, String],\r\n\t\t\t\tdefault: 16\r\n\t\t\t},\r\n\t\t\tcustomPrefix: {\r\n\t\t\t\ttype: String,\r\n\t\t\t\tdefault: ''\r\n\t\t\t},\r\n\t\t\tfontFamily: {\r\n\t\t\t\ttype: String,\r\n\t\t\t\tdefault: ''\r\n\t\t\t}\r\n\t\t},\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\ticons: fontData\r\n\t\t\t}\r\n\t\t},\r\n\t\tcomputed: {\r\n\t\t\tunicode() {\r\n\t\t\t\tlet code = this.icons.find(v => v.font_class === this.type)\r\n\t\t\t\tif (code) {\r\n\t\t\t\t\treturn code.unicode\r\n\t\t\t\t}\r\n\t\t\t\treturn ''\r\n\t\t\t},\r\n\t\t\ticonSize() {\r\n\t\t\t\treturn getVal(this.size)\r\n\t\t\t},\r\n\t\t\tstyleObj() {\r\n\t\t\t\tif (this.fontFamily !== '') {\r\n\t\t\t\t\treturn `color: ${this.color}; font-size: ${this.iconSize}; font-family: ${this.fontFamily};`\r\n\t\t\t\t}\r\n\t\t\t\treturn `color: ${this.color}; font-size: ${this.iconSize};`\r\n\t\t\t}\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\t_onClick() {\r\n\t\t\t\tthis.$emit('click')\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n</script>\r\n\r\n<style lang=\"scss\">\r\n\t/* #ifndef APP-NVUE */\r\n\t@import './uniicons.css';\r\n\r\n\t@font-face {\r\n\t\tfont-family: uniicons;\r\n\t\tsrc: url('./uniicons.ttf');\r\n\t}\r\n\r\n\t/* #endif */\r\n\t.uni-icons {\r\n\t\tfont-family: uniicons;\r\n\t\ttext-decoration: none;\r\n\t\ttext-align: center;\r\n\t}\r\n</style>\n","import Component from 'D:/项目/tk-mini-program/uni_modules/uni-icons/components/uni-icons/uni-icons.vue'\nwx.createComponent(Component)"],"names":["fontData"],"mappings":";;;AAcC,MAAM,SAAS,CAAC,QAAQ;AACvB,QAAM,MAAM;AACZ,SAAQ,OAAO,QAAQ,YAAY,IAAI,KAAK,GAAG,IAAK,MAAM,OAAO;AAClE;AAqBA,MAAK,YAAU;AAAA,EACd,MAAM;AAAA,EACN,OAAO,CAAC,OAAO;AAAA,EACf,OAAO;AAAA,IACN,MAAM;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA,IACD,OAAO;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA,IACD,MAAM;AAAA,MACL,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IACT;AAAA,IACD,cAAc;AAAA,MACb,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA,IACD,YAAY;AAAA,MACX,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,EACA;AAAA,EACD,OAAO;AACN,WAAO;AAAA,MACN,OAAOA,2DAAO;AAAA,IACf;AAAA,EACA;AAAA,EACD,UAAU;AAAA,IACT,UAAU;AACT,UAAI,OAAO,KAAK,MAAM,KAAK,OAAK,EAAE,eAAe,KAAK,IAAI;AAC1D,UAAI,MAAM;AACT,eAAO,KAAK;AAAA,MACb;AACA,aAAO;AAAA,IACP;AAAA,IACD,WAAW;AACV,aAAO,OAAO,KAAK,IAAI;AAAA,IACvB;AAAA,IACD,WAAW;AACV,UAAI,KAAK,eAAe,IAAI;AAC3B,eAAO,UAAU,KAAK,KAAK,gBAAgB,KAAK,QAAQ,kBAAkB,KAAK,UAAU;AAAA,MAC1F;AACA,aAAO,UAAU,KAAK,KAAK,gBAAgB,KAAK,QAAQ;AAAA,IACzD;AAAA,EACA;AAAA,EACD,SAAS;AAAA,IACR,WAAW;AACV,WAAK,MAAM,OAAO;AAAA,IACnB;AAAA,EACD;AACD;;;;;;;;;;;AC1FD,GAAG,gBAAgB,SAAS;"}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,103 @@
"use strict";
const common_vendor = require("./common/vendor.js");
const components_NationalDictionary = require("./components/NationalDictionary.js");
const common_assets = require("./common/assets.js");
const _sfc_main = {
data() {
return {
gender: "",
Gender: ["男", "女"],
Country: components_NationalDictionary.countryNamesArray,
country: "",
nameAnchor: "",
numberCoins: "",
remarks: "",
Display: false,
options: [
{ label: "选项一", value: "1" },
{ label: "选项二", value: "2" },
{ label: "选项三", value: "3" }
]
};
},
onLoad() {
common_vendor.index.getStorage({
key: "userinfo",
success: (res) => {
}
});
},
methods: {
handleOverlayClick(event) {
if (event.target === this.$el) {
this.Display = false;
}
},
open() {
if (this.Display) {
this.Display = false;
} else {
this.Display = true;
}
},
//获取主播名称
NameAnchor: function(event) {
this.nameAnchor = event.target.value;
},
Publish() {
common_vendor.index.__f__("log", "at pages/NewAddedPk/NewAddedPk.vue:103", this.nameAnchor, this.gender, this.country, this.numberCoins, this.remarks);
}
}
};
if (!Array) {
const _easycom_uni_combox2 = common_vendor.resolveComponent("uni-combox");
const _easycom_wht_select2 = common_vendor.resolveComponent("wht-select");
const _easycom_uni_number_box2 = common_vendor.resolveComponent("uni-number-box");
const _easycom_uni_easyinput2 = common_vendor.resolveComponent("uni-easyinput");
(_easycom_uni_combox2 + _easycom_wht_select2 + _easycom_uni_number_box2 + _easycom_uni_easyinput2)();
}
const _easycom_uni_combox = () => "./uni_modules/uni-combox/components/uni-combox/uni-combox.js";
const _easycom_wht_select = () => "./uni_modules/wht-select/components/wht-select/wht-select.js";
const _easycom_uni_number_box = () => "./uni_modules/uni-number-box/components/uni-number-box/uni-number-box.js";
const _easycom_uni_easyinput = () => "./uni_modules/uni-easyinput/components/uni-easyinput/uni-easyinput.js";
if (!Math) {
(_easycom_uni_combox + _easycom_wht_select + _easycom_uni_number_box + _easycom_uni_easyinput)();
}
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
return common_vendor.e({
a: $data.Display
}, $data.Display ? {
b: common_vendor.o$1(($event) => $options.open()),
c: common_assets._imports_0$5,
d: common_vendor.o$1((...args) => $options.NameAnchor && $options.NameAnchor(...args)),
e: common_vendor.o$1(($event) => $data.gender = $event),
f: common_vendor.p({
candidates: $data.Gender,
placeholder: "请选择性别",
modelValue: $data.gender
}),
g: common_vendor.o$1(($event) => $data.country = $event),
h: common_vendor.p({
options: $data.options,
placeholder: "请选择国家",
modelValue: $data.country
}),
i: common_vendor.o$1(($event) => $data.numberCoins = $event),
j: common_vendor.p({
modelValue: $data.numberCoins
}),
k: common_vendor.o$1(($event) => $data.remarks = $event),
l: common_vendor.p({
type: "textarea",
placeholder: "备注",
modelValue: $data.remarks
}),
m: common_vendor.o$1(($event) => $options.Publish()),
n: common_vendor.o$1(() => {
}),
o: common_vendor.o$1(($event) => $options.open())
} : {});
}
const MiniProgramPage = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-96d38e2b"]]);
exports.MiniProgramPage = MiniProgramPage;
//# sourceMappingURL=../.sourcemap/mp-weixin/NewAddedPk.js.map

View File

@@ -8,6 +8,7 @@ if (!Math) {
"./pages/login/login.js";
"./pages/UserInformation/UserInformation.js";
"./pages/Setting/Setting.js";
"./pages/NewAddedPk/NewAddedPk.js";
"./TUIKit/components/TUIConversation/index.js";
"./TUIKit/components/TUIChat/index.js";
"./TUIKit/components/TUIChat/video-play.js";

View File

@@ -5,7 +5,8 @@
"pages/index/index",
"pages/login/login",
"pages/UserInformation/UserInformation",
"pages/Setting/Setting"
"pages/Setting/Setting",
"pages/NewAddedPk/NewAddedPk"
],
"subPackages": [
{

View File

@@ -1,6 +1,7 @@
"use strict";
const _imports_0$4 = "/static/HomeBackground.png";
const _imports_0$3 = "/static/Settings.png";
const _imports_0$5 = "/static/HomeBackground.png";
const _imports_0$4 = "/static/Settings.png";
const _imports_0$3 = "/static/Fork.png";
const _imports_0$2 = "/static/Navigationimg.png";
const _imports_1$1 = "/static/Return.png";
const createGroup = "/assets/start-group.6d6b5fbb.svg";
@@ -83,10 +84,11 @@ exports.InvitationDark = InvitationDark;
exports.InvitationLight = InvitationLight;
exports.SearchDefaultIcon = SearchDefaultIcon;
exports._imports_0 = _imports_0$2;
exports._imports_0$1 = _imports_0$4;
exports._imports_0$2 = _imports_0$3;
exports._imports_0$1 = _imports_0$5;
exports._imports_0$2 = _imports_0$4;
exports._imports_0$3 = _imports_0$1;
exports._imports_0$4 = _imports_0;
exports._imports_0$5 = _imports_0$3;
exports._imports_1 = _imports_1$1;
exports._imports_1$1 = _imports_1;
exports.addSVG = addSVG;

View File

@@ -6875,9 +6875,9 @@ function populateParameters(fromRes, toRes) {
appVersion: "1.0.0",
appVersionCode: "100",
appLanguage: getAppLanguage(hostLanguage),
uniCompileVersion: "4.65",
uniCompilerVersion: "4.65",
uniRuntimeVersion: "4.65",
uniCompileVersion: "4.66",
uniCompilerVersion: "4.66",
uniRuntimeVersion: "4.66",
uniPlatform: "mp-weixin",
deviceBrand,
deviceModel: model,
@@ -7026,9 +7026,9 @@ const getAppBaseInfo = {
appLanguage: getAppLanguage(hostLanguage),
isUniAppX: false,
uniPlatform: "mp-weixin",
uniCompileVersion: "4.65",
uniCompilerVersion: "4.65",
uniRuntimeVersion: "4.65"
uniCompileVersion: "4.66",
uniCompilerVersion: "4.66",
uniRuntimeVersion: "4.66"
};
extend(toRes, parameters);
}
@@ -7768,9 +7768,9 @@ function isConsoleWritable() {
return isWritable;
}
function initRuntimeSocketService() {
const hosts = "192.168.0.107,127.0.0.1";
const hosts = "192.168.0.111,127.0.0.1";
const port = "8090";
const id = "mp-weixin_d28YCI";
const id = "mp-weixin_XfiXYR";
const lazy = typeof swan !== "undefined";
let restoreError = lazy ? () => {
} : initOnError();

View File

@@ -0,0 +1,256 @@
"use strict";
const NationalDictionary = {
AD: "安道尔",
AE: "阿拉伯联合酋长国",
AF: "阿富汗",
AG: "安提瓜和巴布达",
AI: "安圭拉",
AL: "阿尔巴尼亚",
AM: "亚美尼亚",
AO: "安哥拉",
AQ: "南极洲",
AR: "阿根廷",
AS: "美属萨摩亚",
AT: "奥地利",
AU: "澳大利亚",
AW: "阿鲁巴",
AX: "奥兰群岛",
AZ: "阿塞拜疆",
BA: "波斯尼亚和黑塞哥维那",
BB: "巴巴多斯",
BD: "孟加拉国",
BE: "比利时",
BF: "布基纳法索",
BG: "保加利亚",
BH: "巴林",
BI: "布隆迪",
BJ: "贝宁",
BL: "圣巴泰勒米",
BM: "百慕大群岛",
BN: "文莱达鲁萨兰国",
BO: "玻利维亚",
BQ: "博奈尔、圣尤斯特歇斯和萨巴",
BR: "巴西",
BS: "巴哈马",
BT: "不丹",
BV: "布韦岛",
BW: "博茨瓦纳",
BY: "白俄罗斯",
BZ: "伯利兹",
CA: "加拿大",
CC: "科科斯(基林)群岛",
CD: "刚果民主共和国",
CF: "中非共和国",
CG: "刚果共和国",
CH: "瑞士",
CI: "科特迪瓦",
CK: "库克群岛",
CL: "智利",
CM: "喀麦隆",
CN: "中国",
CO: "哥伦比亚",
CR: "哥斯达黎加",
CU: "古巴",
CV: "佛得角",
CW: "库拉索",
CX: "圣诞岛",
CY: "塞浦路斯",
CZ: "捷克共和国",
DE: "德国",
DG: "迪戈加西亚岛",
DJ: "吉布提",
DK: "丹麦",
DM: "多米尼克",
DO: "多米尼加共和国",
DZ: "阿尔及利亚",
EC: "厄瓜多尔",
EE: "爱沙尼亚",
EG: "埃及",
EH: "西撒哈拉",
ER: "厄立特里亚",
ES: "西班牙",
ET: "埃塞俄比亚",
FI: "芬兰",
FJ: "斐济",
FK: "福克兰群岛",
FM: "密克罗尼西亚",
FO: "法罗群岛",
FR: "法国",
GA: "加蓬",
GB: "英国",
GD: "格林纳达",
GE: "格鲁吉亚",
GF: "法属圭亚那",
GG: "根西岛",
GH: "加纳",
GI: "直布罗陀",
GL: "格陵兰",
GM: "冈比亚",
GN: "几内亚",
GP: "瓜德罗普",
GQ: "赤道几内亚",
GR: "希腊",
GS: "南乔治亚和南桑德威奇群岛",
GT: "危地马拉",
GU: "关岛",
GW: "几内亚比绍",
GY: "圭亚那",
HK: "中国香港特别行政区",
HM: "赫德岛和麦克唐纳群岛",
HN: "洪都拉斯",
HR: "克罗地亚",
HT: "海地",
HU: "匈牙利",
ID: "印度尼西亚",
IE: "爱尔兰",
IL: "以色列",
IM: "马恩岛",
IN: "印度",
IO: "英属印度洋领地",
IQ: "伊拉克",
IR: "伊朗",
IS: "冰岛",
IT: "意大利",
JE: "泽西岛",
JM: "牙买加",
JO: "约旦",
JP: "日本",
KE: "肯尼亚",
KG: "吉尔吉斯斯坦",
KH: "柬埔寨",
KI: "基里巴斯",
KM: "科摩罗",
KN: "圣基茨和尼维斯",
KP: "朝鲜",
KR: "韩国",
KW: "科威特",
KY: "开曼群岛",
KZ: "哈萨克斯坦",
LA: "老挝",
LB: "黎巴嫩",
LC: "圣卢西亚",
LI: "列支敦士登",
LK: "斯里兰卡",
LR: "利比里亚",
LS: "莱索托",
LT: "立陶宛",
LU: "卢森堡",
LV: "拉脱维亚",
LY: "利比亚",
MA: "摩洛哥",
MC: "摩纳哥",
MD: "摩尔多瓦",
ME: "黑山",
MF: "圣马丁",
MG: "马达加斯加",
MH: "马绍尔群岛",
MK: "北马其顿",
ML: "马里",
MM: "缅甸",
MN: "蒙古",
MO: "中国澳门特别行政区",
MP: "北马里亚纳群岛",
MQ: "马提尼克",
MR: "毛里塔尼亚",
MS: "蒙特塞拉特",
MT: "马耳他",
MU: "毛里求斯",
MV: "马尔代夫",
MW: "马拉维",
MX: "墨西哥",
MY: "马来西亚",
MZ: "莫桑比克",
NA: "纳米比亚",
NC: "新喀里多尼亚",
NE: "尼日尔",
NF: "诺福克岛",
NG: "尼日利亚",
NI: "尼加拉瓜",
NL: "荷兰",
NO: "挪威",
NP: "尼泊尔",
NR: "瑙鲁",
NU: "纽埃",
NZ: "新西兰",
OM: "阿曼",
PA: "巴拿马",
PE: "秘鲁",
PF: "法属玻利尼西亚",
PG: "巴布亚新几内亚",
PH: "菲律宾",
PK: "巴基斯坦",
PL: "波兰",
PM: "圣皮埃尔和密克隆群岛",
PN: "皮特凯恩群岛",
PR: "波多黎各",
PS: "巴勒斯坦",
PT: "葡萄牙",
PW: "帕劳",
PY: "巴拉圭",
QA: "卡塔尔",
RE: "留尼汪",
RO: "罗马尼亚",
RS: "塞尔维亚",
RU: "俄罗斯",
RW: "卢旺达",
SA: "沙特阿拉伯",
SB: "索罗门群岛",
SC: "塞舌尔",
SD: "苏丹",
SE: "瑞典",
SG: "新加坡",
SI: "斯洛文尼亚",
SJ: "斯瓦尔巴和扬马延",
SK: "斯洛伐克",
SL: "塞拉利昂",
SM: "圣马利诺",
SN: "塞内加尔",
SO: "索马里",
SR: "苏里南",
SS: "南苏丹",
ST: "圣多美和普林西比",
SV: "萨尔瓦多",
SX: "荷属圣马丁",
SY: "叙利亚",
SZ: "斯威士兰",
TC: "特克斯和凯科斯群岛",
TD: "乍得",
TF: "法属南部领地",
TG: "多哥",
TH: "泰国",
TJ: "塔吉克斯坦",
TK: "托克劳群岛",
TL: "东帝汶",
TM: "土库曼斯坦",
TN: "突尼斯",
TO: "汤加",
TR: "土耳其",
TT: "特立尼达和多巴哥",
TV: "图瓦卢",
TW: "台湾",
TZ: "坦桑尼亚",
UA: "乌克兰",
UG: "乌干达",
UM: "美国本土外小岛屿",
US: "美国",
UY: "乌拉圭",
UZ: "乌兹别克斯坦",
VA: "梵蒂冈",
VC: "圣文森特",
VE: "委内瑞拉",
VG: "英属维尔京群岛",
VI: "美属维尔京群岛",
VN: "越南",
VU: "瓦努阿图",
WS: "萨摩亚",
YE: "也门",
YT: "马约特岛",
ZA: "南非",
ZM: "赞比亚",
ZW: "津巴布韦",
UK: "英国",
WF: "瓦利斯"
};
const countryNamesArray = Object.values(NationalDictionary);
exports.countryNamesArray = countryNamesArray;
//# sourceMappingURL=../../.sourcemap/mp-weixin/components/NationalDictionary.js.map

View File

@@ -1,5 +1,9 @@
"use strict";
const common_vendor = require("../../common/vendor.js");
if (!Math) {
NewAddedPk();
}
const NewAddedPk = () => "../../pages/NewAddedPk/NewAddedPk2.js";
const _sfc_main = {
__name: "tabBar",
props: {
@@ -61,11 +65,18 @@ const _sfc_main = {
tabList[middleIndex].middleClass = "mid-button";
}
}
common_vendor.ref();
const createModule = common_vendor.ref();
function openPopupQuantity() {
createModule.value.open();
}
const disabledScroll = () => {
return false;
};
function handlePush(item, index) {
if (index === 2) {
openPopupQuantity();
return;
}
if (item.text === "消息") {
common_vendor.index.navigateTo({ url: "/TUIKit/components/TUIConversation/index" });
} else {
@@ -82,12 +93,15 @@ const _sfc_main = {
b: common_vendor.t(item.text),
c: __props.tabIndex == index ? "#1DD2F9" : "#A7A3A3",
d: common_vendor.n("list-item flex flex-column flex-middle " + item.middleClass),
e: common_vendor.o$1(($event) => handlePush(item), index),
e: common_vendor.o$1(($event) => handlePush(item, index), index),
f: index
};
}),
b: common_vendor.n(common_vendor.unref(showMiddleButton) === true ? "tab-list-middle" : "tab-list-default"),
c: common_vendor.o$1(disabledScroll)
c: common_vendor.o$1(disabledScroll),
d: common_vendor.sr(createModule, "c497a889-0", {
"k": "createModule"
})
};
};
}

View File

@@ -1,4 +1,6 @@
{
"component": true,
"usingComponents": {}
"usingComponents": {
"new-added-pk": "../../pages/NewAddedPk/NewAddedPk"
}
}

View File

@@ -1 +1 @@
<view class="tab-block data-v-c497a889"><view class="{{['tab-list', 'flex', 'flex-center', 'data-v-c497a889', b]}}"><view wx:for="{{a}}" wx:for-item="item" wx:key="f" class="{{['data-v-c497a889', item.d]}}" bindtap="{{item.e}}"><view class="item-img-box data-v-c497a889"><image class="item-img data-v-c497a889" src="{{item.a}}"/></view><view class="item-text font-20 data-v-c497a889" style="{{'color:' + item.c}}">{{item.b}}</view></view></view><view class="data-v-c497a889" catchtouchmove="{{c}}"></view></view>
<view class="tab-block data-v-c497a889"><view class="{{['tab-list', 'flex', 'flex-center', 'data-v-c497a889', b]}}"><view wx:for="{{a}}" wx:for-item="item" wx:key="f" class="{{['data-v-c497a889', item.d]}}" bindtap="{{item.e}}"><view class="item-img-box data-v-c497a889"><image class="item-img data-v-c497a889" src="{{item.a}}"/></view><view class="item-text font-20 data-v-c497a889" style="{{'color:' + item.c}}">{{item.b}}</view></view></view><view class="data-v-c497a889" catchtouchmove="{{c}}"></view><new-added-pk class="createModule r data-v-c497a889" u-r="createModule" u-i="c497a889-0" bind:__l="__l"></new-added-pk></view>

View File

@@ -57,6 +57,13 @@
padding: 0;
z-index: 0;
}
.tab-block .createModule.data-v-c497a889 {
position: fixed;
bottom: 0;
right: 0;
z-index: 998;
width: 100vw;
}
.tab-block .tab-list-default.data-v-c497a889 {
background-color: #ffffff;
border-top: 1px #dddddd solid;

View File

@@ -0,0 +1,4 @@
"use strict";
const NewAddedPk = require("../../NewAddedPk.js");
wx.createPage(NewAddedPk.MiniProgramPage);
//# sourceMappingURL=../../../.sourcemap/mp-weixin/pages/NewAddedPk/NewAddedPk.js.map

View File

@@ -0,0 +1,9 @@
{
"navigationBarTitleText": "新增PK",
"usingComponents": {
"uni-combox": "../../uni_modules/uni-combox/components/uni-combox/uni-combox",
"wht-select": "../../uni_modules/wht-select/components/wht-select/wht-select",
"uni-number-box": "../../uni_modules/uni-number-box/components/uni-number-box/uni-number-box",
"uni-easyinput": "../../uni_modules/uni-easyinput/components/uni-easyinput/uni-easyinput"
}
}

View File

@@ -0,0 +1 @@
<view wx:if="{{a}}" class="Mask data-v-96d38e2b" bindtap="{{o}}"><view class="data-v-96d38e2b" catchtap="{{n}}"><view class="container data-v-96d38e2b"><image class="Fork data-v-96d38e2b" bindtap="{{b}}" src="{{c}}" mode="scaleToFill"/><view class="Title data-v-96d38e2b">发布新PK</view><view class="Individual data-v-96d38e2b"><view class="NameAnchor data-v-96d38e2b"><input class="NameAnchorcss data-v-96d38e2b" bindinput="{{d}}" placeholder="主播名称"/></view><view class="Gender data-v-96d38e2b"><uni-combox wx:if="{{f}}" class="Gendercss data-v-96d38e2b" u-i="96d38e2b-0" bind:__l="__l" bindupdateModelValue="{{e}}" u-p="{{f}}"></uni-combox></view></view><view class="Accountnumber data-v-96d38e2b"><wht-select wx:if="{{h}}" class="data-v-96d38e2b" u-i="96d38e2b-1" bind:__l="__l" bindupdateModelValue="{{g}}" u-p="{{h}}"/><view class="Coins data-v-96d38e2b"><uni-number-box wx:if="{{j}}" class="number-box data-v-96d38e2b" u-i="96d38e2b-2" bind:__l="__l" bindupdateModelValue="{{i}}" u-p="{{j}}"></uni-number-box></view></view><view class="Remarkscss data-v-96d38e2b"><uni-easyinput wx:if="{{l}}" class="data-v-96d38e2b" u-i="96d38e2b-3" bind:__l="__l" bindupdateModelValue="{{k}}" u-p="{{l}}"></uni-easyinput></view><view class="Publish data-v-96d38e2b"><button bindtap="{{m}}" class="Publishcss data-v-96d38e2b">发布</button></view></view></view></view>

View File

@@ -0,0 +1,91 @@
.Mask.data-v-96d38e2b{
width: 100vw;
height: 100vh;
background: #00000076;
display: flex;
flex-direction: column-reverse;
}
.container.data-v-96d38e2b {
display: flex;
background-color: #fff;
flex-direction: column;
width: 100%;
height: 900rpx;
}
.Fork.data-v-96d38e2b{
width: 50rpx;
height: 50rpx;
margin-top: 20rpx;
/* margin-bottom: 40rpx; */
margin-left: 90%;
}
.Title.data-v-96d38e2b{
width: 100%;
height: 30rpx;
font-size: 50rpx;
font-weight: bold;
text-align: center;
margin-top: 40rpx;
margin-bottom: 40rpx;
}
.Individual.data-v-96d38e2b{
display: flex;
/* justify-content: center; */
}
.NameAnchor.data-v-96d38e2b{
margin: 40rpx;
}
.NameAnchorcss.data-v-96d38e2b{
width: 300rpx;
height: 85rpx;
border: 1rpx solid #ccc;
border-radius: 10rpx;
text-align: center;
}
.Gender.data-v-96d38e2b{
margin: 40rpx;
}
.Gendercss.data-v-96d38e2b{
width: 300rpx;
height: 80rpx;
text-align: center;
}
.Accountnumber.data-v-96d38e2b{
display: flex;
}
.Country.data-v-96d38e2b{
}
.Countrycss.data-v-96d38e2b{
margin: 40rpx;
width: 300rpx;
height: 65rpx;
text-align: center;
}
.Coins.data-v-96d38e2b{
margin: 40rpx;
width: 300rpx;
height: 65rpx;
display: flex;
justify-content: center;
align-items: center;
}
.number-box.data-v-96d38e2b {
text-align: center;
}
.Remarkscss.data-v-96d38e2b{
width: 90%;
margin-top: 30rpx;
margin-left: 5%;
margin-right: 5%;
margin-bottom: 50rpx;
border-radius: 10rpx;
}
.Publish.data-v-96d38e2b{
margin-bottom: 50rpx;
width: 90%;
margin-left: 5%;
}
.Publishcss.data-v-96d38e2b{
background-color: #0048ff94;
}

View File

@@ -0,0 +1,4 @@
"use strict";
const NewAddedPk = require("../../NewAddedPk.js");
wx.createPage(NewAddedPk.MiniProgramPage);
//# sourceMappingURL=../../../.sourcemap/mp-weixin/pages/NewAddedPk/NewAddedPk2.js.map

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.4 KiB

View File

@@ -0,0 +1,161 @@
"use strict";
const common_vendor = require("../../../../common/vendor.js");
const _sfc_main = {
name: "uniCombox",
emits: ["input", "update:modelValue"],
props: {
clearAble: {
type: Boolean,
default: false
},
border: {
type: Boolean,
default: true
},
label: {
type: String,
default: ""
},
labelWidth: {
type: String,
default: "auto"
},
placeholder: {
type: String,
default: ""
},
candidates: {
type: Array,
default() {
return [];
}
},
emptyTips: {
type: String,
default: "无匹配项"
},
modelValue: {
type: [String, Number],
default: ""
}
},
data() {
return {
showSelector: false,
inputVal: ""
};
},
computed: {
labelStyle() {
if (this.labelWidth === "auto") {
return "";
}
return `width: ${this.labelWidth}`;
},
filterCandidates() {
return this.candidates.filter((item) => {
return item.toString().indexOf(this.inputVal) > -1;
});
},
filterCandidatesLength() {
return this.filterCandidates.length;
}
},
watch: {
modelValue: {
handler(newVal) {
this.inputVal = newVal;
},
immediate: true
}
},
methods: {
toggleSelector() {
this.showSelector = !this.showSelector;
},
onFocus() {
this.showSelector = true;
},
onBlur() {
setTimeout(() => {
this.showSelector = false;
}, 153);
},
onSelectorClick(index) {
this.inputVal = this.filterCandidates[index];
this.showSelector = false;
this.$emit("input", this.inputVal);
this.$emit("update:modelValue", this.inputVal);
},
onInput() {
setTimeout(() => {
this.$emit("input", this.inputVal);
this.$emit("update:modelValue", this.inputVal);
});
},
clean() {
this.inputVal = "";
this.onInput();
}
}
};
if (!Array) {
const _easycom_uni_icons2 = common_vendor.resolveComponent("uni-icons");
_easycom_uni_icons2();
}
const _easycom_uni_icons = () => "../../../uni-icons/components/uni-icons/uni-icons.js";
if (!Math) {
_easycom_uni_icons();
}
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
return common_vendor.e({
a: $props.label
}, $props.label ? {
b: common_vendor.t($props.label),
c: common_vendor.s($options.labelStyle)
} : {}, {
d: $props.placeholder,
e: common_vendor.o$1([($event) => $data.inputVal = $event.detail.value, (...args) => $options.onInput && $options.onInput(...args)]),
f: common_vendor.o$1((...args) => $options.onFocus && $options.onFocus(...args)),
g: common_vendor.o$1((...args) => $options.onBlur && $options.onBlur(...args)),
h: $data.inputVal,
i: !$data.inputVal || !$props.clearAble
}, !$data.inputVal || !$props.clearAble ? {
j: common_vendor.o$1($options.toggleSelector),
k: common_vendor.p({
type: $data.showSelector ? "top" : "bottom",
size: "30",
color: "#999"
})
} : {}, {
l: $data.inputVal && $props.clearAble
}, $data.inputVal && $props.clearAble ? {
m: common_vendor.o$1($options.clean),
n: common_vendor.p({
type: "clear",
size: "24",
color: "#999",
width: "60rpx",
height: "60rpx"
})
} : {}, {
o: $data.showSelector
}, $data.showSelector ? common_vendor.e({
p: $options.filterCandidatesLength === 0
}, $options.filterCandidatesLength === 0 ? {
q: common_vendor.t($props.emptyTips)
} : {}, {
r: common_vendor.f($options.filterCandidates, (item, index, i0) => {
return {
a: common_vendor.t(item),
b: index,
c: common_vendor.o$1(($event) => $options.onSelectorClick(index), index)
};
})
}) : {}, {
s: common_vendor.n($props.border ? "" : "uni-combox__no-border")
});
}
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-e602780e"]]);
wx.createComponent(Component);
//# sourceMappingURL=../../../../../.sourcemap/mp-weixin/uni_modules/uni-combox/components/uni-combox/uni-combox.js.map

View File

@@ -0,0 +1,6 @@
{
"component": true,
"usingComponents": {
"uni-icons": "../../../uni-icons/components/uni-icons/uni-icons"
}
}

View File

@@ -0,0 +1 @@
<view class="{{['uni-combox', 'data-v-e602780e', s]}}"><view wx:if="{{a}}" class="uni-combox__label data-v-e602780e" style="{{c}}"><text class="data-v-e602780e">{{b}}</text></view><view class="uni-combox__input-box data-v-e602780e"><input class="uni-combox__input data-v-e602780e" type="text" placeholder="{{d}}" placeholder-class="uni-combox__input-plac" bindinput="{{e}}" bindfocus="{{f}}" bindblur="{{g}}" value="{{h}}"/><uni-icons wx:if="{{i}}" class="data-v-e602780e" bindclick="{{j}}" u-i="e602780e-0" bind:__l="__l" u-p="{{k}}"></uni-icons><uni-icons wx:if="{{l}}" class="data-v-e602780e" bindclick="{{m}}" u-i="e602780e-1" bind:__l="__l" u-p="{{n}}"></uni-icons></view><view wx:if="{{o}}" class="uni-combox__selector data-v-e602780e"><view class="uni-popper__arrow data-v-e602780e"></view><scroll-view scroll-y="true" class="uni-combox__selector-scroll data-v-e602780e"><view wx:if="{{p}}" class="uni-combox__selector-empty data-v-e602780e"><text class="data-v-e602780e">{{q}}</text></view><view wx:for="{{r}}" wx:for-item="item" wx:key="b" class="uni-combox__selector-item data-v-e602780e" bindtap="{{item.c}}"><text class="data-v-e602780e">{{item.a}}</text></view></scroll-view></view></view>

View File

@@ -0,0 +1,126 @@
/**
* 这里是uni-app内置的常用样式变量
*
* uni-app 官方扩展插件及插件市场https://ext.dcloud.net.cn上很多三方插件均使用了这些样式变量
* 如果你是插件开发者建议你使用scss预处理并在插件代码中直接使用这些变量无需 import 这个文件方便用户通过搭积木的方式开发整体风格一致的App
*
*/
/**
* 如果你是App开发者插件使用者你可以通过修改这些变量来定制自己的插件主题实现自定义主题功能
*
* 如果你的项目同样使用了scss预处理你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
*/
/* 颜色变量 */
/* 行为相关颜色 */
/* 文字基本颜色 */
/* 背景颜色 */
/* 边框颜色 */
/* 尺寸变量 */
/* 文字尺寸 */
/* 图片尺寸 */
/* Border Radius */
/* 水平间距 */
/* 垂直间距 */
/* 透明度 */
/* 文章场景相关 */
.uni-combox.data-v-e602780e {
font-size: 14px;
border: 1px solid #DCDFE6;
border-radius: 4px;
padding: 6px 10px;
position: relative;
display: flex;
flex-direction: row;
align-items: center;
}
.uni-combox__icon.data-v-e602780e {
border: 1px solid #004cff;
width: 70rpx;
height: 70rpx;
}
.uni-combox__label.data-v-e602780e {
font-size: 16px;
line-height: 22px;
padding-right: 10px;
color: #999999;
}
.uni-combox__input-box.data-v-e602780e {
position: relative;
display: flex;
flex: 1;
flex-direction: row;
align-items: center;
}
.uni-combox__input.data-v-e602780e {
flex: 1;
font-size: 14px;
height: 22px;
line-height: 22px;
}
.uni-combox__input-plac.data-v-e602780e {
font-size: 14px;
color: #999;
}
.uni-combox__selector.data-v-e602780e {
box-sizing: border-box;
position: absolute;
top: calc(100% + 12px);
left: 0;
width: 100%;
background-color: #FFFFFF;
border: 1px solid #EBEEF5;
border-radius: 6px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
z-index: 2;
padding: 4px 0;
}
.uni-combox__selector-scroll.data-v-e602780e {
position: relative;
z-index: 999;
max-height: 200px;
box-sizing: border-box;
}
.uni-combox__selector-empty.data-v-e602780e,
.uni-combox__selector-item.data-v-e602780e {
display: flex;
cursor: pointer;
line-height: 36px;
font-size: 14px;
text-align: center;
padding: 0px 10px;
}
.uni-combox__selector-item.data-v-e602780e:hover {
background-color: #f9f9f9;
}
.uni-combox__selector-empty.data-v-e602780e:last-child,
.uni-combox__selector-item.data-v-e602780e:last-child {
border-bottom: none;
}
.uni-popper__arrow.data-v-e602780e,
.uni-popper__arrow.data-v-e602780e::after {
position: absolute;
display: block;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
border-width: 6px;
}
.uni-popper__arrow.data-v-e602780e {
filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03));
top: -6px;
left: 10%;
margin-right: 3px;
border-top-width: 0;
border-bottom-color: #EBEEF5;
}
.uni-popper__arrow.data-v-e602780e::after {
content: " ";
top: 1px;
margin-left: -6px;
border-top-width: 0;
border-bottom-color: #fff;
}
.uni-combox__no-border.data-v-e602780e {
border: none;
}

View File

@@ -0,0 +1,476 @@
"use strict";
const common_vendor = require("../../../../common/vendor.js");
function obj2strClass(obj) {
let classess = "";
for (let key in obj) {
const val = obj[key];
if (val) {
classess += `${key} `;
}
}
return classess;
}
function obj2strStyle(obj) {
let style = "";
for (let key in obj) {
const val = obj[key];
style += `${key}:${val};`;
}
return style;
}
const _sfc_main = {
name: "uni-easyinput",
emits: [
"click",
"iconClick",
"update:modelValue",
"input",
"focus",
"blur",
"confirm",
"clear",
"eyes",
"change",
"keyboardheightchange"
],
model: {
prop: "modelValue",
event: "update:modelValue"
},
options: {
virtualHost: true
},
inject: {
form: {
from: "uniForm",
default: null
},
formItem: {
from: "uniFormItem",
default: null
}
},
props: {
name: String,
value: [Number, String],
modelValue: [Number, String],
type: {
type: String,
default: "text"
},
clearable: {
type: Boolean,
default: true
},
autoHeight: {
type: Boolean,
default: false
},
placeholder: {
type: String,
default: " "
},
placeholderStyle: String,
focus: {
type: Boolean,
default: false
},
disabled: {
type: Boolean,
default: false
},
maxlength: {
type: [Number, String],
default: 140
},
confirmType: {
type: String,
default: "done"
},
clearSize: {
type: [Number, String],
default: 24
},
inputBorder: {
type: Boolean,
default: true
},
prefixIcon: {
type: String,
default: ""
},
suffixIcon: {
type: String,
default: ""
},
trim: {
type: [Boolean, String],
default: false
},
cursorSpacing: {
type: Number,
default: 0
},
passwordIcon: {
type: Boolean,
default: true
},
adjustPosition: {
type: Boolean,
default: true
},
primaryColor: {
type: String,
default: "#2979ff"
},
styles: {
type: Object,
default() {
return {
color: "#333",
backgroundColor: "#fff",
disableColor: "#F7F6F6",
borderColor: "#e5e5e5"
};
}
},
errorMessage: {
type: [String, Boolean],
default: ""
}
},
data() {
return {
focused: false,
val: "",
showMsg: "",
border: false,
isFirstBorder: false,
showClearIcon: false,
showPassword: false,
focusShow: false,
localMsg: "",
isEnter: false
// 用于判断当前是否是使用回车操作
};
},
computed: {
// 输入框内是否有值
isVal() {
const val = this.val;
if (val || val === 0) {
return true;
}
return false;
},
msg() {
return this.localMsg || this.errorMessage;
},
// 因为uniapp的input组件的maxlength组件必须要数值这里转为数值用户可以传入字符串数值
inputMaxlength() {
return Number(this.maxlength);
},
// 处理外层样式的style
boxStyle() {
return `color:${this.inputBorder && this.msg ? "#e43d33" : this.styles.color};`;
},
// input 内容的类和样式处理
inputContentClass() {
return obj2strClass({
"is-input-border": this.inputBorder,
"is-input-error-border": this.inputBorder && this.msg,
"is-textarea": this.type === "textarea",
"is-disabled": this.disabled,
"is-focused": this.focusShow
});
},
inputContentStyle() {
const focusColor = this.focusShow ? this.primaryColor : this.styles.borderColor;
const borderColor = this.inputBorder && this.msg ? "#dd524d" : focusColor;
return obj2strStyle({
"border-color": borderColor || "#e5e5e5",
"background-color": this.disabled ? this.styles.disableColor : this.styles.backgroundColor
});
},
// input右侧样式
inputStyle() {
const paddingRight = this.type === "password" || this.clearable || this.prefixIcon ? "" : "10px";
return obj2strStyle({
"padding-right": paddingRight,
"padding-left": this.prefixIcon ? "" : "10px"
});
}
},
watch: {
value(newVal) {
if (newVal === null) {
this.val = "";
return;
}
this.val = newVal;
},
modelValue(newVal) {
if (newVal === null) {
this.val = "";
return;
}
this.val = newVal;
},
focus(newVal) {
this.$nextTick(() => {
this.focused = this.focus;
this.focusShow = this.focus;
});
}
},
created() {
this.init();
if (this.form && this.formItem) {
this.$watch("formItem.errMsg", (newVal) => {
this.localMsg = newVal;
});
}
},
mounted() {
this.$nextTick(() => {
this.focused = this.focus;
this.focusShow = this.focus;
});
},
methods: {
/**
* 初始化变量值
*/
init() {
if (this.value || this.value === 0) {
this.val = this.value;
} else if (this.modelValue || this.modelValue === 0 || this.modelValue === "") {
this.val = this.modelValue;
} else {
this.val = "";
}
},
/**
* 点击图标时触发
* @param {Object} type
*/
onClickIcon(type) {
this.$emit("iconClick", type);
},
/**
* 显示隐藏内容,密码框时生效
*/
onEyes() {
this.showPassword = !this.showPassword;
this.$emit("eyes", this.showPassword);
},
/**
* 输入时触发
* @param {Object} event
*/
onInput(event) {
let value = event.detail.value;
if (this.trim) {
if (typeof this.trim === "boolean" && this.trim) {
value = this.trimStr(value);
}
if (typeof this.trim === "string") {
value = this.trimStr(value, this.trim);
}
}
if (this.errMsg)
this.errMsg = "";
this.val = value;
this.$emit("input", value);
this.$emit("update:modelValue", value);
},
/**
* 外部调用方法
* 获取焦点时触发
* @param {Object} event
*/
onFocus() {
this.$nextTick(() => {
this.focused = true;
});
this.$emit("focus", null);
},
_Focus(event) {
this.focusShow = true;
this.$emit("focus", event);
},
/**
* 外部调用方法
* 失去焦点时触发
* @param {Object} event
*/
onBlur() {
this.focused = false;
this.$emit("blur", null);
},
_Blur(event) {
event.detail.value;
this.focusShow = false;
this.$emit("blur", event);
if (this.isEnter === false) {
this.$emit("change", this.val);
}
if (this.form && this.formItem) {
const { validateTrigger } = this.form;
if (validateTrigger === "blur") {
this.formItem.onFieldChange();
}
}
},
/**
* 按下键盘的发送键
* @param {Object} e
*/
onConfirm(e) {
this.$emit("confirm", this.val);
this.isEnter = true;
this.$emit("change", this.val);
this.$nextTick(() => {
this.isEnter = false;
});
},
/**
* 清理内容
* @param {Object} event
*/
onClear(event) {
this.val = "";
this.$emit("input", "");
this.$emit("update:modelValue", "");
this.$emit("clear");
},
/**
* 键盘高度发生变化的时候触发此事件
* 兼容性微信小程序2.7.0+、App 3.1.0+
* @param {Object} event
*/
onkeyboardheightchange(event) {
this.$emit("keyboardheightchange", event);
},
/**
* 去除空格
*/
trimStr(str, pos = "both") {
if (pos === "both") {
return str.trim();
} else if (pos === "left") {
return str.trimLeft();
} else if (pos === "right") {
return str.trimRight();
} else if (pos === "start") {
return str.trimStart();
} else if (pos === "end") {
return str.trimEnd();
} else if (pos === "all") {
return str.replace(/\s+/g, "");
} else if (pos === "none") {
return str;
}
return str;
}
}
};
if (!Array) {
const _easycom_uni_icons2 = common_vendor.resolveComponent("uni-icons");
_easycom_uni_icons2();
}
const _easycom_uni_icons = () => "../../../uni-icons/components/uni-icons/uni-icons.js";
if (!Math) {
_easycom_uni_icons();
}
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
return common_vendor.e({
a: $props.prefixIcon
}, $props.prefixIcon ? {
b: common_vendor.o$1(($event) => $options.onClickIcon("prefix")),
c: common_vendor.p({
type: $props.prefixIcon,
color: "#c0c4cc",
size: "22"
})
} : {}, {
d: $props.type === "textarea"
}, $props.type === "textarea" ? {
e: $props.inputBorder ? 1 : "",
f: $props.name,
g: $data.val,
h: $props.placeholder,
i: $props.placeholderStyle,
j: $props.disabled,
k: $options.inputMaxlength,
l: $data.focused,
m: $props.autoHeight,
n: $props.cursorSpacing,
o: $props.adjustPosition,
p: common_vendor.o$1((...args) => $options.onInput && $options.onInput(...args)),
q: common_vendor.o$1((...args) => $options._Blur && $options._Blur(...args)),
r: common_vendor.o$1((...args) => $options._Focus && $options._Focus(...args)),
s: common_vendor.o$1((...args) => $options.onConfirm && $options.onConfirm(...args)),
t: common_vendor.o$1((...args) => $options.onkeyboardheightchange && $options.onkeyboardheightchange(...args))
} : {
v: $props.type === "password" ? "text" : $props.type,
w: common_vendor.s($options.inputStyle),
x: $props.name,
y: $data.val,
z: !$data.showPassword && $props.type === "password",
A: $props.placeholder,
B: $props.placeholderStyle,
C: $props.disabled,
D: $options.inputMaxlength,
E: $data.focused,
F: $props.confirmType,
G: $props.cursorSpacing,
H: $props.adjustPosition,
I: common_vendor.o$1((...args) => $options._Focus && $options._Focus(...args)),
J: common_vendor.o$1((...args) => $options._Blur && $options._Blur(...args)),
K: common_vendor.o$1((...args) => $options.onInput && $options.onInput(...args)),
L: common_vendor.o$1((...args) => $options.onConfirm && $options.onConfirm(...args)),
M: common_vendor.o$1((...args) => $options.onkeyboardheightchange && $options.onkeyboardheightchange(...args))
}, {
N: $props.type === "password" && $props.passwordIcon
}, $props.type === "password" && $props.passwordIcon ? common_vendor.e({
O: $options.isVal
}, $options.isVal ? {
P: $props.type === "textarea" ? 1 : "",
Q: common_vendor.o$1($options.onEyes),
R: common_vendor.p({
type: $data.showPassword ? "eye-slash-filled" : "eye-filled",
size: 22,
color: $data.focusShow ? $props.primaryColor : "#c0c4cc"
})
} : {}) : {}, {
S: $props.suffixIcon
}, $props.suffixIcon ? common_vendor.e({
T: $props.suffixIcon
}, $props.suffixIcon ? {
U: common_vendor.o$1(($event) => $options.onClickIcon("suffix")),
V: common_vendor.p({
type: $props.suffixIcon,
color: "#c0c4cc",
size: "22"
})
} : {}) : common_vendor.e({
W: $props.clearable && $options.isVal && !$props.disabled && $props.type !== "textarea"
}, $props.clearable && $options.isVal && !$props.disabled && $props.type !== "textarea" ? {
X: $props.type === "textarea" ? 1 : "",
Y: common_vendor.o$1($options.onClear),
Z: common_vendor.p({
type: "clear",
size: $props.clearSize,
color: $options.msg ? "#dd524d" : $data.focusShow ? $props.primaryColor : "#c0c4cc"
})
} : {}), {
aa: common_vendor.n($options.inputContentClass),
ab: common_vendor.s($options.inputContentStyle),
ac: $options.msg ? 1 : "",
ad: common_vendor.s($options.boxStyle)
});
}
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render]]);
wx.createComponent(Component);
//# sourceMappingURL=../../../../../.sourcemap/mp-weixin/uni_modules/uni-easyinput/components/uni-easyinput/uni-easyinput.js.map

View File

@@ -0,0 +1,6 @@
{
"component": true,
"usingComponents": {
"uni-icons": "../../../uni-icons/components/uni-icons/uni-icons"
}
}

View File

@@ -0,0 +1 @@
<view class="{{['uni-easyinput', ac && 'uni-easyinput-error']}}" style="{{ad}}"><view class="{{['uni-easyinput__content', aa]}}" style="{{ab}}"><uni-icons wx:if="{{a}}" class="content-clear-icon" catchclick="{{b}}" u-i="61595fa3-0" bind:__l="__l" u-p="{{c}}"></uni-icons><slot name="left"></slot><textarea wx:if="{{d}}" class="{{['uni-easyinput__content-textarea', e && 'input-padding']}}" name="{{f}}" value="{{g}}" placeholder="{{h}}" placeholderStyle="{{i}}" disabled="{{j}}" placeholder-class="uni-easyinput__placeholder-class" maxlength="{{k}}" focus="{{l}}" autoHeight="{{m}}" cursor-spacing="{{n}}" adjust-position="{{o}}" bindinput="{{p}}" bindblur="{{q}}" bindfocus="{{r}}" bindconfirm="{{s}}" bindkeyboardheightchange="{{t}}"></textarea><block wx:else><input wx:if="{{r0}}" type="{{v}}" class="uni-easyinput__content-input" style="{{w}}" name="{{x}}" value="{{y}}" password="{{z}}" placeholder="{{A}}" placeholderStyle="{{B}}" placeholder-class="uni-easyinput__placeholder-class" disabled="{{C}}" maxlength="{{D}}" focus="{{E}}" confirmType="{{F}}" cursor-spacing="{{G}}" adjust-position="{{H}}" bindfocus="{{I}}" bindblur="{{J}}" bindinput="{{K}}" bindconfirm="{{L}}" bindkeyboardheightchange="{{M}}"/></block><block wx:if="{{N}}"><uni-icons wx:if="{{O}}" class="{{['content-clear-icon', P && 'is-textarea-icon']}}" bindclick="{{Q}}" u-i="61595fa3-1" bind:__l="__l" u-p="{{R}}"></uni-icons></block><block wx:if="{{S}}"><uni-icons wx:if="{{T}}" class="content-clear-icon" catchclick="{{U}}" u-i="61595fa3-2" bind:__l="__l" u-p="{{V}}"></uni-icons></block><block wx:else><uni-icons wx:if="{{W}}" class="{{['content-clear-icon', X && 'is-textarea-icon']}}" bindclick="{{Y}}" u-i="61595fa3-3" bind:__l="__l" u-p="{{Z}}"></uni-icons></block><slot name="right"></slot></view></view>

View File

@@ -0,0 +1,144 @@
/**
* 这里是uni-app内置的常用样式变量
*
* uni-app 官方扩展插件及插件市场https://ext.dcloud.net.cn上很多三方插件均使用了这些样式变量
* 如果你是插件开发者建议你使用scss预处理并在插件代码中直接使用这些变量无需 import 这个文件方便用户通过搭积木的方式开发整体风格一致的App
*
*/
/**
* 如果你是App开发者插件使用者你可以通过修改这些变量来定制自己的插件主题实现自定义主题功能
*
* 如果你的项目同样使用了scss预处理你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
*/
/* 颜色变量 */
/* 行为相关颜色 */
/* 文字基本颜色 */
/* 背景颜色 */
/* 边框颜色 */
/* 尺寸变量 */
/* 文字尺寸 */
/* 图片尺寸 */
/* Border Radius */
/* 水平间距 */
/* 垂直间距 */
/* 透明度 */
/* 文章场景相关 */
.uni-easyinput {
width: 100%;
flex: 1;
position: relative;
text-align: left;
color: #333;
font-size: 14px;
}
.uni-easyinput__content {
flex: 1;
width: 100%;
display: flex;
box-sizing: border-box;
flex-direction: row;
align-items: center;
border-color: #fff;
transition-property: border-color;
transition-duration: 0.3s;
}
.uni-easyinput__content-input {
width: auto;
position: relative;
overflow: hidden;
flex: 1;
line-height: 1;
font-size: 14px;
height: 35px;
/*ifdef H5*/
/*endif*/
}
.uni-easyinput__content-input ::-ms-reveal {
display: none;
}
.uni-easyinput__content-input ::-ms-clear {
display: none;
}
.uni-easyinput__content-input ::-o-clear {
display: none;
}
.uni-easyinput__placeholder-class {
color: #999;
font-size: 12px;
}
.is-textarea {
align-items: flex-start;
}
.is-textarea-icon {
margin-top: 5px;
}
.uni-easyinput__content-textarea {
position: relative;
overflow: hidden;
flex: 1;
line-height: 1.5;
font-size: 14px;
margin: 6px;
margin-left: 0;
height: 80px;
min-height: 80px;
min-height: 80px;
width: auto;
}
.input-padding {
padding-left: 10px;
}
.content-clear-icon {
padding: 0 5px;
}
.label-icon {
margin-right: 5px;
margin-top: -1px;
}
.is-input-border {
display: flex;
box-sizing: border-box;
flex-direction: row;
align-items: center;
border: 1px solid #dcdfe6;
border-radius: 4px;
}
.uni-error-message {
position: absolute;
bottom: -17px;
left: 0;
line-height: 12px;
color: #e43d33;
font-size: 12px;
text-align: left;
}
.uni-error-msg--boeder {
position: relative;
bottom: 0;
line-height: 22px;
}
.is-input-error-border {
border-color: #e43d33;
}
.is-input-error-border .uni-easyinput__placeholder-class {
color: #f29e99;
}
.uni-easyinput--border {
margin-bottom: 0;
padding: 10px 15px;
border-top: 1px #eee solid;
}
.uni-easyinput-error {
padding-bottom: 0;
}
.is-first-border {
border: none;
}
.is-disabled {
background-color: #f7f6f6;
color: #d5d5d5;
}
.is-disabled .uni-easyinput__placeholder-class {
color: #d5d5d5;
font-size: 12px;
}

View File

@@ -0,0 +1,73 @@
"use strict";
const uni_modules_uniIcons_components_uniIcons_uniicons_file_vue = require("./uniicons_file_vue.js");
const common_vendor = require("../../../../common/vendor.js");
const getVal = (val) => {
const reg = /^[0-9]*$/g;
return typeof val === "number" || reg.test(val) ? val + "px" : val;
};
const _sfc_main = {
name: "UniIcons",
emits: ["click"],
props: {
type: {
type: String,
default: ""
},
color: {
type: String,
default: "#333333"
},
size: {
type: [Number, String],
default: 16
},
customPrefix: {
type: String,
default: ""
},
fontFamily: {
type: String,
default: ""
}
},
data() {
return {
icons: uni_modules_uniIcons_components_uniIcons_uniicons_file_vue.fontData
};
},
computed: {
unicode() {
let code = this.icons.find((v) => v.font_class === this.type);
if (code) {
return code.unicode;
}
return "";
},
iconSize() {
return getVal(this.size);
},
styleObj() {
if (this.fontFamily !== "") {
return `color: ${this.color}; font-size: ${this.iconSize}; font-family: ${this.fontFamily};`;
}
return `color: ${this.color}; font-size: ${this.iconSize};`;
}
},
methods: {
_onClick() {
this.$emit("click");
}
}
};
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
return {
a: common_vendor.s($options.styleObj),
b: common_vendor.n("uniui-" + $props.type),
c: common_vendor.n($props.customPrefix),
d: common_vendor.n($props.customPrefix ? $props.type : ""),
e: common_vendor.o$1((...args) => $options._onClick && $options._onClick(...args))
};
}
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render]]);
wx.createComponent(Component);
//# sourceMappingURL=../../../../../.sourcemap/mp-weixin/uni_modules/uni-icons/components/uni-icons/uni-icons.js.map

View File

@@ -0,0 +1,4 @@
{
"component": true,
"usingComponents": {}
}

View File

@@ -0,0 +1 @@
<text style="{{a}}" class="{{['uni-icons', b, c, d]}}" bindtap="{{e}}"><slot></slot></text>

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,649 @@
"use strict";
const fontData = [
{
"font_class": "arrow-down",
"unicode": ""
},
{
"font_class": "arrow-left",
"unicode": ""
},
{
"font_class": "arrow-right",
"unicode": ""
},
{
"font_class": "arrow-up",
"unicode": ""
},
{
"font_class": "auth",
"unicode": ""
},
{
"font_class": "auth-filled",
"unicode": ""
},
{
"font_class": "back",
"unicode": ""
},
{
"font_class": "bars",
"unicode": ""
},
{
"font_class": "calendar",
"unicode": ""
},
{
"font_class": "calendar-filled",
"unicode": ""
},
{
"font_class": "camera",
"unicode": ""
},
{
"font_class": "camera-filled",
"unicode": ""
},
{
"font_class": "cart",
"unicode": ""
},
{
"font_class": "cart-filled",
"unicode": ""
},
{
"font_class": "chat",
"unicode": ""
},
{
"font_class": "chat-filled",
"unicode": ""
},
{
"font_class": "chatboxes",
"unicode": ""
},
{
"font_class": "chatboxes-filled",
"unicode": ""
},
{
"font_class": "chatbubble",
"unicode": ""
},
{
"font_class": "chatbubble-filled",
"unicode": ""
},
{
"font_class": "checkbox",
"unicode": ""
},
{
"font_class": "checkbox-filled",
"unicode": ""
},
{
"font_class": "checkmarkempty",
"unicode": ""
},
{
"font_class": "circle",
"unicode": ""
},
{
"font_class": "circle-filled",
"unicode": ""
},
{
"font_class": "clear",
"unicode": ""
},
{
"font_class": "close",
"unicode": ""
},
{
"font_class": "closeempty",
"unicode": ""
},
{
"font_class": "cloud-download",
"unicode": ""
},
{
"font_class": "cloud-download-filled",
"unicode": ""
},
{
"font_class": "cloud-upload",
"unicode": ""
},
{
"font_class": "cloud-upload-filled",
"unicode": ""
},
{
"font_class": "color",
"unicode": ""
},
{
"font_class": "color-filled",
"unicode": ""
},
{
"font_class": "compose",
"unicode": ""
},
{
"font_class": "contact",
"unicode": ""
},
{
"font_class": "contact-filled",
"unicode": ""
},
{
"font_class": "down",
"unicode": ""
},
{
"font_class": "bottom",
"unicode": ""
},
{
"font_class": "download",
"unicode": ""
},
{
"font_class": "download-filled",
"unicode": ""
},
{
"font_class": "email",
"unicode": ""
},
{
"font_class": "email-filled",
"unicode": ""
},
{
"font_class": "eye",
"unicode": ""
},
{
"font_class": "eye-filled",
"unicode": ""
},
{
"font_class": "eye-slash",
"unicode": ""
},
{
"font_class": "eye-slash-filled",
"unicode": ""
},
{
"font_class": "fire",
"unicode": ""
},
{
"font_class": "fire-filled",
"unicode": ""
},
{
"font_class": "flag",
"unicode": ""
},
{
"font_class": "flag-filled",
"unicode": ""
},
{
"font_class": "folder-add",
"unicode": ""
},
{
"font_class": "folder-add-filled",
"unicode": ""
},
{
"font_class": "font",
"unicode": ""
},
{
"font_class": "forward",
"unicode": ""
},
{
"font_class": "gear",
"unicode": ""
},
{
"font_class": "gear-filled",
"unicode": ""
},
{
"font_class": "gift",
"unicode": ""
},
{
"font_class": "gift-filled",
"unicode": ""
},
{
"font_class": "hand-down",
"unicode": ""
},
{
"font_class": "hand-down-filled",
"unicode": ""
},
{
"font_class": "hand-up",
"unicode": ""
},
{
"font_class": "hand-up-filled",
"unicode": ""
},
{
"font_class": "headphones",
"unicode": ""
},
{
"font_class": "heart",
"unicode": ""
},
{
"font_class": "heart-filled",
"unicode": ""
},
{
"font_class": "help",
"unicode": ""
},
{
"font_class": "help-filled",
"unicode": ""
},
{
"font_class": "home",
"unicode": ""
},
{
"font_class": "home-filled",
"unicode": ""
},
{
"font_class": "image",
"unicode": ""
},
{
"font_class": "image-filled",
"unicode": ""
},
{
"font_class": "images",
"unicode": ""
},
{
"font_class": "images-filled",
"unicode": ""
},
{
"font_class": "info",
"unicode": ""
},
{
"font_class": "info-filled",
"unicode": ""
},
{
"font_class": "left",
"unicode": ""
},
{
"font_class": "link",
"unicode": ""
},
{
"font_class": "list",
"unicode": ""
},
{
"font_class": "location",
"unicode": ""
},
{
"font_class": "location-filled",
"unicode": ""
},
{
"font_class": "locked",
"unicode": ""
},
{
"font_class": "locked-filled",
"unicode": ""
},
{
"font_class": "loop",
"unicode": ""
},
{
"font_class": "mail-open",
"unicode": ""
},
{
"font_class": "mail-open-filled",
"unicode": ""
},
{
"font_class": "map",
"unicode": ""
},
{
"font_class": "map-filled",
"unicode": ""
},
{
"font_class": "map-pin",
"unicode": ""
},
{
"font_class": "map-pin-ellipse",
"unicode": ""
},
{
"font_class": "medal",
"unicode": ""
},
{
"font_class": "medal-filled",
"unicode": ""
},
{
"font_class": "mic",
"unicode": ""
},
{
"font_class": "mic-filled",
"unicode": ""
},
{
"font_class": "micoff",
"unicode": ""
},
{
"font_class": "micoff-filled",
"unicode": ""
},
{
"font_class": "minus",
"unicode": ""
},
{
"font_class": "minus-filled",
"unicode": ""
},
{
"font_class": "more",
"unicode": ""
},
{
"font_class": "more-filled",
"unicode": ""
},
{
"font_class": "navigate",
"unicode": ""
},
{
"font_class": "navigate-filled",
"unicode": ""
},
{
"font_class": "notification",
"unicode": ""
},
{
"font_class": "notification-filled",
"unicode": ""
},
{
"font_class": "paperclip",
"unicode": ""
},
{
"font_class": "paperplane",
"unicode": ""
},
{
"font_class": "paperplane-filled",
"unicode": ""
},
{
"font_class": "person",
"unicode": ""
},
{
"font_class": "person-filled",
"unicode": ""
},
{
"font_class": "personadd",
"unicode": ""
},
{
"font_class": "personadd-filled",
"unicode": ""
},
{
"font_class": "personadd-filled-copy",
"unicode": ""
},
{
"font_class": "phone",
"unicode": ""
},
{
"font_class": "phone-filled",
"unicode": ""
},
{
"font_class": "plus",
"unicode": ""
},
{
"font_class": "plus-filled",
"unicode": ""
},
{
"font_class": "plusempty",
"unicode": ""
},
{
"font_class": "pulldown",
"unicode": ""
},
{
"font_class": "pyq",
"unicode": ""
},
{
"font_class": "qq",
"unicode": ""
},
{
"font_class": "redo",
"unicode": ""
},
{
"font_class": "redo-filled",
"unicode": ""
},
{
"font_class": "refresh",
"unicode": ""
},
{
"font_class": "refresh-filled",
"unicode": ""
},
{
"font_class": "refreshempty",
"unicode": ""
},
{
"font_class": "reload",
"unicode": ""
},
{
"font_class": "right",
"unicode": ""
},
{
"font_class": "scan",
"unicode": ""
},
{
"font_class": "search",
"unicode": ""
},
{
"font_class": "settings",
"unicode": ""
},
{
"font_class": "settings-filled",
"unicode": ""
},
{
"font_class": "shop",
"unicode": ""
},
{
"font_class": "shop-filled",
"unicode": ""
},
{
"font_class": "smallcircle",
"unicode": ""
},
{
"font_class": "smallcircle-filled",
"unicode": ""
},
{
"font_class": "sound",
"unicode": ""
},
{
"font_class": "sound-filled",
"unicode": ""
},
{
"font_class": "spinner-cycle",
"unicode": ""
},
{
"font_class": "staff",
"unicode": ""
},
{
"font_class": "staff-filled",
"unicode": ""
},
{
"font_class": "star",
"unicode": ""
},
{
"font_class": "star-filled",
"unicode": ""
},
{
"font_class": "starhalf",
"unicode": ""
},
{
"font_class": "trash",
"unicode": ""
},
{
"font_class": "trash-filled",
"unicode": ""
},
{
"font_class": "tune",
"unicode": ""
},
{
"font_class": "tune-filled",
"unicode": ""
},
{
"font_class": "undo",
"unicode": ""
},
{
"font_class": "undo-filled",
"unicode": ""
},
{
"font_class": "up",
"unicode": ""
},
{
"font_class": "top",
"unicode": ""
},
{
"font_class": "upload",
"unicode": ""
},
{
"font_class": "upload-filled",
"unicode": ""
},
{
"font_class": "videocam",
"unicode": ""
},
{
"font_class": "videocam-filled",
"unicode": ""
},
{
"font_class": "vip",
"unicode": ""
},
{
"font_class": "vip-filled",
"unicode": ""
},
{
"font_class": "wallet",
"unicode": ""
},
{
"font_class": "wallet-filled",
"unicode": ""
},
{
"font_class": "weibo",
"unicode": ""
},
{
"font_class": "weixin",
"unicode": ""
}
];
exports.fontData = fontData;
//# sourceMappingURL=../../../../../.sourcemap/mp-weixin/uni_modules/uni-icons/components/uni-icons/uniicons_file_vue.js.map

View File

@@ -0,0 +1,155 @@
"use strict";
const common_vendor = require("../../../../common/vendor.js");
const _sfc_main = {
name: "UniNumberBox",
emits: ["change", "input", "update:modelValue", "blur", "focus"],
props: {
value: {
type: [Number, String],
default: 1
},
modelValue: {
type: [Number, String],
default: 1
},
min: {
type: Number,
default: 0
},
max: {
type: Number,
default: 100
},
step: {
type: Number,
default: 1
},
background: {
type: String,
default: "#f5f5f5"
},
color: {
type: String,
default: "#333"
},
disabled: {
type: Boolean,
default: false
},
width: {
type: Number,
default: 40
}
},
data() {
return {
inputValue: 0
};
},
watch: {
value(val) {
this.inputValue = +val;
},
modelValue(val) {
this.inputValue = +val;
}
},
computed: {
widthWithPx() {
return this.width + "px";
}
},
created() {
if (this.value === 1) {
this.inputValue = +this.modelValue;
}
if (this.modelValue === 1) {
this.inputValue = +this.value;
}
},
methods: {
_calcValue(type) {
if (this.disabled) {
return;
}
const scale = this._getDecimalScale();
let value = this.inputValue * scale;
let step = this.step * scale;
if (type === "minus") {
value -= step;
if (value < this.min * scale) {
return;
}
if (value > this.max * scale) {
value = this.max * scale;
}
}
if (type === "plus") {
value += step;
if (value > this.max * scale) {
return;
}
if (value < this.min * scale) {
value = this.min * scale;
}
}
this.inputValue = (value / scale).toFixed(String(scale).length - 1);
this.$emit("input", +this.inputValue);
this.$emit("update:modelValue", +this.inputValue);
this.$emit("change", +this.inputValue);
},
_getDecimalScale() {
let scale = 1;
if (~~this.step !== this.step) {
scale = Math.pow(10, String(this.step).split(".")[1].length);
}
return scale;
},
_onBlur(event) {
this.$emit("blur", event);
let value = event.detail.value;
if (isNaN(value)) {
this.inputValue = this.value;
return;
}
value = +value;
if (value > this.max) {
value = this.max;
} else if (value < this.min) {
value = this.min;
}
const scale = this._getDecimalScale();
this.inputValue = value.toFixed(String(scale).length - 1);
this.$emit("input", +this.inputValue);
this.$emit("update:modelValue", +this.inputValue);
this.$emit("change", +this.inputValue);
},
_onFocus(event) {
this.$emit("focus", event);
}
}
};
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
return {
a: $data.inputValue <= $props.min || $props.disabled ? 1 : "",
b: $props.color,
c: common_vendor.o$1(($event) => $options._calcValue("minus")),
d: $props.background,
e: $props.disabled,
f: common_vendor.o$1((...args) => $options._onFocus && $options._onFocus(...args)),
g: common_vendor.o$1((...args) => $options._onBlur && $options._onBlur(...args)),
h: $props.step < 1 ? "digit" : "number",
i: $props.background,
j: $props.color,
k: $options.widthWithPx,
l: $data.inputValue,
m: common_vendor.o$1(($event) => $data.inputValue = $event.detail.value),
n: $data.inputValue >= $props.max || $props.disabled ? 1 : "",
o: $props.color,
p: common_vendor.o$1(($event) => $options._calcValue("plus")),
q: $props.background
};
}
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render]]);
wx.createComponent(Component);
//# sourceMappingURL=../../../../../.sourcemap/mp-weixin/uni_modules/uni-number-box/components/uni-number-box/uni-number-box.js.map

View File

@@ -0,0 +1,4 @@
{
"component": true,
"usingComponents": {}
}

View File

@@ -0,0 +1 @@
<view class="uni-numbox"><view bindtap="{{c}}" class="uni-numbox__minus uni-numbox-btns" style="{{'background:' + d}}"><text class="{{['uni-numbox--text', a && 'uni-numbox--disabled']}}" style="{{'color:' + b}}">-</text></view><block wx:if="{{r0}}"><input disabled="{{e}}" bindfocus="{{f}}" bindblur="{{g}}" class="uni-numbox__value" type="{{h}}" style="{{'background:' + i + ';' + ('color:' + j) + ';' + ('width:' + k)}}" value="{{l}}" bindinput="{{m}}"/></block><view bindtap="{{p}}" class="uni-numbox__plus uni-numbox-btns" style="{{'background:' + q}}"><text class="{{['uni-numbox--text', n && 'uni-numbox--disabled']}}" style="{{'color:' + o}}">+</text></view></view>

View File

@@ -0,0 +1,65 @@
/**
* 这里是uni-app内置的常用样式变量
*
* uni-app 官方扩展插件及插件市场https://ext.dcloud.net.cn上很多三方插件均使用了这些样式变量
* 如果你是插件开发者建议你使用scss预处理并在插件代码中直接使用这些变量无需 import 这个文件方便用户通过搭积木的方式开发整体风格一致的App
*
*/
/**
* 如果你是App开发者插件使用者你可以通过修改这些变量来定制自己的插件主题实现自定义主题功能
*
* 如果你的项目同样使用了scss预处理你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
*/
/* 颜色变量 */
/* 行为相关颜色 */
/* 文字基本颜色 */
/* 背景颜色 */
/* 边框颜色 */
/* 尺寸变量 */
/* 文字尺寸 */
/* 图片尺寸 */
/* Border Radius */
/* 水平间距 */
/* 垂直间距 */
/* 透明度 */
/* 文章场景相关 */
.uni-numbox {
display: flex;
flex-direction: row;
}
.uni-numbox-btns {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0 8px;
background-color: #f5f5f5;
}
.uni-numbox__value {
margin: 0 2px;
background-color: #f5f5f5;
width: 40px;
height: 26px;
text-align: center;
font-size: 14px;
border-width: 0;
color: #333;
}
.uni-numbox__minus {
border-top-left-radius: 2px;
border-bottom-left-radius: 2px;
}
.uni-numbox__plus {
border-top-right-radius: 2px;
border-bottom-right-radius: 2px;
}
.uni-numbox--text {
line-height: 20px;
margin-bottom: 2px;
font-size: 20px;
font-weight: 300;
color: #333;
}
.uni-numbox .uni-numbox--disabled {
color: #c0c0c0 !important;
}

View File

@@ -0,0 +1,191 @@
"use strict";
const common_vendor = require("../../../../common/vendor.js");
const _sfc_main = {
name: "wht-select",
props: {
options: {
type: Array,
default: () => []
},
value: {
type: [String, Number],
default: ""
},
placeholder: {
type: String,
default: "请选择"
},
disabled: {
type: Boolean,
default: false
},
clearable: {
type: Boolean,
default: false
},
// 样式相关的props
height: {
type: Number,
default: 40
},
fontSize: {
type: Number,
default: 14
},
borderColor: {
type: String,
default: "#dcdfe6"
},
borderRadius: {
type: Number,
default: 4
},
backgroundColor: {
type: String,
default: "#ffffff"
},
textColor: {
type: String,
default: "#606266"
},
placeholderColor: {
type: String,
default: "#c0c4cc"
},
activeColor: {
type: String,
default: "#409eff"
},
filterable: {
type: Boolean,
default: false
},
searchPlaceholder: {
type: String,
default: "请输入搜索内容"
}
},
data() {
return {
currentValue: "",
isOpen: false,
searchQuery: ""
};
},
computed: {
currentLabel() {
const option = this.options.find((item) => item.value === this.currentValue);
return option ? option.label : "";
},
filteredOptions() {
if (!this.filterable || !this.searchQuery) {
return this.options;
}
return this.options.filter(
(item) => item.label.toLowerCase().includes(this.searchQuery.toLowerCase())
);
}
},
watch: {
value: {
handler(newVal) {
this.currentValue = newVal;
},
immediate: true
}
},
methods: {
togglePicker() {
if (this.disabled)
return;
this.isOpen = !this.isOpen;
if (!this.isOpen) {
this.searchQuery = "";
}
},
selectOption(item, index) {
if (item.disabled)
return;
this.currentValue = item.value;
this.searchQuery = "";
this.$emit("input", item.value);
this.$emit("change", item);
this.isOpen = false;
},
clearValue(e) {
this.currentValue = "";
this.searchQuery = "";
this.$emit("input", "");
this.$emit("change", null);
this.$emit("clear");
},
onSearch() {
this.$emit("search", this.searchQuery);
},
handleFocus() {
if (!this.disabled) {
this.isOpen = true;
}
}
}
};
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
return common_vendor.e({
a: $props.filterable
}, $props.filterable ? {
b: $data.currentValue ? $options.currentLabel : $props.placeholder,
c: $props.fontSize + "px",
d: $data.currentValue ? $props.textColor : $props.placeholderColor,
e: common_vendor.o$1(() => {
}),
f: common_vendor.o$1([($event) => $data.searchQuery = $event.detail.value, (...args) => $options.onSearch && $options.onSearch(...args)]),
g: common_vendor.o$1((...args) => $options.handleFocus && $options.handleFocus(...args)),
h: $data.searchQuery
} : {
i: common_vendor.t($options.currentLabel || $props.placeholder),
j: $props.fontSize + "px",
k: $data.currentValue ? $props.textColor : $props.placeholderColor
}, {
l: $props.clearable && $data.currentValue && !$props.disabled
}, $props.clearable && $data.currentValue && !$props.disabled ? {
m: common_vendor.o$1((...args) => $options.clearValue && $options.clearValue(...args))
} : {
n: $props.placeholderColor
}, {
o: $data.isOpen ? 1 : "",
p: !$data.currentValue ? 1 : "",
q: $props.height + "px",
r: $props.backgroundColor,
s: $props.borderColor,
t: $props.borderRadius + "px",
v: common_vendor.o$1((...args) => $options.togglePicker && $options.togglePicker(...args)),
w: $data.isOpen
}, $data.isOpen ? common_vendor.e({
x: common_vendor.o$1((...args) => $options.togglePicker && $options.togglePicker(...args)),
y: $options.filteredOptions.length > 0
}, $options.filteredOptions.length > 0 ? {
z: common_vendor.f($options.filteredOptions, (item, index, i0) => {
return {
a: common_vendor.t(item.label),
b: item.value,
c: item.disabled ? 1 : "",
d: $data.currentValue === item.value ? 1 : "",
e: item.disabled ? $props.placeholderColor : $props.textColor,
f: $data.currentValue === item.value ? $props.activeColor + "20" : $props.backgroundColor,
g: common_vendor.o$1(($event) => $options.selectOption(item, index), item.value)
};
}),
A: $props.fontSize + "px"
} : {
B: $props.fontSize + "px",
C: $props.placeholderColor
}, {
D: $props.backgroundColor,
E: $props.borderRadius + "px"
}) : {}, {
F: $props.disabled ? 1 : ""
});
}
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-57f09195"]]);
wx.createComponent(Component);
//# sourceMappingURL=../../../../../.sourcemap/mp-weixin/uni_modules/wht-select/components/wht-select/wht-select.js.map

View File

@@ -0,0 +1,4 @@
{
"component": true,
"usingComponents": {}
}

View File

@@ -0,0 +1 @@
<view class="{{['wht-select-wrapper', 'data-v-57f09195', F && 'is-disabled']}}"><view class="{{['wht-select-inner', 'data-v-57f09195', o && 'is-active', p && 'is-placeholder']}}" style="{{'height:' + q + ';' + ('background-color:' + r) + ';' + ('border-color:' + s) + ';' + ('border-radius:' + t)}}" bindtap="{{v}}"><view class="wht-select-value data-v-57f09195"><input wx:if="{{a}}" class="wht-select-input data-v-57f09195" placeholder="{{b}}" style="{{'font-size:' + c + ';' + ('color:' + d)}}" catchtap="{{e}}" bindinput="{{f}}" bindfocus="{{g}}" value="{{h}}"/><text wx:else class="data-v-57f09195" style="{{'font-size:' + j + ';' + ('color:' + k)}}">{{i}}</text></view><view class="wht-select-suffix data-v-57f09195"><view wx:if="{{l}}" class="wht-select-clear data-v-57f09195" catchtap="{{m}}">×</view><view wx:else class="wht-select-arrow data-v-57f09195" style="{{'border-top-color:' + n}}"></view></view></view><view wx:if="{{w}}" class="select-dropdown data-v-57f09195"><view class="select-dropdown-mask data-v-57f09195" catchtap="{{x}}"></view><view class="select-dropdown-content data-v-57f09195" style="{{'background-color:' + D + ';' + ('border-radius:' + E)}}"><block wx:if="{{y}}"><view wx:for="{{z}}" wx:for-item="item" wx:key="b" class="{{['data-v-57f09195', item.c && 'disabled', item.d && 'active']}}" style="{{'font-size:' + A + ';' + ('color:' + item.e) + ';' + ('background-color:' + item.f)}}" catchtap="{{item.g}}">{{item.a}}</view></block><view wx:else class="select-dropdown-empty data-v-57f09195" style="{{'font-size:' + B + ';' + ('color:' + C)}}"> 暂无数据 </view></view></view></view>

View File

@@ -0,0 +1,181 @@
/**
* 这里是uni-app内置的常用样式变量
*
* uni-app 官方扩展插件及插件市场https://ext.dcloud.net.cn上很多三方插件均使用了这些样式变量
* 如果你是插件开发者建议你使用scss预处理并在插件代码中直接使用这些变量无需 import 这个文件方便用户通过搭积木的方式开发整体风格一致的App
*
*/
/**
* 如果你是App开发者插件使用者你可以通过修改这些变量来定制自己的插件主题实现自定义主题功能
*
* 如果你的项目同样使用了scss预处理你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
*/
/* 颜色变量 */
/* 行为相关颜色 */
/* 文字基本颜色 */
/* 背景颜色 */
/* 边框颜色 */
/* 尺寸变量 */
/* 文字尺寸 */
/* 图片尺寸 */
/* Border Radius */
/* 水平间距 */
/* 垂直间距 */
/* 透明度 */
/* 文章场景相关 */
.wht-select-wrapper.data-v-57f09195 {
width: 100%;
position: relative;
}
.wht-select-wrapper .wht-select-inner.data-v-57f09195 {
position: relative;
width: 100%;
border-width: 1px;
border-style: solid;
transition: all 0.2s;
cursor: pointer;
}
.wht-select-wrapper .wht-select-inner.is-active .wht-select-arrow.data-v-57f09195 {
transform: rotate(180deg);
}
.wht-select-wrapper .wht-select-value.data-v-57f09195 {
position: absolute;
left: 12px;
right: 30px;
top: 50%;
transform: translateY(-50%);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
height: 100%;
display: flex;
align-items: center;
}
.wht-select-wrapper .wht-select-suffix.data-v-57f09195 {
position: absolute;
right: 8px;
top: 50%;
transform: translateY(-50%);
display: flex;
align-items: center;
}
.wht-select-wrapper .wht-select-clear.data-v-57f09195 {
width: 16px;
height: 16px;
line-height: 16px;
text-align: center;
border-radius: 50%;
background-color: #c0c4cc;
color: #fff;
font-size: 12px;
cursor: pointer;
transition: all 0.2s;
}
.wht-select-wrapper .wht-select-clear.data-v-57f09195:hover {
background-color: #909399;
}
.wht-select-wrapper .wht-select-arrow.data-v-57f09195 {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 5px solid;
transition: transform 0.2s;
}
.wht-select-wrapper .select-dropdown.data-v-57f09195 {
position: absolute;
top: 100%;
left: 0;
width: 100%;
margin-top: 4px;
z-index: 999;
}
.wht-select-wrapper .select-dropdown-mask.data-v-57f09195 {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 998;
}
.wht-select-wrapper .select-dropdown-content.data-v-57f09195 {
position: relative;
max-height: 240px;
border: 1px solid #e4e7ed;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
z-index: 999;
overflow-y: auto;
}
.wht-select-wrapper .select-dropdown-content.data-v-57f09195::-webkit-scrollbar {
width: 6px;
}
.wht-select-wrapper .select-dropdown-content.data-v-57f09195::-webkit-scrollbar-thumb {
background-color: #e4e7ed;
border-radius: 3px;
}
.wht-select-wrapper .select-dropdown-content > view.data-v-57f09195 {
padding: 0 12px;
height: 36px;
line-height: 36px;
cursor: pointer;
}
.wht-select-wrapper .select-dropdown-content > view.disabled.data-v-57f09195 {
cursor: not-allowed;
}
.wht-select-wrapper .select-dropdown-content .select-dropdown-search.data-v-57f09195 {
padding: 8px;
border-bottom: 1px solid #e4e7ed;
}
.wht-select-wrapper .select-dropdown-content .select-dropdown-search input.data-v-57f09195 {
width: 100%;
height: 32px;
padding: 0 8px;
border: 1px solid #dcdfe6;
border-radius: 4px;
font-size: 14px;
}
.wht-select-wrapper .select-dropdown-content .select-dropdown-search input.data-v-57f09195:focus {
border-color: #409eff;
outline: none;
}
.wht-select-wrapper .select-dropdown-content .select-dropdown-empty.data-v-57f09195 {
padding: 12px;
text-align: center;
}
.wht-select-wrapper .wht-select-input.data-v-57f09195 {
width: 100%;
height: 100%;
background: transparent;
border: none;
outline: none;
padding: 0;
margin: 0;
line-height: normal;
}
.wht-select-wrapper .wht-select-input.data-v-57f09195::-webkit-input-placeholder {
color: inherit;
line-height: normal;
}
.wht-select-wrapper .wht-select-input.data-v-57f09195::placeholder {
color: inherit;
line-height: normal;
}
@media (prefers-color-scheme: dark) {
.wht-select-wrapper .select-dropdown-content.data-v-57f09195 {
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.3);
}
.wht-select-wrapper .select-dropdown-content.data-v-57f09195::-webkit-scrollbar-thumb {
background-color: #48484a;
}
.wht-select-wrapper .select-dropdown-content .select-dropdown-search.data-v-57f09195 {
border-bottom-color: #48484a;
}
.wht-select-wrapper .select-dropdown-content .select-dropdown-search input.data-v-57f09195 {
border-color: #48484a;
background-color: #1c1c1e;
color: #fff;
}
.wht-select-wrapper .select-dropdown-content .select-dropdown-search input.data-v-57f09195:focus {
border-color: #409eff;
}
}