long
/
repair-project-240821
1
0
Fork 0
Code Issues 0 Pull Requests 0 Projects 0 Releases 0 Wiki Activity
Browse Source

修复bug

master
longjieli 1 year ago
parent
d1cc257697
commit
ca96da527b
41 changed files with 4466 additions and 0 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +192
    -0
      pages/finish/finish.vue
  2. +195
    -0
      pages/login/login.vue
  3. +70
    -0
      pages/reject/reject.vue
  4. +248
    -0
      pages/repair/repair.vue
  5. +175
    -0
      pages/repairList/repairList.vue
  6. BIN
      static/bar/1.png
  7. BIN
      static/bar/2.png
  8. BIN
      static/bar/3.png
  9. BIN
      static/bar/4.png
  10. BIN
      static/login/logo.png
  11. +42
    -0
      uni_modules/uni-icons/changelog.md
  12. +91
    -0
      uni_modules/uni-icons/components/uni-icons/uni-icons.uvue
  13. +110
    -0
      uni_modules/uni-icons/components/uni-icons/uni-icons.vue
  14. +664
    -0
      uni_modules/uni-icons/components/uni-icons/uniicons.css
  15. BIN
      uni_modules/uni-icons/components/uni-icons/uniicons.ttf
  16. +664
    -0
      uni_modules/uni-icons/components/uni-icons/uniicons_file.ts
  17. +649
    -0
      uni_modules/uni-icons/components/uni-icons/uniicons_file_vue.js
  18. +89
    -0
      uni_modules/uni-icons/package.json
  19. +8
    -0
      uni_modules/uni-icons/readme.md
  20. +8
    -0
      uni_modules/uni-scss/changelog.md
  21. +1
    -0
      uni_modules/uni-scss/index.scss
  22. +82
    -0
      uni_modules/uni-scss/package.json
  23. +4
    -0
      uni_modules/uni-scss/readme.md
  24. +7
    -0
      uni_modules/uni-scss/styles/index.scss
  25. +3
    -0
      uni_modules/uni-scss/styles/setting/_border.scss
  26. +66
    -0
      uni_modules/uni-scss/styles/setting/_color.scss
  27. +55
    -0
      uni_modules/uni-scss/styles/setting/_radius.scss
  28. +56
    -0
      uni_modules/uni-scss/styles/setting/_space.scss
  29. +167
    -0
      uni_modules/uni-scss/styles/setting/_styles.scss
  30. +24
    -0
      uni_modules/uni-scss/styles/setting/_text.scss
  31. +146
    -0
      uni_modules/uni-scss/styles/setting/_variables.scss
  32. +19
    -0
      uni_modules/uni-scss/styles/tools/functions.scss
  33. +31
    -0
      uni_modules/uni-scss/theme.scss
  34. +62
    -0
      uni_modules/uni-scss/variables.scss
  35. +95
    -0
      utils/oss-upload/common/crypto/base64.js
  36. +117
    -0
      utils/oss-upload/common/crypto/crypto.js.js
  37. +29
    -0
      utils/oss-upload/common/crypto/hmac.js
  38. +59
    -0
      utils/oss-upload/common/crypto/sha1.js
  39. +36
    -0
      utils/oss-upload/oss/OSSConfig.js
  40. +139
    -0
      utils/oss-upload/oss/index.js
  41. +63
    -0
      utils/oss-upload/oss/web.js

+ 192
- 0
pages/finish/finish.vue View File

@ -0,0 +1,192 @@
<!-- 结单 -->
<template>
<view class="finish">
<navbar title="结单" :leftClick="leftClick"></navbar>
<uv-form labelPosition="top" :model="form" :rules="rules" ref="form" labelWidth="140">
<uv-form-item label="处理结果" prop="form.processingResult">
<uv-input @focus="processingPickerOpen" placeholder="请选择处理结果" v-model="form.processingResult"
:fontSize="30"></uv-input>
</uv-form-item>
<uv-form-item label="收费金额" prop="form.money">
<uv-input placeholder="请输入收费金额" type="number" v-model="form.money" :fontSize="30"></uv-input>
</uv-form-item>
<uv-form-item label="处理说明" prop="form.instructions">
<uv-textarea v-model="form.instructions" :maxlength="200" :height="120" count
placeholder="请输入处理说明"></uv-textarea>
</uv-form-item>
<uv-form-item label="照片" prop="form.images">
<view class="image-list">
<view @click="openImageMenu(index)" v-for="(item,index) in form.images" :key="index"
class="image-item">
<image :src="item" mode="widthFix"></image>
</view>
<view v-if="form.images.length < maxUpload" @click="chooseImage" class="upload">
<uv-icon name="camera-fill" color="#3c9cff" size="50"></uv-icon>
</view>
</view>
</uv-form-item>
<uv-button type="primary" text="结单" shape="circle" customStyle="margin-top: 10px"
@click="submit"></uv-button>
<!-- 选择完成状态 -->
<uv-picker ref="processing" :columns="processingList" :itemHeight="100" :round="20" keyName="label"
title="选择处理结果" @confirm="floorConfirm"></uv-picker>
<!-- 图片操作菜单 -->
<uv-action-sheet ref="actionSheet" :actions="list" :round="20" cancelText="取消" title="图片操作"
@select="selectImageSheet"> </uv-action-sheet>
</uv-form>
</view>
</template>
<script>
import navbar from '../../components/base/navbar.vue'
export default {
name: 'Finish',
components: {
navbar
},
data() {
return {
form: {
processingResult: '',
money: 0,
instructions: '',
images: []
},
rules: {
},
processingList: [
[{
id: 0,
label: '已处理'
},
{
id: 1,
label: '未处理'
}
]
],
maxUpload: 4,
currentIndex: 0,
list: [ //图片操作菜单操作项
{
name: '查看图片',
id: 0
},
{
name: '删除图片',
id: 1
}
],
}
},
methods: {
//返回
leftClick() {
uni.switchTab({
url: '/pages/repairList/repairList'
})
},
//打开处理结果
processingPickerOpen() {
this.$refs.processing.open();
},
//用户选择了处理结果
floorConfirm(floor) {
this.form.processingResult = floor.value[0].label
},
//选择文件
chooseImage() {
this.$utils.chooseImage(res => {
res.tempFiles.forEach(file => {
console.log(file);
this.aliUpload(file)
})
})
},
//阿里云oss上传
aliUpload(file) {
this.$uploadFileToOSS(file).then(filePath => {
this.form.images.push(filePath)
})
},
//打开图片操作菜单
openImageMenu(index) {
this.currentIndex = index
this.$refs.actionSheet.open();
},
//用户选择了图片操作选项
selectImageSheet(imageSheet) {
let {
id
} = imageSheet
if (id) {
this.deleteImageAsList()
} else {
this.viewImageAsList()
}
},
//查看图片
viewImageAsList() {
this.$utils.previewImage({
current: this.currentIndex,
urls: this.form.images
})
},
//删除图片
deleteImageAsList() {
this.form.images = this.form.images.filter((_, index) => {
return index != this.currentIndex
})
},
}
}
</script>
<style>
.finish {
width: 96%;
margin: 0rpx auto;
}
.image-list {
width: 100%;
display: flex;
flex-wrap: wrap;
padding-top: 20rpx;
}
.image-item,
.upload {
display: flex;
align-items: center;
justify-content: center;
width: 24%;
height: 174rpx;
background: #f8f8f8;
margin-left: 1%;
border-radius: 15rpx;
overflow: hidden;
margin-bottom: 20rpx;;
}
.image-item image {
width: 100%;
}
</style>

+ 195
- 0
pages/login/login.vue View File

@ -0,0 +1,195 @@
<template>
<view class="content">
<!-- app和小程序使用以下svg会报错 h5正常 -->
<!-- <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="100%" height="100%" viewBox="0 0 1600 900" preserveAspectRatio="xMidYMax slice">
<defs>
<linearGradient id="bg">
<stop offset="0%" style="stop-color:rgba(130, 158, 249, 0.06)"></stop>
<stop offset="50%" style="stop-color:rgba(76, 190, 255, 0.6)"></stop>
<stop offset="100%" style="stop-color:rgba(115, 209, 72, 0.2)"></stop>
</linearGradient>
<path id="wave" fill="url(#bg)"
d="M-363.852,502.589c0,0,236.988-41.997,505.475,0
s371.981,38.998,575.971,0s293.985-39.278,505.474,5.859s493.475,48.368,716.963-4.995v560.106H-363.852V502.589z" />
</defs>
<g>
<use xlink:href='#wave' opacity=".3">
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="10s"
calcMode="spline" values="270 230; -334 180; 270 230" keyTimes="0; .5; 1"
keySplines="0.42, 0, 0.58, 1.0;0.42, 0, 0.58, 1.0" repeatCount="indefinite" />
</use>
<use xlink:href='#wave' opacity=".6">
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="8s"
calcMode="spline" values="-270 230;243 220;-270 230" keyTimes="0; .6; 1"
keySplines="0.42, 0, 0.58, 1.0;0.42, 0, 0.58, 1.0" repeatCount="indefinite" />
</use>
<use xlink:href='#wave' opacty=".9">
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="6s"
calcMode="spline" values="0 230;-140 200;0 230" keyTimes="0; .4; 1"
keySplines="0.42, 0, 0.58, 1.0;0.42, 0, 0.58, 1.0" repeatCount="indefinite" />
</use>
</g>
</svg> -->
<view class="loginBox">
<h3 style="text-align: center;margin-bottom:120rpx;">欢迎登录</h3>
<view class="inputBox">
<view class="ipt">
<uni-icons type="contact" size="24" color="rgb(66,157,250)"></uni-icons>
<input type="text" value="" placeholder="请输入手机号"/>
</view>
<view class="ipt">
<uni-icons type="eye" size="24" color="rgb(66,157,250)"></uni-icons>
<input type="passsword" value="" placeholder="请输入密码"/>
</view>
<view class="ipt">
<uni-icons type="checkmarkempty" size="24" color="rgb(66,157,250)"></uni-icons>
<input type="text" value="" placeholder="请输入验证码"/>
<view class="yzm">
验证码
</view>
</view>
<button @click="login">登录</button>
<view class="forgetPwd">
<!-- <span>忘记密码</span> -->
<!-- <span>没有账号，去注册</span> -->
</view>
</view>
<view class="tipbox">
<view class="txt">
—— 其他账号登录 ——
</view>
<view class="otherUser">
<uni-icons type="weixin" size="40" color="rgb(2,187,17)"></uni-icons>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
//登录
login(){
uni.switchTab({
url: '/pages/repair/repair'
})
}
}
}
</script>
<style scoped>
svg {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height:40%;
box-sizing: border-box;
display: block;
background-color: #ffffff;
}
.loginBox{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-60%);
width: 90%;
border-radius: 20rpx;
padding: 60rpx;
box-sizing: border-box;
}
h3{
color:rgb(66,157,250);
font-size: 40rpx;
letter-spacing: 10rpx;
margin-bottom: 40rpx;
}
.inputBox{
}
.ipt{
height: 86rpx;
display: flex;
justify-content: flex-start;
align-items: center;
margin-bottom: 40rpx;
background-color: #f5f5f5;
border-radius: 10rpx;
padding-left: 10rpx;
}
.ipt input{
margin-left: 20rpx;
font-size: 28rpx;
}
.ipt input{
margin-left: 20rpx;
}
.forgetPwd{
margin-top: 30rpx;
font-size: 26rpx;
color: #b5b5b5;
text-align: end;
padding:0 10rpx;
display: flex;
justify-content: space-between;
}
button{
margin-top: 20rpx;
line-height: 85rpx;
text-align: center;
background: rgb(66,157,250);
border-radius: 40rpx;
color: #fff;
margin-top: 40rpx;
}
.tip{
text-align: center;
font-size: 28rpx;
position: fixed;
bottom: 50rpx;
left: 50%;
transform: translate(-50%,-50%);
color: #f4f4f4;
}
.tipbox {
text-align: center;
margin-top: 100rpx;
}
.otherUser {
margin-top: 30rpx;
display: flex;
justify-content: center;
}
.txt {
font-size: 28rpx;
color: #cbcbcb;
}
.otherUser .uni-icons {
margin-left: 20rpx;
}
.yzm{
text-align: end;
font-size: 24rpx;
background: linear-gradient(to right,rgb(66,157,250),rgb(0, 170, 127));
height: 60rpx;
width: 150rpx;
line-height: 60rpx;
text-align: center;
border-radius: 10rpx;
color: #fff;
}
</style>

+ 70
- 0
pages/reject/reject.vue View File

@ -0,0 +1,70 @@
<!-- 驳回 -->
<template>
<view class="reject">
<navbar title="驳回" :leftClick="leftClick"></navbar>
<uv-form labelPosition="left" :model="form" :rules="rules" errorType="toast" ref="form" labelWidth="0">
<uv-form-item label="" prop="reason">
<uv-textarea v-model="form.reason" :maxlength="200" :height="120" count
placeholder="请输入驳回原因"></uv-textarea>
</uv-form-item>
<uv-button type="primary" text="驳回" shape="circle" customStyle="margin-top: 10px"
@click="submit"></uv-button>
</uv-form>
</view>
</template>
<script>
import navbar from '../../components/base/navbar.vue'
export default {
name: 'Reject',
components: {
navbar
},
data() {
return {
form: {
reason: ''
},
rules: {
'reason': {
type: 'string',
required: true,
message: '请填写姓名',
trigger: ['blur', 'change']
}
},
}
},
methods: {
//驳回
submit() {
this.$refs.form.validate().then(res => {
}).catch(errors => {
uni.showToast({
icon: 'none',
title: '请填写驳回原因'
})
})
},
//返回
leftClick() {
uni.switchTab({
url: '/pages/repairList/repairList'
})
}
}
}
</script>
<style scoped>
.reject {
width: 96%;
margin: 0rpx auto;
}
</style>

+ 248
- 0
pages/repair/repair.vue View File

@ -0,0 +1,248 @@
<!-- 报修 -->
<template>
<view class="repair bx reserveSpace">
<!-- <view class="repair-title">
<text>申请报修</text>
</view> -->
<uv-form :model="form" :rules="rules" :useBeforeRead="true" ref="form" labelPosition="left" labelWidth="100">
<uv-form-item label="楼栋" prop="form.building" borderBottom>
<uv-input @focus="floorPickerOpen" placeholder="请选择楼层" v-model="form.building" border="none" :fontSize="30"></uv-input>
<template v-slot:right>
<uv-icon name="arrow-right"></uv-icon>
</template>
</uv-form-item>
<uv-form-item label="室号" prop="form.room" borderBottom>
<uv-input @focus="roomPickerOpen" placeholder="请选择室号" v-model="form.room" border="none" :fontSize="30"></uv-input>
<template v-slot:right>
<uv-icon name="arrow-right"></uv-icon>
</template>
</uv-form-item>
<uv-form-item label="项目" prop="form.project" borderBottom>
<uv-input v-model="form.project" placeholder="请填写项目" :fontSize="30" border="none"></uv-input>
</uv-form-item>
<uv-form-item label="姓名" prop="form.name" borderBottom>
<uv-input v-model="form.name" placeholder="请填写姓名" :fontSize="30" border="none"></uv-input>
</uv-form-item>
<uv-form-item label="简介" prop="form.intro" borderBottom>
<uv-textarea v-model="form.intro" :height="140" :maxlength="200" textStyle="font-size : 30rpx" count
placeholder="请输入内容"></uv-textarea>
</uv-form-item>
<uv-form-item label="电话号" prop="form.name" borderBottom>
<uv-input v-model="form.phone" placeholder="请填写电话号" border="none" :fontSize="30"></uv-input>
</uv-form-item>
<uv-form-item label="照片" prop="form.images" labelPosition="top">
<view class="image-list">
<view @click="openImageMenu(index)" v-for="(item,index) in form.images" :key="index"
class="image-item">
<image :src="item" mode="widthFix"></image>
</view>
<view v-if="form.images.length < maxUpload" @click="uploadImage" class="upload">
<uv-icon name="camera-fill" color="#3c9cff" size="50"></uv-icon>
</view>
</view>
</uv-form-item>
<uv-button type="primary" text="提交" shape="circle" customStyle="margin-top: 10px"
@click="submitRepair"></uv-button>
</uv-form>
<!-- 报修地址选择(楼栋) -->
<uv-picker ref="floorPicker" :columns="floorList" :itemHeight="100" :round="20" keyName="label" title="选择楼栋"
@confirm="floorConfirm"></uv-picker>
<!-- 报修地址选择(室号) -->
<uv-picker ref="roomPicker" :columns="roomNumberList" :itemHeight="100" :round="20" keyName="label" title="选择室号"
@confirm="roomConfirm"></uv-picker>
<!-- 图片操作菜单 -->
<uv-action-sheet ref="actionSheet" :actions="list" :round="20" cancelText="取消" title="图片操作"
@select="selectImageSheet"> </uv-action-sheet>
</view>
</template>
<script>
export default {
name: 'Repair',
data() {
return {
form: {
building: '', //楼栋
room: '', //室号
project: '', //项目
phone: '', //手机号
name: '', //姓名
intro: '', //简介
images: []
},
rules: { //参数校验
'form.name': {
type: 'string',
required: true,
message: '请填写姓名',
trigger: ['blur', 'change']
}
},
maxUpload: 4, //最大上传图片张数
list: [ //图片操作菜单操作项
{
name: '查看图片',
id: 0
},
{
name: '删除图片',
id: 1
}
],
currentIndex: undefined, //当前操作的图片索引
floorList: [
[{
id: 0,
label: '楼栋1'
},
{
id: 1,
label: '楼栋2'
}
]
], //楼栋列表
roomNumberList: [
[{
id: 0,
label: 'A1001'
},
{
id: 1,
label: 'A1002'
}
]
], //室号列表
}
},
methods: {
//上传图片
uploadImage(){
let self = this
this.$Oss.ossUploadImage({
success(res){
self.form.images.push(res)
}
})
},
//打开图片操作菜单
openImageMenu(index) {
this.currentIndex = index
this.$refs.actionSheet.open();
},
//用户选择了图片操作选项
selectImageSheet(imageSheet) {
let {
id
} = imageSheet
if (id) {
this.deleteImageAsList()
} else {
this.viewImageAsList()
}
},
//查看图片
viewImageAsList() {
this.$utils.previewImage({
current: this.currentIndex,
urls: this.form.images
})
},
//删除图片
deleteImageAsList() {
this.form.images = this.form.images.filter((_, index) => {
return index != this.currentIndex
})
},
//用户选择了楼栋
floorConfirm(floor) {
this.form.building = floor.value[0].label
},
//打开选择楼栋
floorPickerOpen() {
this.$refs.floorPicker.open();
},
//用户选择了室号
roomConfirm(floor) {
this.form.room = floor.value[0].label
},
//打开选择室号
roomPickerOpen() {
this.$refs.roomPicker.open();
},
//提交报修
submitRepair() {
console.log(this.form);
},
}
}
</script>
<style scoped>
.bx {
width: 96%;
margin: 0rpx auto;
}
.repair-title {
display: flex;
align-items: center;
justify-content: center;
height: 100rpx;
padding-top: 100rpx;
}
.repair-title text {
font-size: 40rpx;
font-weight: bold;
height: 70rpx;
border-bottom: 8rpx solid #3c9cff;
}
.image-list {
width: 100%;
display: flex;
flex-wrap: wrap;
padding-top: 20rpx;
}
.image-item,
.upload {
display: flex;
align-items: center;
justify-content: center;
width: 24%;
height: 174rpx;
background: #f8f8f8;
margin-left: 1%;
border-radius: 15rpx;
overflow: hidden;
margin-bottom: 20rpx;
}
.image-item image {
width: 100%;
}
</style>

+ 175
- 0
pages/repairList/repairList.vue View File

@ -0,0 +1,175 @@
<template>
<view class="repairList reserveSpace">
<view class="tab">
<uv-tabs :list="list" lineWidth="60" lineHeight="10" @click="selectTag"></uv-tabs>
</view>
<view class="repairList-main">
<view v-for="item in 10" class="repairItem">
<view class="repairMain">
<!-- <view class="userName">用户名</view> -->
<view class="build">
<view>
<text style="margin-right: 10rpx;">楼栋:楼栋1</text>
<text>室号:A1001</text>
</view>
<text style="font-size: 26rpx;">2024-12-12</text>
</view>
<view class="desc">
近期，我所在的学生宿舍楼X栋XXX室遇到了一个亟需解决的问题，特此提交报修申请。具体故障为：宿舍内卫生间水龙头出现持续滴漏现象，已持续多日，不仅造成了水资源的浪费，还影响了寝室的日常使用和休息环境。夜间滴水声尤为明显，干扰了同学们的睡眠质量。我们初步检查，未能自行解决，判断可能是内部密封件老化或松动所致。为尽快恢复宿舍正常生活环境，恳请学校后勤部门能尽快安排专业维修人员前来检查并修复，我们将积极配合维修工作，确保宿舍设施尽快恢复正常使用。感谢学校对我们学习生活环境的关心与支持！
</view>
<view class="repairImages">
<view v-for="(item,index) in urls" :key="index" class="image-item">
<image @click="viewImageAsList(index)" :src="item" mode="widthFix"></image>
</view>
</view>
<view class="btns">
<view @click="toReject" class="btn">驳回</view>
<view @click="toFinish" class="btn">结单</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
urls: [
'http://www.mxqih.top:666/logo.png',
'http://www.mxqih.top:666/logo.png',
'http://www.mxqih.top:666/logo.png'
],
list: [{
name: '待完成',
}, {
name: '已完成',
}],
current: 0,
currentIndex : 0
}
},
methods: {
//跳转驳回
toReject() {
uni.navigateTo({
url: '/pages/reject/reject'
})
},
//跳转结单页面
toFinish() {
uni.navigateTo({
url: '/pages/finish/finish'
})
},
//查看图片
viewImageAsList(index) {
this.currentIndex = index
this.$utils.previewImage({
current: this.currentIndex,
urls: this.urls
})
},
//选择了顶部的标签
selectTag(tag){
console.log(tag);
}
}
}
</script>
<style scoped>
.repairList{
background: #f8f8f8;
}
.tab{
display: flex;
align-items: center;
height: 80rpx;
background: white;
margin-bottom: 20rpx;
}
.repairList-main {
min-height: 100vh;
}
.repairItem {
display: flex;
background: white;
width: 96%;
margin: 0rpx auto;
border-radius: 20rpx;
margin-bottom: 20rpx;
}
.repairMain {
width: 100%;
box-sizing: border-box;
padding-left: 20rpx;
}
/*
.userName {
font-size: 32rpx;
margin: 10rpx 0rpx;
} */
.build {
display: flex;
justify-content: space-between;
font-size: 28rpx;
margin: 20rpx 0rpx;
}
.desc {
height: 200rpx;
overflow-y: scroll;
margin-bottom: 20rpx;
}
.repairImages {
display: flex;
flex-wrap: wrap;
margin: 10rpx 0rpx;
}
.image-item {
width: 24%;
margin-left: 1%;
height: 180rpx;
overflow: hidden;
}
.image-item image {
width: 100%;
}
.btns {
margin: 20rpx 0rpx;
display: flex;
justify-content: flex-end;
}
.btn {
width: 200rpx;
height: 50rpx;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50rpx;
margin-left: 15rpx;
font-size: 30rpx;
color: white;
background: #f9ae3d;
}
.btn:nth-child(2) {
background: #3c9cff;
}
</style>

BIN
static/bar/1.png View File

Before After
Width: 64  |  Height: 64  |  Size: 2.8 KiB

BIN
static/bar/2.png View File

Before After
Width: 64  |  Height: 64  |  Size: 2.8 KiB

BIN
static/bar/3.png View File

Before After
Width: 64  |  Height: 64  |  Size: 906 B

BIN
static/bar/4.png View File

Before After
Width: 64  |  Height: 64  |  Size: 930 B

BIN
static/login/logo.png View File

Before After
Width: 505  |  Height: 504  |  Size: 154 KiB

+ 42
- 0
uni_modules/uni-icons/changelog.md View File

@ -0,0 +1,42 @@
## 2.0.10（2024-06-07）
- 优化 uni-app x 中，size 属性的类型
## 2.0.9（2024-01-12）
fix: 修复图标大小默认值错误的问题
## 2.0.8（2023-12-14）
- 修复 项目未使用 ts 情况下，打包报错的bug
## 2.0.7（2023-12-14）
- 修复 size 属性为 string 时，不加单位导致尺寸异常的bug
## 2.0.6（2023-12-11）
- 优化 兼容老版本icon类型，如 top ，bottom 等
## 2.0.5（2023-12-11）
- 优化 兼容老版本icon类型，如 top ，bottom 等
## 2.0.4（2023-12-06）
- 优化 uni-app x 下示例项目图标排序
## 2.0.3（2023-12-06）
- 修复 nvue下引入组件报错的bug
## 2.0.2（2023-12-05）
-优化 size 属性支持单位
## 2.0.1（2023-12-05）
- 新增 uni-app x 支持定义图标
## 1.3.5（2022-01-24）
- 优化 size 属性可以传入不带单位的字符串数值
## 1.3.4（2022-01-24）
- 优化 size 支持其他单位
## 1.3.3（2022-01-17）
- 修复 nvue 有些图标不显示的bug，兼容老版本图标
## 1.3.2（2021-12-01）
- 优化 示例可复制图标名称
## 1.3.1（2021-11-23）
- 优化 兼容旧组件 type 值
## 1.3.0（2021-11-19）
- 新增 更多图标
- 优化 自定义图标使用方式
- 优化 组件UI，并提供设计资源，详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移，详见:[https://uniapp.dcloud.io/component/uniui/uni-icons](https://uniapp.dcloud.io/component/uniui/uni-icons)
## 1.1.7（2021-11-08）
## 1.2.0（2021-07-30）
- 组件兼容 vue3，如何创建vue3项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.1.5（2021-05-12）
- 新增 组件示例地址
## 1.1.4（2021-02-05）
- 调整为uni_modules目录规范

+ 91
- 0
uni_modules/uni-icons/components/uni-icons/uni-icons.uvue 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>

+ 110
- 0
uni_modules/uni-icons/components/uni-icons/uni-icons.vue 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>

+ 664
- 0
uni_modules/uni-icons/components/uni-icons/uniicons.css 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";
}

BIN
uni_modules/uni-icons/components/uni-icons/uniicons.ttf View File


+ 664
- 0
uni_modules/uni-icons/components/uni-icons/uniicons_file.ts 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)

+ 649
- 0
uni_modules/uni-icons/components/uni-icons/uniicons_file_vue.js 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)

+ 89
- 0
uni_modules/uni-icons/package.json 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"
}
}
}
}
}

+ 8
- 0
uni_modules/uni-icons/readme.md View File

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

+ 8
- 0
uni_modules/uni-scss/changelog.md View File

@ -0,0 +1,8 @@
## 1.0.3（2022-01-21）
- 优化 组件示例
## 1.0.2（2021-11-22）
- 修复 / 符号在 vue 不同版本兼容问题引起的报错问题
## 1.0.1（2021-11-22）
- 修复 vue3中scss语法兼容问题
## 1.0.0（2021-11-18）
- init

+ 1
- 0
uni_modules/uni-scss/index.scss View File

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

+ 82
- 0
uni_modules/uni-scss/package.json 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"
}
}
}
}
}

+ 4
- 0
uni_modules/uni-scss/readme.md View File

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

+ 7
- 0
uni_modules/uni-scss/styles/index.scss 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';

+ 3
- 0
uni_modules/uni-scss/styles/setting/_border.scss View File

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

+ 66
- 0
uni_modules/uni-scss/styles/setting/_color.scss 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;
}

+ 55
- 0
uni_modules/uni-scss/styles/setting/_radius.scss 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)
}
}
}
}

+ 56
- 0
uni_modules/uni-scss/styles/setting/_space.scss 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);
}
}
}
}

+ 167
- 0
uni_modules/uni-scss/styles/setting/_styles.scss 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 */

+ 24
- 0
uni_modules/uni-scss/styles/setting/_text.scss 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 */
}

+ 146
- 0
uni_modules/uni-scss/styles/setting/_variables.scss 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;

+ 19
- 0
uni_modules/uni-scss/styles/tools/functions.scss 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;
};

+ 31
- 0
uni_modules/uni-scss/theme.scss 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);

+ 62
- 0
uni_modules/uni-scss/variables.scss 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);

+ 95
- 0
utils/oss-upload/common/crypto/base64.js View File

@ -0,0 +1,95 @@
export const Base64 = {
_keyStr: "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",
encode: function(input) {
var output = "";
var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
var i = 0;
input = Base64._utf8_encode(input);
while (i < input.length) {
chr1 = input.charCodeAt(i++);
chr2 = input.charCodeAt(i++);
chr3 = input.charCodeAt(i++);
enc1 = chr1 >> 2;
enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
enc4 = chr3 & 63;
if (isNaN(chr2)) {
enc3 = enc4 = 64;
} else if (isNaN(chr3)) {
enc4 = 64;
}
output = output +
this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) +
this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);
}
return output;
},
decode: function(input) {
var output = "";
var chr1, chr2, chr3;
var enc1, enc2, enc3, enc4;
var i = 0;
input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");
while (i < input.length) {
enc1 = this._keyStr.indexOf(input.charAt(i++));
enc2 = this._keyStr.indexOf(input.charAt(i++));
enc3 = this._keyStr.indexOf(input.charAt(i++));
enc4 = this._keyStr.indexOf(input.charAt(i++));
chr1 = (enc1 << 2) | (enc2 >> 4);
chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
chr3 = ((enc3 & 3) << 6) | enc4;
output = output + String.fromCharCode(chr1);
if (enc3 != 64) {
output = output + String.fromCharCode(chr2);
}
if (enc4 != 64) {
output = output + String.fromCharCode(chr3);
}
}
output = Base64._utf8_decode(output);
return output;
},
_utf8_encode: function(string) {
string = string.replace(/\r\n/g, "\n");
var utftext = "";
for (var n = 0; n < string.length; n++) {
var c = string.charCodeAt(n);
if (c < 128) {
utftext += String.fromCharCode(c);
} else if ((c > 127) && (c < 2048)) {
utftext += String.fromCharCode((c >> 6) | 192);
utftext += String.fromCharCode((c & 63) | 128);
} else {
utftext += String.fromCharCode((c >> 12) | 224);
utftext += String.fromCharCode(((c >> 6) & 63) | 128);
utftext += String.fromCharCode((c & 63) | 128);
}
}
return utftext;
},
_utf8_decode: function(utftext) {
var string = "";
var i = 0;
var c = c1 = c2 = 0;
while (i < utftext.length) {
c = utftext.charCodeAt(i);
if (c < 128) {
string += String.fromCharCode(c);
i++;
} else if ((c > 191) && (c < 224)) {
c2 = utftext.charCodeAt(i + 1);
string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
i += 2;
} else {
c2 = utftext.charCodeAt(i + 1);
c3 = utftext.charCodeAt(i + 2);
string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
i += 3;
}
}
return string;
}
}

+ 117
- 0
utils/oss-upload/common/crypto/crypto.js.js View File

@ -0,0 +1,117 @@
var base64map = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
let Crypto = {};
var util = Crypto.util = {
rotl: function(n, b) {
return (n << b) | (n >>> (32 - b));
},
rotr: function(n, b) {
return (n << (32 - b)) | (n >>> b);
},
endian: function(n) {
if (n.constructor == Number) {
return util.rotl(n, 8) & 0x00FF00FF |
util.rotl(n, 24) & 0xFF00FF00;
}
for (var i = 0; i < n.length; i++)
n[i] = util.endian(n[i]);
return n;
},
randomBytes: function(n) {
for (var bytes = []; n > 0; n--)
bytes.push(Math.floor(Math.random() * 256));
return bytes;
},
stringToBytes: function(str) {
var bytes = [];
for (var i = 0; i < str.length; i++)
bytes.push(str.charCodeAt(i));
return bytes;
},
bytesToString: function(bytes) {
var str = [];
for (var i = 0; i < bytes.length; i++)
str.push(String.fromCharCode(bytes[i]));
return str.join("");
},
stringToWords: function(str) {
var words = [];
for (var c = 0, b = 0; c < str.length; c++, b += 8)
words[b >>> 5] |= str.charCodeAt(c) << (24 - b % 32);
return words;
},
bytesToWords: function(bytes) {
var words = [];
for (var i = 0, b = 0; i < bytes.length; i++, b += 8)
words[b >>> 5] |= bytes[i] << (24 - b % 32);
return words;
},
wordsToBytes: function(words) {
var bytes = [];
for (var b = 0; b < words.length * 32; b += 8)
bytes.push((words[b >>> 5] >>> (24 - b % 32)) & 0xFF);
return bytes;
},
bytesToHex: function(bytes) {
var hex = [];
for (var i = 0; i < bytes.length; i++) {
hex.push((bytes[i] >>> 4).toString(16));
hex.push((bytes[i] & 0xF).toString(16));
}
return hex.join("");
},
hexToBytes: function(hex) {
var bytes = [];
for (var c = 0; c < hex.length; c += 2)
bytes.push(parseInt(hex.substr(c, 2), 16));
return bytes;
},
bytesToBase64: function(bytes) {
if (typeof btoa == "function") return btoa(util.bytesToString(bytes));
var base64 = [],
overflow;
for (var i = 0; i < bytes.length; i++) {
switch (i % 3) {
case 0:
base64.push(base64map.charAt(bytes[i] >>> 2));
overflow = (bytes[i] & 0x3) << 4;
break;
case 1:
base64.push(base64map.charAt(overflow | (bytes[i] >>> 4)));
overflow = (bytes[i] & 0xF) << 2;
break;
case 2:
base64.push(base64map.charAt(overflow | (bytes[i] >>> 6)));
base64.push(base64map.charAt(bytes[i] & 0x3F));
overflow = -1;
}
}
if (overflow != undefined && overflow != -1)
base64.push(base64map.charAt(overflow));
while (base64.length % 4 != 0) base64.push("=");
return base64.join("");
},
base64ToBytes: function(base64) {
if (typeof atob == "function") return util.stringToBytes(atob(base64));
base64 = base64.replace(/[^A-Z0-9+\/]/ig, "");
var bytes = [];
for (var i = 0; i < base64.length; i++) {
switch (i % 4) {
case 1:
bytes.push((base64map.indexOf(base64.charAt(i - 1)) << 2) |
(base64map.indexOf(base64.charAt(i)) >>> 4));
break;
case 2:
bytes.push(((base64map.indexOf(base64.charAt(i - 1)) & 0xF) << 4) |
(base64map.indexOf(base64.charAt(i)) >>> 2));
break;
case 3:
bytes.push(((base64map.indexOf(base64.charAt(i - 1)) & 0x3) << 6) |
(base64map.indexOf(base64.charAt(i))));
break;
}
}
return bytes;
}
};
Crypto.mode = {};
export default Crypto;

+ 29
- 0
utils/oss-upload/common/crypto/hmac.js View File

@ -0,0 +1,29 @@
import Crypto from '@/utils/oss-upload/common/crypto/crypto.js.js';
(function() {
// Shortcut
var util = Crypto.util;
Crypto.HMAC = function(hasher, message, key, options) {
// Allow arbitrary length keys
key = key.length > hasher._blocksize * 4 ?
hasher(key, {
asBytes: true
}) :
util.stringToBytes(key);
// XOR keys with pad constants
var okey = key,
ikey = key.slice(0);
for (var i = 0; i < hasher._blocksize * 4; i++) {
okey[i] ^= 0x5C;
ikey[i] ^= 0x36;
}
var hmacbytes = hasher(util.bytesToString(okey) +
hasher(util.bytesToString(ikey) + message, {
asString: true
}), {
asBytes: true
});
return options && options.asBytes ? hmacbytes :
options && options.asString ? util.bytesToString(hmacbytes) :
util.bytesToHex(hmacbytes);
};
})();

+ 59
- 0
utils/oss-upload/common/crypto/sha1.js View File

@ -0,0 +1,59 @@
import Crypto from '@/utils/oss-upload/common/crypto/crypto.js.js';
(function() {
// Shortcut
var util = Crypto.util;
// Public API
var SHA1 = Crypto.SHA1 = function(message, options) {
var digestbytes = util.wordsToBytes(SHA1._sha1(message));
return options && options.asBytes ? digestbytes :
options && options.asString ? util.bytesToString(digestbytes) :
util.bytesToHex(digestbytes);
};
// The core
SHA1._sha1 = function(message) {
var m = util.stringToWords(message),
l = message.length * 8,
w = [],
H0 = 1732584193,
H1 = -271733879,
H2 = -1732584194,
H3 = 271733878,
H4 = -1009589776;
// Padding
m[l >> 5] |= 0x80 << (24 - l % 32);
m[((l + 64 >>> 9) << 4) + 15] = l;
for (var i = 0; i < m.length; i += 16) {
var a = H0,
b = H1,
c = H2,
d = H3,
e = H4;
for (var j = 0; j < 80; j++) {
if (j < 16) w[j] = m[i + j];
else {
var n = w[j - 3] ^ w[j - 8] ^ w[j - 14] ^ w[j - 16];
w[j] = (n << 1) | (n >>> 31);
}
var t = ((H0 << 5) | (H0 >>> 27)) + H4 + (w[j] >>> 0) + (
j < 20 ? (H1 & H2 | ~H1 & H3) + 1518500249 :
j < 40 ? (H1 ^ H2 ^ H3) + 1859775393 :
j < 60 ? (H1 & H2 | H1 & H3 | H2 & H3) - 1894007588 :
(H1 ^ H2 ^ H3) - 899497514);
H4 = H3;
H3 = H2;
H2 = (H1 << 30) | (H1 >>> 2);
H1 = H0;
H0 = t;
}
H0 += a;
H1 += b;
H2 += c;
H3 += d;
H4 += e;
}
return [H0, H1, H2, H3, H4];
};
// Package private blocksize
SHA1._blocksize = 16;
})();

+ 36
- 0
utils/oss-upload/oss/OSSConfig.js View File

@ -0,0 +1,36 @@
import Crypto from '@/utils/oss-upload/common/crypto/crypto.js.js';
import '@/utils/oss-upload/common/crypto/hmac.js';
import '@/utils/oss-upload/common/crypto/sha1.js';
import { Base64 } from '@/utils/oss-upload/common/crypto/base64.js';
import ossConfig from '@/config.js'
let date = new Date()
date = date.setHours(date.getHours() + 1)
let extime = "" + new Date(date).toISOString()
let policyText = {
"expiration": extime,
"conditions": [
["content-length-range", 0, 1024 * 1024 * 100] // 设置上传文件的大小限制
]
};
let config = {
accessid: ossConfig.aliOss.config.accessKeyId,
accesskey: ossConfig.aliOss.config.accessKeySecret,
osshost: ossConfig.aliOss.url,
policyBase64: Base64.encode(JSON.stringify(policyText))
}
let message = config.policyBase64;
let bytes = Crypto.HMAC(Crypto.SHA1, message, config.accesskey, {
asBytes: true
});
let signature = Crypto.util.bytesToBase64(bytes);
let timetamp = new Date().getTime();
let OSSConfig = {
name: 'aliyun',
host: config.osshost,
accessid: config.accessid,
signature: signature,
policyBase64: config.policyBase64,
}
export default OSSConfig;

+ 139
- 0
utils/oss-upload/oss/index.js View File

@ -0,0 +1,139 @@
/**
* 阿里云OSS工具类
*/
import OSSConfig from "@/utils/oss-upload/oss/OSSConfig.js"
//支持web端
import {
uploadFileToOSS
} from '@/utils/oss-upload/oss/web.js'
import ossConfig from '@/config.js'
/**
* 生成一个随机的Key
*/
function storeKey() {
let s = [];
let hexDigits = "0123456789abcdef";
for (let i = 0; i < 36; i++) {
s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
}
s[14] = "4";
s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1);
s[8] = s[13] = s[18] = s[23] = "-";
return s.join("");
}
/**
* 根据当天日期在OSS端生成文件夹
*/
function storeFolder() {
const date = new Date();
const formatNumber = n => {
n = n.toString()
return n[1] ? n : '0' + n
}
return [date.getFullYear(), date.getMonth() + 1, date.getDate()].map(formatNumber).join('-')
}
/**
* 阿里云OSS上传文件, 所有具体功能的工具函数均基于此
* 注意, resolve时一定为上传成功, 返回OSS上的Key
* @param filePath 待上传文件的URI
* @param key 存储桶中的目标文件名
* @param folder 存储桶中的目标文件夹
*/
export function ossUpload(filePath, key = storeKey(), folder = storeFolder()) {
return new Promise((resolve, reject) => {
if (folder && folder?.length > 0) {
if (folder[0] == "/") folder = folder.slice(1, folder.length)
if (folder[folder.length - 1] != "/") folder += "/"
key = folder + key
}
const filePrefixArr = filePath.split(".")
key += `.${filePrefixArr[filePrefixArr.length - 1]}`
let config = {
url: OSSConfig.host,
name: 'file',
filePath,
formData: {
key,
policy: OSSConfig.policyBase64,
OSSAccessKeyId: OSSConfig.accessid,
success_action_status: '200',
signature: OSSConfig.signature,
},
success(res) {
if (res.errMsg.includes("uploadFile:ok")) {
resolve(ossConfig.aliOss.url + key)
} else {
reject(res)
}
},
fail(err) {
reject(err)
}
}
uni.uploadFile(config)
})
}
/**
* 阿里云OSS上传图片
* @param {compressed, key, folder, success, fail} compressed: 是否压缩 key: 存储桶中的目标文件名 folder: 存储桶中的目标文件夹
*/
export function ossUploadImage({
key,
folder,
compressed = true, //是否压缩
success, //成功时的回调
fail //失败时的回调
}) {
const sizeType = [compressed ? 'compressed' : 'original']
uni.chooseImage({
count: 1,
sizeType,
success(res) {
// #ifdef H5
return uploadFileToOSS(res.tempFiles[0]).then(success).catch(fail)
// #endif
ossUpload(res.tempFilePaths[0], key, folder).then(success).catch(fail)
},
fail
})
}
/**
* 阿里云OSS上传视频
* @param { key, folder, sourceType, compressed, maxDuration, camera, success, fail}
* key: 存储桶中的目标文件名 folder: 存储桶中的目标文件夹 其它参数同uni.chooseVideo(mpWeixin)
*/
export function ossUploadVideo({
key,
folder,
sourceType = ['album', 'camera'], //album 从相册选视频, camera 使用相机拍摄
compressed = true, //是否压缩所选的视频源文件
maxDuration = 60, //拍摄视频最长拍摄时间, 单位秒。最长支持 60 秒
camera = 'back', //调用相机方向, 'front'、'back', 默认'back'
success, //成功时的回调
fail //失败时的回调
}) {
uni.chooseVideo({
sourceType,
compressed,
maxDuration,
camera,
success(res) {
// #ifdef H5
return uploadFileToOSS(res.tempFile).then(success).catch(fail)
// #endif
ossUpload(res.tempFilePath, key, folder).then(success).catch(fail)
},
fail
})
}
const OSS = {
ossUploadVideo,
ossUploadImage,
ossUpload
}
export default OSS;

+ 63
- 0
utils/oss-upload/oss/web.js View File

@ -0,0 +1,63 @@
// 此方法适用于web
import OSS from "ali-oss"
import config from '@/config.js'
/**
* 生成一个随机的Key
*/
function storeKey() {
let s = [];
let hexDigits = "0123456789abcdef";
for (let i = 0; i < 36; i++) {
s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
}
s[14] = "4";
s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1);
s[8] = s[13] = s[18] = s[23] = "-";
return s.join("");
}
/**
* 根据当天日期在OSS端生成文件夹
*/
function storeFolder() {
const date = new Date();
const formatNumber = n => {
n = n.toString()
return n[1] ? n : '0' + n
}
return [date.getFullYear(), date.getMonth() + 1, date.getDate()].map(formatNumber).join('-')
}
export function uploadFileToOSS(file) {
uni.showLoading({
title: '上传中...'
});
return new Promise((resolve,reject) => {
// 创建OSS实例
const client = new OSS(config.aliOss.config);
// 设置文件名和文件目录
const suffix = '.' + file.name.split('.').pop();
let key = storeFolder()
if(key[key.length - 1] != '/') key += '/'
const fileName = key + storeKey() + suffix; // 注意：文件名需要是唯一的
// 使用put接口上传文件
client.multipartUpload(fileName, file, {
headers: {
'Content-Disposition': 'inline',
'Content-Type': file.type
}
}).then(res => {
uni.hideLoading();
resolve(config.aliOss.url + res.name);
}).catch(err => {
uni.hideLoading();
reject(err)
})
})
}

Write Preview
Loading…
Cancel
Save