初始化仓库
commit
752ca3861a
|
|
@ -0,0 +1,16 @@
|
|||
{ // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
|
||||
// launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
|
||||
"version": "0.0",
|
||||
"configurations": [{
|
||||
"default" :
|
||||
{
|
||||
"launchtype" : "local"
|
||||
},
|
||||
"mp-weixin" :
|
||||
{
|
||||
"launchtype" : "local"
|
||||
},
|
||||
"type" : "uniCloud"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
<script>
|
||||
export default {
|
||||
onLaunch: function() {
|
||||
console.log('App Launch')
|
||||
},
|
||||
onShow: function() {
|
||||
console.log('App Show')
|
||||
},
|
||||
onHide: function() {
|
||||
console.log('App Hide')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/*每个页面公共css */
|
||||
@import url('./static/iconfont/iconfont.css');
|
||||
::-webkit-scrollbar{
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,50 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="progress">
|
||||
<image src="@/static/image/procress.svg" mode=""></image>
|
||||
</view>
|
||||
<view class="telphone">
|
||||
<text class="iconfont icon-Vector-1"></text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"bottoms",
|
||||
data() {
|
||||
return {
|
||||
|
||||
};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.progress{
|
||||
margin-top: 89rpx;
|
||||
padding-right: 30rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
image{
|
||||
width: 575rpx;
|
||||
height: 93rpx;
|
||||
}
|
||||
}
|
||||
.telphone{
|
||||
position: fixed;
|
||||
right: 30rpx;
|
||||
bottom: 95rpx;
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
border-radius: 50%;
|
||||
background-color: #3887FD;
|
||||
text-align: center;
|
||||
line-height: 130rpx;
|
||||
box-shadow: 0 6rpx 26rpx 10rpx #0a2a9b1f;
|
||||
.icon-Vector-1{
|
||||
color: #fff;
|
||||
font-size: 50rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"navblack",
|
||||
data() {
|
||||
return {
|
||||
|
||||
};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"navno",
|
||||
data() {
|
||||
return {
|
||||
|
||||
};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,83 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="top" :style="'padding-top:' + top + 'px'"></view>
|
||||
<view style="display: flex;">
|
||||
<view class="nav" :class="color==0?'white':color==1?'black':''">
|
||||
<view class="iconfont icon-WeUIjichuyangshiku" @click="goTo(-1)"></view>
|
||||
<view class="iconfont" @click="goTo(1)"></view>
|
||||
</view>
|
||||
<view class="pageName" :class="color==0?'white':''" v-if="page">{{page}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props:['top','page','color'],
|
||||
name:"navs",
|
||||
data() {
|
||||
return {
|
||||
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
goTo(i){
|
||||
if(i==-1){
|
||||
uni.navigateBack()
|
||||
}else{
|
||||
uni.reLaunch({
|
||||
url:'/pages/index/index'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.nav{
|
||||
width: 141rpx;
|
||||
height: 62rpx;
|
||||
margin-left: 30rpx;
|
||||
border-radius: 40rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.iconfont{
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
.nav.white{
|
||||
color: #fff;
|
||||
background-color: rgba(0,0,0,.3);
|
||||
}
|
||||
.nav.black{
|
||||
color: #000;
|
||||
border: 1px solid #f7f7f7;
|
||||
.iconfont:first-child{
|
||||
position: relative;
|
||||
}
|
||||
.iconfont:first-child::after{
|
||||
content: '';
|
||||
width: 0;
|
||||
height: 32rpx;
|
||||
border: 1rpx solid #f7f7f7;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
.pageName{
|
||||
width: 402rpx;
|
||||
text-align: center;
|
||||
line-height: 62rpx;
|
||||
font-size: 32rpx;
|
||||
color: #000;
|
||||
font-weight: 400;
|
||||
}
|
||||
.pageName.white{
|
||||
color: #fff;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<script>
|
||||
var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
|
||||
CSS.supports('top: constant(a)'))
|
||||
document.write(
|
||||
'<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
|
||||
(coverSupport ? ', viewport-fit=cover' : '') + '" />')
|
||||
</script>
|
||||
<title></title>
|
||||
<!--preload-links-->
|
||||
<!--app-context-->
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"><!--app-html--></div>
|
||||
<script type="module" src="/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
import App from './App'
|
||||
|
||||
// #ifndef VUE3
|
||||
import Vue from 'vue'
|
||||
import './uni.promisify.adaptor'
|
||||
Vue.config.productionTip = false
|
||||
App.mpType = 'app'
|
||||
const app = new Vue({
|
||||
...App
|
||||
})
|
||||
app.$mount()
|
||||
// #endif
|
||||
|
||||
// #ifdef VUE3
|
||||
import { createSSRApp } from 'vue'
|
||||
export function createApp() {
|
||||
const app = createSSRApp(App)
|
||||
return {
|
||||
app
|
||||
}
|
||||
}
|
||||
// #endif
|
||||
|
|
@ -0,0 +1,73 @@
|
|||
{
|
||||
"name" : "bingyu",
|
||||
"appid" : "__UNI__1604193",
|
||||
"description" : "",
|
||||
"versionName" : "1.0.0",
|
||||
"versionCode" : "100",
|
||||
"transformPx" : false,
|
||||
/* 5+App特有相关 */
|
||||
"app-plus" : {
|
||||
"usingComponents" : true,
|
||||
"nvueStyleCompiler" : "uni-app",
|
||||
"compilerVersion" : 3,
|
||||
"splashscreen" : {
|
||||
"alwaysShowBeforeRender" : true,
|
||||
"waiting" : true,
|
||||
"autoclose" : true,
|
||||
"delay" : 0
|
||||
},
|
||||
/* 模块配置 */
|
||||
"modules" : {},
|
||||
/* 应用发布信息 */
|
||||
"distribute" : {
|
||||
/* android打包配置 */
|
||||
"android" : {
|
||||
"permissions" : [
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
|
||||
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
|
||||
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
|
||||
]
|
||||
},
|
||||
/* ios打包配置 */
|
||||
"ios" : {},
|
||||
/* SDK配置 */
|
||||
"sdkConfigs" : {}
|
||||
}
|
||||
},
|
||||
/* 快应用特有相关 */
|
||||
"quickapp" : {},
|
||||
/* 小程序特有相关 */
|
||||
"mp-weixin" : {
|
||||
"appid" : "wx55ff808ba0e28b1d",
|
||||
"setting" : {
|
||||
"urlCheck" : false,
|
||||
"minified" : true
|
||||
},
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-alipay" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-baidu" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-toutiao" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"uniStatistics" : {
|
||||
"enable" : false
|
||||
},
|
||||
"vueVersion" : "2"
|
||||
}
|
||||
|
|
@ -0,0 +1,119 @@
|
|||
{
|
||||
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
|
||||
{
|
||||
"path": "pages/index/index",
|
||||
"style": {
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTitleText": "首页"
|
||||
}
|
||||
}
|
||||
,{
|
||||
"path" : "pages/companyProfile/companyProfile",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTextStyle": "white",
|
||||
"navigationBarTitleText": "公司介绍"
|
||||
}
|
||||
|
||||
}
|
||||
,{
|
||||
"path" : "pages/companyInformation/companyInformation",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "公司资讯"
|
||||
}
|
||||
|
||||
}
|
||||
,{
|
||||
"path" : "pages/infoDetail/infoDetail",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "资讯详情"
|
||||
}
|
||||
|
||||
}
|
||||
,{
|
||||
"path" : "pages/caseSelect/caseSelect",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "案例库"
|
||||
}
|
||||
|
||||
}
|
||||
,{
|
||||
"path" : "pages/caseDetail/caseDetail",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTextStyle": "white",
|
||||
"navigationBarTitleText": "案例详情"
|
||||
}
|
||||
|
||||
}
|
||||
,{
|
||||
"path" : "pages/my/my",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTextStyle": "white",
|
||||
"navigationBarTitleText": "个人中心"
|
||||
}
|
||||
|
||||
}
|
||||
,{
|
||||
"path" : "pages/myInfo/myInfo",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "个人信息"
|
||||
}
|
||||
|
||||
}
|
||||
,{
|
||||
"path" : "pages/myProject/myProject",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "我的项目"
|
||||
}
|
||||
|
||||
}
|
||||
,{
|
||||
"path" : "pages/notice/notice",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "通知"
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
,{
|
||||
"path" : "pages/projectSchedule/projectSchedule",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "项目进展"
|
||||
}
|
||||
|
||||
}
|
||||
],
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "uni-app",
|
||||
"navigationBarBackgroundColor": "#F8F8F8",
|
||||
"backgroundColor": "#F8F8F8"
|
||||
},
|
||||
"uniIdRouter": {}
|
||||
}
|
||||
|
|
@ -0,0 +1,444 @@
|
|||
<template>
|
||||
<view class="detail-box">
|
||||
<navs :top='top' :color='color'></navs>
|
||||
<view class="detailBg">
|
||||
<image
|
||||
src="https://img.zcool.cn/community/01bfbb5c9ebc0ba8012141685959e0.jpg?x-oss-process=image/resize,m_fill,w_520,h_390,limit_1/auto-orient,1/sharpen,100/quality,q_80/format,webp"
|
||||
mode=""></image>
|
||||
<view class="detail-title">
|
||||
<image src="@/static/image/default-avatar.svg" mode=""></image>
|
||||
<view>
|
||||
<view class="detail-name">xxxx小程序</view>
|
||||
<view class="detail-company">xxxxxxx公司</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="detail-cont">
|
||||
<text
|
||||
style="line-height: 44rpx;">这是为xxxx开发的一套系统，这是为xxxx开发的一套系统，这是为xxxx开发的一套系统，这是为xxxx开发的一套系统，这是为xxxx开发的一套系明明就静静。</text>
|
||||
<image
|
||||
src="https://img.zcool.cn/community/01bfbb5c9ebc0ba8012141685959e0.jpg?x-oss-process=image/resize,m_fill,w_520,h_390,limit_1/auto-orient,1/sharpen,100/quality,q_80/format,webp"
|
||||
mode=""></image>
|
||||
<view class="service">
|
||||
<view class="service-title">服务介绍</view>
|
||||
<view class="service-cont">
|
||||
<view>服务内容全部包含:
|
||||
上海莫畏信息科技位于上海张江园区技术为主导的科技创新型企业。公司主要从事移动化信息网络与电子商务、IT方案咨询与服务、计算机软件开发与实施、智慧城市，智慧生活相关的物联网领域的开发，公司经营范围：APP开发，小程序开发，网站建设，系统定制，企业管理软件等，公司坚持科技创新，以人为本的理念，我们为不同行业客户提供全面专业的定制化服务。
|
||||
</view>
|
||||
<view>服务优势: 1.【报价合理】我司案例众多、经验丰富，最大化降低开发成本，匹配您的预算。</view>
|
||||
<view>2.【公司专业】经营十七年，人员配置齐全，多年开发经验，久经历练，实操落地。</view>
|
||||
<view>3.【流程规范】严格按照开发规范执行，及时反馈项目进度，做到双方信息对称。</view>
|
||||
<view>4.【多人售后】多人多维度提供售后服务，力争项目提升客户体验，让您和您的客户都放心。</view>
|
||||
<view>5.【资质齐全】具有高*双*认证，质量管理体系，项目经理PMP证书，十多项软著等资质 服务前需客户提供的信息: </view>
|
||||
<view>【梳理需求】产品经理会跟您详细沟通需求，梳理业务逻辑，给您匹配合适的产品，如需定制，则会详细沟通。</view>
|
||||
<view>【报价反馈】评估好需求之后给出合理的报价和周期，根据您的预算和周期继而调整需求方案 </view>
|
||||
<view>【需求匹配】报价和周期匹配在接受范围内后，产品经理会给出需求功能文档 </view>
|
||||
<view>【提供合同】根据项目类型编辑合同文档给您过目</view>
|
||||
<view>【阐明服务】在合作之前我们会把服务流程和收费标准都说清楚，以免后期有误会。</view>
|
||||
</view>
|
||||
<view class="service-tag">
|
||||
<view v-for="(item,index) in tag" :key="index">{{item}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="service-substance">
|
||||
<view class="substance-title">服务内容</view>
|
||||
<view class="table">
|
||||
<uni-table border stripe emptyText="暂无更多数据">
|
||||
<!-- 表头行 -->
|
||||
<uni-tr>
|
||||
<uni-th align="left" class="th1">版本</uni-th>
|
||||
<uni-th align="center" class="th2">
|
||||
<view>基础版</view>
|
||||
<view>￥ 2699.00</view>
|
||||
</uni-th>
|
||||
<uni-th align="center" class="th3">
|
||||
<view>标准版</view>
|
||||
<view>￥ 2699.00</view>
|
||||
</uni-th>
|
||||
<uni-th align="center" class="th4">
|
||||
<view>高级版</view>
|
||||
<view>￥ 2699.00</view>
|
||||
</uni-th>
|
||||
</uni-tr>
|
||||
<!-- 表格数据行 -->
|
||||
<uni-tr>
|
||||
<uni-td>服务卖点</uni-td>
|
||||
<uni-td>基础版，报价工期详情咨询客服</uni-td>
|
||||
<uni-td>基础版，报价工期详情咨询客服</uni-td>
|
||||
<uni-td>基础版，报价工期详情咨询客服</uni-td>
|
||||
</uni-tr>
|
||||
<uni-tr>
|
||||
<uni-td>项目开工</uni-td>
|
||||
</uni-tr>
|
||||
<uni-tr>
|
||||
<uni-td>专属服务对接群</uni-td>
|
||||
<uni-td>
|
||||
<image src="@/static/image/Frame.svg" mode=""></image>
|
||||
</uni-td>
|
||||
<uni-td>
|
||||
<image src="@/static/image/Frame.svg" mode=""></image>
|
||||
</uni-td>
|
||||
<uni-td>
|
||||
<image src="@/static/image/Frame.svg" mode=""></image>
|
||||
</uni-td>
|
||||
</uni-tr>
|
||||
<uni-tr>
|
||||
<uni-td>全程一对一服务</uni-td>
|
||||
<uni-td>
|
||||
<image src="@/static/image/Frame.svg" mode=""></image>
|
||||
</uni-td>
|
||||
<uni-td>
|
||||
<image src="@/static/image/Frame.svg" mode=""></image>
|
||||
</uni-td>
|
||||
<uni-td>
|
||||
<image src="@/static/image/Frame.svg" mode=""></image>
|
||||
</uni-td>
|
||||
</uni-tr>
|
||||
<uni-tr>
|
||||
<uni-td>项目经理</uni-td>
|
||||
<uni-td>-</uni-td>
|
||||
<uni-td>-</uni-td>
|
||||
<uni-td>1名</uni-td>
|
||||
</uni-tr>
|
||||
<uni-tr>
|
||||
<uni-td>产品经理</uni-td>
|
||||
<uni-td>-</uni-td>
|
||||
<uni-td>-</uni-td>
|
||||
<uni-td>1名</uni-td>
|
||||
</uni-tr>
|
||||
<uni-tr>
|
||||
<uni-td>产品经理</uni-td>
|
||||
<uni-td>-</uni-td>
|
||||
<uni-td>-</uni-td>
|
||||
<uni-td>1名</uni-td>
|
||||
</uni-tr>
|
||||
</uni-table>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottoms" :style="'padding-bottom:'+safeAreaBottom+'px'">
|
||||
<view class="share" @click="shareTo()">
|
||||
<view class="iconfont icon-Group17"></view>
|
||||
<view style="margin-top: 6rpx;">分享</view>
|
||||
</view>
|
||||
<view class="similar">我要类似</view>
|
||||
</view>
|
||||
<uni-popup ref="popup" type="bottom" safeArea>
|
||||
<view class="shareCard">
|
||||
<view class="card-top">请选择分享方式</view>
|
||||
<view class="Fra1me" @click="closePop()">
|
||||
<image src="@/static/image/Fra1me.svg" mode=""></image>
|
||||
</view>
|
||||
<view class="share-method">
|
||||
<view>
|
||||
<view class="method" style="background-color: #2F9BFF;">
|
||||
<image src="@/static/image/share1.svg" mode=""></image>
|
||||
</view>
|
||||
<view class="method-text">小程序码</view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="method" style="background-color: #9C8FEC;">
|
||||
<image src="@/static/image/share2.svg" mode=""></image>
|
||||
</view>
|
||||
<view class="method-text">复制链接</view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="method" style="background-color: #09BB07;">
|
||||
<image src="@/static/image/share3.svg" mode=""></image>
|
||||
</view>
|
||||
<view class="method-text">转发给朋友</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
color: 0,
|
||||
top: 0,
|
||||
tag: ['php', 'Java', 'B/S', '定制开发', '源码交付'],
|
||||
safeAreaBottom: 0
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.top = uni.getMenuButtonBoundingClientRect().top;
|
||||
this.safeDistance()
|
||||
},
|
||||
methods: {
|
||||
safeDistance() {
|
||||
let safeArea = uni.getSystemInfoSync().safeArea;
|
||||
let screenHeight = uni.getSystemInfoSync().screenHeight;
|
||||
this.safeAreaBottom = screenHeight - safeArea.bottom;
|
||||
},
|
||||
shareTo() {
|
||||
this.$refs.popup.open()
|
||||
},
|
||||
closePop() {
|
||||
this.$refs.popup.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.detail-box {
|
||||
position: relative;
|
||||
padding-bottom: 234rpx;
|
||||
}
|
||||
|
||||
.detailBg {
|
||||
width: 100%;
|
||||
height: 580rpx;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: -10;
|
||||
|
||||
>image {
|
||||
width: 100%;
|
||||
height: 580rpx;
|
||||
}
|
||||
|
||||
.detail-title {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 108rpx;
|
||||
background-color: rgba(0, 0, 0, .5);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 72rpx;
|
||||
height: 72rpx;
|
||||
margin-left: 32rpx;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.detail-name {
|
||||
font-size: 36rpx;
|
||||
font-weight: 500;
|
||||
line-height: 36rpx;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.detail-company {
|
||||
font-size: 22rpx;
|
||||
font-weight: 400;
|
||||
color: #ffffffb3;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.detail-cont {
|
||||
margin-top: 440rpx;
|
||||
padding: 0 30rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
color: #333;
|
||||
|
||||
>image {
|
||||
margin-top: 18rpx;
|
||||
width: 100%;
|
||||
height: 1028rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.service {
|
||||
margin-top: 96rpx;
|
||||
|
||||
.service-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: 600;
|
||||
color: #2A3A72;
|
||||
}
|
||||
|
||||
.service-cont {
|
||||
margin-top: 22rpx;
|
||||
line-height: 48rpx;
|
||||
padding-bottom: 26rpx;
|
||||
border-bottom: 1rpx solid #F0F0F0;
|
||||
}
|
||||
|
||||
.service-tag {
|
||||
display: flex;
|
||||
margin-top: 21rpx;
|
||||
color: #3887FD;
|
||||
|
||||
>view {
|
||||
height: 44rpx;
|
||||
padding: 0 18rpx;
|
||||
background: #3887fd1a;
|
||||
border-radius: 22rpx;
|
||||
line-height: 44rpx;
|
||||
margin-left: 12rpx;
|
||||
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.service-substance {
|
||||
margin-top: 96rpx;
|
||||
|
||||
.substance-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: 600;
|
||||
color: #2A3A72;
|
||||
}
|
||||
|
||||
.table {
|
||||
// height: 30rpx;
|
||||
margin-top: 38rpx;
|
||||
|
||||
image {
|
||||
width: 22rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bottoms {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
border-top: 1rpx solid #EBEBEB;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.share {
|
||||
margin-left: 54rpx;
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.similar {
|
||||
margin-right: 30rpx;
|
||||
width: 302rpx;
|
||||
height: 76rpx;
|
||||
border-radius: 12rpx;
|
||||
background-color: #3887FD;
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
text-align: center;
|
||||
line-height: 76rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.shareCard {
|
||||
height: 349rpx;
|
||||
border-radius: 60rpx 60rpx 0 0;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
.card-top {
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
margin-top: 45rpx;
|
||||
}
|
||||
|
||||
.Fra1me {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
position: absolute;
|
||||
right: 42rpx;
|
||||
top: 35rpx;
|
||||
|
||||
image {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.share-method {
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
margin-top: 50rpx;
|
||||
|
||||
.method {
|
||||
margin: 0 auto;
|
||||
width: 110rpx;
|
||||
height: 110rpx;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
height: 60rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.method-text {
|
||||
color: #A3A3A3;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
line-height: 46rpx;
|
||||
margin-top: 14rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.uni-table-th {
|
||||
background-color: #F0F0F0;
|
||||
height: 100rpx;
|
||||
font-size: 28rpx;
|
||||
color: #333 !important;
|
||||
width: 150rpx !important;
|
||||
|
||||
&:nth-child(2) {
|
||||
background: linear-gradient(88.6deg, #6ba6fe 0%, #3887fd 100%);
|
||||
color: #fff !important;
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
&:nth-child(3) {
|
||||
background: linear-gradient(88.6deg, #f5be4f 0%, #f3ab41 100%);
|
||||
color: #fff !important;
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
&:nth-child(4) {
|
||||
background: linear-gradient(88.6deg, #4d4968 0%, #333049 100%);
|
||||
color: #fff !important;
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
.uni-table-tr{
|
||||
&:nth-child(3){
|
||||
position: relative;
|
||||
&::after{
|
||||
content: '';
|
||||
width: 0;
|
||||
height: 64rpx;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
border-right: 1rpx solid #EFF4FF;
|
||||
}
|
||||
.uni-table-td{
|
||||
color: #333;
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
border-right: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,292 @@
|
|||
<template>
|
||||
<view>
|
||||
<navs :top='top' :color='color'></navs>
|
||||
<view class="caseBox">
|
||||
<view class="search">
|
||||
<view class="left">
|
||||
<text class="iconfont icon-SearchBar" style="margin-left: 26rpx;margin-right: 34rpx; color: #4B4E5D;"></text>
|
||||
<input class="uni-input" placeholder-style="color:#C2C2C2" placeholder="输入项目类型" />
|
||||
</view>
|
||||
<view class="selectbtn" @click="toggle()">
|
||||
<image src="@/static/image/Group4526.svg" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
<uni-popup ref="popup" type="bottom" :animation="false" background-color="#fff">
|
||||
<navs :top='top' :color='color'></navs>
|
||||
<view class="allsel">
|
||||
<view class="sel-left">
|
||||
<view class="category" :class="popIndex==0?'active':''" @click="popSel(0)">全部</view>
|
||||
<view class="category" :class="popIndex==1?'active':''" @click="popSel(1)">开发</view>
|
||||
<view class="category" :class="popIndex==2?'active':''" @click="popSel(2)">设计</view>
|
||||
<view class="category" :class="popIndex==3?'active':''" @click="popSel(3)">拍摄</view>
|
||||
</view>
|
||||
<view class="sel-right">
|
||||
<view class="classification" v-for="(item,index) in navList" :key="item.text" @click="popSel2(index)">
|
||||
<view v-if="item.text=='logo设计'" style="height: 32rpx;">
|
||||
<image src="@/static/image/VectorStroke-2.svg" mode="" style="width: 32rpx;height: 32rpx;"></image>
|
||||
</view>
|
||||
<view :class="item.name" v-else></view>
|
||||
<view class="classify-text">{{item.text}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
<view style="padding-left: 30rpx;margin-top: 42rpx;">
|
||||
<scroll-view :show-scrollbar="false" class="screen" scroll-x="true">
|
||||
<view :class="select==index?'item active':'item'" v-for="(item,index) in navList" :key="item.text" @click="sel(index)">
|
||||
<view v-if="item.text == 'logo设计'" style="position: relative;padding-left: 32rpx;">
|
||||
<image :src="select==index?'../../static/image/VectorStroke-1.svg':'../../static/image/VectorStroke-2.svg'" mode="" style="position: absolute; left: 0;"></image>
|
||||
<text style="margin-left: 9rpx;">{{item.text}}</text>
|
||||
</view>
|
||||
<view v-else>
|
||||
<text :class="item.name"></text>
|
||||
<text style="margin-left: 9rpx;">{{item.text}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class="product">
|
||||
<view class="product-item" @click="goTo()">
|
||||
<image src="https://img2.baidu.com/it/u=419111865,3225914506&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500" mode=""></image>
|
||||
<view>
|
||||
<text class="bg-blue">开发</text>
|
||||
<text>xxxx小程序</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="product-item">
|
||||
<image src="https://img2.baidu.com/it/u=3625112638,614874177&fm=253&fmt=auto&app=120&f=JPEG?w=500&h=500" mode=""></image>
|
||||
<view>
|
||||
<text class="bg-blue">开发</text>
|
||||
<text>xxxx小程序</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="product-item">
|
||||
<image src="http://t14.baidu.com/it/u=3416681815,520803445&fm=224&app=112&f=JPEG?w=500&h=500" mode=""></image>
|
||||
<view>
|
||||
<text class="bg-green">设计</text>
|
||||
<text>xxxx小程序</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="product-item">
|
||||
<image src="https://img0.baidu.com/it/u=745259874,3861833027&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=510" mode=""></image>
|
||||
<view>
|
||||
<text class="bg-blue">开发</text>
|
||||
<text>xxxx小程序</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="product-item">
|
||||
<image src="https://img2.baidu.com/it/u=3625112638,614874177&fm=253&fmt=auto&app=120&f=JPEG?w=500&h=500" mode=""></image>
|
||||
<view>
|
||||
<text class="bg-blue">开发</text>
|
||||
<text>xxxx小程序</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="product-item">
|
||||
<image src="http://t14.baidu.com/it/u=3416681815,520803445&fm=224&app=112&f=JPEG?w=500&h=500" mode=""></image>
|
||||
<view>
|
||||
<text class="bg-green">设计</text>
|
||||
<text>xxxx小程序</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<bottoms></bottoms>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
top:0,
|
||||
color:1,
|
||||
navList:[{text:'全部',name:'iconfont icon-dashboard-3--app-application-dashboard-home-layout-vertical'},{text:'系统开发',name:'iconfont icon-Vector-14'},{text:'APP',name:'iconfont icon-Vector-1-2'},
|
||||
{text:'小程序',name:'iconfont icon-Vector-2-1'},{text:'3D建模',name:'iconfont icon-Vector-3-1'},
|
||||
{text:'网站',name:'iconfont icon-Vector-5-2'},{text:'logo设计',name:'iconfont icon-Vector-3-1'},
|
||||
{text:'识别设计',name:'iconfont icon-Vector-8'},{text:'包装设计',name:'iconfont icon-Vector-7'},
|
||||
{text:'宣传品设计',name:'iconfont icon-Vector-6'},{text:'UI设计',name:'iconfont icon-Vector-5'},
|
||||
{text:'动漫游戏设计',name:'iconfont icon-Group4525'},{text:'视频拍摄',name:'iconfont icon-VectorStroke-1'},
|
||||
{text:'照片拍摄',name:'iconfont icon-Vector-9'},],
|
||||
select:0,
|
||||
popIndex:0,
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.top = uni.getMenuButtonBoundingClientRect().top;
|
||||
},
|
||||
methods:{
|
||||
sel(i){
|
||||
this.select = i;
|
||||
},
|
||||
toggle() {
|
||||
this.$refs.popup.open('top')
|
||||
},
|
||||
popSel(i){//弹出层左边选项
|
||||
this.popIndex = i;
|
||||
},
|
||||
popSel2(i){//弹出层右边选项
|
||||
this.select = i;
|
||||
this.$refs.popup.close()
|
||||
},
|
||||
goTo(){
|
||||
uni.navigateTo({
|
||||
url:'/pages/caseDetail/caseDetail'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.caseBox{
|
||||
padding: 23rpx 0 34rpx;
|
||||
}
|
||||
.search{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 0 30rpx;
|
||||
.left{
|
||||
flex: 1;
|
||||
line-height: 80rpx;
|
||||
background-color: #FAFBFD;
|
||||
border-radius: 40rpx;
|
||||
display: flex;
|
||||
.uni-input{
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
.selectbtn{
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
border-radius: 50%;
|
||||
background-color: #494949;
|
||||
margin-left: 28rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
image{
|
||||
width: 36rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.screen{
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
margin-bottom: 39rpx;
|
||||
}
|
||||
.item{
|
||||
display: inline-block;
|
||||
border-radius: 50rpx;
|
||||
padding: 15rpx 35rpx;
|
||||
color: #333;
|
||||
font-size: 22rpx;
|
||||
image{
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
}
|
||||
.item.active{
|
||||
background-color: #494949;
|
||||
color: #fff;
|
||||
}
|
||||
.product{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding: 0 30rpx;
|
||||
.product-item{
|
||||
width: 332rpx;
|
||||
margin-right: 26rpx;
|
||||
margin-bottom: 45rpx;
|
||||
&:nth-child(2n){
|
||||
margin-top: 48rpx;
|
||||
margin-right: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
image{
|
||||
width: 332rpx;
|
||||
height: 280rpx;
|
||||
border-radius: 40rpx;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
view{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
text{
|
||||
&:first-child{
|
||||
font-size: 20rpx;
|
||||
font-weight: 500;
|
||||
padding: 5rpx;
|
||||
}
|
||||
&:last-child{
|
||||
margin-left: 11rpx;
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
.bg-blue{
|
||||
color: #3887FD;
|
||||
background-color: #EEF1FF;
|
||||
}
|
||||
.bg-green{
|
||||
color: #6FCC26;
|
||||
background-color: #EEFEE7;
|
||||
}
|
||||
}
|
||||
}
|
||||
.allsel{
|
||||
display: flex;
|
||||
margin-top: 26rpx;
|
||||
padding-bottom: 56rpx;
|
||||
.sel-left{
|
||||
padding-left: 30rpx;
|
||||
.category{
|
||||
width: 140rpx;
|
||||
height: 68rpx;
|
||||
border-radius: 10rpx;
|
||||
background-color: #FAFAFA;
|
||||
color: #999999;
|
||||
font-size: 26rpx;
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
line-height: 68rpx;
|
||||
margin-top: 16rpx;
|
||||
&:first-child{
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
.category.active{
|
||||
background-color: #494949;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.sel-right{
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
.classification{
|
||||
width: 33.3%;
|
||||
text-align: center;
|
||||
color: #333;
|
||||
font-size: 26rpx;
|
||||
margin-top: 52rpx;
|
||||
&:nth-child(1){
|
||||
margin-top: 0;
|
||||
}
|
||||
&:nth-child(2){
|
||||
margin-top: 0;
|
||||
}
|
||||
&:nth-child(3){
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
.classify-text{
|
||||
margin-top: 14rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,198 @@
|
|||
<template>
|
||||
<view style="padding-bottom: 46rpx;">
|
||||
<navs :top='top' :page='pageName' :color='color'></navs>
|
||||
<view class="infobox">
|
||||
<view class="top">
|
||||
<view class="box" @click="change(1)" :class="select==1?'active':''">
|
||||
<text>公司动态</text>
|
||||
<image class="img1" src="@/static/image/company.svg" mode="" v-if="select==1"></image>
|
||||
</view>
|
||||
<view class="box" @click="change(2)" :class="select==2?'active':''">
|
||||
<text>行业动态</text>
|
||||
<image class="img2" src="@/static/image/industry.svg" mode="" v-if="select==2"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="news">
|
||||
<view class="news-item" @click="goTo()">
|
||||
<image src="https://mms2.baidu.com/it/u=3529567955,935711200&fm=253&app=120&f=JPEGw=640&h=429" mode=""></image>
|
||||
<view style="margin-top: 17rpx;padding: 0 22rpx;">
|
||||
<view class="title1">企业资讯标题标题标额企业资讯标企业资讯标题标题标额</view>
|
||||
<view class="title2">xxxx网 2023.08.22</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="news-item">
|
||||
<image src="https://mms2.baidu.com/it/u=3529567955,935711200&fm=253&app=120&f=JPEGw=640&h=429" mode=""></image>
|
||||
<view style="margin-top: 17rpx;padding: 0 22rpx;">
|
||||
<view class="title1">企业资讯标题标题标额企业资讯标企业资讯标题标题标额</view>
|
||||
<view class="title2">xxxx网 2023.08.22</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="news-item">
|
||||
<image src="https://mms2.baidu.com/it/u=3529567955,935711200&fm=253&app=120&f=JPEGw=640&h=429" mode=""></image>
|
||||
<view style="margin-top: 17rpx;padding: 0 22rpx;">
|
||||
<view class="title1">企业资讯标题标题标额企业资讯标企业资讯标题标题标额</view>
|
||||
<view class="title2">xxxx网 2023.08.22</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<bottoms></bottoms>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
select:1,
|
||||
pageName:'公司资讯',
|
||||
color:1,
|
||||
top:0
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.top = uni.getMenuButtonBoundingClientRect().top;
|
||||
},
|
||||
methods:{
|
||||
change(i){
|
||||
this.select = i;
|
||||
},
|
||||
goTo(){
|
||||
uni.navigateTo({
|
||||
url:'/pages/infoDetail/infoDetail'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.infobox{
|
||||
padding: 30rpx;
|
||||
background-color: #F9FAFF;
|
||||
}
|
||||
.top{
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
.box{
|
||||
width: 186rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 20rpx;
|
||||
color: #fff;
|
||||
background-color: #494949;
|
||||
text-align: center;
|
||||
font-size: 36rpx;
|
||||
font-weight: 600;
|
||||
padding: 30rpx 40rpx;
|
||||
box-sizing: border-box;
|
||||
letter-spacing: 4rpx;
|
||||
position: relative;
|
||||
animation: width2 1s;
|
||||
&:nth-child(2){
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
image{
|
||||
position: absolute;
|
||||
}
|
||||
.img1{
|
||||
width: 213rpx;
|
||||
height: 179rpx;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
.img2{
|
||||
width: 220rpx;
|
||||
height: 161rpx;
|
||||
right: 7rpx;
|
||||
top: 16rpx;
|
||||
}
|
||||
}
|
||||
.box.active{
|
||||
// flex: 1;
|
||||
width: 488rpx;
|
||||
padding: 0;
|
||||
line-height: 160rpx;
|
||||
letter-spacing: 2rpx;
|
||||
font-size: 40rpx;
|
||||
text-indent: 1em;
|
||||
text-align: left;
|
||||
background-color: #008DFF;
|
||||
// transition: flex .7s linear;
|
||||
animation: width1 .5s;
|
||||
.img1{
|
||||
animation: img1 .7s;
|
||||
}
|
||||
.img2{
|
||||
animation: img2 .7s;
|
||||
}
|
||||
}
|
||||
@keyframes width1{
|
||||
from{
|
||||
width: 186rpx;
|
||||
}
|
||||
to{
|
||||
width: 488rpx;
|
||||
}
|
||||
}
|
||||
@keyframes width2{
|
||||
from{
|
||||
width: 488rpx;
|
||||
}
|
||||
to{
|
||||
width: 186rpx;
|
||||
}
|
||||
}
|
||||
@keyframes img1{
|
||||
from{
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
to{
|
||||
width: 213rpx;
|
||||
height: 179rpx;
|
||||
}
|
||||
}
|
||||
@keyframes img2{
|
||||
from{
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
to{
|
||||
width: 220rpx;
|
||||
height: 161rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.news{
|
||||
margin-top: 28rpx;
|
||||
.news-item{
|
||||
border-radius: 20rpx;
|
||||
box-shadow: 0 2rpx 6rpx 6rpx #0000000a;
|
||||
overflow: hidden;
|
||||
margin-top: 20rpx;
|
||||
&:first-child{
|
||||
margin-top: 0;
|
||||
}
|
||||
image{
|
||||
width: 100%;
|
||||
height: 329rpx;
|
||||
}
|
||||
.title1{
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
.title2{
|
||||
font-size: 24rpx;
|
||||
font-weight: 400;
|
||||
color: #C2C2C2;
|
||||
padding: 10rpx 0 18rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,161 @@
|
|||
<template>
|
||||
<view class="profile-box">
|
||||
<navs :top='top' :color='color'></navs>
|
||||
<view class="bgi">
|
||||
<image src="@/static/image/www.yalijuda.com_beij_LSMOFYp4vl.png" mode=""></image>
|
||||
</view>
|
||||
<view class="content">
|
||||
<view class="profile">
|
||||
<view class="title">公司介绍-Company Profile</view>
|
||||
<view style="font-size: 28rpx;color: #333;font-weight: 400;">上海丙煜信息科技位于上海虹桥中心，是技术为主导的科技创新型企业。公司主要从事移动化信息网络与电子商务、IT方案咨询与服务、计算机软件开发与实施、智慧城市，智慧生活相关的物联网领域的开发，公司经营范围：APP开发，小程序开发，网站建设，系统定制，企业管理软件等，公司坚持科技创新，以人为本的理念，我们为不同行业客户提供全面专业的定制化服务。</view>
|
||||
</view>
|
||||
<view class="environment">
|
||||
<view class="title">公司环境/Environment</view>
|
||||
<image src="@/static/image/huanj.png" mode=""></image>
|
||||
</view>
|
||||
<view class="values">
|
||||
<view class="title">价值观/Values</view>
|
||||
<view style="display: flex;align-items: center;">
|
||||
<image src="@/static/image/value.svg" mode=""></image>
|
||||
<view class="value">服务高效 品质保障 售后安心</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="contact">
|
||||
<view class="title">联系我们/Contact Us</view>
|
||||
<view class="contact-box">
|
||||
<image src="https://mms2.baidu.com/it/u=1165825959,1874574843&fm=253&app=120&f=JPEGw=500&h=750" mode="aspectFill"></image>
|
||||
<view class="right"></view>
|
||||
<view class="card">
|
||||
<view>
|
||||
<view>
|
||||
<image src="@/static/image/tel.svg" mode="" style="width: 36rpx;height: 30rpx;margin-right: 12rpx;"></image>
|
||||
</view>
|
||||
<view>+86 15236541236</view>
|
||||
</view>
|
||||
<view>
|
||||
<view>
|
||||
<image src="@/static/image/email.svg" mode="" style="width: 34rpx;height: 24rpx;margin-right: 19rpx;"></image>
|
||||
</view>
|
||||
<view>2145000@qq.com</view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="iconfont icon-Group"></view>
|
||||
<view>ssssssxx</view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="iconfont icon-Group-1" style="padding-left: 4rpx;"></view>
|
||||
<view>上海虹桥</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<bottoms></bottoms>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
color:0,
|
||||
top:0
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.top = uni.getMenuButtonBoundingClientRect().top;
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.profile-box{
|
||||
position: relative;
|
||||
padding-bottom: 75rpx;
|
||||
.bgi{
|
||||
width: 100%;
|
||||
height: 556rpx;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: -10;
|
||||
image{
|
||||
width: 100%;
|
||||
height: 556rpx;
|
||||
}
|
||||
}
|
||||
.content{
|
||||
padding: 406rpx 30rpx 83rpx;
|
||||
}
|
||||
.title{
|
||||
color: #2A3A72;
|
||||
font-size: 36rpx;
|
||||
font-weight: 600;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
.profile{
|
||||
margin-top: 60rpx;
|
||||
}
|
||||
.environment{
|
||||
margin-top: 80rpx;
|
||||
image{
|
||||
width: 100%;
|
||||
height: 538rpx;
|
||||
}
|
||||
}
|
||||
.values{
|
||||
margin-top: 90rpx;
|
||||
image{
|
||||
width: 48rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
.value{
|
||||
margin-left: 16rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
.contact{
|
||||
margin-top: 125rpx;
|
||||
.contact-box{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-end;
|
||||
position: relative;
|
||||
image{
|
||||
width: 394rpx;
|
||||
height: 412rpx;
|
||||
}
|
||||
.right{
|
||||
width: 70rpx;
|
||||
height: 70rpx;
|
||||
background-color: #3887FD;
|
||||
}
|
||||
.card{
|
||||
position: absolute;
|
||||
right: 35rpx;
|
||||
bottom: 35rpx;
|
||||
width: 378rpx;
|
||||
height: 307rpx;
|
||||
padding: 28rpx 43rpx 40rpx 32rpx;
|
||||
box-sizing: border-box;
|
||||
box-shadow: 0 2rpx 6rpx 6rpx #0000000a;
|
||||
background-color: #fff;
|
||||
>view{
|
||||
display: flex;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
font-weight: 500;
|
||||
line-height: 62rpx;
|
||||
}
|
||||
.iconfont{
|
||||
color: #3887FD;
|
||||
margin-right: 19rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,525 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
<view class="top" :style="'padding-top:' + top + 'px'"></view>
|
||||
<view class="logo">
|
||||
<view class="img">
|
||||
<image src="@/static/image/logo.png" mode=""></image>
|
||||
</view>
|
||||
<image class="avatar" src="@/static/image/default-avatar.svg" mode="" @click="goTo(6)"></image>
|
||||
</view>
|
||||
<view class="navigation">
|
||||
<view class="title">功能导航</view>
|
||||
<view class="function">
|
||||
<view @click="goTo(1)">
|
||||
<view class="iconbox">
|
||||
<image class="icon1" src="@/static/image/icon-Group4529.svg" mode=""></image>
|
||||
<text class="iconfont icon-Vector-2"></text>
|
||||
</view>
|
||||
<text class="text">公司介绍</text>
|
||||
</view>
|
||||
<view @click="goTo(4)">
|
||||
<view class="iconbox">
|
||||
<image class="icon1" src="@/static/image/icon-Group4530.svg" mode=""></image>
|
||||
<view class="iconfont icon-Vector-2"></view>
|
||||
</view>
|
||||
<text class="text">公司案例</text>
|
||||
</view>
|
||||
<view>
|
||||
<view class="iconbox">
|
||||
<image class="icon1" src="@/static/image/icon-Group4531.svg" mode=""></image>
|
||||
<view class="iconfont icon-Vector-2"></view>
|
||||
</view>
|
||||
<text class="text">商务合作</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="clients">
|
||||
<view class="title">
|
||||
<view>合作客户</view>
|
||||
<image class="more" src="@/static/image/more.svg" mode=""></image>
|
||||
</view>
|
||||
<view class="companies">
|
||||
<scroll-view :show-scrollbar="false" class="scroll-view_H" scroll-x="true">
|
||||
<view class="company">
|
||||
<image
|
||||
src="https://img2.baidu.com/it/u=419111865,3225914506&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500"
|
||||
mode=""></image>
|
||||
<view class="introduce">
|
||||
<image src="@/static/image/default-avatar.svg" mode=""></image>
|
||||
<view class="company-name">XXX律师事务所</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="company">
|
||||
<image
|
||||
src="https://img2.baidu.com/it/u=419111865,3225914506&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500"
|
||||
mode=""></image>
|
||||
<view class="introduce">
|
||||
<image src="@/static/image/default-avatar.svg" mode=""></image>
|
||||
<view class="company-name">XXX律师事务所</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="information">
|
||||
<view class="title" @click="goTo(2)">
|
||||
<view>企业资讯</view>
|
||||
<image class="more" src="@/static/image/more.svg" mode=""></image>
|
||||
</view>
|
||||
<view class="news" @click="goTo(3)">
|
||||
<image src="https://mms2.baidu.com/it/u=3529567955,935711200&fm=253&app=120&f=JPEGw=640&h=429" mode="">
|
||||
</image>
|
||||
<view class="news-box">
|
||||
<view class="news-title">企业资讯标题标题标额...企业资讯标标题标题标额</view>
|
||||
<view class="iconfont icon-arrow-up-1--arrow-up-keyboard"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="news" @click="goTo(3)">
|
||||
<view class="news-box">
|
||||
<view class="news-title">企业资讯标题标题标额...企业资讯标标题标题标额</view>
|
||||
<view class="iconfont icon-arrow-up-1--arrow-up-keyboard"></view>
|
||||
</view>
|
||||
<image src="https://mms0.baidu.com/it/u=392427122,2979071926&fm=253&app=138&f=JPEGw=759&h=459" mode="">
|
||||
</image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="case">
|
||||
<view class="title" @click="goTo(4)">
|
||||
<view>案例库</view>
|
||||
<image class="more" src="@/static/image/more.svg" mode=""></image>
|
||||
</view>
|
||||
<view>
|
||||
<scroll-view :show-scrollbar="false" class="screen" scroll-x="true">
|
||||
<view :class="select==index?'item active':'item'" v-for="(item,index) in navList" :key="item.text"
|
||||
@click="sel(index)">
|
||||
<view v-if="item.text == 'logo设计'" style="position: relative;padding-left: 32rpx;">
|
||||
<image :src="select==index?'../../static/image/VectorStroke-1.svg':'../../static/image/VectorStroke.svg'" mode="" style="position: absolute; left: 0;"></image>
|
||||
<text style="margin-left: 9rpx;">{{item.text}}</text>
|
||||
</view>
|
||||
<view v-else>
|
||||
<text :class="item.name"></text>
|
||||
<text style="margin-left: 9rpx;">{{item.text}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class="product">
|
||||
<view class="product-item" @click="goTo(5)">
|
||||
<image
|
||||
src="https://img2.baidu.com/it/u=419111865,3225914506&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500"
|
||||
mode=""></image>
|
||||
<view>
|
||||
<text class="bg-blue">开发</text>
|
||||
<text>xxxx小程序</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="product-item">
|
||||
<image
|
||||
src="https://img2.baidu.com/it/u=3625112638,614874177&fm=253&fmt=auto&app=120&f=JPEG?w=500&h=500"
|
||||
mode=""></image>
|
||||
<view>
|
||||
<text class="bg-blue">开发</text>
|
||||
<text>xxxx小程序</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="product-item">
|
||||
<image src="http://t14.baidu.com/it/u=3416681815,520803445&fm=224&app=112&f=JPEG?w=500&h=500"
|
||||
mode=""></image>
|
||||
<view>
|
||||
<text class="bg-green">设计</text>
|
||||
<text>xxxx小程序</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="product-item">
|
||||
<image
|
||||
src="https://img0.baidu.com/it/u=745259874,3861833027&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=510"
|
||||
mode=""></image>
|
||||
<view>
|
||||
<text class="bg-blue">开发</text>
|
||||
<text>xxxx小程序</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<bottoms></bottoms>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
top: 0,
|
||||
navList: [{
|
||||
text: '全部',
|
||||
name: 'iconfont icon-dashboard-3--app-application-dashboard-home-layout-vertical'
|
||||
}, {
|
||||
text: '系统开发',
|
||||
name: 'iconfont icon-Vector-14'
|
||||
}, {
|
||||
text: 'APP',
|
||||
name: 'iconfont icon-Vector-1-2'
|
||||
},
|
||||
{
|
||||
text: '小程序',
|
||||
name: 'iconfont icon-Vector-2-1'
|
||||
}, {
|
||||
text: '3D建模',
|
||||
name: 'iconfont icon-Vector-3-1'
|
||||
},
|
||||
{
|
||||
text: '网站',
|
||||
name: 'iconfont icon-Vector-5-2'
|
||||
}, {
|
||||
text: 'logo设计',
|
||||
name: 'iconfont icon-Vector-3-1'
|
||||
},
|
||||
{
|
||||
text: '识别设计',
|
||||
name: 'iconfont icon-Vector-8'
|
||||
}, {
|
||||
text: '包装设计',
|
||||
name: 'iconfont icon-Vector-7'
|
||||
},
|
||||
{
|
||||
text: '宣传品设计',
|
||||
name: 'iconfont icon-Vector-6'
|
||||
}, {
|
||||
text: 'UI设计',
|
||||
name: 'iconfont icon-Vector-5'
|
||||
},
|
||||
{
|
||||
text: '动漫游戏设计',
|
||||
name: 'iconfont icon-Group4525'
|
||||
}, {
|
||||
text: '视频拍摄',
|
||||
name: 'iconfont icon-VectorStroke-1'
|
||||
},
|
||||
{
|
||||
text: '照片拍摄',
|
||||
name: 'iconfont icon-Vector-9'
|
||||
},
|
||||
],
|
||||
select: 0
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.top = uni.getMenuButtonBoundingClientRect().top;
|
||||
},
|
||||
methods: {
|
||||
sel(i) {
|
||||
this.select = i;
|
||||
},
|
||||
goTo(i) {
|
||||
switch (i) {
|
||||
case 1:
|
||||
uni.navigateTo({
|
||||
url: '/pages/companyProfile/companyProfile'
|
||||
})
|
||||
break;
|
||||
case 2:
|
||||
uni.navigateTo({
|
||||
url: '/pages/companyInformation/companyInformation'
|
||||
})
|
||||
break;
|
||||
case 3:
|
||||
uni.navigateTo({
|
||||
url: '/pages/infoDetail/infoDetail'
|
||||
})
|
||||
break;
|
||||
case 4:
|
||||
uni.navigateTo({
|
||||
url: '/pages/caseSelect/caseSelect'
|
||||
})
|
||||
break;
|
||||
case 5:
|
||||
uni.navigateTo({
|
||||
url: '/pages/caseDetail/caseDetail'
|
||||
})
|
||||
break;
|
||||
case 6:
|
||||
uni.navigateTo({
|
||||
url: '/pages/my/my'
|
||||
})
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.content {
|
||||
padding-left: 30rpx;
|
||||
padding-bottom: 48rpx;
|
||||
}
|
||||
|
||||
.logo {
|
||||
margin-top: 67rpx;
|
||||
padding-right: 28rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.img {
|
||||
width: 398rpx;
|
||||
height: 119rpx;
|
||||
|
||||
image {
|
||||
width: 398rpx;
|
||||
height: 119rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
color: #2A3A72;
|
||||
font-size: 36rpx;
|
||||
font-weight: 600;
|
||||
margin-bottom: 45rpx;
|
||||
}
|
||||
|
||||
.clients .title,
|
||||
.information .title,
|
||||
.case .title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding-right: 30rpx;
|
||||
|
||||
.more {
|
||||
width: 78rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.clients .title {
|
||||
margin-bottom: 14rpx;
|
||||
}
|
||||
|
||||
.navigation {
|
||||
margin-top: 92rpx;
|
||||
padding-right: 30rpx;
|
||||
|
||||
.function {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
>view {
|
||||
width: 216rpx;
|
||||
height: 162rpx;
|
||||
border-radius: 40rpx;
|
||||
box-shadow: 0 0 30rpx 4rpx #7a98c61a;
|
||||
box-sizing: border-box;
|
||||
padding: 14rpx 22rpx 0;
|
||||
|
||||
.text {
|
||||
color: #2A3A72;
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
.iconbox {
|
||||
height: 82rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 10rpx;
|
||||
|
||||
.icon1 {
|
||||
width: 82rpx;
|
||||
height: 82rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.icon-Vector-2 {
|
||||
color: #7781a4;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.clients {
|
||||
margin-top: 114rpx;
|
||||
|
||||
.companies {
|
||||
display: flex;
|
||||
|
||||
.scroll-view_H {
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.company {
|
||||
border-radius: 40rpx;
|
||||
box-shadow: 0 4rpx 32rpx 4rpx #b2c6e340;
|
||||
padding: 22rpx 20rpx;
|
||||
display: inline-block;
|
||||
margin: 30rpx;
|
||||
margin-left: 0;
|
||||
|
||||
>image {
|
||||
width: 459rpx;
|
||||
height: 387rpx;
|
||||
border-radius: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.introduce {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 25rpx;
|
||||
|
||||
image {
|
||||
width: 68rpx;
|
||||
height: 68rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.company-name {
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
color: #2A3A72;
|
||||
margin-left: 14rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.information {
|
||||
margin-top: 86rpx;
|
||||
padding-right: 30rpx;
|
||||
|
||||
.title {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.news {
|
||||
border-radius: 40rpx;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
margin-top: 37rpx;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 345rpx;
|
||||
height: 216rpx;
|
||||
}
|
||||
|
||||
.news-box {
|
||||
flex: 1;
|
||||
background-color: #F6FAFB;
|
||||
padding: 50rpx 40rpx 27rpx 27rpx;
|
||||
|
||||
.news-title {
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.icon-arrow-up-1--arrow-up-keyboard {
|
||||
text-align: right;
|
||||
color: #3887FD;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.case {
|
||||
margin-top: 142rpx;
|
||||
|
||||
.screen {
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
margin-bottom: 39rpx;
|
||||
}
|
||||
|
||||
.item {
|
||||
display: inline-block;
|
||||
border-radius: 50rpx;
|
||||
padding: 15rpx 35rpx;
|
||||
color: #2A3A72;
|
||||
font-size: 22rpx;
|
||||
image{
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item.active {
|
||||
background-color: #7F89AC;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.product {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding-right: 30rpx;
|
||||
|
||||
.product-item {
|
||||
width: 332rpx;
|
||||
margin-right: 26rpx;
|
||||
margin-bottom: 45rpx;
|
||||
|
||||
&:nth-child(2n) {
|
||||
margin-top: 48rpx;
|
||||
margin-right: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 332rpx;
|
||||
height: 280rpx;
|
||||
border-radius: 40rpx;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
|
||||
view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
text {
|
||||
&:first-child {
|
||||
font-size: 20rpx;
|
||||
font-weight: 500;
|
||||
padding: 5rpx;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-left: 11rpx;
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
|
||||
.bg-blue {
|
||||
color: #3887FD;
|
||||
background-color: #EEF1FF;
|
||||
}
|
||||
|
||||
.bg-green {
|
||||
color: #6FCC26;
|
||||
background-color: #EEFEE7;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,60 @@
|
|||
<template>
|
||||
<view>
|
||||
<navs :top='top' :color='color'></navs>
|
||||
<view class="content">
|
||||
<view class="content-title1">企业资讯标题标题标额...企业资讯标</view>
|
||||
<view class="content-title2">来自:xxxx网 2023.08.22</view>
|
||||
<view class="cont">
|
||||
<text>当地时间8月21日晚，国家主席习近平抵达约翰内斯堡，出席金砖国家领导人第十五次会晤并对南非进行国事访问。南非总统拉马福萨率外长潘多尔，陪同部长、总统府妇女、青年部长祖马等政府高级官员在舷梯旁热情迎接。南非妇女向习近平献上鲜花，礼兵持枪致敬。身着民族服装的民众跳起奔放的舞蹈。</text>
|
||||
<image src="https://mms2.baidu.com/it/u=3529567955,935711200&fm=253&app=120&f=JPEGw=640&h=429" mode=""></image>
|
||||
<text>当地时间8月21日晚，国家主席习近平抵达约翰内斯堡，出席金砖国家领导人第十五次会晤并对南非进行国事访问。南非总统拉马福萨率外长潘多尔，陪同部长、总统府妇女、青年部长祖马等政府高级官员在舷梯旁热情迎接。南非妇女向习近平献上鲜花，礼兵持枪致敬。身着民族服装的民众跳起奔放的舞蹈。</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
top:0,
|
||||
color:1
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.top = uni.getMenuButtonBoundingClientRect().top;
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.content{
|
||||
padding: 52rpx 30rpx;
|
||||
.content-title1{
|
||||
font-size: 46rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
line-height: 64rpx;
|
||||
}
|
||||
.content-title2{
|
||||
font-size: 24rpx;
|
||||
font-weight: 400;
|
||||
color: #C2C2C2;
|
||||
line-height: 44rpx;
|
||||
margin-top: 4rpx;
|
||||
}
|
||||
.cont{
|
||||
margin-top: 34rpx;
|
||||
image{
|
||||
width: 100%;
|
||||
height: 330rpx;
|
||||
margin: 34rpx 0;
|
||||
}
|
||||
text{
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
line-height: 54rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,207 @@
|
|||
<template>
|
||||
<view class="my-box">
|
||||
<navs :top='top' :page='pageName' :color='color'></navs>
|
||||
<image class="my-bg" src="@/static/image/my-bg.png" mode=""></image>
|
||||
<view class="my">
|
||||
<image src="@/static/image/default-avatar.svg" mode="" @click="goTo(0)"></image>
|
||||
<view class="nickname" @click="goTo(0)">我是昵称昵称</view>
|
||||
<view class="iconfont icon-Group105" @click="goTo(3)"></view>
|
||||
</view>
|
||||
<view class="my-use">
|
||||
<view @click="goTo(1)">
|
||||
<view class="iconfont icon-Group-4"></view>
|
||||
<view class="use-text">我的项目</view>
|
||||
<view class="iconfont icon-tubiaoyanse"></view>
|
||||
</view>
|
||||
<view @click="goTo(2)">
|
||||
<view class="iconfont icon-Group-3"></view>
|
||||
<view class="use-text">公司介绍</view>
|
||||
<view class="iconfont icon-tubiaoyanse"></view>
|
||||
</view>
|
||||
<view @click="tel()">
|
||||
<view class="iconfont icon-Group-2"></view>
|
||||
<view class="use-text">联系我们</view>
|
||||
<view class="iconfont icon-tubiaoyanse"></view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="iconfont icon-Group-1-1"></view>
|
||||
<view class="use-text">退出登录</view>
|
||||
<view class="iconfont icon-tubiaoyanse"></view>
|
||||
</view>
|
||||
<uni-popup ref="tel" type="center">
|
||||
<view class="tel-box">
|
||||
<view class="tel-line">
|
||||
<text>手机号</text>
|
||||
<input class="uni-input" placeholder-style="color:#D8D8D8" placeholder="请输入手机号" style="width: 437rpx;height: 88rpx;"/>
|
||||
</view>
|
||||
<view class="tel-line">
|
||||
<text style="line-height: 88rpx;">备注</text>
|
||||
<textarea class="notes" placeholder-style="color:#D8D8D8" placeholder="选填" style="width: 437rpx;height: 150rpx;"/>
|
||||
</view>
|
||||
<view class="tel-btn">确定</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
pageName: '个人中心',
|
||||
color: 0,
|
||||
top: 0
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.top = uni.getMenuButtonBoundingClientRect().top;
|
||||
},
|
||||
methods: {
|
||||
goTo(i) {
|
||||
switch (i) {
|
||||
case 0:
|
||||
uni.navigateTo({
|
||||
url: '/pages/myInfo/myInfo'
|
||||
})
|
||||
break;
|
||||
case 1:
|
||||
uni.navigateTo({
|
||||
url: '/pages/myProject/myProject'
|
||||
})
|
||||
break;
|
||||
case 2:
|
||||
uni.navigateTo({
|
||||
url: '/pages/companyProfile/companyProfile'
|
||||
})
|
||||
break;
|
||||
case 3:
|
||||
uni.navigateTo({
|
||||
url: '/pages/notice/notice'
|
||||
})
|
||||
break;
|
||||
}
|
||||
},
|
||||
tel() {
|
||||
this.$refs.tel.open()
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.my-box {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.my-bg {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 406rpx;
|
||||
z-index: -10;
|
||||
}
|
||||
|
||||
.my {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 45rpx;
|
||||
|
||||
image {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 50%;
|
||||
margin-left: 34rpx;
|
||||
}
|
||||
|
||||
.nickname {
|
||||
flex: 1;
|
||||
margin-left: 24rpx;
|
||||
font-weight: 500;
|
||||
font-size: 36rpx;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.icon-Group105 {
|
||||
margin-right: 38rpx;
|
||||
font-size: 36rpx;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.my-use {
|
||||
border-radius: 40rpx;
|
||||
padding: 0 28rpx;
|
||||
background-color: #fff;
|
||||
margin-top: 35rpx;
|
||||
|
||||
>view {
|
||||
height: 116rpx;
|
||||
border-bottom: 1rpx solid #F0F0F0;
|
||||
display: flex;
|
||||
line-height: 116rpx;
|
||||
font-size: 32rpx;
|
||||
color: #222;
|
||||
|
||||
.icon-tubiaoyanse {
|
||||
font-size: 24rpx;
|
||||
color: #A4A4A4;
|
||||
}
|
||||
|
||||
.use-text {
|
||||
flex: 1;
|
||||
margin-left: 17rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tel-box {
|
||||
width: 628rpx;
|
||||
height: 462rpx;
|
||||
border-radius: 40rpx;
|
||||
background: #ffffff;
|
||||
padding: 38rpx 24rpx;
|
||||
box-sizing: border-box;
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
.tel-line{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-radius: 12rpx;
|
||||
background-color: #F8F8F8;
|
||||
margin-top: 25rpx;
|
||||
padding-left: 31rpx;
|
||||
&:first-child{
|
||||
height: 88rpx;
|
||||
margin-top: 0;
|
||||
line-height: 88rpx;
|
||||
}
|
||||
.uni-input,.notes{
|
||||
padding-right: 23rpx;
|
||||
text-align: right;
|
||||
}
|
||||
.uni-input::placeholder,.notes::placeholder{
|
||||
text-align: left;
|
||||
direction: rtl;
|
||||
}
|
||||
.notes{
|
||||
padding-top: 24rpx;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.tel-btn {
|
||||
width: 303rpx;
|
||||
height: 76rpx;
|
||||
border-radius: 12rpx;
|
||||
background: #3887fd;
|
||||
margin: 44rpx auto 0;
|
||||
color: #fff;
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
line-height: 76rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,146 @@
|
|||
<template>
|
||||
<view style="height: 100vh;background: #F9FAFF;">
|
||||
<view class="myinfo-top">
|
||||
<navs :top='top' :page='pageName' :color='color'></navs>
|
||||
</view>
|
||||
<view class="myinfo-box">
|
||||
<view class="info">
|
||||
<view>
|
||||
<view class="">头像</view>
|
||||
<view style="flex: 1;text-align: right;padding-right: 23rpx;">
|
||||
<button type="default" plain="true" open-type="chooseAvatar" class="chavatar"
|
||||
@chooseavatar="chooseavatar">
|
||||
<image src="@/static/image/default-avatar.svg" mode=""></image>
|
||||
</button>
|
||||
</view>
|
||||
<view class="iconfont icon-tubiaoyanse"></view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="">昵称</view>
|
||||
<view style="flex: 1;text-align: right;padding-right: 23rpx;">
|
||||
<input type="nickname" :value="wxname" @blur="inputWxName" class="nut-input-text" />
|
||||
</view>
|
||||
<view class="iconfont icon-tubiaoyanse"></view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="">简介</view>
|
||||
<view style="flex: 1;text-align: right;padding-right: 23rpx;">
|
||||
<input type="text" :value="jianjie" class="nut-input-text" />
|
||||
</view>
|
||||
<view class="iconfont icon-tubiaoyanse"></view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="">手机号</view>
|
||||
<view style="flex: 1;text-align: right;padding-right: 23rpx;">
|
||||
<input type="text" :value="telephone" class="nut-input-text" />
|
||||
</view>
|
||||
<view class="iconfont icon-tubiaoyanse"></view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="">公司</view>
|
||||
<view style="flex: 1;text-align: right;padding-right: 23rpx;">
|
||||
<input type="text" :value="company" class="nut-input-text" />
|
||||
</view>
|
||||
<view class="iconfont icon-tubiaoyanse"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
pageName: '个人信息',
|
||||
color: 1,
|
||||
top: 0,
|
||||
wxname: '我是昵称',
|
||||
jianjie: '这人很懒，不想写简介',
|
||||
telephone: '1237899****',
|
||||
company: 'xxxx公司'
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.top = uni.getMenuButtonBoundingClientRect().top;
|
||||
},
|
||||
methods: {
|
||||
chooseavatar: function(e) {
|
||||
const {
|
||||
avatarUrl
|
||||
} = e.detail;
|
||||
console.log('---头像', avatarUrl);
|
||||
},
|
||||
inputWxName: function(e) {
|
||||
this.wxname = e.detail.value;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.myinfo-top {
|
||||
background-color: #fff;
|
||||
padding-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.myinfo-box {
|
||||
padding: 31rpx 30rpx 0;
|
||||
|
||||
.info {
|
||||
padding: 0 25rpx;
|
||||
border-radius: 30rpx;
|
||||
background: #ffffff;
|
||||
|
||||
>view {
|
||||
display: flex;
|
||||
color: #333;
|
||||
font-size: 28rpx;
|
||||
border-bottom: 1rpx solid #F0F0F0;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
|
||||
&:first-child {
|
||||
height: 168rpx;
|
||||
line-height: 168rpx;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border: none;
|
||||
height: 96rpx;
|
||||
line-height: 96rpx;
|
||||
}
|
||||
|
||||
.chavatar {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 108rpx;
|
||||
height: 108rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
button[plain] {
|
||||
border: 0
|
||||
}
|
||||
|
||||
.nut-input-text {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.icon-tubiaoyanse {
|
||||
font-size: 24rpx;
|
||||
color: #A4A4A4;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,160 @@
|
|||
<template>
|
||||
<view style="height: 100vh;background: #F9FAFF;">
|
||||
<view class="myproject-top">
|
||||
<navs :top='top' :page='pageName' :color='color'></navs>
|
||||
</view>
|
||||
<view class="myproject-box">
|
||||
<view>
|
||||
<view>项目名称</view>
|
||||
<view style="flex: 1;text-align: right;">xxxxxxx小程序</view>
|
||||
</view>
|
||||
<view @click="goTo()">
|
||||
<view>项目进度</view>
|
||||
<view style="flex: 1;text-align: right;">设计完成80%</view>
|
||||
<view class="iconfont icon-tubiaoyanse"></view>
|
||||
</view>
|
||||
<view>
|
||||
<view>项目计划</view>
|
||||
<view style="flex: 1;text-align: right;">2023.08.31完成交付</view>
|
||||
</view>
|
||||
<view>
|
||||
<view>当前阶段</view>
|
||||
<view style="flex: 1;text-align: right;">设计阶段</view>
|
||||
</view>
|
||||
<view @click="feedback()">
|
||||
<view>我要反馈</view>
|
||||
<view class="iconfont icon-tubiaoyanse"></view>
|
||||
</view>
|
||||
<uni-popup ref="feedback" type="center">
|
||||
<view class="feedback-box">
|
||||
<textarea class="msg" placeholder-style="color:#D8D8D8" placeholder="请输入内容" />
|
||||
<view class="feedback-btn" @click="onSubmit()">提交</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
<uni-popup ref="success" type="center">
|
||||
<view class="success-box">
|
||||
<view class="iconfont icon-Gro11up"></view>
|
||||
<view class="success-text">xxxxx成功</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
pageName: '我的项目',
|
||||
color: 1,
|
||||
top: 0
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.top = uni.getMenuButtonBoundingClientRect().top;
|
||||
},
|
||||
methods: {
|
||||
goTo() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/projectSchedule/projectSchedule'
|
||||
})
|
||||
},
|
||||
feedback() {
|
||||
this.$refs.feedback.open()
|
||||
},
|
||||
onSubmit() {
|
||||
this.$refs.feedback.close()
|
||||
this.$refs.success.open()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.myproject-top {
|
||||
background-color: #fff;
|
||||
padding-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.myproject-box {
|
||||
padding: 24rpx 32rpx 0 28rpx;
|
||||
|
||||
>view {
|
||||
display: flex;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
height: 112rpx;
|
||||
line-height: 112rpx;
|
||||
padding: 0 24rpx 0 28rpx;
|
||||
justify-content: space-between;
|
||||
margin-top: 20rpx;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.icon-tubiaoyanse {
|
||||
font-size: 24rpx;
|
||||
color: #A4A4A4;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.feedback-box {
|
||||
width: 628rpx;
|
||||
height: 462rpx;
|
||||
border-radius: 40rpx;
|
||||
background: #ffffff;
|
||||
padding: 30rpx 24rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
.msg {
|
||||
width: 580rpx;
|
||||
height: 274rpx;
|
||||
border-radius: 12rpx;
|
||||
background: #f8f8f8;
|
||||
padding: 24rpx 22rpx;
|
||||
box-sizing: border-box;
|
||||
font-size: 30rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.feedback-btn {
|
||||
width: 303rpx;
|
||||
height: 76rpx;
|
||||
border-radius: 12rpx;
|
||||
background: #3887fd;
|
||||
margin: 44rpx auto 0;
|
||||
color: #fff;
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
line-height: 76rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.success-box {
|
||||
width: 628rpx;
|
||||
height: 462rpx;
|
||||
border-radius: 40rpx;
|
||||
background: #ffffff;
|
||||
padding-top: 120rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
.icon-Gro11up {
|
||||
text-align: center;
|
||||
color: #3887FD;
|
||||
font-size: 164rpx;
|
||||
}
|
||||
|
||||
.success-text {
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
text-align: center;
|
||||
line-height: 100rpx;
|
||||
margin-top: 11rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,88 @@
|
|||
<template>
|
||||
<view style="height: 100vh;background: #F9FAFF;">
|
||||
<view class="notice-top">
|
||||
<navs :top='top' :page='pageName' :color='color'></navs>
|
||||
</view>
|
||||
<view class="notice-box">
|
||||
<view>
|
||||
<view class="time">1天前</view>
|
||||
<view class="notice">
|
||||
<view class="notice-title">反馈回复</view>
|
||||
<view class="notice-reply">
|
||||
<view>我的问题：进度怎么这么慢？</view>
|
||||
<view>客服回复：bug过多，抱歉</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="time">1天前</view>
|
||||
<view class="notice">
|
||||
<view class="notice-title">项目进展</view>
|
||||
<view class="notice-reply">设计已完成80%</view>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="time">1天前</view>
|
||||
<view class="notice">
|
||||
<view class="notice-title">项目进展</view>
|
||||
<view class="notice-reply">设计已完成80%</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
pageName: '通知',
|
||||
color: 1,
|
||||
top: 0
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.top = uni.getMenuButtonBoundingClientRect().top;
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.notice-top {
|
||||
background-color: #fff;
|
||||
padding-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.notice-box {
|
||||
padding: 0 28rpx 0 32rpx;
|
||||
|
||||
.time {
|
||||
color: #666666;
|
||||
font-size: 24rpx;
|
||||
text-align: center;
|
||||
line-height: 82rpx;
|
||||
}
|
||||
|
||||
.notice {
|
||||
border-radius: 20rpx;
|
||||
background: #ffffff;
|
||||
padding: 0 23rpx;
|
||||
padding-top: 28rpx;
|
||||
|
||||
.notice-title {
|
||||
font-size: 30rpx;
|
||||
color: #000;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.notice-reply {
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
margin-top: 32rpx;
|
||||
padding-bottom: 32rpx;
|
||||
line-height: 45rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,96 @@
|
|||
<template>
|
||||
<view>
|
||||
<navs :top='top' :page='pageName' :color='color'></navs>
|
||||
<view class="project-box">
|
||||
<uv-steps current="0" dot direction="column" active-color="#3887FD" inactive-color="#D0D0D0">
|
||||
<uv-steps-item>
|
||||
<template v-slot:title>
|
||||
<view class="time-title active">设计完成80% <text>今天09:34</text></view>
|
||||
</template>
|
||||
<template v-slot:desc>
|
||||
<view class="time-desc active">如果有的话就填写如果有的话就填写如果有的话就填写如果有的话就填写如果有的话就填写就填写</view>
|
||||
</template>
|
||||
</uv-steps-item>
|
||||
<uv-steps-item>
|
||||
<template v-slot:title>
|
||||
<view class="time-title">设计完成40% <text>昨天09:34</text></view>
|
||||
</template>
|
||||
<template v-slot:desc>
|
||||
<view class="time-desc"></view>
|
||||
</template>
|
||||
</uv-steps-item>
|
||||
<uv-steps-item>
|
||||
<template v-slot:title>
|
||||
<view class="time-title">设计完成10% <text>昨天08:34</text></view>
|
||||
</template>
|
||||
<template v-slot:desc>
|
||||
<view class="time-desc"></view>
|
||||
</template>
|
||||
</uv-steps-item>
|
||||
<uv-steps-item>
|
||||
<template v-slot:title>
|
||||
<view class="time-title">原型交付 <text>8-20 09:34</text></view>
|
||||
</template>
|
||||
<template v-slot:desc>
|
||||
<view class="time-desc">如果有的话就填写如果有的话就填写如果有的话就填写如果有的话就填写如果有的话就填写就填写</view>
|
||||
</template>
|
||||
</uv-steps-item>
|
||||
<uv-steps-item>
|
||||
<template v-slot:title>
|
||||
<view class="time-title">内容敲定 <text>8-20 09:34</text></view>
|
||||
</template>
|
||||
<template v-slot:desc>
|
||||
<view class="time-desc">如果有的话就填写如果有的话就填写如果有的话就填写如果有的话就填写如果有的话就填写就填写</view>
|
||||
</template>
|
||||
</uv-steps-item>
|
||||
</uv-steps>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
pageName: '项目进展',
|
||||
color: 1,
|
||||
top: 0
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.top = uni.getMenuButtonBoundingClientRect().top;
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.project-box {
|
||||
padding: 56rpx 54rpx 0 86rpx;
|
||||
}
|
||||
|
||||
.time-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
color: #999;
|
||||
|
||||
>text {
|
||||
font-size: 26rpx;
|
||||
margin-left: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.time-title.active {
|
||||
color: #3887FD;
|
||||
}
|
||||
|
||||
.time-desc {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
line-height: 40rpx;
|
||||
padding-bottom: 50rpx;
|
||||
}
|
||||
|
||||
.time-desc.active {
|
||||
color: #333;
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,159 @@
|
|||
@font-face {
|
||||
font-family: "iconfont";
|
||||
src: url('~@/static/iconfont/iconfont.eot?t=7e82a34964e3b2c30be23966234c3e87'); /* IE9 */
|
||||
src: url('~@/static/iconfont/iconfont.eot?t=7e82a34964e3b2c30be23966234c3e87#iefix') format('embedded-opentype'), /* IE6-IE8 */
|
||||
url('~@/static/iconfont/iconfont.woff?t=7e82a34964e3b2c30be23966234c3e87') format('woff2'),
|
||||
url('~@/static/iconfont/iconfont.woff?t=7e82a34964e3b2c30be23966234c3e87') format('woff'), /* chrome、firefox */
|
||||
url('~@/static/iconfont/iconfont.ttf?t=7e82a34964e3b2c30be23966234c3e87') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
|
||||
url('~@/static/iconfont/iconfont.svg?t=7e82a34964e3b2c30be23966234c3e87#iconfont') format('svg'); /* iOS 4.1- */
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-arrow-up-1--arrow-up-keyboard:before {
|
||||
content: "\e001";
|
||||
}
|
||||
.icon-Group4529:before {
|
||||
content: "\e002";
|
||||
}
|
||||
.icon-Group4530:before {
|
||||
content: "\e003";
|
||||
}
|
||||
.icon-Group4531:before {
|
||||
content: "\e004";
|
||||
}
|
||||
.icon-Group4532:before {
|
||||
content: "\e005";
|
||||
}
|
||||
.icon-Vector-1:before {
|
||||
content: "\e006";
|
||||
}
|
||||
.icon-Vector-2:before {
|
||||
content: "\e007";
|
||||
}
|
||||
.icon-Vector:before {
|
||||
content: "\e008";
|
||||
}
|
||||
.icon-diamond-2--diamond-money-payment-finance-wealth-jewelry:before {
|
||||
content: "\e009";
|
||||
}
|
||||
.icon-Group653:before {
|
||||
content: "\e00a";
|
||||
}
|
||||
.icon-Group4526:before {
|
||||
content: "\e00b";
|
||||
}
|
||||
.icon-Group4528:before {
|
||||
content: "\e00c";
|
||||
}
|
||||
.icon-Group-1:before {
|
||||
content: "\e00d";
|
||||
}
|
||||
.icon-Group:before {
|
||||
content: "\e00e";
|
||||
}
|
||||
.icon-SearchBar:before {
|
||||
content: "\e00f";
|
||||
}
|
||||
.icon-Vector-3:before {
|
||||
content: "\e012";
|
||||
}
|
||||
.icon-Vector-1-1:before {
|
||||
content: "\e013";
|
||||
}
|
||||
.icon-WeUIjichuyangshiku:before {
|
||||
content: "\e014";
|
||||
}
|
||||
.icon-Vector-5:before {
|
||||
content: "\e015";
|
||||
}
|
||||
.icon-Group4525:before {
|
||||
content: "\e016";
|
||||
}
|
||||
.icon-Vector-8:before {
|
||||
content: "\e017";
|
||||
}
|
||||
.icon-VectorStroke-1:before {
|
||||
content: "\e018";
|
||||
}
|
||||
.icon-Vector-7:before {
|
||||
content: "\e019";
|
||||
}
|
||||
.icon-Vector-5:before {
|
||||
content: "\e01a";
|
||||
}
|
||||
.icon-Vector-6:before {
|
||||
content: "\e01b";
|
||||
}
|
||||
.icon-Vector-9:before {
|
||||
content: "\e01c";
|
||||
}
|
||||
.icon-VectorStroke:before {
|
||||
content: "\e01d";
|
||||
}
|
||||
.icon-Vector-5-2:before {
|
||||
content: "\e01e";
|
||||
}
|
||||
.icon-Vector-2-1:before {
|
||||
content: "\e01f";
|
||||
}
|
||||
.icon-Vector-3-1:before {
|
||||
content: "\e020";
|
||||
}
|
||||
.icon-Vector-14:before {
|
||||
content: "\e021";
|
||||
}
|
||||
.icon-Vector-1-2:before {
|
||||
content: "\e022";
|
||||
}
|
||||
.icon-Frame:before {
|
||||
content: "\e023";
|
||||
}
|
||||
.icon-Group17:before {
|
||||
content: "\e024";
|
||||
}
|
||||
.icon-tubiaoyanse:before {
|
||||
content: "\e025";
|
||||
}
|
||||
.icon-Fra1me:before {
|
||||
content: "\e026";
|
||||
}
|
||||
.icon-Frame-1:before {
|
||||
content: "\e027";
|
||||
}
|
||||
.icon-Frame-2:before {
|
||||
content: "\e028";
|
||||
}
|
||||
.icon-Gro11up:before {
|
||||
content: "\e029";
|
||||
}
|
||||
.icon-Group105:before {
|
||||
content: "\e02a";
|
||||
}
|
||||
.icon-Group-2:before {
|
||||
content: "\e02b";
|
||||
}
|
||||
.icon-Group-3:before {
|
||||
content: "\e02c";
|
||||
}
|
||||
.icon-Vector-16:before {
|
||||
content: "\e02d";
|
||||
}
|
||||
.icon-Group-4:before {
|
||||
content: "\e02e";
|
||||
}
|
||||
.icon-Group-1-1:before {
|
||||
content: "\e02f";
|
||||
}
|
||||
.icon-Frame-3:before {
|
||||
content: "\e030";
|
||||
}
|
||||
.icon-dashboard-3--app-application-dashboard-home-layout-vertical:before {
|
||||
content: "\e031";
|
||||
}
|
||||
Binary file not shown.
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
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 126 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -0,0 +1,10 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 12 13" class="design-iconfont" width="118.15384615384616" height="128">
|
||||
<g clip-path="url(#y8lspvce0__clip0_344_3108)">
|
||||
<path d="M11.6782 10.7737L7.5454 6.6355L11.6684 2.50908C12.0945 2.08072 12.0964 1.38906 11.6684 0.960697C11.2424 0.534301 10.5493 0.534301 10.1213 0.960697L5.99828 5.08514L1.87917 0.966591C1.45116 0.538231 0.756129 0.538231 0.332045 0.966591C-0.0959651 1.39495 -0.0940018 2.08662 0.332045 2.51498L4.45116 6.63746L0.322229 10.7698C-0.105782 11.2001 -0.105782 11.8918 0.322229 12.3182C0.750239 12.7465 1.44134 12.7465 1.86935 12.3182L5.99828 8.18585L10.1311 12.324C10.5591 12.7504 11.2522 12.7504 11.6782 12.324C12.1063 11.8957 12.1043 11.204 11.6782 10.7737Z" fill="#D7D7D7"></path>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="y8lspvce0__clip0_344_3108">
|
||||
<path fill="#fff" transform="translate(0 .642578)" d="M0 0H12V12H0z"></path>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 950 B |
|
|
@ -0,0 +1,10 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 12 9" class="design-iconfont" width="128" height="96">
|
||||
<g clip-path="url(#i8i33aymh__clip0_344_2962)">
|
||||
<path d="M4.7961 8.99984C4.58461 8.99984 4.38249 8.918 4.23089 8.76921L0.23696 4.84113C-0.0774639 4.53053 -0.081207 4.0265 0.231345 3.71218C0.543897 3.39972 1.05109 3.396 1.36739 3.7066L4.71001 6.99488L9.80629 0.316022C10.0739 -0.0354968 10.5774 -0.104313 10.9311 0.161651C11.2848 0.427615 11.3541 0.927925 11.0864 1.27944L5.43431 8.68366C5.29394 8.86593 5.08245 8.98124 4.85225 8.99798C4.83353 8.99798 4.81482 8.99984 4.7961 8.99984Z" fill="#1ECD2F"></path>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="i8i33aymh__clip0_344_2962">
|
||||
<path fill="#fff" d="M0 0H11.25V9H0z"></path>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 779 B |
|
|
@ -0,0 +1,14 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 18 16" class="design-iconfont" width="128" height="113.77777777777777">
|
||||
<path fill="#fff" d="M3 0A3 3 0 1 0 3 6A3 3 0 1 0 3 0Z"></path>
|
||||
<path fill="#fff" d="M3 0A3 3 0 1 0 3 6A3 3 0 1 0 3 0Z"></path>
|
||||
<g opacity=".4" fill="#fff">
|
||||
<rect x="9" y="2" width="9" height="2" rx="1"></rect>
|
||||
<rect x="9" y="2" width="9" height="2" rx="1"></rect>
|
||||
</g>
|
||||
<path transform="rotate(-180 15 13)" fill="#fff" d="M15 10A3 3 0 1 0 15 16A3 3 0 1 0 15 10Z"></path>
|
||||
<path transform="rotate(-180 15 13)" fill="#fff" d="M15 10A3 3 0 1 0 15 16A3 3 0 1 0 15 10Z"></path>
|
||||
<g opacity=".4" transform="rotate(-180 9 14)" fill="#fff">
|
||||
<rect x="9" y="14" width="9" height="2" rx="1"></rect>
|
||||
<rect x="9" y="14" width="9" height="2" rx="1"></rect>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 821 B |
|
|
@ -0,0 +1,3 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 17 17" class="design-iconfont" width="128" height="128">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.77234 2.77246C4.29138 1.25341 6.35165 0.400024 8.4999 0.400024C10.6482 0.400024 12.7084 1.25341 14.2275 2.77246C15.7465 4.2915 16.5999 6.35177 16.5999 8.50002C16.5999 10.3362 15.9765 12.108 14.8469 13.5326C14.8291 13.5588 14.809 13.5839 14.7867 13.6076C14.6118 13.8228 14.4253 14.0298 14.2275 14.2276C12.7084 15.7466 10.6482 16.6 8.4999 16.6C6.35165 16.6 4.29138 15.7466 2.77234 14.2276C2.57456 14.0298 2.38806 13.8229 2.21326 13.6077C2.1908 13.5839 2.17065 13.5587 2.15283 13.5324C1.02328 12.1079 0.399902 10.3361 0.399902 8.50002C0.399902 6.35177 1.25329 4.2915 2.77234 2.77246ZM3.47059 13.224C3.5198 13.2764 3.56989 13.3281 3.62087 13.3791C4.77268 14.5309 6.28979 15.2334 7.8999 15.3739V8.79471L3.47059 13.224ZM7.8999 7.09765L2.72349 12.2741C1.99586 11.1603 1.5999 9.8506 1.5999 8.50002C1.5999 6.67003 2.32686 4.91499 3.62087 3.62099C4.77268 2.46917 6.28979 1.76662 7.8999 1.62614V7.09765ZM9.0999 8.79473L13.5292 13.224C13.48 13.2764 13.4299 13.3281 13.3789 13.3791C12.2271 14.5309 10.71 15.2334 9.0999 15.3739V8.79473ZM14.2763 12.2741L9.0999 7.09767V1.62614C10.71 1.76662 12.2271 2.46917 13.3789 3.62099C14.6729 4.91499 15.3999 6.67003 15.3999 8.50002C15.3999 9.8506 15.0039 11.1604 14.2763 12.2741Z" fill="#fff"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 17 17" class="design-iconfont" width="128" height="128">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.77234 2.77246C4.29138 1.25341 6.35165 0.400024 8.4999 0.400024C10.6482 0.400024 12.7084 1.25341 14.2275 2.77246C15.7465 4.2915 16.5999 6.35177 16.5999 8.50002C16.5999 10.3362 15.9765 12.108 14.8469 13.5326C14.8291 13.5588 14.809 13.5839 14.7867 13.6076C14.6118 13.8228 14.4253 14.0298 14.2275 14.2276C12.7084 15.7466 10.6482 16.6 8.4999 16.6C6.35165 16.6 4.29138 15.7466 2.77234 14.2276C2.57456 14.0298 2.38806 13.8229 2.21326 13.6077C2.1908 13.5839 2.17065 13.5587 2.15283 13.5324C1.02328 12.1079 0.399902 10.3361 0.399902 8.50002C0.399902 6.35177 1.25329 4.2915 2.77234 2.77246ZM3.47059 13.224C3.5198 13.2764 3.56989 13.3281 3.62087 13.3791C4.77268 14.5309 6.28979 15.2334 7.8999 15.3739V8.79471L3.47059 13.224ZM7.8999 7.09765L2.72349 12.2741C1.99586 11.1603 1.5999 9.8506 1.5999 8.50002C1.5999 6.67003 2.32686 4.91499 3.62087 3.62099C4.77268 2.46917 6.28979 1.76662 7.8999 1.62614V7.09765ZM9.0999 8.79473L13.5292 13.224C13.48 13.2764 13.4299 13.3281 13.3789 13.3791C12.2271 14.5309 10.71 15.2334 9.0999 15.3739V8.79473ZM14.2763 12.2741L9.0999 7.09767V1.62614C10.71 1.76662 12.2271 2.46917 13.3789 3.62099C14.6729 4.91499 15.3999 6.67003 15.3999 8.50002C15.3999 9.8506 15.0039 11.1604 14.2763 12.2741Z" fill="#333"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 17 17" class="design-iconfont" width="128" height="128">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.77234 2.77246C4.29138 1.25341 6.35165 0.400024 8.4999 0.400024C10.6482 0.400024 12.7084 1.25341 14.2275 2.77246C15.7465 4.2915 16.5999 6.35177 16.5999 8.50002C16.5999 10.3362 15.9765 12.108 14.8469 13.5326C14.8291 13.5588 14.809 13.5839 14.7867 13.6076C14.6118 13.8228 14.4253 14.0298 14.2275 14.2276C12.7084 15.7466 10.6482 16.6 8.4999 16.6C6.35165 16.6 4.29138 15.7466 2.77234 14.2276C2.57456 14.0298 2.38806 13.8229 2.21326 13.6077C2.1908 13.5839 2.17065 13.5587 2.15283 13.5324C1.02328 12.1079 0.399902 10.3361 0.399902 8.50002C0.399902 6.35177 1.25329 4.2915 2.77234 2.77246ZM3.47059 13.224C3.5198 13.2764 3.56989 13.3281 3.62087 13.3791C4.77268 14.5309 6.28979 15.2334 7.8999 15.3739V8.79471L3.47059 13.224ZM7.8999 7.09765L2.72349 12.2741C1.99586 11.1603 1.5999 9.8506 1.5999 8.50002C1.5999 6.67003 2.32686 4.91499 3.62087 3.62099C4.77268 2.46917 6.28979 1.76662 7.8999 1.62614V7.09765ZM9.0999 8.79473L13.5292 13.224C13.48 13.2764 13.4299 13.3281 13.3789 13.3791C12.2271 14.5309 10.71 15.2334 9.0999 15.3739V8.79473ZM14.2763 12.2741L9.0999 7.09767V1.62614C10.71 1.76662 12.2271 2.46917 13.3789 3.62099C14.6729 4.91499 15.3999 6.67003 15.3999 8.50002C15.3999 9.8506 15.0039 11.1604 14.2763 12.2741Z" fill="#2A3A72"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
|
|
@ -0,0 +1,29 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 108 91" class="design-iconfont" width="128" height="107.85185185185185">
|
||||
<path d="M63.5092 24.0019H60.3465C60.1853 24.0017 60.0307 23.938 59.9167 23.8249C59.8027 23.7118 59.7385 23.5584 59.7383 23.3984V20.2605C59.7385 20.1006 59.8027 19.9472 59.9167 19.834C60.0307 19.7209 60.1853 19.6573 60.3465 19.6571H63.5092C63.6705 19.6573 63.825 19.7209 63.9391 19.834C64.0531 19.9472 64.1172 20.1006 64.1174 20.2605V23.3984C64.1172 23.5584 64.0531 23.7118 63.9391 23.8249C63.825 23.938 63.6705 24.0017 63.5092 24.0019ZM60.3465 19.8985C60.2498 19.8986 60.157 19.9368 60.0886 20.0046C60.0202 20.0725 59.9817 20.1646 59.9816 20.2605V23.3984C59.9817 23.4944 60.0202 23.5864 60.0886 23.6543C60.157 23.7222 60.2498 23.7604 60.3465 23.7605H63.5092C63.606 23.7604 63.6987 23.7222 63.7671 23.6543C63.8355 23.5864 63.874 23.4944 63.8741 23.3984V20.2605C63.874 20.1646 63.8355 20.0725 63.7671 20.0046C63.6987 19.9368 63.606 19.8986 63.5092 19.8985H60.3465Z" fill="#E6E6E6"></path>
|
||||
<path d="M26.652 5.29526H23.4893C23.3281 5.29507 23.1735 5.23144 23.0594 5.11831C22.9454 5.00519 22.8813 4.8518 22.8811 4.69182V1.55394C22.8813 1.39395 22.9454 1.24057 23.0594 1.12745C23.1735 1.01432 23.3281 0.950684 23.4893 0.9505H26.652C26.8132 0.950684 26.9678 1.01432 27.0818 1.12745C27.1958 1.24057 27.26 1.39395 27.2602 1.55394V4.69182C27.26 4.8518 27.1958 5.00519 27.0818 5.11831C26.9678 5.23144 26.8132 5.29507 26.652 5.29526ZM23.4893 1.19188C23.3926 1.19198 23.2998 1.23016 23.2314 1.29804C23.163 1.36591 23.1245 1.45795 23.1244 1.55394V4.69182C23.1245 4.78781 23.163 4.87984 23.2314 4.94772C23.2998 5.0156 23.3926 5.05378 23.4893 5.05388H26.652C26.7487 5.05378 26.8415 5.0156 26.9099 4.94772C26.9783 4.87984 27.0168 4.78781 27.0169 4.69182V1.55394C27.0168 1.45795 26.9783 1.36591 26.9099 1.29804C26.8415 1.23016 26.7487 1.19198 26.652 1.19188H23.4893Z" fill="#E6E6E6"></path>
|
||||
<path d="M61.5629 22.433H58.4003C58.239 22.4328 58.0844 22.3691 57.9704 22.256C57.8564 22.1429 57.7922 21.9895 57.7921 21.8295V18.6916C57.7922 18.5316 57.8564 18.3783 57.9704 18.2651C58.0844 18.152 58.239 18.0884 58.4003 18.0882H61.5629C61.7242 18.0884 61.8788 18.152 61.9928 18.2651C62.1068 18.3783 62.1709 18.5316 62.1711 18.6916V21.8295C62.1709 21.9895 62.1068 22.1429 61.9928 22.256C61.8788 22.3691 61.7242 22.4328 61.5629 22.433ZM58.4003 18.3296C58.3035 18.3297 58.2107 18.3679 58.1423 18.4357C58.0739 18.5036 58.0354 18.5956 58.0353 18.6916V21.8295C58.0354 21.9255 58.0739 22.0175 58.1423 22.0854C58.2107 22.1533 58.3035 22.1915 58.4003 22.1916H61.5629C61.6597 22.1915 61.7524 22.1533 61.8208 22.0854C61.8893 22.0175 61.9277 21.9255 61.9278 21.8295V18.6916C61.9277 18.5956 61.8893 18.5036 61.8208 18.4357C61.7524 18.3679 61.6597 18.3297 61.5629 18.3296H58.4003Z" fill="#E6E6E6"></path>
|
||||
<path d="M6.58129 48.6222H3.41863C3.25738 48.622 3.10279 48.5583 2.98877 48.4452C2.87475 48.3321 2.81061 48.1787 2.81042 48.0187V44.8808C2.81061 44.7209 2.87475 44.5675 2.98877 44.4544C3.10279 44.3412 3.25738 44.2776 3.41863 44.2774H6.58129C6.74254 44.2776 6.89713 44.3412 7.01115 44.4544C7.12517 44.5675 7.18931 44.7209 7.18949 44.8808V48.0187C7.18931 48.1787 7.12517 48.3321 7.01115 48.4452C6.89713 48.5583 6.74254 48.622 6.58129 48.6222ZM3.41863 44.5188C3.32188 44.5189 3.22912 44.5571 3.16071 44.6249C3.09229 44.6928 3.05381 44.7849 3.05371 44.8808V48.0187C3.05381 48.1147 3.09229 48.2067 3.16071 48.2746C3.22912 48.3425 3.32188 48.3807 3.41863 48.3808H6.58129C6.67804 48.3807 6.7708 48.3425 6.83921 48.2746C6.90762 48.2067 6.9461 48.1147 6.94621 48.0187V44.8808C6.9461 44.7849 6.90762 44.6928 6.83921 44.6249C6.7708 44.5571 6.67804 44.5189 6.58129 44.5188H3.41863Z" fill="#E6E6E6"></path>
|
||||
<path d="M4.63512 47.0532H1.47246C1.31121 47.053 1.15662 46.9894 1.0426 46.8762C0.92858 46.7631 0.864442 46.6097 0.864258 46.4498V43.3119C0.864442 43.1519 0.92858 42.9985 1.0426 42.8854C1.15662 42.7723 1.31121 42.7086 1.47246 42.7084H4.63512C4.79637 42.7086 4.95096 42.7723 5.06498 42.8854C5.179 42.9985 5.24314 43.1519 5.24332 43.3119V46.4498C5.24314 46.6097 5.179 46.7631 5.06498 46.8762C4.95096 46.9894 4.79637 47.053 4.63512 47.0532ZM1.47246 42.9498C1.37571 42.9499 1.28295 42.9881 1.21454 43.056C1.14613 43.1238 1.10764 43.2159 1.10754 43.3119V46.4498C1.10764 46.5457 1.14613 46.6378 1.21454 46.7057C1.28295 46.7735 1.37571 46.8117 1.47246 46.8118H4.63512C4.73187 46.8117 4.82463 46.7735 4.89304 46.7057C4.96146 46.6378 4.99994 46.5457 5.00004 46.4498V43.3119C4.99994 43.2159 4.96146 43.1238 4.89304 43.056C4.82463 42.9881 4.73187 42.9499 4.63512 42.9498H1.47246Z" fill="#E6E6E6"></path>
|
||||
<path d="M12.1073 11.3343H41.376C42.7883 11.3343 44.1587 11.8111 45.2618 12.6862C46.3648 13.5614 47.135 14.7828 47.4456 16.1498L62.2344 81.2327C62.3958 81.9426 62.3986 82.6789 62.2428 83.39C62.0869 84.1011 61.7762 84.7698 61.3324 85.3491C60.8886 85.9285 60.3224 86.4045 59.6736 86.7438C59.0247 87.0831 58.3089 87.2775 57.5763 87.3133L27.488 88.7841C25.8769 88.8629 24.2919 88.3573 23.0288 87.3618C21.7657 86.3663 20.9109 84.9489 20.6238 83.374L12.2346 37.3596L11.6105 37.5365L10.0053 28.8151L10.6478 28.6558L8.30605 15.8115C8.20575 15.2614 8.22901 14.696 8.37417 14.1558C8.51933 13.6156 8.78282 13.1138 9.14585 12.6863C9.50888 12.2587 9.96252 11.9158 10.4744 11.6821C10.9863 11.4484 11.5439 11.3297 12.1073 11.3343Z" fill="#3F3D56"></path>
|
||||
<path d="M37.5228 12.7373H40.9394C41.9205 12.7373 42.8722 13.0702 43.6364 13.6808C44.4005 14.2914 44.9312 15.1429 45.1404 16.0941L59.3357 80.646C59.4174 81.0176 59.4173 81.4024 59.3354 81.774C59.2535 82.1457 59.0918 82.4954 58.8612 82.7993C58.6306 83.1032 58.3366 83.3542 57.9993 83.535C57.662 83.7159 57.2894 83.8224 56.9068 83.8473L26.9158 85.7975C26.0697 85.8525 25.2328 85.5965 24.5648 85.0783C23.8968 84.5602 23.4445 83.8161 23.2942 82.9882L11.1813 16.2674C11.1029 15.8356 11.121 15.3919 11.2343 14.9678C11.3475 14.5436 11.5533 14.1493 11.8369 13.8127C12.1206 13.476 12.4753 13.2052 12.8759 13.0194C13.2766 12.8336 13.7134 12.7373 14.1557 12.7373H17.3968C17.7105 12.7373 18.0154 12.8399 18.2644 13.0292C18.5134 13.2186 18.6925 13.484 18.7741 13.7846C18.8461 14.0499 19.0042 14.2843 19.224 14.4514C19.4439 14.6185 19.7131 14.7091 19.99 14.7091H35.3767C35.919 14.7091 36.4413 14.506 36.8392 14.1405C37.2371 13.7749 37.4813 13.2738 37.5228 12.7373Z" fill="#fff"></path>
|
||||
<path d="M13.515 23.713H46.0509L49.5171 39.2085L16.556 39.812L13.515 23.713Z" fill="#4986FF"></path>
|
||||
<path d="M44.4116 53.0579H52.0714L52.3147 54.5128H44.6548L44.4116 53.0579Z" fill="#4986FF"></path>
|
||||
<path d="M50.6439 45.6359L18.158 46.3184L18.1612 46.4701L50.6471 45.7876L50.6439 45.6359Z" fill="#2F2E41"></path>
|
||||
<path d="M51.6374 50.1103L18.54 50.8687L18.5435 51.0204L51.641 50.262L51.6374 50.1103Z" fill="#2F2E41"></path>
|
||||
<path d="M47.5742 68.6266H55.2341L55.4773 70.0815H47.8175L47.5742 68.6266Z" fill="#4986FF"></path>
|
||||
<path d="M53.8066 61.2045L21.3206 61.8871L21.3239 62.0388L53.8098 61.3562L53.8066 61.2045Z" fill="#2F2E41"></path>
|
||||
<path d="M54.8001 65.6791L21.7026 66.4374L21.7062 66.5891L54.8036 65.8307L54.8001 65.6791Z" fill="#2F2E41"></path>
|
||||
<path d="M75.7414 89.1982L74.2921 89.1981L73.6026 83.6516L75.7417 83.6517L75.7414 89.1982Z" fill="#A0616A"></path>
|
||||
<path d="M76.111 90.592L71.4377 90.5919V90.5332C71.4378 90.0546 71.6294 89.5956 71.9705 89.2571C72.3117 88.9187 72.7743 88.7285 73.2567 88.7285L76.1111 88.7286L76.111 90.592Z" fill="#2F2E41"></path>
|
||||
<path d="M93.7462 88.2566L92.3355 88.5862L90.3828 83.3442L92.4649 82.8577L93.7462 88.2566Z" fill="#A0616A"></path>
|
||||
<path d="M94.4281 89.5293L89.8792 90.5921L89.8657 90.535C89.7551 90.0691 89.8356 89.5787 90.0895 89.1717C90.3433 88.7647 90.7497 88.4744 91.2192 88.3646L93.9976 87.7155L94.4281 89.5293Z" fill="#2F2E41"></path>
|
||||
<path d="M75.4452 65.804C75.4479 65.5149 75.5342 58.6936 77.4188 56.1144L77.4467 56.0764L84.0143 56.9753L83.8674 58.407C84.1563 58.6858 86.4286 61.0416 87.0847 66.6202L94.0557 85.1959L90.8149 85.4882L81.2217 65.2105L76.145 87.2523H72.9323L75.4452 65.804Z" fill="#2F2E41"></path>
|
||||
<path d="M76.6494 56.366L77.2914 53.022C77.1658 52.8615 76.6089 52.0906 76.7328 51.1871C76.8137 50.5976 77.1684 50.0807 77.7872 49.6503L79.4513 45.7979L79.4737 45.7849C79.5858 45.7194 82.2352 44.1993 83.6796 45.6334C83.7158 45.6612 87.2721 48.4621 85.844 52.2405L84.081 57.4887L76.6494 56.366Z" fill="#CCC"></path>
|
||||
<path d="M74.4158 60.8902C74.5889 60.8706 74.7556 60.8135 74.904 60.7231C75.0525 60.6326 75.1792 60.511 75.2752 60.3667C75.3712 60.2224 75.4341 60.059 75.4595 59.888C75.4849 59.7169 75.4723 59.5425 75.4224 59.3768L78.8588 56.9203L76.8017 56.144L73.8537 58.5957C73.5788 58.6973 73.351 58.8954 73.2135 59.1525C73.076 59.4096 73.0383 59.7078 73.1076 59.9907C73.1768 60.2735 73.3483 60.5213 73.5894 60.6871C73.8305 60.8529 74.1245 60.9252 74.4158 60.8902Z" fill="#A0616A"></path>
|
||||
<path d="M75.0474 56.9164L80.2938 52.8153L78.7341 47.5282C78.6606 47.2779 78.6398 47.0152 78.6731 46.7565C78.7063 46.4979 78.7929 46.2488 78.9274 46.0247C79.0519 45.8135 79.2195 45.6305 79.4195 45.4873C79.6194 45.3441 79.8473 45.2439 80.0886 45.1931C80.9867 45.0046 81.8021 45.5035 82.5113 46.6764L82.5167 46.6869C82.6341 46.9716 85.3672 53.6749 83.2803 55.1084C81.2388 56.5106 76.505 58.5519 76.4574 58.5724L76.4019 58.5962L75.0474 56.9164Z" fill="#CCC"></path>
|
||||
<path d="M82.0201 44.2392C83.7754 44.2392 85.1983 42.8274 85.1983 41.0859C85.1983 39.3444 83.7754 37.9326 82.0201 37.9326C80.2648 37.9326 78.8419 39.3444 78.8419 41.0859C78.8419 42.8274 80.2648 44.2392 82.0201 44.2392Z" fill="#A0616A"></path>
|
||||
<path d="M87.0027 39.9602C88.5555 39.9602 89.8143 38.7113 89.8143 37.1706C89.8143 35.6299 88.5555 34.381 87.0027 34.381C85.4499 34.381 84.191 35.6299 84.191 37.1706C84.191 38.7113 85.4499 39.9602 87.0027 39.9602Z" fill="#2F2E41"></path>
|
||||
<path d="M89.4279 39.4806C89.064 39.7416 88.6423 39.9123 88.1983 39.9784C87.7543 40.0446 87.3007 40.0043 86.8756 39.8608C86.4505 39.7174 86.0662 39.4751 85.7548 39.1541C85.4434 38.8331 85.2141 38.4428 85.0859 38.0158C85.1344 38.3985 85.2624 38.7669 85.4616 39.0981C85.6609 39.4292 85.9272 39.7157 86.2437 39.9395C86.5603 40.1633 86.9201 40.3196 87.3006 40.3985C87.681 40.4774 88.0739 40.4772 88.4542 40.3978C88.8346 40.3185 89.1943 40.1618 89.5105 39.9376C89.8268 39.7134 90.0927 39.4265 90.2916 39.0952C90.4905 38.7639 90.618 38.3952 90.666 38.0125C90.714 37.6299 90.6816 37.2414 90.5707 36.8718C90.6337 37.3684 90.5608 37.8726 90.3597 38.3317C90.1587 38.7907 89.8368 39.1875 89.4279 39.4806Z" fill="#2F2E41"></path>
|
||||
<path d="M78.3319 39.4837C78.8228 38.6118 79.0106 38.2476 79.6434 37.7174C80.2031 37.2486 80.8915 37.1109 81.4467 37.5551C82.1036 37.2736 82.8345 37.2097 83.5308 37.3731C84.2272 37.5365 84.8518 37.9183 85.312 38.462C85.7722 39.0056 86.0433 39.682 86.0852 40.3908C86.127 41.0995 85.9373 41.8027 85.5443 42.3959C85.1512 42.9892 84.5758 43.4408 83.9035 43.6837C83.2311 43.9267 82.4977 43.9479 81.8122 43.7444C81.1267 43.5408 80.5257 43.1233 80.0984 42.5539C79.6711 41.9844 79.4403 41.2934 79.4404 40.5835C79.4409 40.4588 79.4485 40.3343 79.4631 40.2104C78.9804 40.1432 78.8146 39.5509 78.3319 39.4837Z" fill="#2F2E41"></path>
|
||||
<path d="M107.418 90.7421H61.0731C61.0408 90.7421 61.0099 90.7294 60.987 90.7068C60.9642 90.6841 60.9514 90.6534 60.9514 90.6214C60.9514 90.5894 60.9642 90.5587 60.987 90.5361C61.0099 90.5134 61.0408 90.5007 61.0731 90.5007H107.418C107.45 90.5007 107.481 90.5134 107.504 90.5361C107.527 90.5587 107.54 90.5894 107.54 90.6214C107.54 90.6534 107.527 90.6841 107.504 90.7068C107.481 90.7294 107.45 90.7421 107.418 90.7421Z" fill="#3F3D56"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 11 KiB |
|
|
@ -0,0 +1,9 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 60 60" class="design-iconfont" width="128" height="128">
|
||||
<path d="M0 29.9814C0 46.5184 13.4205 59.9258 29.9735 59.9258C46.5265 59.9258 59.947 46.5184 59.947 29.9814C59.947 13.4445 46.5265 0.0370483 29.9735 0.0370483C13.4205 0.0370483 0 13.4445 0 29.9814Z" fill="#F9F9F9"></path>
|
||||
<path d="M29.9735 59.9258C40.8869 59.9258 50.4329 54.0958 55.6749 45.3905V45.3481C54.1643 43.05 43.7756 39.5711 39.6996 39.5711C31.6166 53.6881 20.7032 42.0016 20.8993 39.7035C15.2544 39.3169 8.44876 43.3889 4.67491 46.0365C9.99647 54.3818 19.3357 59.9258 29.9735 59.9258Z" fill="#D1E3FF"></path>
|
||||
<path d="M21.0318 40.3389C22.2774 43.5637 32.2049 52.6608 39.6996 39.5711C39.7579 39.5711 39.8269 39.5764 39.8852 39.5764C38.4753 38.242 37.3887 36.0233 37.8074 31.9883C34.0442 37.8766 26.8728 38.2261 23.189 32.1419C23.4594 33.9158 23.3322 36.7117 21.0318 40.3389Z" fill="#FFDABE"></path>
|
||||
<path d="M22.9982 32.4437C23.3322 33.6246 31.9346 41.6521 39.7368 39.6823C37.4523 36.8758 38.2633 32.4914 38.4064 29.8808C39.212 28.1122 23.2367 30.871 22.9982 32.4437Z" fill="#DFB08C"></path>
|
||||
<path d="M40.2456 22.9282C40.1979 25.5811 39.7209 27.8687 38.947 29.7696C43.2668 28.5359 44.2898 18.8297 40.2456 22.9282Z" fill="#FFDABE"></path>
|
||||
<path d="M38.0353 16.5846C29.5389 18.4908 26.0353 14.6148 24.2968 13.4339C21.5194 15.6526 22.2138 20.7731 21.3233 21.7103C21.1696 21.5197 21.0318 21.3185 20.9046 21.1067C20.1254 42.2346 40.4417 40.8049 40.2562 22.224C38.417 19.4175 38.7456 19.354 38.0353 16.5846Z" fill="#FFDABE"></path>
|
||||
<path d="M24.2968 13.4339C26.03 14.6148 29.5389 18.4908 38.0353 16.5846C38.7615 19.4069 38.4011 19.4069 40.3675 22.3934C41.8039 22.8859 45.97 8.75296 33.7739 6.8308C19.4894 4.6174 17.6555 17.1776 21.3233 21.7103C22.2138 20.7731 21.5194 15.6526 24.2968 13.4339Z" fill="#48494F"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.8 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 17 14" class="design-iconfont" width="128" height="105.41176470588235">
|
||||
<path d="M1.52962 2.9207L7.84825 6.72051C8.04234 6.8348 8.28602 6.89626 8.53834 6.89626C8.79065 6.89626 9.03434 6.8348 9.22843 6.72051L15.5471 2.9207M14.4688 1.57288H2.60788C2.32191 1.57288 2.04765 1.68648 1.84543 1.88869C1.64322 2.09091 1.52962 2.36517 1.52962 2.65114V11.8164C1.52962 12.1024 1.64322 12.3766 1.84543 12.5788C2.04765 12.7811 2.32191 12.8947 2.60788 12.8947H14.4688C14.7548 12.8947 15.029 12.7811 15.2312 12.5788C15.4335 12.3766 15.5471 12.1024 15.5471 11.8164V2.65114C15.5471 2.36517 15.4335 2.09091 15.2312 1.88869C15.029 1.68648 14.7548 1.57288 14.4688 1.57288Z" stroke="#3887FD" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 818 B |
Binary file not shown.
|
After Width: | Height: | Size: 130 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.9 KiB |
|
|
@ -0,0 +1,22 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 42 43" class="design-iconfont" width="125.02325581395348" height="128">
|
||||
<path fill="#DDEBFF" d="M21.1843 0.9933000000000014A20.5427 20.5427 0 1 0 21.1843 42.0787A20.5427 20.5427 0 1 0 21.1843 0.9933000000000014Z"></path>
|
||||
<g filter="url(#yquslk2ba__filter0_d_357_4172)">
|
||||
<path d="M32.0255 14.3022L21.6804 10.3267C21.3607 10.2067 21.0084 10.2067 20.6887 10.3267L10.3432 14.3022C10.2086 14.3527 10.0926 14.4431 10.0108 14.5612C9.92889 14.6794 9.88502 14.8197 9.88501 14.9634V16.5926C9.88501 16.9827 10.201 17.2988 10.5912 17.2988H31.7774C32.1676 17.2988 32.4836 16.9827 32.4836 16.5926V14.9634C32.4836 14.669 32.3009 14.4055 32.0255 14.3022ZM12.7098 18.7112V25.7733H12.0036C11.6135 25.7733 11.2974 26.0893 11.2974 26.4795V28.5981H31.0712V26.4795C31.0712 26.0893 30.7552 25.7733 30.365 25.7733H29.6588V18.7112H26.834V25.7733H22.5967V18.7112H19.7719V25.7733H15.5347V18.7112H12.7098ZM31.7774 30.0105H10.5912C10.201 30.0105 9.88501 30.3265 9.88501 30.7167V32.1291C9.88501 32.5193 10.201 32.8353 10.5912 32.8353H31.7774C32.1676 32.8353 32.4836 32.5193 32.4836 32.1291V30.7167C32.4836 30.3265 32.1676 30.0105 31.7774 30.0105Z" fill="url(#yquslk2ba__paint0_linear_357_4172)"></path>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="yquslk2ba__paint0_linear_357_4172" x1="21.1843" y1="10.2367" x2="21.1843" y2="32.8353" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#8AB5FE"></stop>
|
||||
<stop offset="1" stop-color="#76A7FA"></stop>
|
||||
</linearGradient>
|
||||
<filter id="yquslk2ba__filter0_d_357_4172" x="5.88501" y="10.2367" width="30.5986" height="30.5986" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0"></feFlood>
|
||||
<feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"></feColorMatrix>
|
||||
<feOffset dy="4"></feOffset>
|
||||
<feGaussianBlur stdDeviation="2"></feGaussianBlur>
|
||||
<feComposite in2="hardAlpha" operator="out"></feComposite>
|
||||
<feColorMatrix values="0 0 0 0 0.177969 0 0 0 0 0.527213 0 0 0 0 0.6375 0 0 0 0.25 0"></feColorMatrix>
|
||||
<feBlend in2="BackgroundImageFix"></feBlend>
|
||||
<feBlend in="SourceGraphic" in2="effect1_dropShadow_357_4172"></feBlend>
|
||||
</filter>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.4 KiB |
|
|
@ -0,0 +1,22 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 42 43" class="design-iconfont" width="125.02325581395348" height="128">
|
||||
<path fill="#F9F1DB" d="M21.4167 0.9933000000000014A20.5427 20.5427 0 1 0 21.4167 42.0787A20.5427 20.5427 0 1 0 21.4167 0.9933000000000014Z"></path>
|
||||
<g filter="url(#dudmv7qfj__filter0_d_357_4173)">
|
||||
<path d="M33.0726 27.9403L21.8365 32.9653C21.7039 33.0164 21.5612 33.0427 21.417 33.0427C21.2728 33.0427 21.1301 33.0164 20.9976 32.9653L9.76085 27.9403C9.53212 27.8376 9.53212 27.6691 9.76085 27.5659L12.4518 26.3648C12.5845 26.3138 12.7274 26.2874 12.8718 26.2874C13.0162 26.2874 13.1591 26.3138 13.2918 26.3648L20.9976 29.8066C21.1301 29.8579 21.2728 29.8844 21.417 29.8844C21.5613 29.8844 21.704 29.8579 21.8365 29.8066L29.5423 26.3648C29.6749 26.3137 29.8177 26.2874 29.962 26.2874C30.1063 26.2874 30.2491 26.3137 30.3817 26.3648L33.0726 27.5684C33.3042 27.6691 33.3042 27.8376 33.0726 27.9403ZM33.0726 20.9269L30.3817 19.7233C30.2491 19.6722 30.1063 19.6458 29.962 19.6458C29.8177 19.6458 29.6749 19.6722 29.5423 19.7233L21.8365 23.1691C21.7039 23.22 21.5612 23.2462 21.417 23.2462C21.2729 23.2462 21.1302 23.22 20.9976 23.1691L13.2918 19.7233C13.1591 19.6722 13.0162 19.6459 12.8718 19.6459C12.7274 19.6459 12.5845 19.6722 12.4518 19.7233L9.76085 20.9269C9.53212 21.0296 9.53212 21.1986 9.76085 21.3024L20.9976 26.3263C21.1301 26.3774 21.2728 26.4037 21.417 26.4037C21.5612 26.4037 21.7039 26.3774 21.8365 26.3263L33.0726 21.3024C33.3042 21.1986 33.3042 21.0301 33.0726 20.9269ZM9.76085 15.0851L20.997 19.7233C21.2666 19.8183 21.5663 19.8183 21.8359 19.7233L33.0726 15.0851C33.3014 14.9896 33.3014 14.834 33.0726 14.7389L21.8359 10.1013C21.5665 10.0052 21.2664 10.0052 20.997 10.1013L9.76085 14.7389C9.52926 14.834 9.52926 14.9896 9.76085 15.0851Z" fill="url(#dudmv7qfj__paint0_linear_357_4173)"></path>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="dudmv7qfj__paint0_linear_357_4173" x1="21.4167" y1="10.0292" x2="21.4167" y2="33.0427" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FFD87C"></stop>
|
||||
<stop offset="1" stop-color="#F8B953"></stop>
|
||||
</linearGradient>
|
||||
<filter id="dudmv7qfj__filter0_d_357_4173" x="5.58716" y="10.0292" width="31.6592" height="31.0135" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0"></feFlood>
|
||||
<feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"></feColorMatrix>
|
||||
<feOffset dy="4"></feOffset>
|
||||
<feGaussianBlur stdDeviation="2"></feGaussianBlur>
|
||||
<feComposite in2="hardAlpha" operator="out"></feComposite>
|
||||
<feColorMatrix values="0 0 0 0 0.506105 0 0 0 0 0.575 0 0 0 0 0.138958 0 0 0 0.25 0"></feColorMatrix>
|
||||
<feBlend in2="BackgroundImageFix"></feBlend>
|
||||
<feBlend in="SourceGraphic" in2="effect1_dropShadow_357_4173"></feBlend>
|
||||
</filter>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.0 KiB |
|
|
@ -0,0 +1,22 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 42 43" class="design-iconfont" width="125.02325581395348" height="128">
|
||||
<path fill="#DEEFE1" d="M21.0898 0.9933000000000014A20.5427 20.5427 0 1 0 21.0898 42.0787A20.5427 20.5427 0 1 0 21.0898 0.9933000000000014Z"></path>
|
||||
<g filter="url(#jyedx9vu7__filter0_d_357_4174)">
|
||||
<path d="M24.951 24.8909C24.951 25.2616 24.6309 25.5619 24.2357 25.5619H19.9442C19.549 25.5619 19.2289 25.2616 19.2289 24.8909V22.878H10.6458V28.9168C10.6458 29.9903 11.6471 30.9297 12.7915 30.9297H31.3883C32.5328 30.9297 33.5341 29.9903 33.5341 28.9168V22.878H24.951V24.8909ZM31.3883 16.1682H27.812V14.1553C27.812 13.0817 26.8107 12.1423 25.6662 12.1423H18.5136C17.3692 12.1423 16.3678 13.0817 16.3678 14.1553V16.1682H12.7915C11.6471 16.1682 10.6458 17.1076 10.6458 18.1811V21.536H33.5341V18.1811C33.5341 17.1076 32.5328 16.1682 31.3883 16.1682ZM24.951 16.1682H19.2289V14.8262H24.951V16.1682Z" fill="url(#jyedx9vu7__paint0_linear_357_4174)"></path>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="jyedx9vu7__paint0_linear_357_4174" x1="22.0899" y1="12.1423" x2="22.0899" y2="30.9297" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#93C89E"></stop>
|
||||
<stop offset="1" stop-color="#6BA575"></stop>
|
||||
</linearGradient>
|
||||
<filter id="jyedx9vu7__filter0_d_357_4174" x="6.64575" y="12.1423" width="30.8884" height="26.7874" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0"></feFlood>
|
||||
<feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"></feColorMatrix>
|
||||
<feOffset dy="4"></feOffset>
|
||||
<feGaussianBlur stdDeviation="2"></feGaussianBlur>
|
||||
<feComposite in2="hardAlpha" operator="out"></feComposite>
|
||||
<feColorMatrix values="0 0 0 0 0.138281 0 0 0 0 0.5625 0 0 0 0 0.223973 0 0 0 0.25 0"></feColorMatrix>
|
||||
<feBlend in2="BackgroundImageFix"></feBlend>
|
||||
<feBlend in="SourceGraphic" in2="effect1_dropShadow_357_4174"></feBlend>
|
||||
</filter>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.0 KiB |
|
|
@ -0,0 +1,33 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 111 81" class="design-iconfont" width="128" height="93.4054054054054">
|
||||
<path d="M21.813 42.1858L20.3591 26.7861L16.0239 26.9354L19.4557 42.1428C19.1757 42.3776 18.9741 42.6923 18.8779 43.0447C18.7818 43.397 18.7955 43.7704 18.9174 44.1147C19.0393 44.4591 19.2635 44.758 19.5601 44.9716C19.8566 45.1851 20.2113 45.3032 20.5768 45.3098C20.9423 45.3165 21.3011 45.2115 21.6052 45.0089C21.9094 44.8063 22.1444 44.5157 22.2788 44.1761C22.4132 43.8364 22.4406 43.4638 22.3574 43.1082C22.2741 42.7525 22.0842 42.4307 21.813 42.1858Z" fill="#FFB8B8"></path>
|
||||
<path d="M104.229 76.5097C104.189 78.0011 103.939 79.4795 103.487 80.9013C103.476 80.9343 103.465 80.9669 103.455 80.9997H100.683C100.686 80.9699 100.689 80.9371 100.692 80.9013C100.876 78.7782 101.942 65.8569 100.668 63.6472C100.779 63.8266 104.444 69.7638 104.229 76.5097Z" fill="#F0F0F0"></path>
|
||||
<path d="M103.785 80.794C103.736 80.863 103.686 80.932 103.634 81H99.2856C99.3187 80.9413 99.3568 80.8723 99.401 80.794C100.119 79.4983 102.246 75.6257 104.22 71.6094C106.341 67.2942 108.287 62.8153 108.123 61.1942C108.173 61.5598 109.64 72.7052 103.785 80.794Z" fill="#F0F0F0"></path>
|
||||
<path d="M8.2747 74.2472C8.33426 76.4685 8.70665 78.6702 9.38092 80.7876C9.39586 80.8367 9.41246 80.8851 9.4286 80.9343H13.5563C13.552 80.8902 13.5475 80.8411 13.5431 80.7876C13.2679 77.6259 11.6811 58.3832 13.5784 55.0925C13.4123 55.3595 7.95405 64.2012 8.2747 74.2472Z" fill="#F0F0F0"></path>
|
||||
<path d="M8.58442 80.7876C8.61895 80.8367 8.65483 80.8859 8.6916 80.9343H11.7881C11.7646 80.8924 11.7374 80.8433 11.7059 80.7876C11.1943 79.8651 9.68017 77.1067 8.27468 74.2472C6.76484 71.1743 5.37848 67.9849 5.49523 66.8305C5.4592 67.0907 4.41398 75.0276 8.58442 80.7876Z" fill="#F0F0F0"></path>
|
||||
<path d="M98.003 64.8559H54.9103C54.6987 64.8556 54.4959 64.7715 54.3463 64.622C54.1967 64.4726 54.1126 64.2699 54.1123 64.0585V53.3771C54.1126 53.1657 54.1967 52.963 54.3463 52.8136C54.4959 52.6641 54.6987 52.58 54.9103 52.5797H98.003C98.2145 52.58 98.4174 52.6641 98.5669 52.8136C98.7165 52.963 98.8007 53.1657 98.801 53.3771V64.0584C98.8007 64.2698 98.7166 64.4725 98.567 64.622C98.4174 64.7715 98.2146 64.8556 98.003 64.8559ZM54.9103 52.898C54.7835 52.8983 54.662 52.9488 54.5723 53.0383C54.4827 53.1279 54.4322 53.2493 54.4319 53.376V64.0573C54.4322 64.184 54.4827 64.3054 54.5723 64.395C54.662 64.4846 54.7835 64.535 54.9103 64.5353H98.003C98.1298 64.5351 98.2513 64.4847 98.341 64.3951C98.4306 64.3055 98.4811 64.184 98.4814 64.0573V53.3771C98.4811 53.2504 98.4306 53.1289 98.341 53.0393C98.2513 52.9497 98.1298 52.8993 98.003 52.8991L54.9103 52.898Z" fill="#3F3D56"></path>
|
||||
<path d="M50.8427 77.7478C52.638 77.7478 54.0933 76.2936 54.0933 74.4997C54.0933 72.7058 52.638 71.2515 50.8427 71.2515C49.0474 71.2515 47.592 72.7058 47.592 74.4997C47.592 76.2936 49.0474 77.7478 50.8427 77.7478Z" fill="#E6E6E6"></path>
|
||||
<path d="M58.3503 72.4464C58.2067 72.4464 58.0689 72.5034 57.9673 72.6049C57.8657 72.7064 57.8086 72.8441 57.8086 72.9877C57.8086 73.1313 57.8657 73.2689 57.9673 73.3705C58.0689 73.472 58.2067 73.529 58.3503 73.529H83.8914C83.9626 73.5292 84.033 73.5153 84.0988 73.4882C84.1646 73.4611 84.2244 73.4214 84.2748 73.3712C84.3252 73.3211 84.3652 73.2615 84.3926 73.1958C84.4199 73.1302 84.4341 73.0599 84.4342 72.9888C84.4344 72.9177 84.4205 72.8473 84.3934 72.7815C84.3663 72.7158 84.3265 72.656 84.2763 72.6057C84.2261 72.5553 84.1665 72.5153 84.1008 72.488C84.0351 72.4606 83.9647 72.4465 83.8936 72.4464H58.3503Z" fill="#E6E6E6"></path>
|
||||
<path d="M58.3503 75.6947C58.2066 75.6944 58.0687 75.7512 57.9669 75.8525C57.8651 75.9538 57.8078 76.0914 57.8075 76.235C57.8072 76.3785 57.864 76.5163 57.9654 76.6181C58.0668 76.7198 58.2045 76.7771 58.3482 76.7774H69.3407C69.4844 76.7774 69.6222 76.7203 69.7238 76.6188C69.8254 76.5173 69.8825 76.3796 69.8825 76.236C69.8825 76.0925 69.8254 75.9548 69.7238 75.8532C69.6222 75.7517 69.4844 75.6947 69.3407 75.6947H58.3503Z" fill="#E6E6E6"></path>
|
||||
<path d="M61.6059 61.9141C63.4011 61.9141 64.8565 60.4599 64.8565 58.666C64.8565 56.8721 63.4011 55.4178 61.6059 55.4178C59.8106 55.4178 58.3552 56.8721 58.3552 58.666C58.3552 60.4599 59.8106 61.9141 61.6059 61.9141Z" fill="#E6E6E6"></path>
|
||||
<path d="M69.1135 56.6127C68.9698 56.6127 68.832 56.6697 68.7304 56.7712C68.6288 56.8727 68.5718 57.0104 68.5718 57.154C68.5718 57.2976 68.6288 57.4353 68.7304 57.5368C68.832 57.6383 68.9698 57.6953 69.1135 57.6953H94.6546C94.7983 57.6953 94.9361 57.6383 95.0377 57.5368C95.1393 57.4353 95.1964 57.2976 95.1964 57.154C95.1964 57.0104 95.1393 56.8727 95.0377 56.7712C94.9361 56.6697 94.7983 56.6127 94.6546 56.6127H69.1135Z" fill="#E6E6E6"></path>
|
||||
<path d="M69.1135 59.861C68.9698 59.861 68.832 59.918 68.7304 60.0196C68.6288 60.1211 68.5718 60.2588 68.5718 60.4023C68.5718 60.5459 68.6288 60.6836 68.7304 60.7851C68.832 60.8866 68.9698 60.9437 69.1135 60.9437H80.1039C80.2476 60.9437 80.3854 60.8866 80.487 60.7851C80.5886 60.6836 80.6457 60.5459 80.6457 60.4023C80.6457 60.2588 80.5886 60.1211 80.487 60.0196C80.3854 59.918 80.2476 59.861 80.1039 59.861H69.1135Z" fill="#E6E6E6"></path>
|
||||
<path d="M89.6317 38.4167H46.5389C46.3274 38.4164 46.1246 38.3323 45.975 38.1828C45.8254 38.0334 45.7412 37.8307 45.741 37.6193V0.79736C45.7412 0.585971 45.8254 0.38332 45.975 0.233846C46.1246 0.0843723 46.3274 0.00027666 46.5389 0H89.6317C89.8432 0.00027666 90.046 0.0843723 90.1956 0.233846C90.3452 0.38332 90.4294 0.585971 90.4296 0.79736V37.6192C90.4294 37.8306 90.3452 38.0332 90.1956 38.1827C90.046 38.3322 89.8432 38.4163 89.6317 38.4165V38.4167ZM46.5389 0.318316C46.4122 0.318592 46.2906 0.369041 46.201 0.458623C46.1113 0.548206 46.0609 0.669625 46.0606 0.796313V37.6192C46.0609 37.7459 46.1113 37.8673 46.201 37.9569C46.2906 38.0464 46.4122 38.0969 46.5389 38.0972H89.6317C89.7585 38.0969 89.88 38.0465 89.9696 37.9569C90.0593 37.8673 90.1098 37.7459 90.11 37.6192V0.79736C90.1097 0.670672 90.0593 0.549252 89.9696 0.45967C89.88 0.370087 89.7584 0.319639 89.6317 0.319362L46.5389 0.318316Z" fill="#3F3D56"></path>
|
||||
<path d="M53.2344 9.72322C55.0297 9.72322 56.485 8.26897 56.485 6.47507C56.485 4.68117 55.0297 3.22693 53.2344 3.22693C51.4391 3.22693 49.9838 4.68117 49.9838 6.47507C49.9838 8.26897 51.4391 9.72322 53.2344 9.72322Z" fill="#3772E7"></path>
|
||||
<path d="M60.7422 4.30957C60.5985 4.30957 60.4607 4.3666 60.3591 4.46812C60.2575 4.56964 60.2004 4.70733 60.2004 4.8509C60.2004 4.99447 60.2575 5.13216 60.3591 5.23368C60.4607 5.3352 60.5985 5.39224 60.7422 5.39224H86.2833C86.4269 5.39224 86.5647 5.3352 86.6663 5.23368C86.7679 5.13216 86.825 4.99447 86.825 4.8509C86.825 4.70733 86.7679 4.56964 86.6663 4.46812C86.5647 4.3666 86.4269 4.30957 86.2833 4.30957H60.7422Z" fill="#CCC"></path>
|
||||
<path d="M60.7422 7.55792C60.5985 7.55792 60.4607 7.61496 60.3591 7.71648C60.2575 7.81799 60.2004 7.95568 60.2004 8.09925C60.2004 8.24282 60.2575 8.38051 60.3591 8.48203C60.4607 8.58355 60.5985 8.64059 60.7422 8.64059H71.7326C71.8763 8.64059 72.0141 8.58355 72.1157 8.48203C72.2173 8.38051 72.2744 8.24282 72.2744 8.09925C72.2744 7.95568 72.2173 7.81799 72.1157 7.71648C72.0141 7.61496 71.8763 7.55792 71.7326 7.55792H60.7422Z" fill="#CCC"></path>
|
||||
<path d="M34.8594 77.8721H31.5706L29.6272 50.5366L29.5525 57.4825L22.377 76.6024L19.5367 74.3618L24.2456 55.3166L22.0033 44.711H36.6532L34.8594 77.8721Z" fill="#2F2E41"></path>
|
||||
<path d="M29.6272 10.9524C31.7738 10.9524 33.5139 9.21359 33.5139 7.06867C33.5139 4.92374 31.7738 3.18494 29.6272 3.18494C27.4806 3.18494 25.7405 4.92374 25.7405 7.06867C25.7405 9.21359 27.4806 10.9524 29.6272 10.9524Z" fill="#FFB8B8"></path>
|
||||
<path d="M37.1018 46.8023C30.7518 45.1741 24.7938 44.0769 21.1065 46.0554C21.7523 39.2721 21.0053 30.6132 18.7894 21.5632C18.0698 18.6237 18.5579 15.975 21.1812 14.4627L24.6942 12.4462L30.0758 12.5955L32.8837 14.1478C34.2567 14.8334 35.3684 15.948 36.0497 17.3223C36.7311 18.6966 36.945 20.2556 36.6589 21.7625C35.1501 29.6953 35.9654 38.2571 37.1018 46.8023Z" fill="#3F3D56"></path>
|
||||
<path d="M22.6013 27.8317L15.5753 27.3836C16.1242 20.4771 17.6864 16.7017 20.06 15.4337L22.6013 18.4211V27.8317Z" fill="#3F3D56"></path>
|
||||
<path d="M99.87 33.6399H56.7771C56.5655 33.6396 56.3627 33.5555 56.2131 33.4061C56.0635 33.2566 55.9794 33.0539 55.9791 32.8425V13.9456C55.9794 13.7342 56.0635 13.5315 56.2131 13.3821C56.3627 13.2326 56.5655 13.1485 56.7771 13.1483H99.87C100.082 13.1485 100.284 13.2326 100.434 13.3821C100.584 13.5315 100.668 13.7342 100.668 13.9456V32.8425C100.668 33.0539 100.584 33.2566 100.434 33.4061C100.284 33.5555 100.082 33.6396 99.87 33.6399Z" fill="#3772E7"></path>
|
||||
<path d="M65.553 19.7347C65.4093 19.7347 65.2715 19.7918 65.1699 19.8933C65.0683 19.9948 65.0112 20.1325 65.0112 20.2761C65.0112 20.4196 65.0683 20.5573 65.1699 20.6589C65.2715 20.7604 65.4093 20.8174 65.553 20.8174H91.0942C91.2379 20.8174 91.3757 20.7604 91.4773 20.6589C91.5789 20.5573 91.6359 20.4196 91.6359 20.2761C91.6359 20.1325 91.5789 19.9948 91.4773 19.8933C91.3757 19.7918 91.2379 19.7347 91.0942 19.7347H65.553Z" fill="#fff"></path>
|
||||
<path d="M65.553 22.8716C65.4093 22.8716 65.2715 22.9286 65.1699 23.0301C65.0683 23.1317 65.0112 23.2693 65.0112 23.4129C65.0112 23.5565 65.0683 23.6942 65.1699 23.7957C65.2715 23.8972 65.4093 23.9542 65.553 23.9542H91.0942C91.2379 23.9542 91.3757 23.8972 91.4773 23.7957C91.5789 23.6942 91.6359 23.5565 91.6359 23.4129C91.6359 23.2693 91.5789 23.1317 91.4773 23.0301C91.3757 22.9286 91.2379 22.8716 91.0942 22.8716H65.553Z" fill="#fff"></path>
|
||||
<path d="M65.553 25.9705C65.4093 25.9705 65.2715 26.0276 65.1699 26.1291C65.0683 26.2306 65.0112 26.3683 65.0112 26.5119C65.0112 26.6554 65.0683 26.7931 65.1699 26.8946C65.2715 26.9962 65.4093 27.0532 65.553 27.0532H76.5434C76.6871 27.0532 76.8249 26.9962 76.9265 26.8946C77.0281 26.7931 77.0851 26.6554 77.0851 26.5119C77.0851 26.3683 77.0281 26.2306 76.9265 26.1291C76.8249 26.0276 76.6871 25.9705 76.5434 25.9705H65.553Z" fill="#fff"></path>
|
||||
<path d="M30.9524 1.95814C30.5904 1.9202 30.2489 2.11275 29.8927 2.19147C29.1602 2.35189 28.4098 2.01939 27.6566 2.02223C27.0093 2.059 26.3796 2.24681 25.8179 2.57058C25.3637 2.78507 24.9492 3.07504 24.5921 3.42814C24.233 3.78692 24.0239 4.26877 24.0073 4.77594C24.0571 5.06645 24.0481 5.36397 23.981 5.65097C23.9051 5.79569 23.815 5.93249 23.7119 6.05936C23.6187 6.20886 23.5592 6.37683 23.5375 6.55162C23.5159 6.72641 23.5325 6.90382 23.5864 7.07152C23.7373 7.40376 23.9413 7.70921 24.1906 7.97584C24.6752 8.59708 24.9788 9.34097 25.4137 10.0003C25.6035 10.2865 25.8163 10.5567 26.0501 10.8083C26.0883 10.8528 26.135 10.8895 26.1873 10.9161C26.2388 10.9342 26.2933 10.9421 26.3479 10.9394C27.2704 10.9657 28.225 10.986 29.0744 10.6244C29.3465 10.5301 29.5776 10.3446 29.7283 10.0993C29.8508 9.76286 29.873 9.39811 29.7924 9.04924C29.7538 8.66069 29.7626 8.26889 29.8187 7.88248C29.8225 7.75198 29.876 7.62784 29.9682 7.53533C30.0379 7.49208 30.1177 7.46793 30.1997 7.46531C30.2817 7.46269 30.3629 7.48168 30.4352 7.52039C30.5795 7.59633 30.7371 7.64384 30.8994 7.66036C31.2176 7.66036 31.419 7.29857 31.4833 6.98354C31.4482 6.70043 31.4901 6.41311 31.6047 6.15182C31.7193 5.89052 31.9022 5.66492 32.1343 5.49876C32.3529 5.22144 32.5031 4.89652 32.5726 4.55035C32.6421 4.20419 32.6289 3.84654 32.5342 3.50641C32.3244 2.8508 31.6822 2.03104 30.9524 1.95814Z" fill="#2F2E41"></path>
|
||||
<path d="M87.2398 80.6896H44.1471C43.9355 80.6893 43.7327 80.6053 43.5831 80.4558C43.4336 80.3063 43.3494 80.1037 43.3491 79.8923V69.2108C43.3494 68.9994 43.4335 68.7967 43.5831 68.6473C43.7327 68.4978 43.9355 68.4137 44.1471 68.4135H87.2398C87.4514 68.4137 87.6542 68.4978 87.8038 68.6473C87.9533 68.7968 88.0375 68.9994 88.0378 69.2108V79.8921C88.0375 80.1035 87.9533 80.3062 87.8038 80.4556C87.6542 80.6051 87.4514 80.6893 87.2398 80.6896ZM44.1471 68.7318C44.0203 68.732 43.8988 68.7825 43.8091 68.8721C43.7195 68.9617 43.669 69.0831 43.6687 69.2098V79.8911C43.669 80.0178 43.7195 80.1392 43.8091 80.2288C43.8988 80.3183 44.0203 80.3688 44.1471 80.3691H87.2398C87.3666 80.3688 87.4881 80.3184 87.5778 80.2288C87.6675 80.1392 87.7179 80.0178 87.7182 79.8911V69.2108C87.7179 69.0841 87.6674 68.9627 87.5778 68.8731C87.4881 68.7835 87.3666 68.7331 87.2398 68.7328L44.1471 68.7318Z" fill="#3F3D56"></path>
|
||||
<path d="M38.4062 41.5884L36.9524 26.1886L32.6172 26.338L36.0489 41.5453C35.769 41.7802 35.5674 42.0948 35.4712 42.4472C35.375 42.7996 35.3888 43.1729 35.5107 43.5172C35.6326 43.8616 35.8568 44.1605 36.1533 44.3741C36.4499 44.5877 36.8046 44.7057 37.1701 44.7124C37.5356 44.719 37.8944 44.614 38.1985 44.4114C38.5026 44.2088 38.7376 43.9183 38.872 43.5786C39.0064 43.2389 39.0339 42.8664 38.9506 42.5107C38.8674 42.155 38.6775 41.8332 38.4062 41.5884Z" fill="#FFB8B8"></path>
|
||||
<path d="M38.447 26.4873L31.8695 27.9811L31.5706 17.2261L35.3078 17.3755L38.447 26.4873Z" fill="#3F3D56"></path>
|
||||
<path d="M31.4666 77.6031L36.2374 77.6029H36.2376C37.0439 77.6029 37.8172 77.923 38.3874 78.4928C38.9576 79.0625 39.2779 79.8352 39.278 80.6409V80.7396L31.4667 80.7399L31.4666 77.6031Z" fill="#2F2E41"></path>
|
||||
<path d="M19.484 73.8286L23.4947 76.4103L23.4948 76.4104C24.1726 76.8468 24.6492 77.5343 24.8197 78.3218C24.9902 79.1093 24.8407 79.9322 24.4041 80.6096L24.3506 80.6926L17.7839 76.4656L19.484 73.8286Z" fill="#2F2E41"></path>
|
||||
<path d="M110.356 80.7012H0V81H110.356V80.7012Z" fill="#CACACA"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
|
|
@ -0,0 +1,4 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 40 20" class="design-iconfont" width="128" height="64">
|
||||
<rect width="39.2153" height="20" rx="10" fill="#F8FAFB"></rect>
|
||||
<path d="M13.122 8C11.9549 8 11 8.9549 11 10.122C11 11.2891 11.9549 12.244 13.122 12.244C14.2891 12.244 15.244 11.2891 15.244 10.122C15.244 8.9549 14.2891 8 13.122 8ZM25.8541 8C24.687 8 23.7321 8.9549 23.7321 10.122C23.7321 11.2891 24.687 12.244 25.8541 12.244C27.0212 12.244 27.9761 11.2891 27.9761 10.122C27.9761 8.9549 27.0212 8 25.8541 8ZM19.488 8C18.3209 8 17.366 8.9549 17.366 10.122C17.366 11.2891 18.3209 12.244 19.488 12.244C20.6551 12.244 21.61 11.2891 21.61 10.122C21.61 8.9549 20.6551 8 19.488 8Z" fill="#CDCECF"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 729 B |
Binary file not shown.
|
After Width: | Height: | Size: 50 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.9 KiB |
|
|
@ -0,0 +1,34 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 289 47" class="design-iconfont" width="128" height="20.81660899653979">
|
||||
<path d="M1.4341 40.2328L2.27375 37.2781L3.02838 37.4056L2.42255 39.4994H4.28254C4.49511 38.6704 4.66517 37.8095 4.79271 36.8954L5.56859 36.9911C5.43042 37.8839 5.26037 38.7129 5.06905 39.4994H10.0432V40.2328H4.86711C4.73957 40.6579 4.61203 41.0618 4.46323 41.4445H8.81029V42.1034C8.52332 43.0175 7.94938 43.8465 7.07784 44.5905C7.93875 45.1007 8.99098 45.5683 10.2239 45.9935L9.83063 46.7056C8.47018 46.206 7.34356 45.664 6.45076 45.0794C5.57922 45.6959 4.49511 46.2485 3.20906 46.7481L2.80518 46.036C3.99557 45.6002 4.98403 45.1219 5.78116 44.6011C4.95214 43.9634 4.36757 43.2726 4.01683 42.5286C3.24095 44.2079 2.24187 45.5364 1.03022 46.5249L0.636963 45.8234C2.18873 44.463 3.32598 42.603 4.06997 40.2328H1.4341ZM4.59077 42.1459C4.95214 42.8687 5.55796 43.5383 6.40825 44.1547C7.19476 43.5383 7.73681 42.8687 8.03441 42.1459H4.59077ZM7.35418 36.9805C8.11944 37.565 8.74652 38.1496 9.25669 38.7342L8.71463 39.2762C8.26824 38.7129 7.64115 38.1177 6.84402 37.48L7.35418 36.9805Z" fill="#A1A9C5"></path>
|
||||
<path d="M16.4522 39.7651H17.1856V41.0618H20.1828V44.633C20.1828 45.292 19.8427 45.6321 19.1837 45.6321H18.1846L17.9933 44.92L18.9393 44.9412C19.2794 44.9412 19.4494 44.7818 19.4494 44.4736V41.7739H17.1856V46.7162H16.4522V41.7739H14.1777V45.7065H13.4443V41.6358C12.9129 42.1778 12.339 42.688 11.7119 43.1663L11.223 42.5286C12.5728 41.5295 13.6356 40.3922 14.4115 39.0956H11.5737V38.3516H14.8154C15.0492 37.8839 15.2405 37.4162 15.4 36.9273L16.1759 37.023C16.0271 37.4906 15.857 37.937 15.6657 38.3516H20.8205V39.0956H15.2937C14.9111 39.797 14.4647 40.456 13.9545 41.0618H16.4522V39.7651Z" fill="#A1A9C5"></path>
|
||||
<path d="M28.218 36.9911H29.0045V40.2009C29.8866 40.8493 30.7794 41.5826 31.6935 42.401L31.2258 43.1025C30.3543 42.231 29.6209 41.5401 29.0045 41.0512V46.7056H28.218V36.9911ZM23.924 41.2106C24.5192 41.5295 25.0613 41.9015 25.5502 42.3266C26.0391 41.3913 26.3686 40.3497 26.528 39.2125H24.4236C23.9134 40.4241 23.2226 41.4126 22.3723 42.1991L21.8515 41.5507C23.0631 40.4241 23.8922 38.8936 24.3173 36.9805L25.0825 37.108C24.9763 37.5863 24.8487 38.0433 24.6999 38.4791H27.2826V39.1487C26.9213 42.3691 25.3695 44.8031 22.6061 46.4505L22.0853 45.8021C23.4139 45.0369 24.4555 44.0803 25.1995 42.9324C24.6468 42.4648 24.0835 42.0822 23.5202 41.8058L23.924 41.2106Z" fill="#A1A9C5"></path>
|
||||
<path d="M38.8146 40.2009V43.432H34.9777V45.3983C34.9777 45.6959 35.1584 45.8553 35.4985 45.8553H40.5683C40.8127 45.8447 40.9828 45.7384 41.0785 45.5364C41.1635 45.3664 41.2273 44.9412 41.2804 44.2823L42.0031 44.5161C41.9394 45.1751 41.865 45.6427 41.7693 45.9191C41.6099 46.3442 41.2804 46.5568 40.7915 46.578H35.2115C34.5419 46.578 34.2124 46.2698 34.2124 45.6746V40.2009H38.8146ZM34.9777 42.7305H38.0493V40.9024H34.9777V42.7305ZM35.2009 36.8742L35.9661 37.0442C35.8173 37.4056 35.6473 37.767 35.4772 38.1071H41.4079C41.4079 40.7961 41.3548 42.4542 41.2485 43.0919C41.1529 43.7721 40.7383 44.1122 40.005 44.1122C39.8774 44.1122 39.6542 44.1016 39.3354 44.0803L39.1547 43.3895C39.4417 43.4107 39.6861 43.432 39.8987 43.432C40.2494 43.432 40.4514 43.2194 40.5045 42.7943C40.5683 42.3691 40.6108 41.0512 40.6321 38.8405H35.0734C34.5419 39.712 33.9467 40.4773 33.2771 41.1256L32.7457 40.4879C33.7448 39.5738 34.5632 38.3622 35.2009 36.8742Z" fill="#A1A9C5"></path>
|
||||
<path d="M61.018 42.0184H70.4348V42.6774H65.9496L65.5882 43.4426H69.7227V45.7703C69.7227 46.3867 69.4039 46.7056 68.7768 46.7056H68.0222L67.8521 46.0466L68.5642 46.0785C68.8406 46.0785 68.9787 45.9191 68.9787 45.6108V44.1016H67.2675V46.6205H66.5342V44.1016H64.9611V46.6205H64.2278V44.1016H62.6335V46.7481H61.9108V43.4426H64.8123L65.1737 42.6774H61.018V42.0184ZM61.6663 37.3312H69.7971V37.9583H66.0984V38.6279H70.1797V40.8174H69.4464V39.2337H66.0984V41.5826H65.3544V39.2337H62.0064V40.8174H61.2731V38.6279H65.3544V37.9583H61.6663V37.3312ZM62.5804 39.8289H64.7911V40.3391H62.5804V39.8289ZM62.5804 40.8918H64.7911V41.4019H62.5804V40.8918ZM66.6511 39.8289H68.8512V40.3391H66.6511V39.8289ZM66.6617 40.8918H68.8831V41.4019H66.6617V40.8918Z" fill="#A1A9C5"></path>
|
||||
<path d="M71.8059 38.9255H76.0361V36.938H76.8226V38.9255H79.2246C78.8314 38.4685 78.3106 37.9902 77.6729 37.48L78.1724 37.0124C78.8101 37.48 79.3415 37.9583 79.7667 38.426L79.2671 38.9255H80.8827V39.6589H76.8226V40.2753C77.1095 40.9237 77.4603 41.5401 77.8748 42.114C78.6294 41.5401 79.2778 40.8918 79.8198 40.169L80.3831 40.6686C79.7985 41.4232 79.0971 42.0822 78.2787 42.6455C79.0758 43.6339 80.0643 44.5055 81.2334 45.2495L80.702 45.8765C78.9802 44.6861 77.6941 43.2407 76.8226 41.5295V45.664C76.8226 46.3229 76.5037 46.6524 75.866 46.6524H74.4312L74.2717 45.9191C74.7394 45.9509 75.1751 45.9722 75.6003 45.9722C75.8873 45.9722 76.0361 45.8021 76.0361 45.4727V42.5711C74.9201 43.9315 73.6128 45.0794 72.1141 45.9935L71.6996 45.3026C73.3364 44.4098 74.7819 43.1982 76.0361 41.6464V39.6589H71.8059V38.9255ZM72.8369 40.3922C73.5596 41.0299 74.1654 41.6783 74.6543 42.316L74.1229 42.8368C73.6872 42.231 73.0813 41.5826 72.3054 40.8918L72.8369 40.3922Z" fill="#A1A9C5"></path>
|
||||
<path d="M86.739 39.0318H89.8212V36.9486H90.5865V39.0318H91.7663V39.7651H90.5865V45.6108C90.5865 46.3229 90.2145 46.6843 89.4918 46.6843H87.8231L87.6637 45.9297C88.2163 45.9616 88.7371 45.9828 89.226 45.9828C89.6193 45.9828 89.8212 45.7915 89.8212 45.4195V39.7651H86.739V39.0318ZM82.934 39.7226C83.6036 40.4454 84.22 41.1787 84.794 41.9015C85.1872 40.9449 85.421 39.9033 85.4954 38.7767H82.5832V38.0327H86.1863V38.596C86.1331 40.0415 85.8355 41.3594 85.2829 42.5392C85.7293 43.1344 86.1438 43.7402 86.5158 44.3354L85.9631 44.8881C85.6442 44.3567 85.2935 43.8252 84.9109 43.2832C84.3263 44.3035 83.5398 45.2176 82.562 46.0253L82.1156 45.3557C83.1147 44.5905 83.8905 43.6871 84.4432 42.6455C83.848 41.8483 83.1678 41.0299 82.4238 40.2009L82.934 39.7226ZM87.3129 41.0193C88.025 41.8909 88.5777 42.6667 88.9603 43.347L88.3545 43.7721C87.9294 43.0387 87.3873 42.2629 86.7283 41.4445L87.3129 41.0193Z" fill="#A1A9C5"></path>
|
||||
<path d="M97.9202 38.7661C98.1965 39.2444 98.441 39.7651 98.6748 40.3391H99.7164C100.014 39.8077 100.258 39.2444 100.471 38.6492L101.194 38.9042C100.992 39.4357 100.769 39.9139 100.524 40.3391H102.246V41.0725H96.3153V40.3391H97.9414C97.7289 39.8714 97.5163 39.4463 97.2931 39.0637L97.9202 38.7661ZM99.3231 36.9061C99.44 37.2037 99.557 37.5438 99.6739 37.9158H102.055V38.6173H96.5597V37.9158H98.898C98.7811 37.5969 98.6535 37.2993 98.526 37.0336L99.3231 36.9061ZM94.0195 46.6205H93.0948L92.9354 45.8765C93.2224 45.8978 93.4987 45.9191 93.7538 45.9191C94.0301 45.9191 94.1789 45.7809 94.1789 45.5045V42.8899C93.7538 43.06 93.318 43.2194 92.8823 43.3576L92.6909 42.5923C93.1905 42.4648 93.69 42.3054 94.1789 42.114V39.7439H92.8823V39.0105H94.1789V37.0017H94.9654V39.0105H95.8476V39.7439H94.9654V41.7846C95.263 41.6358 95.5606 41.487 95.8582 41.3275V42.1034C95.5606 42.2628 95.263 42.4116 94.9654 42.5498V45.6959C94.9654 46.3123 94.6466 46.6205 94.0195 46.6205ZM98.3878 41.3701L99.1212 41.4551C99.0149 41.7421 98.898 42.0184 98.7705 42.2841H102.416V43.0281H101.247C101.087 43.8146 100.758 44.4842 100.258 45.0263C100.981 45.3664 101.683 45.7277 102.352 46.1104L101.938 46.7268C101.3 46.3336 100.567 45.9403 99.7164 45.5364C99.0149 46.0466 97.8989 46.4611 96.3684 46.7587L96.0708 46.0679C97.3037 45.8447 98.2603 45.5471 98.9192 45.1644C98.2709 44.8668 97.5801 44.5799 96.8361 44.2823C97.123 43.8465 97.3781 43.432 97.6013 43.0281H96.1771V42.2841H97.9946C98.1434 41.9653 98.2709 41.6677 98.3878 41.3701ZM100.524 43.0281H98.3772C98.1859 43.3576 97.9839 43.6764 97.7714 43.974C98.3878 44.2079 98.983 44.4523 99.557 44.7074C100.035 44.261 100.354 43.7083 100.524 43.0281Z" fill="#A1A9C5"></path>
|
||||
<path d="M125.661 36.9592H126.214C127.564 38.5216 129.126 39.7545 130.89 40.6473L130.476 41.3807C128.701 40.4241 127.192 39.1806 125.937 37.6501C124.779 39.0956 123.248 40.3391 121.356 41.4019L120.953 40.6686C122.844 39.6695 124.407 38.4366 125.661 36.9592ZM129.296 42.4223V46.7056H128.552V46.0679H123.323V46.7056H122.579V42.4223H129.296ZM123.323 45.3345H128.552V43.145H123.323V45.3345ZM123.174 40.3391H128.701V41.0725H123.174V40.3391Z" fill="#A1A9C5"></path>
|
||||
<path d="M139.903 46.6737H138.49L138.277 45.9084L139.659 45.9403C139.924 45.9403 140.063 45.7809 140.063 45.462V38.1284H133.069V46.7056H132.304V37.3844H140.828V45.6321C140.828 46.3229 140.52 46.6737 139.903 46.6737ZM133.845 39.3506H139.297V40.0627H133.845V39.3506ZM134.44 41.2106H138.702V44.633H134.44V41.2106ZM137.958 43.9528V41.9015H135.184V43.9528H137.958Z" fill="#A1A9C5"></path>
|
||||
<path d="M149.681 43.06L150.425 43.2619C150.149 44.1441 149.809 44.9412 149.405 45.6427H151.69V46.3548H142.72V45.6427H148.587C149.001 44.92 149.363 44.0591 149.681 43.06ZM144.601 43.1875C144.909 43.7615 145.186 44.4311 145.43 45.1751L144.739 45.3557C144.527 44.6755 144.25 44.0272 143.91 43.4107L144.601 43.1875ZM147.056 42.975C147.301 43.5914 147.524 44.2929 147.715 45.09L147.035 45.2707C146.854 44.548 146.631 43.8571 146.355 43.1982L147.056 42.975ZM144.442 41.9546H149.958V42.6348H144.442V41.9546ZM144.016 38.5641C143.74 39.0956 143.432 39.5845 143.081 40.0309L142.422 39.6163C143.081 38.8086 143.559 37.9158 143.857 36.938L144.601 37.0974C144.516 37.3737 144.42 37.6288 144.325 37.8839H147.12V38.5641H145.589C145.76 38.9361 145.908 39.2869 146.015 39.6057L145.313 39.8608C145.175 39.4144 145.016 38.9786 144.824 38.5641H144.016ZM148.491 38.5641C148.3 38.9361 148.098 39.2869 147.875 39.6057L147.226 39.1912C147.726 38.511 148.087 37.767 148.31 36.938L149.044 37.0974C148.959 37.3737 148.874 37.6288 148.789 37.8839H151.892V38.5641H150.202C150.436 38.968 150.617 39.34 150.755 39.7014L150.053 39.9565C149.862 39.4782 149.65 39.0105 149.416 38.5641H148.491ZM146.95 39.6163H147.439C148.757 40.5835 150.287 41.3488 152.02 41.9015L151.648 42.5604C149.905 41.9653 148.427 41.2 147.194 40.2434C146.068 41.1362 144.58 41.9015 142.73 42.5498L142.369 41.8909C144.197 41.2744 145.728 40.5198 146.95 39.6163Z" fill="#A1A9C5"></path>
|
||||
<path d="M154.039 37.3631H161.564V39.3825H157.855V40.0734H160.119V40.6898H157.855V41.4551H159.215C160.044 40.9449 160.767 40.3497 161.373 39.6695L162 39.999C161.5 40.5304 160.926 41.0193 160.289 41.4551H162.531V42.114H159.194C158.641 42.401 158.067 42.6561 157.451 42.8899H161.192V46.7906H160.438V46.3123H155.92V46.7906H155.166V43.5808C154.634 43.7083 154.082 43.8146 153.518 43.9209L153.104 43.2832C154.953 43.0919 156.558 42.6986 157.929 42.114H153.168V41.4551H157.111V40.6898H154.326V40.0734H157.111V39.3825H154.039V37.3631ZM160.831 38.8192V37.937H159.268V38.8192H160.831ZM158.578 38.8192V37.937H157.047V38.8192H158.578ZM156.356 38.8192V37.937H154.773V38.8192H156.356ZM155.92 44.8881V45.6852H160.438V44.8881H155.92ZM160.438 44.3035V43.4851H155.92V44.3035H160.438Z" fill="#A1A9C5"></path>
|
||||
<path d="M182.024 37.6076H190.304V38.3516H188.529V41.1681H190.857V41.9015H188.529V46.6099H187.753V41.9015H184.682C184.586 42.9962 184.384 43.8996 184.065 44.6224C183.661 45.5152 182.992 46.206 182.056 46.6949L181.642 46.036C182.503 45.5471 183.109 44.8987 183.449 44.091C183.672 43.4745 183.821 42.7518 183.906 41.9015H181.45V41.1681H183.948C183.948 41.0299 183.959 40.9024 183.959 40.7961V38.3516H182.024V37.6076ZM184.745 38.3516V40.7961C184.745 40.9237 184.735 41.0512 184.735 41.1681H187.753V38.3516H184.745Z" fill="#A1A9C5"></path>
|
||||
<path d="M192.695 40.2328L193.535 37.2781L194.29 37.4056L193.684 39.4994H195.544C195.756 38.6704 195.927 37.8095 196.054 36.8954L196.83 36.9911C196.692 37.8839 196.522 38.7129 196.33 39.4994H201.305V40.2328H196.128C196.001 40.6579 195.873 41.0618 195.725 41.4445H200.072V42.1034C199.785 43.0175 199.211 43.8465 198.339 44.5905C199.2 45.1007 200.252 45.5683 201.485 45.9935L201.092 46.7056C199.732 46.206 198.605 45.664 197.712 45.0794C196.841 45.6959 195.756 46.2485 194.47 46.7481L194.067 46.036C195.257 45.6002 196.245 45.1219 197.043 44.6011C196.213 43.9634 195.629 43.2726 195.278 42.5286C194.502 44.2079 193.503 45.5364 192.292 46.5249L191.898 45.8234C193.45 44.463 194.587 42.603 195.331 40.2328H192.695ZM195.852 42.1459C196.214 42.8687 196.819 43.5383 197.67 44.1547C198.456 43.5383 198.998 42.8687 199.296 42.1459H195.852ZM198.616 36.9805C199.381 37.565 200.008 38.1496 200.518 38.7342L199.976 39.2762C199.53 38.7129 198.903 38.1177 198.105 37.48L198.616 36.9805Z" fill="#A1A9C5"></path>
|
||||
<path d="M206.257 36.938H207.012L203.25 46.7162H202.484L206.257 36.938Z" fill="#A1A9C5"></path>
|
||||
<path d="M213.825 38.9786C213.485 39.8289 213.06 40.5517 212.539 41.1256L212.05 40.5304C212.805 39.627 213.315 38.4153 213.58 36.8848L214.367 37.0336C214.282 37.4588 214.186 37.852 214.08 38.2346H217.247V38.9786H213.825ZM214.941 39.7014C215.515 40.4241 215.951 41.0512 216.248 41.5933L215.611 42.029C215.292 41.4445 214.867 40.7961 214.324 40.084L214.941 39.7014ZM210.828 36.938H211.604V42.1885H210.828V36.938ZM208.628 37.4588H209.382V41.7952H208.628V37.4588ZM216.376 42.7199V45.6746H217.513V46.3655H207.894V45.6746H209.085V42.7199H216.376ZM209.818 45.6746H211.232V43.4214H209.818V45.6746ZM211.965 45.6746H213.453V43.4214H211.965V45.6746ZM214.186 45.6746H215.642V43.4214H214.186V45.6746Z" fill="#A1A9C5"></path>
|
||||
<path d="M220.585 36.9698H221.276V37.4906H223.114V38.0858H221.276V38.7554H223.465V39.3932H221.435V41.6464H220.733V39.3932H218.767V38.7554H220.585V36.9698ZM226.685 41.9227V46.7375H225.941V46.3017H220.84V46.7481H220.106V41.9227H226.685ZM220.84 45.7065H225.941V45.0263H220.84V45.7065ZM220.84 44.4736H225.941V43.7615H220.84V44.4736ZM220.84 43.2088H225.941V42.5179H220.84V43.2088ZM222.551 39.7333C222.827 40.2009 223.072 40.7005 223.274 41.2319L222.721 41.487C222.487 40.9024 222.232 40.3816 221.956 39.9246L222.551 39.7333ZM224.092 38.2984H223.603V37.6288H227.557V38.2665C227.291 39.0424 226.866 39.712 226.292 40.2753C226.77 40.5942 227.366 40.8811 228.088 41.1362L227.748 41.7633C226.951 41.4763 226.282 41.1362 225.75 40.7323C225.219 41.115 224.592 41.4445 223.88 41.6995L223.55 41.0618C224.198 40.8493 224.751 40.5835 225.208 40.2647C224.645 39.6907 224.273 39.0424 224.092 38.2984ZM225.729 39.8502C226.207 39.4038 226.558 38.883 226.781 38.2984H224.772C224.9 38.8724 225.219 39.3825 225.729 39.8502ZM219.628 39.7226L220.266 39.8502C220.011 40.6048 219.671 41.2531 219.224 41.8058L218.672 41.4551C219.097 40.9343 219.416 40.3603 219.628 39.7226Z" fill="#A1A9C5"></path>
|
||||
<path d="M251.727 44.5905C250.866 45.5045 249.463 46.2167 247.518 46.7268L247.093 46.0785C249.07 45.5683 250.451 44.8775 251.238 44.0272C251.365 43.8784 251.472 43.719 251.578 43.5489H247.188V42.8262H251.95C252.226 42.1672 252.375 41.4126 252.407 40.5729V39.3188H253.151V40.5729C253.119 41.4126 252.991 42.1672 252.758 42.8262H256.169V43.5489H252.439C252.343 43.719 252.247 43.8784 252.152 44.0272C253.661 44.6224 255.053 45.3132 256.308 46.121L255.893 46.78C254.533 45.8659 253.151 45.1432 251.727 44.5905ZM248.602 40.7749C249.378 41.1043 250.09 41.4976 250.728 41.944L250.334 42.5498C249.654 42.0396 248.942 41.6358 248.219 41.3488L248.602 40.7749ZM249.558 39.255C250.356 39.5845 251.089 39.9883 251.748 40.4666L251.355 41.0725C250.643 40.541 249.909 40.1265 249.165 39.8289L249.558 39.255ZM255.989 38.0114V40.0521H255.245V38.7236H248.081V40.0521H247.337V38.0114H251.376C251.248 37.6501 251.1 37.3312 250.94 37.0336L251.727 36.9061C251.865 37.2249 252.003 37.5969 252.141 38.0114H255.989Z" fill="#A1A9C5"></path>
|
||||
<path d="M257.604 38.4685H259.294C259.092 37.9477 258.869 37.4694 258.625 37.0442L259.4 36.9061C259.613 37.3631 259.826 37.8839 260.028 38.4685H261.314V39.2125H259.156V40.6898H261.058C261.058 43.3895 261.005 45.0475 260.92 45.664C260.825 46.3017 260.4 46.6205 259.645 46.6205C259.549 46.6205 259.379 46.6099 259.145 46.5887L258.975 45.8978C259.188 45.9191 259.369 45.9403 259.539 45.9403C259.921 45.9403 260.155 45.749 260.229 45.3664C260.293 44.9412 260.336 43.6233 260.346 41.3913H259.145C259.092 43.7934 258.699 45.5683 257.966 46.6949L257.402 46.1954C258.082 45.1219 258.423 43.4001 258.433 41.0299V39.2125H257.604V38.4685ZM262.791 38.8511C262.451 39.627 262.058 40.3072 261.611 40.9024L261.112 40.3072C261.771 39.4463 262.302 38.3197 262.727 36.9273L263.439 37.0868C263.322 37.4481 263.205 37.7989 263.078 38.139H266.904V38.8511H262.791ZM266.5 40.2647C266.5 42.2416 266.458 43.432 266.373 43.8465C266.288 44.261 265.916 44.4736 265.278 44.4736H265.14L264.949 43.8146C265.119 43.8146 265.278 43.8252 265.406 43.8252C265.597 43.8252 265.703 43.7083 265.746 43.4958C265.788 43.2938 265.809 42.5392 265.809 41.2319L264.736 41.6145V45.1219H264.034V41.8696L262.95 42.2629V45.2813C262.95 45.7384 263.12 45.9722 263.471 45.9722H265.597C265.873 45.9722 266.075 45.9084 266.203 45.8021C266.351 45.664 266.447 45.2495 266.5 44.5692L267.159 44.7818C267.074 45.664 266.915 46.206 266.681 46.3973C266.479 46.5568 266.16 46.6418 265.724 46.6418H263.248C262.589 46.6418 262.27 46.2273 262.27 45.4195V42.5073L261.441 42.8049V42.114L262.27 41.8058V40.3178H262.95V41.5614L264.034 41.1681V39.4569H264.736V40.913L266.5 40.2647Z" fill="#A1A9C5"></path>
|
||||
<path d="M268.233 38.2346H272.622C272.431 37.7989 272.218 37.4056 271.985 37.0442L272.835 36.8954C273.047 37.2993 273.26 37.7457 273.451 38.2346H277.639V38.968H268.233V38.2346ZM274.61 39.2869C275.79 40.2222 276.778 41.1469 277.575 42.0822L277.012 42.6455C276.31 41.7527 275.333 40.8067 274.089 39.7864L274.61 39.2869ZM274.716 41.2744L275.418 41.5826C274.907 42.5604 274.291 43.4001 273.558 44.1122C274.705 44.9412 276.098 45.5577 277.756 45.9828L277.278 46.6949C275.556 46.206 274.121 45.5258 272.973 44.633C271.783 45.5896 270.337 46.2911 268.637 46.7375L268.169 46.036C269.848 45.6108 271.241 44.9731 272.357 44.1228C271.581 43.4214 270.943 42.6136 270.443 41.7208L271.102 41.3488C271.57 42.2203 272.187 42.975 272.941 43.6233C273.664 42.9431 274.259 42.1672 274.716 41.2744ZM271.187 39.2975L271.74 39.7864C270.932 40.8386 269.933 41.7633 268.743 42.5498L268.254 41.9015C269.412 41.1575 270.39 40.2966 271.187 39.2975Z" fill="#A1A9C5"></path>
|
||||
<path d="M281.061 36.8742L281.773 37.2143C281.54 37.9583 281.242 38.6492 280.902 39.3081V46.7375H280.137V40.5729C279.754 41.1362 279.318 41.6677 278.84 42.1778L278.606 41.3807C279.733 40.0734 280.551 38.5748 281.061 36.8742ZM281.997 39.2762H286.067V36.9911H286.833V39.2762H288.363V40.0202H286.833V45.5683C286.833 46.2911 286.493 46.6524 285.834 46.6524H284.292L284.122 45.8978C284.622 45.9297 285.1 45.9509 285.568 45.9509C285.897 45.9509 286.067 45.7596 286.067 45.377V40.0202H281.997V39.2762ZM282.974 41.1787C283.782 42.1353 284.409 42.975 284.845 43.6871L284.197 44.1441C283.74 43.3682 283.123 42.5073 282.347 41.5614L282.974 41.1787Z" fill="#A1A9C5"></path>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.585 11.1537H13.5198V10.6223H14.585V11.1537ZM18.8458 11.1537H16.7154V10.6223H18.8458V11.1537ZM23.1066 11.1537H20.9762V10.6223H23.1066V11.1537ZM27.3674 11.1537H25.237V10.6223H27.3674V11.1537ZM31.6282 11.1537H29.4978V10.6223H31.6282V11.1537ZM35.889 11.1537H33.7586V10.6223H35.889V11.1537ZM40.1498 11.1537H38.0194V10.6223H40.1498V11.1537ZM44.4106 11.1537H42.2802V10.6223H44.4106V11.1537ZM48.6714 11.1537H46.541V10.6223H48.6714V11.1537ZM52.9322 11.1537H50.8018V10.6223H52.9322V11.1537ZM57.193 11.1537H55.0626V10.6223H57.193V11.1537ZM61.4538 11.1537H59.3234V10.6223H61.4538V11.1537ZM65.7146 11.1537H63.5842V10.6223H65.7146V11.1537ZM69.9754 11.1537H67.845V10.6223H69.9754V11.1537ZM74.2362 11.1537H72.1058V10.6223H74.2362V11.1537ZM78.497 11.1537H76.3667V10.6223H78.497V11.1537ZM82.7579 11.1537H80.6275V10.6223H82.7579V11.1537ZM87.0187 11.1537H84.8883V10.6223H87.0187V11.1537ZM91.2795 11.1537H89.1491V10.6223H91.2795V11.1537ZM95.5403 11.1537H93.4099V10.6223H95.5403V11.1537ZM99.8011 11.1537H97.6707V10.6223H99.8011V11.1537ZM104.062 11.1537H101.932V10.6223H104.062V11.1537ZM108.323 11.1537H106.192V10.6223H108.323V11.1537ZM112.584 11.1537H110.453V10.6223H112.584V11.1537ZM116.844 11.1537H114.714V10.6223H116.844V11.1537ZM121.105 11.1537H118.975V10.6223H121.105V11.1537ZM125.366 11.1537H123.236V10.6223H125.366V11.1537ZM129.627 11.1537H127.496V10.6223H129.627V11.1537ZM133.888 11.1537H131.757V10.6223H133.888V11.1537ZM138.148 11.1537H136.018V10.6223H138.148V11.1537ZM142.409 11.1537H140.279V10.6223H142.409V11.1537ZM146.67 11.1537H144.54V10.6223H146.67V11.1537ZM150.931 11.1537H148.8V10.6223H150.931V11.1537ZM155.192 11.1537H153.061V10.6223H155.192V11.1537ZM159.452 11.1537H157.322V10.6223H159.452V11.1537ZM163.713 11.1537H161.583V10.6223H163.713V11.1537ZM167.974 11.1537H165.844V10.6223H167.974V11.1537ZM172.235 11.1537H170.105V10.6223H172.235V11.1537ZM176.496 11.1537H174.365V10.6223H176.496V11.1537ZM180.757 11.1537H178.626V10.6223H180.757V11.1537ZM185.017 11.1537H182.887V10.6223H185.017V11.1537ZM189.278 11.1537H187.148V10.6223H189.278V11.1537ZM193.539 11.1537H191.409V10.6223H193.539V11.1537ZM197.8 11.1537H195.669V10.6223H197.8V11.1537ZM202.061 11.1537H199.93V10.6223H202.061V11.1537ZM206.321 11.1537H204.191V10.6223H206.321V11.1537ZM210.582 11.1537H208.452V10.6223H210.582V11.1537ZM214.843 11.1537H212.713V10.6223H214.843V11.1537ZM219.104 11.1537H216.973V10.6223H219.104V11.1537ZM223.365 11.1537H221.234V10.6223H223.365V11.1537ZM227.625 11.1537H225.495V10.6223H227.625V11.1537ZM231.886 11.1537H229.756V10.6223H231.886V11.1537ZM236.147 11.1537H234.017V10.6223H236.147V11.1537ZM240.408 11.1537H238.277V10.6223H240.408V11.1537ZM244.669 11.1537H242.538V10.6223H244.669V11.1537ZM248.93 11.1537H246.799V10.6223H248.93V11.1537ZM253.19 11.1537H251.06V10.6223H253.19V11.1537ZM257.451 11.1537H255.321V10.6223H257.451V11.1537ZM261.712 11.1537H259.582V10.6223H261.712V11.1537ZM265.973 11.1537H263.842V10.6223H265.973V11.1537ZM270.234 11.1537H268.103V10.6223H270.234V11.1537ZM273.429 11.1537H272.364V10.6223H273.429V11.1537Z" fill="#A1A9C5"></path>
|
||||
<path d="M34.7768 10.888C34.7768 16.758 30.0183 21.5166 24.1483 21.5166C18.2783 21.5166 13.5198 16.758 13.5198 10.888C13.5198 5.01807 18.2783 0.259521 24.1483 0.259521C30.0183 0.259521 34.7768 5.01807 34.7768 10.888Z" fill="#A1A9C5"></path>
|
||||
<path d="M24.4119 6.10945H25.632V16.7337H24.0101V8.05873C23.3703 8.6688 22.5519 9.1152 21.5698 9.39792V7.79089C22.046 7.67185 22.537 7.46353 23.0727 7.16593C23.6084 6.83857 24.0548 6.49633 24.4119 6.10945Z" fill="#fff"></path>
|
||||
<path d="M94.4397 10.888C94.4397 16.758 89.6812 21.5166 83.8112 21.5166C77.9413 21.5166 73.1827 16.758 73.1827 10.888C73.1827 5.01807 77.9413 0.259521 83.8112 0.259521C89.6812 0.259521 94.4397 5.01807 94.4397 10.888Z" fill="#A1A9C5"></path>
|
||||
<path d="M83.656 5.90114C84.6679 5.90114 85.516 6.18385 86.1707 6.77905C86.8106 7.37425 87.1379 8.13312 87.1379 9.07056C87.1379 9.99311 86.7808 10.8264 86.0963 11.5853C85.6797 12.0168 84.9506 12.5822 83.8941 13.2965C82.7484 14.0553 82.0639 14.7249 81.8407 15.3052H87.1528V16.7337H79.8319C79.8319 15.6772 80.1741 14.7547 80.8884 13.9512C81.2753 13.4899 82.0788 12.8501 83.284 12.0168C83.9983 11.5109 84.5042 11.1091 84.8018 10.7966C85.278 10.261 85.5309 9.68064 85.5309 9.05568C85.5309 8.46048 85.3672 8.01409 85.0399 7.71649C84.7125 7.41889 84.2215 7.27009 83.5965 7.27009C82.9269 7.27009 82.421 7.49329 82.0788 7.95457C81.7217 8.40096 81.5431 9.0408 81.5133 9.90383H79.8914C79.9063 8.71344 80.2485 7.76113 80.9181 7.04689C81.6026 6.27313 82.5252 5.90114 83.656 5.90114Z" fill="#fff"></path>
|
||||
<path d="M154.103 10.888C154.103 16.758 149.344 21.5166 143.474 21.5166C137.604 21.5166 132.846 16.758 132.846 10.888C132.846 5.01807 137.604 0.259521 143.474 0.259521C149.344 0.259521 154.103 5.01807 154.103 10.888Z" fill="#A1A9C5"></path>
|
||||
<path d="M143.26 5.90114C144.331 5.90114 145.179 6.1541 145.834 6.67489C146.459 7.19569 146.786 7.90993 146.786 8.8176C146.786 9.97823 146.191 10.7669 145.03 11.1537C145.655 11.3472 146.132 11.6448 146.459 12.0317C146.816 12.4334 146.995 12.9542 146.995 13.5792C146.995 14.5612 146.652 15.3648 145.983 15.9897C145.268 16.6147 144.331 16.942 143.2 16.942C142.114 16.942 141.236 16.6593 140.581 16.1088C139.837 15.4838 139.421 14.5761 139.331 13.3857H140.968C140.998 14.1 141.221 14.6505 141.668 15.0374C142.054 15.3945 142.56 15.5731 143.185 15.5731C143.87 15.5731 144.42 15.3648 144.837 14.9779C145.194 14.6208 145.388 14.1893 145.388 13.6536C145.388 13.0286 145.194 12.5673 144.807 12.2697C144.45 11.9721 143.914 11.8233 143.215 11.8233H142.441V10.6032H143.2C143.855 10.6032 144.346 10.4544 144.673 10.1717C145.001 9.88896 145.179 9.47232 145.179 8.93664C145.179 8.40096 145.016 7.99921 144.718 7.71649C144.391 7.41889 143.9 7.28497 143.275 7.28497C142.635 7.28497 142.129 7.44865 141.772 7.77601C141.415 8.10336 141.191 8.5944 141.132 9.24912H139.54C139.629 8.19265 140.016 7.37425 140.715 6.77905C141.37 6.18385 142.218 5.90114 143.26 5.90114Z" fill="#fff"></path>
|
||||
<path d="M213.766 10.888C213.766 16.758 209.007 21.5166 203.137 21.5166C197.267 21.5166 192.509 16.758 192.509 10.888C192.509 5.01807 197.267 0.259521 203.137 0.259521C209.007 0.259521 213.766 5.01807 213.766 10.888Z" fill="#A1A9C5"></path>
|
||||
<path d="M203.89 6.10945H205.378V13.1328H206.985V14.4273H205.378V16.7337H203.83V14.4273H198.652V12.8947L203.89 6.10945ZM203.786 8.16288L199.976 13.1328H203.83V8.16288H203.786Z" fill="#fff"></path>
|
||||
<path d="M273.429 10.888C273.429 16.758 268.67 21.5166 262.8 21.5166C256.93 21.5166 252.172 16.758 252.172 10.888C252.172 5.01807 256.93 0.259521 262.8 0.259521C268.67 0.259521 273.429 5.01807 273.429 10.888Z" fill="#A1A9C5"></path>
|
||||
<path d="M259.431 6.10945H265.829V7.53793H260.74L260.428 10.6032H260.473C260.8 10.261 261.172 10.0229 261.603 9.87408C261.99 9.7104 262.437 9.636 262.913 9.636C263.91 9.636 264.728 9.96336 265.353 10.6181C265.978 11.2728 266.306 12.1656 266.306 13.3113C266.306 14.4125 265.889 15.3052 265.085 16.0046C264.326 16.6296 263.419 16.942 262.362 16.942C261.41 16.942 260.592 16.6742 259.907 16.1534C259.148 15.588 258.732 14.7993 258.657 13.8173H260.249C260.309 14.4125 260.547 14.8737 260.949 15.1713C261.306 15.4392 261.782 15.5731 262.377 15.5731C263.032 15.5731 263.582 15.3648 264.029 14.963C264.475 14.5464 264.698 14.0107 264.698 13.3262C264.698 12.5822 264.505 12.0019 264.118 11.5853C263.731 11.1686 263.196 10.9603 262.481 10.9603C262.005 10.9603 261.603 11.0347 261.246 11.2133C260.859 11.3918 260.577 11.6745 260.368 12.0614H258.851L259.431 6.10945Z" fill="#fff"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 26 KiB |
|
|
@ -0,0 +1,12 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 31 31" class="design-iconfont" width="128" height="128">
|
||||
<g clip-path="url(#3vvfostr5__clip0_344_3121)" fill="#fff">
|
||||
<path d="M14.86 15.047H3.39046C1.92826 15.047 0.74292 13.8616 0.74292 12.4006V3.57741C0.74292 2.11521 1.92826 0.929871 3.39046 0.929871H12.2136C13.6747 0.929871 14.86 2.11521 14.86 3.57741V15.047ZM4.27219 11.5177H11.3307V4.45915H4.27219V11.5177ZM28.0954 15.047H16.6247V3.57741C16.6247 2.11521 17.8112 0.929871 19.2722 0.929871H28.0954C29.5564 0.929871 30.7429 2.11521 30.7429 3.57741V12.4006C30.7429 13.8616 29.5564 15.047 28.0954 15.047ZM20.1539 11.5177H27.2125V4.45915H20.1539V11.5177ZM12.2136 30.9299H3.39046C1.92826 30.9299 0.74292 29.7434 0.74292 28.2823V19.4591C0.74292 17.9981 1.92826 16.8116 3.39046 16.8116H14.8612V28.2823C14.86 29.7434 13.6747 30.9299 12.2136 30.9299ZM4.27219 27.4006H11.3307V20.342H4.27219V27.4006ZM16.6247 16.8116H21.9186V22.1055H16.6247V16.8116Z"></path>
|
||||
<path d="M26.3308 21.2238H21.0369V26.5177H26.3308V21.2238Z"></path>
|
||||
<path d="M25.4491 16.8116H30.743V22.1055H25.4491V16.8116ZM16.6248 25.636H21.9187V30.9299H16.6248V25.636ZM25.4491 25.636H30.743V30.9299H25.4491V25.636Z"></path>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="3vvfostr5__clip0_344_3121">
|
||||
<path fill="#fff" transform="translate(.74292 .929871)" d="M0 0H30V30H0z"></path>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
|
|
@ -0,0 +1,11 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 31 31" class="design-iconfont" width="128" height="128">
|
||||
<g clip-path="url(#bvbul47hf__clip0_344_3127)" fill="#fff">
|
||||
<path d="M18.9652 12.4878C18.7361 12.2587 18.4898 12.0518 18.2385 11.8597C17.9798 11.6109 17.6251 11.4557 17.2359 11.4557C16.4377 11.4557 15.7898 12.1035 15.7898 12.9016C15.7898 13.2539 15.9179 13.579 16.1273 13.8303C16.2283 13.951 16.349 14.0544 16.4845 14.1382C16.62 14.2515 16.7555 14.3623 16.8787 14.4855L16.9969 14.6037C18.4947 16.0989 18.0488 18.6755 16.5486 20.1732L10.1583 26.5628C8.66056 28.058 6.22666 28.058 4.72888 26.5628L4.60817 26.4421C3.11039 24.9445 3.11039 22.5083 4.60817 21.0131L7.43129 18.1902C7.79342 17.902 8.02499 17.4586 8.02499 16.9611C8.02499 16.094 7.3229 15.392 6.45576 15.392C6.12812 15.392 5.82512 15.493 5.57384 15.6629C5.57384 15.6605 5.57138 15.6605 5.57138 15.658L5.54182 15.6851C5.43096 15.7639 5.32996 15.8575 5.24374 15.9634L2.31223 18.71C-0.446849 21.4713 -0.446849 25.984 2.31223 28.7404L2.43047 28.8586C5.18954 31.615 9.70014 31.615 12.4592 28.8586L18.8494 22.4689C21.6036 19.7101 21.8376 15.3599 19.0835 12.6036L18.9652 12.4878Z"></path>
|
||||
<path d="M28.1762 3.11511L28.0555 2.99687C25.2964 0.238023 20.7858 0.238023 18.0267 2.99687L11.639 9.38656C8.87991 12.1454 8.72964 16.1285 11.4862 18.8873L11.6045 19.0031C11.7301 19.1287 11.8607 19.247 11.9937 19.3603C12.0898 19.4687 12.2031 19.5598 12.3288 19.6312L12.3312 19.6337C12.5308 19.7495 12.7623 19.816 13.0111 19.816C13.7649 19.816 14.3759 19.2051 14.3759 18.4513C14.3759 18.2395 14.3266 18.0375 14.2404 17.8577C14.0606 17.4537 13.7231 17.2074 13.489 16.9734L13.3708 16.8576C11.873 15.36 12.4421 13.1849 13.9399 11.6872L20.3325 5.29755C21.8279 3.79989 24.2617 3.79989 25.7595 5.29755L25.8778 5.41579C27.3756 6.91345 27.3756 9.35207 25.8778 10.8473L23.062 13.6603C22.6802 13.9436 22.4314 14.3993 22.4314 14.9116C22.4314 15.7713 23.1286 16.4684 23.9883 16.4684C24.2888 16.4684 24.5672 16.3847 24.8037 16.2369C24.8062 16.2393 24.8062 16.2418 24.8086 16.2467L24.853 16.2073C24.9885 16.1162 25.1067 16.0078 25.2077 15.8797L28.1737 13.143C30.9328 10.3866 30.9328 5.87395 28.1762 3.11511Z"></path>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="bvbul47hf__clip0_344_3127">
|
||||
<path fill="#fff" transform="translate(.24292 .927734)" d="M0 0H30V30H0z"></path>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.3 KiB |
|
|
@ -0,0 +1,10 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 37 31" class="design-iconfont" width="128" height="107.24324324324324">
|
||||
<g clip-path="url(#fl4nuevnu__clip0_344_3117)">
|
||||
<path d="M25.0447 10.006C25.4663 10.006 25.8857 10.0446 26.3051 10.0811C25.1774 4.84264 19.5282 0.927734 13.0937 0.927734C5.8974 0.953476 0 5.82941 0 12.0203C0 15.5899 1.96651 18.533 5.22977 20.8133L3.91163 24.7239L8.49517 22.4479C10.1364 22.7697 11.4546 23.0915 13.0766 23.0915C13.4981 23.0915 13.8983 23.0722 14.2963 23.0357C14.0374 22.1476 13.9026 21.2252 13.8961 20.2985C13.9154 14.6224 18.822 10.0082 25.0447 10.0082V10.006ZM18.0003 6.47725C18.9954 6.47725 19.6416 7.1208 19.6416 8.10971C19.6416 9.07503 18.9932 9.74218 18.0003 9.74218C17.0267 9.74218 16.0338 9.09649 16.0338 8.10971C16.0338 7.1208 17.0267 6.47725 18.0003 6.47725ZM8.83541 9.74432C7.86392 9.74432 6.87103 9.09863 6.87103 8.11186C6.87103 7.12294 7.86606 6.4794 8.83541 6.4794C9.80903 6.4794 10.4767 7.12294 10.4767 8.11186C10.4788 9.07718 9.83043 9.74432 8.83541 9.74432ZM37 20.1633C37 14.9613 31.7681 10.7075 25.8664 10.7075C19.6437 10.7075 14.7371 14.9592 14.7371 20.1633C14.7371 25.3847 19.6437 29.6213 25.8664 29.6213C27.1653 29.6213 28.4834 29.2996 29.7994 28.9756L33.3879 30.9299L32.3951 27.6821C35.0335 25.6893 37 23.085 37 20.1633ZM22.2608 18.5287C21.6124 18.5287 20.9426 17.8852 20.9426 17.218C20.9426 16.5745 21.6124 15.9074 22.2608 15.9074C23.2558 15.9074 23.902 16.553 23.902 17.218C23.902 17.8852 23.2537 18.5287 22.2608 18.5287ZM29.4592 18.5287C28.8087 18.5287 28.1603 17.8852 28.1603 17.218C28.1603 16.5745 28.8087 15.9074 29.4592 15.9074C30.4521 15.9074 31.1005 16.553 31.1005 17.218C31.1005 17.8852 30.4499 18.5287 29.4592 18.5287Z" fill="#fff"></path>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="fl4nuevnu__clip0_344_3117">
|
||||
<path fill="#fff" transform="translate(0 .927734)" d="M0 0H37V30H0z"></path>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.9 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 17 17" class="design-iconfont" width="128" height="128">
|
||||
<path d="M8.54948 0.733398C7.56459 0.733398 6.58935 0.927386 5.67943 1.30429C4.76951 1.68119 3.94274 2.23362 3.24632 2.93004C1.83984 4.33652 1.04968 6.24413 1.04968 8.2332M8.54953 3.61791C7.32549 3.61791 6.15158 4.10416 5.28605 4.96969C4.42052 5.83522 3.93427 7.00913 3.93427 8.23317M7.98413 15.2368C7.38599 15.622 6.67405 15.7908 5.96666 15.7152C5.25928 15.6397 4.59906 15.3243 4.09578 14.8215L3.65733 14.383C3.46285 14.1864 3.35378 13.9211 3.35378 13.6446C3.35378 13.3681 3.46285 13.1027 3.65733 12.9061L5.50343 11.0716C5.69804 10.8778 5.96148 10.769 6.2361 10.769C6.51072 10.769 6.77416 10.8778 6.96877 11.0716C7.16535 11.266 7.4307 11.3751 7.70722 11.3751C7.98373 11.3751 8.24908 11.266 8.44566 11.0716L11.3879 8.12934C11.5824 7.93277 11.6914 7.66742 11.6914 7.3909C11.6914 7.11439 11.5824 6.84903 11.3879 6.65246C11.1941 6.45785 11.0853 6.19441 11.0853 5.91979C11.0853 5.64517 11.1941 5.38173 11.3879 5.18712L13.1648 3.34101C13.3613 3.14654 13.6267 3.03746 13.9032 3.03746C14.1797 3.03746 14.4451 3.14654 14.6416 3.34101L15.0801 3.77946C15.5919 4.27564 15.9181 4.93235 16.0042 5.63999C16.0903 6.34763 15.9311 7.06339 15.5532 7.66782C13.5412 10.6548 10.9711 13.2249 7.98413 15.2368Z" stroke="#3887FD" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
|
|
@ -0,0 +1,6 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 26 22" class="design-iconfont" width="128" height="108.3076923076923">
|
||||
<path d="M19.5586 1.16399H6.15293C5.8437 1.17228 5.54081 1.25149 5.26875 1.39522C4.99668 1.53895 4.76309 1.74316 4.58685 1.99134L1.23358 6.52377C0.984588 6.86726 0.860237 7.28208 0.880264 7.70241C0.900291 8.12275 1.06355 8.52451 1.34413 8.84395L11.4002 20.157C11.5723 20.374 11.7929 20.5496 12.0452 20.6704C12.2975 20.7912 12.5748 20.854 12.8558 20.854C13.1368 20.854 13.4141 20.7912 13.6664 20.6704C13.9187 20.5496 14.1393 20.374 14.3113 20.157L24.3656 8.84395C24.6462 8.52451 24.8094 8.12275 24.8295 7.70241C24.8495 7.28208 24.7251 6.86726 24.4761 6.52377L21.1247 1.99134C20.9485 1.74316 20.7149 1.53895 20.4428 1.39522C20.1707 1.25149 19.8679 1.17228 19.5586 1.16399Z" stroke="#5799FD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"></path>
|
||||
<path d="M11.8978 1.146L7.40218 7.94465L12.8558 20.8045" stroke="#5799FD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"></path>
|
||||
<path d="M13.8691 1.146L18.3463 7.94465L12.8558 20.8045" stroke="#5799FD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"></path>
|
||||
<path d="M0.91671 7.94465H24.7949" stroke="#5799FD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 137 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
|
|
@ -0,0 +1,10 @@
|
|||
uni.addInterceptor({
|
||||
returnValue (res) {
|
||||
if (!(!!res && (typeof res === "object" || typeof res === "function") && typeof res.then === "function")) {
|
||||
return res;
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
res.then((res) => res[0] ? reject(res[0]) : resolve(res[1]));
|
||||
});
|
||||
},
|
||||
});
|
||||
|
|
@ -0,0 +1,76 @@
|
|||
/**
|
||||
* 这里是uni-app内置的常用样式变量
|
||||
*
|
||||
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
|
||||
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
|
||||
*
|
||||
*/
|
||||
|
||||
/**
|
||||
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
|
||||
*
|
||||
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
|
||||
*/
|
||||
|
||||
/* 颜色变量 */
|
||||
|
||||
/* 行为相关颜色 */
|
||||
$uni-color-primary: #007aff;
|
||||
$uni-color-success: #4cd964;
|
||||
$uni-color-warning: #f0ad4e;
|
||||
$uni-color-error: #dd524d;
|
||||
|
||||
/* 文字基本颜色 */
|
||||
$uni-text-color:#333;//基本色
|
||||
$uni-text-color-inverse:#fff;//反色
|
||||
$uni-text-color-grey:#999;//辅助灰色，如加载更多的提示信息
|
||||
$uni-text-color-placeholder: #808080;
|
||||
$uni-text-color-disable:#c0c0c0;
|
||||
|
||||
/* 背景颜色 */
|
||||
$uni-bg-color:#ffffff;
|
||||
$uni-bg-color-grey:#f8f8f8;
|
||||
$uni-bg-color-hover:#f1f1f1;//点击状态颜色
|
||||
$uni-bg-color-mask:rgba(0, 0, 0, 0.4);//遮罩颜色
|
||||
|
||||
/* 边框颜色 */
|
||||
$uni-border-color:#c8c7cc;
|
||||
|
||||
/* 尺寸变量 */
|
||||
|
||||
/* 文字尺寸 */
|
||||
$uni-font-size-sm:12px;
|
||||
$uni-font-size-base:14px;
|
||||
$uni-font-size-lg:16;
|
||||
|
||||
/* 图片尺寸 */
|
||||
$uni-img-size-sm:20px;
|
||||
$uni-img-size-base:26px;
|
||||
$uni-img-size-lg:40px;
|
||||
|
||||
/* Border Radius */
|
||||
$uni-border-radius-sm: 2px;
|
||||
$uni-border-radius-base: 3px;
|
||||
$uni-border-radius-lg: 6px;
|
||||
$uni-border-radius-circle: 50%;
|
||||
|
||||
/* 水平间距 */
|
||||
$uni-spacing-row-sm: 5px;
|
||||
$uni-spacing-row-base: 10px;
|
||||
$uni-spacing-row-lg: 15px;
|
||||
|
||||
/* 垂直间距 */
|
||||
$uni-spacing-col-sm: 4px;
|
||||
$uni-spacing-col-base: 8px;
|
||||
$uni-spacing-col-lg: 12px;
|
||||
|
||||
/* 透明度 */
|
||||
$uni-opacity-disabled: 0.3; // 组件禁用态的透明度
|
||||
|
||||
/* 文章场景相关 */
|
||||
$uni-color-title: #2C405A; // 文章标题颜色
|
||||
$uni-font-size-title:20px;
|
||||
$uni-color-subtitle: #555555; // 二级标题颜色
|
||||
$uni-font-size-subtitle:26px;
|
||||
$uni-color-paragraph: #3F536E; // 文章段落颜色
|
||||
$uni-font-size-paragraph:15px;
|
||||
|
|
@ -0,0 +1,140 @@
|
|||
## 2.2.24（2023-06-02）
|
||||
- 修复 部分情况修改时间，开始、结束时间显示异常的Bug [详情](https://ask.dcloud.net.cn/question/171146)
|
||||
- 优化 当前月可以选择上月、下月的日期
|
||||
## 2.2.23（2023-05-02）
|
||||
- 修复 部分情况修改时间，开始时间未更新 [详情](https://github.com/dcloudio/uni-ui/issues/737)
|
||||
- 修复 部分平台及设备第一次点击无法显示弹框
|
||||
- 修复 ios 日期格式未补零显示及使用异常 [详情](https://ask.dcloud.net.cn/question/162979)
|
||||
## 2.2.22（2023-03-30）
|
||||
- 修复 日历 picker 修改年月后，自动选中当月1日 [详情](https://ask.dcloud.net.cn/question/165937)
|
||||
- 修复 小程序端 低版本 ios NaN [详情](https://ask.dcloud.net.cn/question/162979)
|
||||
## 2.2.21（2023-02-20）
|
||||
- 修复 firefox 浏览器显示区域点击无法拉起日历弹框的Bug [详情](https://ask.dcloud.net.cn/question/163362)
|
||||
## 2.2.20（2023-02-17）
|
||||
- 优化 值为空依然选中当天问题
|
||||
- 优化 提供 default-value 属性支持配置选择器打开时默认显示的时间
|
||||
- 优化 非范围选择未选择日期时间，点击确认按钮选中当前日期时间
|
||||
- 优化 字节小程序日期时间范围选择，底部日期换行问题
|
||||
## 2.2.19（2023-02-09）
|
||||
- 修复 2.2.18 引起范围选择配置 end 选择无效的Bug [详情](https://github.com/dcloudio/uni-ui/issues/686)
|
||||
## 2.2.18（2023-02-08）
|
||||
- 修复 移动端范围选择change事件触发异常的Bug [详情](https://github.com/dcloudio/uni-ui/issues/684)
|
||||
- 优化 PC端输入日期格式错误时返回当前日期时间
|
||||
- 优化 PC端输入日期时间超出 start、end 限制的Bug
|
||||
- 优化 移动端日期时间范围用法时间展示不完整问题
|
||||
## 2.2.17（2023-02-04）
|
||||
- 修复 小程序端绑定 Date 类型报错的Bug [详情](https://github.com/dcloudio/uni-ui/issues/679)
|
||||
- 修复 vue3 time-picker 无法显示绑定时分秒的Bug
|
||||
## 2.2.16（2023-02-02）
|
||||
- 修复 字节小程序报错的Bug
|
||||
## 2.2.15（2023-02-02）
|
||||
- 修复 某些情况切换月份错误的Bug
|
||||
## 2.2.14（2023-01-30）
|
||||
- 修复 某些情况切换月份错误的Bug [详情](https://ask.dcloud.net.cn/question/162033)
|
||||
## 2.2.13（2023-01-10）
|
||||
- 修复 多次加载组件造成内存占用的Bug
|
||||
## 2.2.12（2022-12-01）
|
||||
- 修复 vue3 下 i18n 国际化初始值不正确的Bug
|
||||
## 2.2.11（2022-09-19）
|
||||
- 修复 支付宝小程序样式错乱的Bug [详情](https://github.com/dcloudio/uni-app/issues/3861)
|
||||
## 2.2.10（2022-09-19）
|
||||
- 修复 反向选择日期范围，日期显示异常的Bug [详情](https://ask.dcloud.net.cn/question/153401?item_id=212892&rf=false)
|
||||
## 2.2.9（2022-09-16）
|
||||
- 可以使用 uni-scss 控制主题色
|
||||
## 2.2.8（2022-09-08）
|
||||
- 修复 close事件无效的Bug
|
||||
## 2.2.7（2022-09-05）
|
||||
- 修复 移动端 maskClick 无效的Bug [详情](https://ask.dcloud.net.cn/question/140824)
|
||||
## 2.2.6（2022-06-30）
|
||||
- 优化 组件样式，调整了组件图标大小、高度、颜色等，与uni-ui风格保持一致
|
||||
## 2.2.5（2022-06-24）
|
||||
- 修复 日历顶部年月及底部确认未国际化的Bug
|
||||
## 2.2.4（2022-03-31）
|
||||
- 修复 Vue3 下动态赋值,单选类型未响应的Bug
|
||||
## 2.2.3（2022-03-28）
|
||||
- 修复 Vue3 下动态赋值未响应的Bug
|
||||
## 2.2.2（2021-12-10）
|
||||
- 修复 clear-icon 属性在小程序平台不生效的Bug
|
||||
## 2.2.1（2021-12-10）
|
||||
- 修复 日期范围选在小程序平台，必须多点击一次才能取消选中状态的Bug
|
||||
## 2.2.0（2021-11-19）
|
||||
- 优化 组件UI，并提供设计资源 [详情](https://uniapp.dcloud.io/component/uniui/resource)
|
||||
- 文档迁移 [https://uniapp.dcloud.io/component/uniui/uni-datetime-picker](https://uniapp.dcloud.io/component/uniui/uni-datetime-picker)
|
||||
## 2.1.5（2021-11-09）
|
||||
- 新增 提供组件设计资源，组件样式调整
|
||||
## 2.1.4（2021-09-10）
|
||||
- 修复 hide-second 在移动端的Bug
|
||||
- 修复 单选赋默认值时，赋值日期未高亮的Bug
|
||||
- 修复 赋默认值时，移动端未正确显示时间的Bug
|
||||
## 2.1.3（2021-09-09）
|
||||
- 新增 hide-second 属性，支持只使用时分，隐藏秒
|
||||
## 2.1.2（2021-09-03）
|
||||
- 优化 取消选中时（范围选）直接开始下一次选择, 避免多点一次
|
||||
- 优化 移动端支持清除按钮，同时支持通过 ref 调用组件的 clear 方法
|
||||
- 优化 调整字号大小，美化日历界面
|
||||
- 修复 因国际化导致的 placeholder 失效的Bug
|
||||
## 2.1.1（2021-08-24）
|
||||
- 新增 支持国际化
|
||||
- 优化 范围选择器在 pc 端过宽的问题
|
||||
## 2.1.0（2021-08-09）
|
||||
- 新增 适配 vue3
|
||||
## 2.0.19（2021-08-09）
|
||||
- 新增 支持作为 uni-forms 子组件相关功能
|
||||
- 修复 在 uni-forms 中使用时，选择时间报 NAN 错误的Bug
|
||||
## 2.0.18（2021-08-05）
|
||||
- 修复 type 属性动态赋值无效的Bug
|
||||
- 修复 ‘确认’按钮被 tabbar 遮盖 bug
|
||||
- 修复 组件未赋值时范围选左、右日历相同的Bug
|
||||
## 2.0.17（2021-08-04）
|
||||
- 修复 范围选未正确显示当前值的Bug
|
||||
- 修复 h5 平台（移动端）报错 'cale' of undefined 的Bug
|
||||
## 2.0.16（2021-07-21）
|
||||
- 新增 return-type 属性支持返回 date 日期对象
|
||||
## 2.0.15（2021-07-14）
|
||||
- 修复 单选日期类型，初始赋值后不在当前日历的Bug
|
||||
- 新增 clearIcon 属性，显示框的清空按钮可配置显示隐藏（仅 pc 有效）
|
||||
- 优化 移动端移除显示框的清空按钮，无实际用途
|
||||
## 2.0.14（2021-07-14）
|
||||
- 修复 组件赋值为空，界面未更新的Bug
|
||||
- 修复 start 和 end 不能动态赋值的Bug
|
||||
- 修复 范围选类型，用户选择后再次选择右侧日历（结束日期）显示不正确的Bug
|
||||
## 2.0.13（2021-07-08）
|
||||
- 修复 范围选择不能动态赋值的Bug
|
||||
## 2.0.12（2021-07-08）
|
||||
- 修复 范围选择的初始时间在一个月内时，造成无法选择的bug
|
||||
## 2.0.11（2021-07-08）
|
||||
- 优化 弹出层在超出视窗边缘定位不准确的问题
|
||||
## 2.0.10（2021-07-08）
|
||||
- 修复 范围起始点样式的背景色与今日样式的字体前景色融合，导致日期字体看不清的Bug
|
||||
- 优化 弹出层在超出视窗边缘被遮盖的问题
|
||||
## 2.0.9（2021-07-07）
|
||||
- 新增 maskClick 事件
|
||||
- 修复 特殊情况日历 rpx 布局错误的Bug，rpx -> px
|
||||
- 修复 范围选择时清空返回值不合理的bug，['', ''] -> []
|
||||
## 2.0.8（2021-07-07）
|
||||
- 新增 日期时间显示框支持插槽
|
||||
## 2.0.7（2021-07-01）
|
||||
- 优化 添加 uni-icons 依赖
|
||||
## 2.0.6（2021-05-22）
|
||||
- 修复 图标在小程序上不显示的Bug
|
||||
- 优化 重命名引用组件，避免潜在组件命名冲突
|
||||
## 2.0.5（2021-05-20）
|
||||
- 优化 代码目录扁平化
|
||||
## 2.0.4（2021-05-12）
|
||||
- 新增 组件示例地址
|
||||
## 2.0.3（2021-05-10）
|
||||
- 修复 ios 下不识别 '-' 日期格式的Bug
|
||||
- 优化 pc 下弹出层添加边框和阴影
|
||||
## 2.0.2（2021-05-08）
|
||||
- 修复 在 admin 中获取弹出层定位错误的bug
|
||||
## 2.0.1（2021-05-08）
|
||||
- 修复 type 属性向下兼容，默认值从 date 变更为 datetime
|
||||
## 2.0.0（2021-04-30）
|
||||
- 支持日历形式的日期+时间的范围选择
|
||||
> 注意：此版本不向后兼容，不再支持单独时间选择（type=time）及相关的 hide-second 属性（时间选可使用内置组件 picker）
|
||||
## 1.0.6（2021-03-18）
|
||||
- 新增 hide-second 属性，时间支持仅选择时、分
|
||||
- 修复 选择跟显示的日期不一样的Bug
|
||||
- 修复 chang事件触发2次的Bug
|
||||
- 修复 分、秒 end 范围错误的Bug
|
||||
- 优化 更好的 nvue 适配
|
||||
|
|
@ -0,0 +1,177 @@
|
|||
<template>
|
||||
<view class="uni-calendar-item__weeks-box" :class="{
|
||||
'uni-calendar-item--disable':weeks.disable,
|
||||
'uni-calendar-item--before-checked-x':weeks.beforeMultiple,
|
||||
'uni-calendar-item--multiple': weeks.multiple,
|
||||
'uni-calendar-item--after-checked-x':weeks.afterMultiple,
|
||||
}" @click="choiceDate(weeks)" @mouseenter="handleMousemove(weeks)">
|
||||
<view class="uni-calendar-item__weeks-box-item" :class="{
|
||||
'uni-calendar-item--checked':calendar.fullDate === weeks.fullDate && (calendar.userChecked || !checkHover),
|
||||
'uni-calendar-item--checked-range-text': checkHover,
|
||||
'uni-calendar-item--before-checked':weeks.beforeMultiple,
|
||||
'uni-calendar-item--multiple': weeks.multiple,
|
||||
'uni-calendar-item--after-checked':weeks.afterMultiple,
|
||||
'uni-calendar-item--disable':weeks.disable,
|
||||
}">
|
||||
<text v-if="selected && weeks.extraInfo" class="uni-calendar-item__weeks-box-circle"></text>
|
||||
<text class="uni-calendar-item__weeks-box-text uni-calendar-item__weeks-box-text-disable uni-calendar-item--checked-text">{{weeks.date}}</text>
|
||||
</view>
|
||||
<view :class="{'uni-calendar-item--today': weeks.isToday}"></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
weeks: {
|
||||
type: Object,
|
||||
default () {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
calendar: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
selected: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return []
|
||||
}
|
||||
},
|
||||
checkHover: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
choiceDate(weeks) {
|
||||
this.$emit('change', weeks)
|
||||
},
|
||||
handleMousemove(weeks) {
|
||||
this.$emit('handleMouse', weeks)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" >
|
||||
$uni-primary: #007aff !default;
|
||||
|
||||
.uni-calendar-item__weeks-box {
|
||||
flex: 1;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 1px 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.uni-calendar-item__weeks-box-text {
|
||||
font-size: 14px;
|
||||
// font-family: Lato-Bold, Lato;
|
||||
font-weight: bold;
|
||||
color: darken($color: $uni-primary, $amount: 40%);
|
||||
}
|
||||
|
||||
.uni-calendar-item__weeks-box-item {
|
||||
position: relative;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
/* #ifdef H5 */
|
||||
cursor: pointer;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
|
||||
.uni-calendar-item__weeks-box-circle {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
right: 5px;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 8px;
|
||||
background-color: #dd524d;
|
||||
|
||||
}
|
||||
|
||||
.uni-calendar-item__weeks-box .uni-calendar-item--disable {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.uni-calendar-item--disable .uni-calendar-item__weeks-box-text-disable {
|
||||
color: #D1D1D1;
|
||||
}
|
||||
|
||||
.uni-calendar-item--today {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 17%;
|
||||
background-color: #dd524d;
|
||||
width:6px;
|
||||
height: 6px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.uni-calendar-item--extra {
|
||||
color: #dd524d;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.uni-calendar-item__weeks-box .uni-calendar-item--checked {
|
||||
background-color: $uni-primary;
|
||||
border-radius: 50%;
|
||||
box-sizing: border-box;
|
||||
border: 3px solid #fff;
|
||||
}
|
||||
|
||||
.uni-calendar-item--checked .uni-calendar-item--checked-text {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.uni-calendar-item--multiple .uni-calendar-item--checked-range-text {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.uni-calendar-item--multiple {
|
||||
background-color: #F6F7FC;
|
||||
// color: #fff;
|
||||
}
|
||||
|
||||
.uni-calendar-item--multiple .uni-calendar-item--before-checked,
|
||||
.uni-calendar-item--multiple .uni-calendar-item--after-checked {
|
||||
background-color: $uni-primary;
|
||||
border-radius: 50%;
|
||||
box-sizing: border-box;
|
||||
border: 3px solid #F6F7FC;
|
||||
}
|
||||
|
||||
.uni-calendar-item--before-checked .uni-calendar-item--checked-text,
|
||||
.uni-calendar-item--after-checked .uni-calendar-item--checked-text {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.uni-calendar-item--before-checked-x {
|
||||
border-top-left-radius: 50px;
|
||||
border-bottom-left-radius: 50px;
|
||||
box-sizing: border-box;
|
||||
background-color: #F6F7FC;
|
||||
}
|
||||
|
||||
.uni-calendar-item--after-checked-x {
|
||||
border-top-right-radius: 50px;
|
||||
border-bottom-right-radius: 50px;
|
||||
background-color: #F6F7FC;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,929 @@
|
|||
<template>
|
||||
<view class="uni-calendar" @mouseleave="leaveCale">
|
||||
|
||||
<view v-if="!insert && show" class="uni-calendar__mask" :class="{'uni-calendar--mask-show':aniMaskShow}"
|
||||
@click="maskClick"></view>
|
||||
|
||||
<view v-if="insert || show" class="uni-calendar__content"
|
||||
:class="{'uni-calendar--fixed':!insert,'uni-calendar--ani-show':aniMaskShow, 'uni-calendar__content-mobile': aniMaskShow}">
|
||||
<view class="uni-calendar__header" :class="{'uni-calendar__header-mobile' :!insert}">
|
||||
|
||||
<view class="uni-calendar__header-btn-box" @click.stop="changeMonth('pre')">
|
||||
<view class="uni-calendar__header-btn uni-calendar--left"></view>
|
||||
</view>
|
||||
|
||||
<picker mode="date" :value="date" fields="month" @change="bindDateChange">
|
||||
<text
|
||||
class="uni-calendar__header-text">{{ (nowDate.year||'') + yearText + ( nowDate.month||'') + monthText}}</text>
|
||||
</picker>
|
||||
|
||||
<view class="uni-calendar__header-btn-box" @click.stop="changeMonth('next')">
|
||||
<view class="uni-calendar__header-btn uni-calendar--right"></view>
|
||||
</view>
|
||||
|
||||
<view v-if="!insert" class="dialog-close" @click="close">
|
||||
<view class="dialog-close-plus" data-id="close"></view>
|
||||
<view class="dialog-close-plus dialog-close-rotate" data-id="close"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="uni-calendar__box">
|
||||
|
||||
<view v-if="showMonth" class="uni-calendar__box-bg">
|
||||
<text class="uni-calendar__box-bg-text">{{nowDate.month}}</text>
|
||||
</view>
|
||||
|
||||
<view class="uni-calendar__weeks" style="padding-bottom: 7px;">
|
||||
<view class="uni-calendar__weeks-day">
|
||||
<text class="uni-calendar__weeks-day-text">{{SUNText}}</text>
|
||||
</view>
|
||||
<view class="uni-calendar__weeks-day">
|
||||
<text class="uni-calendar__weeks-day-text">{{MONText}}</text>
|
||||
</view>
|
||||
<view class="uni-calendar__weeks-day">
|
||||
<text class="uni-calendar__weeks-day-text">{{TUEText}}</text>
|
||||
</view>
|
||||
<view class="uni-calendar__weeks-day">
|
||||
<text class="uni-calendar__weeks-day-text">{{WEDText}}</text>
|
||||
</view>
|
||||
<view class="uni-calendar__weeks-day">
|
||||
<text class="uni-calendar__weeks-day-text">{{THUText}}</text>
|
||||
</view>
|
||||
<view class="uni-calendar__weeks-day">
|
||||
<text class="uni-calendar__weeks-day-text">{{FRIText}}</text>
|
||||
</view>
|
||||
<view class="uni-calendar__weeks-day">
|
||||
<text class="uni-calendar__weeks-day-text">{{SATText}}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="uni-calendar__weeks" v-for="(item,weekIndex) in weeks" :key="weekIndex">
|
||||
<view class="uni-calendar__weeks-item" v-for="(weeks,weeksIndex) in item" :key="weeksIndex">
|
||||
<calendar-item class="uni-calendar-item--hook" :weeks="weeks" :calendar="calendar"
|
||||
:selected="selected" :checkHover="range" @change="choiceDate"
|
||||
@handleMouse="handleMouse">
|
||||
</calendar-item>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="!insert && !range && hasTime" class="uni-date-changed uni-calendar--fixed-top"
|
||||
style="padding: 0 80px;">
|
||||
<view class="uni-date-changed--time-date">{{tempSingleDate ? tempSingleDate : selectDateText}}</view>
|
||||
<time-picker type="time" :start="timepickerStartTime" :end="timepickerEndTime" v-model="time"
|
||||
:disabled="!tempSingleDate" :border="false" :hide-second="hideSecond" class="time-picker-style">
|
||||
</time-picker>
|
||||
</view>
|
||||
|
||||
<view v-if="!insert && range && hasTime" class="uni-date-changed uni-calendar--fixed-top">
|
||||
<view class="uni-date-changed--time-start">
|
||||
<view class="uni-date-changed--time-date">{{tempRange.before ? tempRange.before : startDateText}}
|
||||
</view>
|
||||
<time-picker type="time" :start="timepickerStartTime" v-model="timeRange.startTime" :border="false"
|
||||
:hide-second="hideSecond" :disabled="!tempRange.before" class="time-picker-style">
|
||||
</time-picker>
|
||||
</view>
|
||||
<view style="line-height: 50px;">
|
||||
<uni-icons type="arrowthinright" color="#999"></uni-icons>
|
||||
</view>
|
||||
<view class="uni-date-changed--time-end">
|
||||
<view class="uni-date-changed--time-date">{{tempRange.after ? tempRange.after : endDateText}}</view>
|
||||
<time-picker type="time" :end="timepickerEndTime" v-model="timeRange.endTime" :border="false"
|
||||
:hide-second="hideSecond" :disabled="!tempRange.after" class="time-picker-style">
|
||||
</time-picker>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="!insert" class="uni-date-changed uni-date-btn--ok">
|
||||
<view class="uni-datetime-picker--btn" @click="confirm">{{confirmText}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { Calendar, getDate, getTime } from './util.js';
|
||||
import calendarItem from './calendar-item.vue'
|
||||
import timePicker from './time-picker.vue'
|
||||
|
||||
import { initVueI18n } from '@dcloudio/uni-i18n'
|
||||
import i18nMessages from './i18n/index.js'
|
||||
const { t } = initVueI18n(i18nMessages)
|
||||
|
||||
/**
|
||||
* Calendar 日历
|
||||
* @description 日历组件可以查看日期，选择任意范围内的日期，打点操作。常用场景如：酒店日期预订、火车机票选择购买日期、上下班打卡等
|
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=56
|
||||
* @property {String} date 自定义当前时间，默认为今天
|
||||
* @property {String} startDate 日期选择范围-开始日期
|
||||
* @property {String} endDate 日期选择范围-结束日期
|
||||
* @property {Boolean} range 范围选择
|
||||
* @property {Boolean} insert = [true|false] 插入模式,默认为false
|
||||
* @value true 弹窗模式
|
||||
* @value false 插入模式
|
||||
* @property {Boolean} clearDate = [true|false] 弹窗模式是否清空上次选择内容
|
||||
* @property {Array} selected 打点，期待格式[{date: '2019-06-27', info: '签到', data: { custom: '自定义信息', name: '自定义消息头',xxx:xxx... }}]
|
||||
* @property {Boolean} showMonth 是否选择月份为背景
|
||||
* @property {[String} defaultValue 选择器打开时默认显示的时间
|
||||
* @event {Function} change 日期改变，`insert :ture` 时生效
|
||||
* @event {Function} confirm 确认选择`insert :false` 时生效
|
||||
* @event {Function} monthSwitch 切换月份时触发
|
||||
* @example <uni-calendar :insert="true" :start-date="'2019-3-2'":end-date="'2019-5-20'"@change="change" />
|
||||
*/
|
||||
export default {
|
||||
components: {
|
||||
calendarItem,
|
||||
timePicker
|
||||
},
|
||||
props: {
|
||||
date: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
defTime: {
|
||||
type: [String, Object],
|
||||
default: ''
|
||||
},
|
||||
selectableTimes: {
|
||||
type: [Object],
|
||||
default () {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
selected: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
startDate: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
endDate: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
startPlaceholder: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
endPlaceholder: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
range: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
hasTime: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
insert: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
showMonth: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
clearDate: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
checkHover: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
hideSecond: {
|
||||
type: [Boolean],
|
||||
default: false
|
||||
},
|
||||
pleStatus: {
|
||||
type: Object,
|
||||
default () {
|
||||
return {
|
||||
before: '',
|
||||
after: '',
|
||||
data: [],
|
||||
fulldate: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
defaultValue: {
|
||||
type: [String, Object, Array],
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
weeks: [],
|
||||
calendar: {},
|
||||
nowDate: {},
|
||||
aniMaskShow: false,
|
||||
firstEnter: true,
|
||||
time: '',
|
||||
timeRange: {
|
||||
startTime: '',
|
||||
endTime: ''
|
||||
},
|
||||
tempSingleDate: '',
|
||||
tempRange: {
|
||||
before: '',
|
||||
after: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
date: {
|
||||
immediate: true,
|
||||
handler(newVal) {
|
||||
if (!this.range) {
|
||||
this.tempSingleDate = newVal
|
||||
setTimeout(() => {
|
||||
this.init(newVal)
|
||||
}, 100)
|
||||
}
|
||||
}
|
||||
},
|
||||
defTime: {
|
||||
immediate: true,
|
||||
handler(newVal) {
|
||||
if (!this.range) {
|
||||
this.time = newVal
|
||||
} else {
|
||||
this.timeRange.startTime = newVal.start
|
||||
this.timeRange.endTime = newVal.end
|
||||
}
|
||||
}
|
||||
},
|
||||
startDate(val) {
|
||||
// 字节小程序 watch 早于 created
|
||||
if(!this.cale){
|
||||
return
|
||||
}
|
||||
this.cale.setStartDate(val)
|
||||
this.cale.setDate(this.nowDate.fullDate)
|
||||
this.weeks = this.cale.weeks
|
||||
},
|
||||
endDate(val) {
|
||||
// 字节小程序 watch 早于 created
|
||||
if(!this.cale){
|
||||
return
|
||||
}
|
||||
this.cale.setEndDate(val)
|
||||
this.cale.setDate(this.nowDate.fullDate)
|
||||
this.weeks = this.cale.weeks
|
||||
},
|
||||
selected(newVal) {
|
||||
// 字节小程序 watch 早于 created
|
||||
if(!this.cale){
|
||||
return
|
||||
}
|
||||
this.cale.setSelectInfo(this.nowDate.fullDate, newVal)
|
||||
this.weeks = this.cale.weeks
|
||||
},
|
||||
pleStatus: {
|
||||
immediate: true,
|
||||
handler(newVal) {
|
||||
const {
|
||||
before,
|
||||
after,
|
||||
fulldate,
|
||||
which
|
||||
} = newVal
|
||||
this.tempRange.before = before
|
||||
this.tempRange.after = after
|
||||
setTimeout(() => {
|
||||
if (fulldate) {
|
||||
this.cale.setHoverMultiple(fulldate)
|
||||
if (before && after) {
|
||||
this.cale.lastHover = true
|
||||
if (this.rangeWithinMonth(after, before)) return
|
||||
this.setDate(before)
|
||||
} else {
|
||||
this.cale.setMultiple(fulldate)
|
||||
this.setDate(this.nowDate.fullDate)
|
||||
this.calendar.fullDate = ''
|
||||
this.cale.lastHover = false
|
||||
}
|
||||
} else {
|
||||
// 字节小程序 watch 早于 created
|
||||
if(!this.cale){
|
||||
return
|
||||
}
|
||||
|
||||
this.cale.setDefaultMultiple(before, after)
|
||||
if (which === 'left' && before) {
|
||||
this.setDate(before)
|
||||
this.weeks = this.cale.weeks
|
||||
} else if(after) {
|
||||
this.setDate(after)
|
||||
this.weeks = this.cale.weeks
|
||||
}
|
||||
this.cale.lastHover = true
|
||||
}
|
||||
}, 16)
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
timepickerStartTime() {
|
||||
const activeDate = this.range ? this.tempRange.before : this.calendar.fullDate
|
||||
return activeDate === this.startDate ? this.selectableTimes.start : ''
|
||||
},
|
||||
timepickerEndTime() {
|
||||
const activeDate = this.range ? this.tempRange.after : this.calendar.fullDate
|
||||
return activeDate === this.endDate ? this.selectableTimes.end : ''
|
||||
},
|
||||
/**
|
||||
* for i18n
|
||||
*/
|
||||
selectDateText() {
|
||||
return t("uni-datetime-picker.selectDate")
|
||||
},
|
||||
startDateText() {
|
||||
return this.startPlaceholder || t("uni-datetime-picker.startDate")
|
||||
},
|
||||
endDateText() {
|
||||
return this.endPlaceholder || t("uni-datetime-picker.endDate")
|
||||
},
|
||||
okText() {
|
||||
return t("uni-datetime-picker.ok")
|
||||
},
|
||||
yearText() {
|
||||
return t("uni-datetime-picker.year")
|
||||
},
|
||||
monthText() {
|
||||
return t("uni-datetime-picker.month")
|
||||
},
|
||||
MONText() {
|
||||
return t("uni-calender.MON")
|
||||
},
|
||||
TUEText() {
|
||||
return t("uni-calender.TUE")
|
||||
},
|
||||
WEDText() {
|
||||
return t("uni-calender.WED")
|
||||
},
|
||||
THUText() {
|
||||
return t("uni-calender.THU")
|
||||
},
|
||||
FRIText() {
|
||||
return t("uni-calender.FRI")
|
||||
},
|
||||
SATText() {
|
||||
return t("uni-calender.SAT")
|
||||
},
|
||||
SUNText() {
|
||||
return t("uni-calender.SUN")
|
||||
},
|
||||
confirmText() {
|
||||
return t("uni-calender.confirm")
|
||||
},
|
||||
},
|
||||
created() {
|
||||
// 获取日历方法实例
|
||||
this.cale = new Calendar({
|
||||
selected: this.selected,
|
||||
startDate: this.startDate,
|
||||
endDate: this.endDate,
|
||||
range: this.range,
|
||||
})
|
||||
// 选中某一天
|
||||
this.init(this.date)
|
||||
},
|
||||
methods: {
|
||||
leaveCale() {
|
||||
this.firstEnter = true
|
||||
},
|
||||
handleMouse(weeks) {
|
||||
if (weeks.disable) return
|
||||
if (this.cale.lastHover) return
|
||||
let {
|
||||
before,
|
||||
after
|
||||
} = this.cale.multipleStatus
|
||||
if (!before) return
|
||||
this.calendar = weeks
|
||||
// 设置范围选
|
||||
this.cale.setHoverMultiple(this.calendar.fullDate)
|
||||
this.weeks = this.cale.weeks
|
||||
// hover时，进入一个日历，更新另一个
|
||||
if (this.firstEnter) {
|
||||
this.$emit('firstEnterCale', this.cale.multipleStatus)
|
||||
this.firstEnter = false
|
||||
}
|
||||
},
|
||||
rangeWithinMonth(A, B) {
|
||||
const [yearA, monthA] = A.split('-')
|
||||
const [yearB, monthB] = B.split('-')
|
||||
return yearA === yearB && monthA === monthB
|
||||
},
|
||||
// 蒙版点击事件
|
||||
maskClick() {
|
||||
this.close()
|
||||
this.$emit('maskClose')
|
||||
},
|
||||
|
||||
clearCalender() {
|
||||
if (this.range) {
|
||||
this.timeRange.startTime = ''
|
||||
this.timeRange.endTime = ''
|
||||
this.tempRange.before = ''
|
||||
this.tempRange.after = ''
|
||||
this.cale.multipleStatus.before = ''
|
||||
this.cale.multipleStatus.after = ''
|
||||
this.cale.multipleStatus.data = []
|
||||
this.cale.lastHover = false
|
||||
} else {
|
||||
this.time = ''
|
||||
this.tempSingleDate = ''
|
||||
}
|
||||
this.calendar.fullDate = ''
|
||||
this.setDate(new Date())
|
||||
},
|
||||
|
||||
bindDateChange(e) {
|
||||
const value = e.detail.value + '-1'
|
||||
this.setDate(value)
|
||||
},
|
||||
/**
|
||||
* 初始化日期显示
|
||||
* @param {Object} date
|
||||
*/
|
||||
init(date) {
|
||||
// 字节小程序 watch 早于 created
|
||||
if(!this.cale){
|
||||
return
|
||||
}
|
||||
this.cale.setDate(date || new Date())
|
||||
this.weeks = this.cale.weeks
|
||||
this.nowDate = this.cale.getInfo(date)
|
||||
this.calendar = {...this.nowDate}
|
||||
if(!date){
|
||||
// 优化date为空默认不选中今天
|
||||
this.calendar.fullDate = ''
|
||||
if(this.defaultValue && !this.range){
|
||||
// 暂时只支持移动端非范围选择
|
||||
const defaultDate = new Date(this.defaultValue)
|
||||
const fullDate = getDate(defaultDate)
|
||||
const year = defaultDate.getFullYear()
|
||||
const month = defaultDate.getMonth()+1
|
||||
const date = defaultDate.getDate()
|
||||
const day = defaultDate.getDay()
|
||||
this.calendar = {
|
||||
fullDate,
|
||||
year,
|
||||
month,
|
||||
date,
|
||||
day
|
||||
},
|
||||
this.tempSingleDate = fullDate
|
||||
this.time = getTime(defaultDate, this.hideSecond)
|
||||
}
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 打开日历弹窗
|
||||
*/
|
||||
open() {
|
||||
// 弹窗模式并且清理数据
|
||||
if (this.clearDate && !this.insert) {
|
||||
this.cale.cleanMultipleStatus()
|
||||
this.init(this.date)
|
||||
}
|
||||
this.show = true
|
||||
this.$nextTick(() => {
|
||||
setTimeout(() => {
|
||||
this.aniMaskShow = true
|
||||
}, 50)
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 关闭日历弹窗
|
||||
*/
|
||||
close() {
|
||||
this.aniMaskShow = false
|
||||
this.$nextTick(() => {
|
||||
setTimeout(() => {
|
||||
this.show = false
|
||||
this.$emit('close')
|
||||
}, 300)
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 确认按钮
|
||||
*/
|
||||
confirm() {
|
||||
this.setEmit('confirm')
|
||||
this.close()
|
||||
},
|
||||
/**
|
||||
* 变化触发
|
||||
*/
|
||||
change() {
|
||||
if (!this.insert) return
|
||||
this.setEmit('change')
|
||||
},
|
||||
/**
|
||||
* 选择月份触发
|
||||
*/
|
||||
monthSwitch() {
|
||||
let {
|
||||
year,
|
||||
month
|
||||
} = this.nowDate
|
||||
this.$emit('monthSwitch', {
|
||||
year,
|
||||
month: Number(month)
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 派发事件
|
||||
* @param {Object} name
|
||||
*/
|
||||
setEmit(name) {
|
||||
if(!this.range){
|
||||
if(!this.calendar.fullDate){
|
||||
this.calendar = this.cale.getInfo(new Date())
|
||||
this.tempSingleDate = this.calendar.fullDate
|
||||
}
|
||||
if(this.hasTime && !this.time) {
|
||||
this.time = getTime(new Date(), this.hideSecond)
|
||||
}
|
||||
}
|
||||
let {
|
||||
year,
|
||||
month,
|
||||
date,
|
||||
fullDate,
|
||||
extraInfo
|
||||
} = this.calendar
|
||||
this.$emit(name, {
|
||||
range: this.cale.multipleStatus,
|
||||
year,
|
||||
month,
|
||||
date,
|
||||
time: this.time,
|
||||
timeRange: this.timeRange,
|
||||
fulldate: fullDate,
|
||||
extraInfo: extraInfo || {}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 选择天触发
|
||||
* @param {Object} weeks
|
||||
*/
|
||||
choiceDate(weeks) {
|
||||
if (weeks.disable) return
|
||||
this.calendar = weeks
|
||||
this.calendar.userChecked = true
|
||||
// 设置多选
|
||||
this.cale.setMultiple(this.calendar.fullDate, true)
|
||||
this.weeks = this.cale.weeks
|
||||
this.tempSingleDate = this.calendar.fullDate
|
||||
const beforeDate = new Date(this.cale.multipleStatus.before).getTime()
|
||||
const afterDate = new Date(this.cale.multipleStatus.after).getTime()
|
||||
// 如果先选择结束日期，后选择开始日期，需要交换
|
||||
if (beforeDate > afterDate && afterDate) {
|
||||
this.tempRange.before = this.cale.multipleStatus.after
|
||||
this.tempRange.after = this.cale.multipleStatus.before
|
||||
} else {
|
||||
this.tempRange.before = this.cale.multipleStatus.before
|
||||
this.tempRange.after = this.cale.multipleStatus.after
|
||||
}
|
||||
this.change()
|
||||
},
|
||||
changeMonth(type) {
|
||||
let newDate
|
||||
if(type === 'pre') {
|
||||
newDate = this.cale.getPreMonthObj(this.nowDate.fullDate).fullDate
|
||||
} else if(type === 'next') {
|
||||
newDate = this.cale.getNextMonthObj(this.nowDate.fullDate).fullDate
|
||||
}
|
||||
|
||||
this.setDate(newDate)
|
||||
this.monthSwitch()
|
||||
},
|
||||
/**
|
||||
* 设置日期
|
||||
* @param {Object} date
|
||||
*/
|
||||
setDate(date) {
|
||||
this.cale.setDate(date)
|
||||
this.weeks = this.cale.weeks
|
||||
this.nowDate = this.cale.getInfo(date)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" >
|
||||
$uni-primary: #007aff !default;
|
||||
|
||||
.uni-calendar {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.uni-calendar__mask {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
transition-property: opacity;
|
||||
transition-duration: 0.3s;
|
||||
opacity: 0;
|
||||
/* #ifndef APP-NVUE */
|
||||
z-index: 99;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-calendar--mask-show {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.uni-calendar--fixed {
|
||||
position: fixed;
|
||||
bottom: calc(var(--window-bottom));
|
||||
left: 0;
|
||||
right: 0;
|
||||
transition-property: transform;
|
||||
transition-duration: 0.3s;
|
||||
transform: translateY(460px);
|
||||
/* #ifndef APP-NVUE */
|
||||
z-index: 99;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-calendar--ani-show {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.uni-calendar__content {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.uni-calendar__content-mobile {
|
||||
border-top-left-radius: 10px;
|
||||
border-top-right-radius: 10px;
|
||||
box-shadow: 0px 0px 5px 3px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.uni-calendar__header {
|
||||
position: relative;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.uni-calendar__header-mobile {
|
||||
padding: 10px;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.uni-calendar--fixed-top {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
border-top-color: rgba(0, 0, 0, 0.4);
|
||||
border-top-style: solid;
|
||||
border-top-width: 1px;
|
||||
}
|
||||
|
||||
.uni-calendar--fixed-width {
|
||||
width: 50px;
|
||||
}
|
||||
|
||||
.uni-calendar__backtoday {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 25rpx;
|
||||
padding: 0 5px;
|
||||
padding-left: 10px;
|
||||
height: 25px;
|
||||
line-height: 25px;
|
||||
font-size: 12px;
|
||||
border-top-left-radius: 25px;
|
||||
border-bottom-left-radius: 25px;
|
||||
color: #fff;
|
||||
background-color: #f1f1f1;
|
||||
}
|
||||
|
||||
.uni-calendar__header-text {
|
||||
text-align: center;
|
||||
width: 100px;
|
||||
font-size: 15px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.uni-calendar__button-text {
|
||||
text-align: center;
|
||||
width: 100px;
|
||||
font-size: 14px;
|
||||
color: $uni-primary;
|
||||
/* #ifndef APP-NVUE */
|
||||
letter-spacing: 3px;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-calendar__header-btn-box {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.uni-calendar__header-btn {
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
border-left-color: #808080;
|
||||
border-left-style: solid;
|
||||
border-left-width: 1px;
|
||||
border-top-color: #555555;
|
||||
border-top-style: solid;
|
||||
border-top-width: 1px;
|
||||
}
|
||||
|
||||
.uni-calendar--left {
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
|
||||
.uni-calendar--right {
|
||||
transform: rotate(135deg);
|
||||
}
|
||||
|
||||
|
||||
.uni-calendar__weeks {
|
||||
position: relative;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.uni-calendar__weeks-item {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.uni-calendar__weeks-day {
|
||||
flex: 1;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 40px;
|
||||
border-bottom-color: #F5F5F5;
|
||||
border-bottom-style: solid;
|
||||
border-bottom-width: 1px;
|
||||
}
|
||||
|
||||
.uni-calendar__weeks-day-text {
|
||||
font-size: 12px;
|
||||
color: #B2B2B2;
|
||||
}
|
||||
|
||||
.uni-calendar__box {
|
||||
position: relative;
|
||||
// padding: 0 10px;
|
||||
padding-bottom: 7px;
|
||||
}
|
||||
|
||||
.uni-calendar__box-bg {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.uni-calendar__box-bg-text {
|
||||
font-size: 200px;
|
||||
font-weight: bold;
|
||||
color: #999;
|
||||
opacity: 0.1;
|
||||
text-align: center;
|
||||
/* #ifndef APP-NVUE */
|
||||
line-height: 1;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-date-changed {
|
||||
padding: 0 10px;
|
||||
// line-height: 50px;
|
||||
text-align: center;
|
||||
color: #333;
|
||||
border-top-color: #DCDCDC;
|
||||
;
|
||||
border-top-style: solid;
|
||||
border-top-width: 1px;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.uni-date-btn--ok {
|
||||
padding: 20px 15px;
|
||||
}
|
||||
|
||||
.uni-date-changed--time-start {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.uni-date-changed--time-end {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.uni-date-changed--time-date {
|
||||
color: #999;
|
||||
line-height: 50px;
|
||||
/* #ifdef MP-TOUTIAO */
|
||||
font-size: 16px;
|
||||
/* #endif */
|
||||
margin-right: 5px;
|
||||
// opacity: 0.6;
|
||||
}
|
||||
|
||||
.time-picker-style {
|
||||
// width: 62px;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
justify-content: center;
|
||||
align-items: center
|
||||
}
|
||||
|
||||
.mr-10 {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.dialog-close {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
padding: 0 25px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.dialog-close-plus {
|
||||
width: 16px;
|
||||
height: 2px;
|
||||
background-color: #737987;
|
||||
border-radius: 2px;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
.dialog-close-rotate {
|
||||
position: absolute;
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
|
||||
.uni-datetime-picker--btn {
|
||||
border-radius: 100px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
background-color: $uni-primary;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
.uni-datetime-picker--btn:active {
|
||||
opacity: 0.7;
|
||||
}
|
||||
/* #endif */
|
||||
</style>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
{
|
||||
"uni-datetime-picker.selectDate": "select date",
|
||||
"uni-datetime-picker.selectTime": "select time",
|
||||
"uni-datetime-picker.selectDateTime": "select date and time",
|
||||
"uni-datetime-picker.startDate": "start date",
|
||||
"uni-datetime-picker.endDate": "end date",
|
||||
"uni-datetime-picker.startTime": "start time",
|
||||
"uni-datetime-picker.endTime": "end time",
|
||||
"uni-datetime-picker.ok": "ok",
|
||||
"uni-datetime-picker.clear": "clear",
|
||||
"uni-datetime-picker.cancel": "cancel",
|
||||
"uni-datetime-picker.year": "-",
|
||||
"uni-datetime-picker.month": "",
|
||||
"uni-calender.MON": "MON",
|
||||
"uni-calender.TUE": "TUE",
|
||||
"uni-calender.WED": "WED",
|
||||
"uni-calender.THU": "THU",
|
||||
"uni-calender.FRI": "FRI",
|
||||
"uni-calender.SAT": "SAT",
|
||||
"uni-calender.SUN": "SUN",
|
||||
"uni-calender.confirm": "confirm"
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
import en from './en.json'
|
||||
import zhHans from './zh-Hans.json'
|
||||
import zhHant from './zh-Hant.json'
|
||||
export default {
|
||||
en,
|
||||
'zh-Hans': zhHans,
|
||||
'zh-Hant': zhHant
|
||||
}
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
{
|
||||
"uni-datetime-picker.selectDate": "选择日期",
|
||||
"uni-datetime-picker.selectTime": "选择时间",
|
||||
"uni-datetime-picker.selectDateTime": "选择日期时间",
|
||||
"uni-datetime-picker.startDate": "开始日期",
|
||||
"uni-datetime-picker.endDate": "结束日期",
|
||||
"uni-datetime-picker.startTime": "开始时间",
|
||||
"uni-datetime-picker.endTime": "结束时间",
|
||||
"uni-datetime-picker.ok": "确定",
|
||||
"uni-datetime-picker.clear": "清除",
|
||||
"uni-datetime-picker.cancel": "取消",
|
||||
"uni-datetime-picker.year": "年",
|
||||
"uni-datetime-picker.month": "月",
|
||||
"uni-calender.SUN": "日",
|
||||
"uni-calender.MON": "一",
|
||||
"uni-calender.TUE": "二",
|
||||
"uni-calender.WED": "三",
|
||||
"uni-calender.THU": "四",
|
||||
"uni-calender.FRI": "五",
|
||||
"uni-calender.SAT": "六",
|
||||
"uni-calender.confirm": "确认"
|
||||
}
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
{
|
||||
"uni-datetime-picker.selectDate": "選擇日期",
|
||||
"uni-datetime-picker.selectTime": "選擇時間",
|
||||
"uni-datetime-picker.selectDateTime": "選擇日期時間",
|
||||
"uni-datetime-picker.startDate": "開始日期",
|
||||
"uni-datetime-picker.endDate": "結束日期",
|
||||
"uni-datetime-picker.startTime": "開始时间",
|
||||
"uni-datetime-picker.endTime": "結束时间",
|
||||
"uni-datetime-picker.ok": "確定",
|
||||
"uni-datetime-picker.clear": "清除",
|
||||
"uni-datetime-picker.cancel": "取消",
|
||||
"uni-datetime-picker.year": "年",
|
||||
"uni-datetime-picker.month": "月",
|
||||
"uni-calender.SUN": "日",
|
||||
"uni-calender.MON": "一",
|
||||
"uni-calender.TUE": "二",
|
||||
"uni-calender.WED": "三",
|
||||
"uni-calender.THU": "四",
|
||||
"uni-calender.FRI": "五",
|
||||
"uni-calender.SAT": "六",
|
||||
"uni-calender.confirm": "確認"
|
||||
}
|
||||
|
|
@ -0,0 +1,934 @@
|
|||
<template>
|
||||
<view class="uni-datetime-picker">
|
||||
<view @click="initTimePicker">
|
||||
<slot>
|
||||
<view class="uni-datetime-picker-timebox-pointer"
|
||||
:class="{'uni-datetime-picker-disabled': disabled, 'uni-datetime-picker-timebox': border}">
|
||||
<text class="uni-datetime-picker-text">{{time}}</text>
|
||||
<view v-if="!time" class="uni-datetime-picker-time">
|
||||
<text class="uni-datetime-picker-text">{{selectTimeText}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</slot>
|
||||
</view>
|
||||
<view v-if="visible" id="mask" class="uni-datetime-picker-mask" @click="tiggerTimePicker"></view>
|
||||
<view v-if="visible" class="uni-datetime-picker-popup" :class="[dateShow && timeShow ? '' : 'fix-nvue-height']"
|
||||
:style="fixNvueBug">
|
||||
<view class="uni-title">
|
||||
<text class="uni-datetime-picker-text">{{selectTimeText}}</text>
|
||||
</view>
|
||||
<view v-if="dateShow" class="uni-datetime-picker__container-box">
|
||||
<picker-view class="uni-datetime-picker-view" :indicator-style="indicatorStyle" :value="ymd"
|
||||
@change="bindDateChange">
|
||||
<picker-view-column>
|
||||
<view class="uni-datetime-picker-item" v-for="(item,index) in years" :key="index">
|
||||
<text class="uni-datetime-picker-item">{{lessThanTen(item)}}</text>
|
||||
</view>
|
||||
</picker-view-column>
|
||||
<picker-view-column>
|
||||
<view class="uni-datetime-picker-item" v-for="(item,index) in months" :key="index">
|
||||
<text class="uni-datetime-picker-item">{{lessThanTen(item)}}</text>
|
||||
</view>
|
||||
</picker-view-column>
|
||||
<picker-view-column>
|
||||
<view class="uni-datetime-picker-item" v-for="(item,index) in days" :key="index">
|
||||
<text class="uni-datetime-picker-item">{{lessThanTen(item)}}</text>
|
||||
</view>
|
||||
</picker-view-column>
|
||||
</picker-view>
|
||||
<!-- 兼容 nvue 不支持伪类 -->
|
||||
<text class="uni-datetime-picker-sign sign-left">-</text>
|
||||
<text class="uni-datetime-picker-sign sign-right">-</text>
|
||||
</view>
|
||||
<view v-if="timeShow" class="uni-datetime-picker__container-box">
|
||||
<picker-view class="uni-datetime-picker-view" :class="[hideSecond ? 'time-hide-second' : '']"
|
||||
:indicator-style="indicatorStyle" :value="hms" @change="bindTimeChange">
|
||||
<picker-view-column>
|
||||
<view class="uni-datetime-picker-item" v-for="(item,index) in hours" :key="index">
|
||||
<text class="uni-datetime-picker-item">{{lessThanTen(item)}}</text>
|
||||
</view>
|
||||
</picker-view-column>
|
||||
<picker-view-column>
|
||||
<view class="uni-datetime-picker-item" v-for="(item,index) in minutes" :key="index">
|
||||
<text class="uni-datetime-picker-item">{{lessThanTen(item)}}</text>
|
||||
</view>
|
||||
</picker-view-column>
|
||||
<picker-view-column v-if="!hideSecond">
|
||||
<view class="uni-datetime-picker-item" v-for="(item,index) in seconds" :key="index">
|
||||
<text class="uni-datetime-picker-item">{{lessThanTen(item)}}</text>
|
||||
</view>
|
||||
</picker-view-column>
|
||||
</picker-view>
|
||||
<!-- 兼容 nvue 不支持伪类 -->
|
||||
<text class="uni-datetime-picker-sign" :class="[hideSecond ? 'sign-center' : 'sign-left']">:</text>
|
||||
<text v-if="!hideSecond" class="uni-datetime-picker-sign sign-right">:</text>
|
||||
</view>
|
||||
<view class="uni-datetime-picker-btn">
|
||||
<view @click="clearTime">
|
||||
<text class="uni-datetime-picker-btn-text">{{clearText}}</text>
|
||||
</view>
|
||||
<view class="uni-datetime-picker-btn-group">
|
||||
<view class="uni-datetime-picker-cancel" @click="tiggerTimePicker">
|
||||
<text class="uni-datetime-picker-btn-text">{{cancelText}}</text>
|
||||
</view>
|
||||
<view @click="setTime">
|
||||
<text class="uni-datetime-picker-btn-text">{{okText}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { initVueI18n } from '@dcloudio/uni-i18n'
|
||||
import i18nMessages from './i18n/index.js'
|
||||
const { t } = initVueI18n(i18nMessages)
|
||||
import { fixIosDateFormat } from './util'
|
||||
|
||||
/**
|
||||
* DatetimePicker 时间选择器
|
||||
* @description 可以同时选择日期和时间的选择器
|
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=xxx
|
||||
* @property {String} type = [datetime | date | time] 显示模式
|
||||
* @property {Boolean} multiple = [true|false] 是否多选
|
||||
* @property {String|Number} value 默认值
|
||||
* @property {String|Number} start 起始日期或时间
|
||||
* @property {String|Number} end 起始日期或时间
|
||||
* @property {String} return-type = [timestamp | string]
|
||||
* @event {Function} change 选中发生变化触发
|
||||
*/
|
||||
|
||||
export default {
|
||||
name: 'UniDatetimePicker',
|
||||
data() {
|
||||
return {
|
||||
indicatorStyle: `height: 50px;`,
|
||||
visible: false,
|
||||
fixNvueBug: {},
|
||||
dateShow: true,
|
||||
timeShow: true,
|
||||
title: '日期和时间',
|
||||
// 输入框当前时间
|
||||
time: '',
|
||||
// 当前的年月日时分秒
|
||||
year: 1920,
|
||||
month: 0,
|
||||
day: 0,
|
||||
hour: 0,
|
||||
minute: 0,
|
||||
second: 0,
|
||||
// 起始时间
|
||||
startYear: 1920,
|
||||
startMonth: 1,
|
||||
startDay: 1,
|
||||
startHour: 0,
|
||||
startMinute: 0,
|
||||
startSecond: 0,
|
||||
// 结束时间
|
||||
endYear: 2120,
|
||||
endMonth: 12,
|
||||
endDay: 31,
|
||||
endHour: 23,
|
||||
endMinute: 59,
|
||||
endSecond: 59,
|
||||
}
|
||||
},
|
||||
props: {
|
||||
type: {
|
||||
type: String,
|
||||
default: 'datetime'
|
||||
},
|
||||
value: {
|
||||
type: [String, Number],
|
||||
default: ''
|
||||
},
|
||||
modelValue: {
|
||||
type: [String, Number],
|
||||
default: ''
|
||||
},
|
||||
start: {
|
||||
type: [Number, String],
|
||||
default: ''
|
||||
},
|
||||
end: {
|
||||
type: [Number, String],
|
||||
default: ''
|
||||
},
|
||||
returnType: {
|
||||
type: String,
|
||||
default: 'string'
|
||||
},
|
||||
disabled: {
|
||||
type: [Boolean, String],
|
||||
default: false
|
||||
},
|
||||
border: {
|
||||
type: [Boolean, String],
|
||||
default: true
|
||||
},
|
||||
hideSecond: {
|
||||
type: [Boolean, String],
|
||||
default: false
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
// #ifndef VUE3
|
||||
value: {
|
||||
handler(newVal) {
|
||||
if (newVal) {
|
||||
this.parseValue(fixIosDateFormat(newVal))
|
||||
this.initTime(false)
|
||||
} else {
|
||||
this.time = ''
|
||||
this.parseValue(Date.now())
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
// #endif
|
||||
// #ifdef VUE3
|
||||
modelValue: {
|
||||
handler(newVal) {
|
||||
if (newVal) {
|
||||
this.parseValue(fixIosDateFormat(newVal))
|
||||
this.initTime(false)
|
||||
} else {
|
||||
this.time = ''
|
||||
this.parseValue(Date.now())
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
// #endif
|
||||
type: {
|
||||
handler(newValue) {
|
||||
if (newValue === 'date') {
|
||||
this.dateShow = true
|
||||
this.timeShow = false
|
||||
this.title = '日期'
|
||||
} else if (newValue === 'time') {
|
||||
this.dateShow = false
|
||||
this.timeShow = true
|
||||
this.title = '时间'
|
||||
} else {
|
||||
this.dateShow = true
|
||||
this.timeShow = true
|
||||
this.title = '日期和时间'
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
start: {
|
||||
handler(newVal) {
|
||||
this.parseDatetimeRange(fixIosDateFormat(newVal), 'start')
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
end: {
|
||||
handler(newVal) {
|
||||
this.parseDatetimeRange(fixIosDateFormat(newVal), 'end')
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
|
||||
// 月、日、时、分、秒可选范围变化后，检查当前值是否在范围内，不在则当前值重置为可选范围第一项
|
||||
months(newVal) {
|
||||
this.checkValue('month', this.month, newVal)
|
||||
},
|
||||
days(newVal) {
|
||||
this.checkValue('day', this.day, newVal)
|
||||
},
|
||||
hours(newVal) {
|
||||
this.checkValue('hour', this.hour, newVal)
|
||||
},
|
||||
minutes(newVal) {
|
||||
this.checkValue('minute', this.minute, newVal)
|
||||
},
|
||||
seconds(newVal) {
|
||||
this.checkValue('second', this.second, newVal)
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// 当前年、月、日、时、分、秒选择范围
|
||||
years() {
|
||||
return this.getCurrentRange('year')
|
||||
},
|
||||
|
||||
months() {
|
||||
return this.getCurrentRange('month')
|
||||
},
|
||||
|
||||
days() {
|
||||
return this.getCurrentRange('day')
|
||||
},
|
||||
|
||||
hours() {
|
||||
return this.getCurrentRange('hour')
|
||||
},
|
||||
|
||||
minutes() {
|
||||
return this.getCurrentRange('minute')
|
||||
},
|
||||
|
||||
seconds() {
|
||||
return this.getCurrentRange('second')
|
||||
},
|
||||
|
||||
// picker 当前值数组
|
||||
ymd() {
|
||||
return [this.year - this.minYear, this.month - this.minMonth, this.day - this.minDay]
|
||||
},
|
||||
hms() {
|
||||
return [this.hour - this.minHour, this.minute - this.minMinute, this.second - this.minSecond]
|
||||
},
|
||||
|
||||
// 当前 date 是 start
|
||||
currentDateIsStart() {
|
||||
return this.year === this.startYear && this.month === this.startMonth && this.day === this.startDay
|
||||
},
|
||||
|
||||
// 当前 date 是 end
|
||||
currentDateIsEnd() {
|
||||
return this.year === this.endYear && this.month === this.endMonth && this.day === this.endDay
|
||||
},
|
||||
|
||||
// 当前年、月、日、时、分、秒的最小值和最大值
|
||||
minYear() {
|
||||
return this.startYear
|
||||
},
|
||||
maxYear() {
|
||||
return this.endYear
|
||||
},
|
||||
minMonth() {
|
||||
if (this.year === this.startYear) {
|
||||
return this.startMonth
|
||||
} else {
|
||||
return 1
|
||||
}
|
||||
},
|
||||
maxMonth() {
|
||||
if (this.year === this.endYear) {
|
||||
return this.endMonth
|
||||
} else {
|
||||
return 12
|
||||
}
|
||||
},
|
||||
minDay() {
|
||||
if (this.year === this.startYear && this.month === this.startMonth) {
|
||||
return this.startDay
|
||||
} else {
|
||||
return 1
|
||||
}
|
||||
},
|
||||
maxDay() {
|
||||
if (this.year === this.endYear && this.month === this.endMonth) {
|
||||
return this.endDay
|
||||
} else {
|
||||
return this.daysInMonth(this.year, this.month)
|
||||
}
|
||||
},
|
||||
minHour() {
|
||||
if (this.type === 'datetime') {
|
||||
if (this.currentDateIsStart) {
|
||||
return this.startHour
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
}
|
||||
if (this.type === 'time') {
|
||||
return this.startHour
|
||||
}
|
||||
},
|
||||
maxHour() {
|
||||
if (this.type === 'datetime') {
|
||||
if (this.currentDateIsEnd) {
|
||||
return this.endHour
|
||||
} else {
|
||||
return 23
|
||||
}
|
||||
}
|
||||
if (this.type === 'time') {
|
||||
return this.endHour
|
||||
}
|
||||
},
|
||||
minMinute() {
|
||||
if (this.type === 'datetime') {
|
||||
if (this.currentDateIsStart && this.hour === this.startHour) {
|
||||
return this.startMinute
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
}
|
||||
if (this.type === 'time') {
|
||||
if (this.hour === this.startHour) {
|
||||
return this.startMinute
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
}
|
||||
},
|
||||
maxMinute() {
|
||||
if (this.type === 'datetime') {
|
||||
if (this.currentDateIsEnd && this.hour === this.endHour) {
|
||||
return this.endMinute
|
||||
} else {
|
||||
return 59
|
||||
}
|
||||
}
|
||||
if (this.type === 'time') {
|
||||
if (this.hour === this.endHour) {
|
||||
return this.endMinute
|
||||
} else {
|
||||
return 59
|
||||
}
|
||||
}
|
||||
},
|
||||
minSecond() {
|
||||
if (this.type === 'datetime') {
|
||||
if (this.currentDateIsStart && this.hour === this.startHour && this.minute === this.startMinute) {
|
||||
return this.startSecond
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
}
|
||||
if (this.type === 'time') {
|
||||
if (this.hour === this.startHour && this.minute === this.startMinute) {
|
||||
return this.startSecond
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
}
|
||||
},
|
||||
maxSecond() {
|
||||
if (this.type === 'datetime') {
|
||||
if (this.currentDateIsEnd && this.hour === this.endHour && this.minute === this.endMinute) {
|
||||
return this.endSecond
|
||||
} else {
|
||||
return 59
|
||||
}
|
||||
}
|
||||
if (this.type === 'time') {
|
||||
if (this.hour === this.endHour && this.minute === this.endMinute) {
|
||||
return this.endSecond
|
||||
} else {
|
||||
return 59
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* for i18n
|
||||
*/
|
||||
selectTimeText() {
|
||||
return t("uni-datetime-picker.selectTime")
|
||||
},
|
||||
okText() {
|
||||
return t("uni-datetime-picker.ok")
|
||||
},
|
||||
clearText() {
|
||||
return t("uni-datetime-picker.clear")
|
||||
},
|
||||
cancelText() {
|
||||
return t("uni-datetime-picker.cancel")
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
// #ifdef APP-NVUE
|
||||
const res = uni.getSystemInfoSync();
|
||||
this.fixNvueBug = {
|
||||
top: res.windowHeight / 2,
|
||||
left: res.windowWidth / 2
|
||||
}
|
||||
// #endif
|
||||
},
|
||||
|
||||
methods: {
|
||||
/**
|
||||
* @param {Object} item
|
||||
* 小于 10 在前面加个 0
|
||||
*/
|
||||
|
||||
lessThanTen(item) {
|
||||
return item < 10 ? '0' + item : item
|
||||
},
|
||||
|
||||
/**
|
||||
* 解析时分秒字符串，例如：00:00:00
|
||||
* @param {String} timeString
|
||||
*/
|
||||
parseTimeType(timeString) {
|
||||
if (timeString) {
|
||||
let timeArr = timeString.split(':')
|
||||
this.hour = Number(timeArr[0])
|
||||
this.minute = Number(timeArr[1])
|
||||
this.second = Number(timeArr[2])
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 解析选择器初始值，类型可以是字符串、时间戳，例如：2000-10-02、'08:30:00'、 1610695109000
|
||||
* @param {String | Number} datetime
|
||||
*/
|
||||
initPickerValue(datetime) {
|
||||
let defaultValue = null
|
||||
if (datetime) {
|
||||
defaultValue = this.compareValueWithStartAndEnd(datetime, this.start, this.end)
|
||||
} else {
|
||||
defaultValue = Date.now()
|
||||
defaultValue = this.compareValueWithStartAndEnd(defaultValue, this.start, this.end)
|
||||
}
|
||||
this.parseValue(defaultValue)
|
||||
},
|
||||
|
||||
/**
|
||||
* 初始值规则：
|
||||
* - 用户设置初始值 value
|
||||
* - 设置了起始时间 start、终止时间 end，并 start < value < end，初始值为 value， 否则初始值为 start
|
||||
* - 只设置了起始时间 start，并 start < value，初始值为 value，否则初始值为 start
|
||||
* - 只设置了终止时间 end，并 value < end，初始值为 value，否则初始值为 end
|
||||
* - 无起始终止时间，则初始值为 value
|
||||
* - 无初始值 value，则初始值为当前本地时间 Date.now()
|
||||
* @param {Object} value
|
||||
* @param {Object} dateBase
|
||||
*/
|
||||
compareValueWithStartAndEnd(value, start, end) {
|
||||
let winner = null
|
||||
value = this.superTimeStamp(value)
|
||||
start = this.superTimeStamp(start)
|
||||
end = this.superTimeStamp(end)
|
||||
|
||||
if (start && end) {
|
||||
if (value < start) {
|
||||
winner = new Date(start)
|
||||
} else if (value > end) {
|
||||
winner = new Date(end)
|
||||
} else {
|
||||
winner = new Date(value)
|
||||
}
|
||||
} else if (start && !end) {
|
||||
winner = start <= value ? new Date(value) : new Date(start)
|
||||
} else if (!start && end) {
|
||||
winner = value <= end ? new Date(value) : new Date(end)
|
||||
} else {
|
||||
winner = new Date(value)
|
||||
}
|
||||
|
||||
return winner
|
||||
},
|
||||
|
||||
/**
|
||||
* 转换为可比较的时间戳，接受日期、时分秒、时间戳
|
||||
* @param {Object} value
|
||||
*/
|
||||
superTimeStamp(value) {
|
||||
let dateBase = ''
|
||||
if (this.type === 'time' && value && typeof value === 'string') {
|
||||
const now = new Date()
|
||||
const year = now.getFullYear()
|
||||
const month = now.getMonth() + 1
|
||||
const day = now.getDate()
|
||||
dateBase = year + '/' + month + '/' + day + ' '
|
||||
}
|
||||
if (Number(value)) {
|
||||
value = parseInt(value)
|
||||
dateBase = 0
|
||||
}
|
||||
return this.createTimeStamp(dateBase + value)
|
||||
},
|
||||
|
||||
/**
|
||||
* 解析默认值 value，字符串、时间戳
|
||||
* @param {Object} defaultTime
|
||||
*/
|
||||
parseValue(value) {
|
||||
if (!value) {
|
||||
return
|
||||
}
|
||||
if (this.type === 'time' && typeof value === "string") {
|
||||
this.parseTimeType(value)
|
||||
} else {
|
||||
let defaultDate = null
|
||||
defaultDate = new Date(value)
|
||||
if (this.type !== 'time') {
|
||||
this.year = defaultDate.getFullYear()
|
||||
this.month = defaultDate.getMonth() + 1
|
||||
this.day = defaultDate.getDate()
|
||||
}
|
||||
if (this.type !== 'date') {
|
||||
this.hour = defaultDate.getHours()
|
||||
this.minute = defaultDate.getMinutes()
|
||||
this.second = defaultDate.getSeconds()
|
||||
}
|
||||
}
|
||||
if (this.hideSecond) {
|
||||
this.second = 0
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 解析可选择时间范围 start、end，年月日字符串、时间戳
|
||||
* @param {Object} defaultTime
|
||||
*/
|
||||
parseDatetimeRange(point, pointType) {
|
||||
// 时间为空，则重置为初始值
|
||||
if (!point) {
|
||||
if (pointType === 'start') {
|
||||
this.startYear = 1920
|
||||
this.startMonth = 1
|
||||
this.startDay = 1
|
||||
this.startHour = 0
|
||||
this.startMinute = 0
|
||||
this.startSecond = 0
|
||||
}
|
||||
if (pointType === 'end') {
|
||||
this.endYear = 2120
|
||||
this.endMonth = 12
|
||||
this.endDay = 31
|
||||
this.endHour = 23
|
||||
this.endMinute = 59
|
||||
this.endSecond = 59
|
||||
}
|
||||
return
|
||||
}
|
||||
if (this.type === 'time') {
|
||||
const pointArr = point.split(':')
|
||||
this[pointType + 'Hour'] = Number(pointArr[0])
|
||||
this[pointType + 'Minute'] = Number(pointArr[1])
|
||||
this[pointType + 'Second'] = Number(pointArr[2])
|
||||
} else {
|
||||
if (!point) {
|
||||
pointType === 'start' ? this.startYear = this.year - 60 : this.endYear = this.year + 60
|
||||
return
|
||||
}
|
||||
if (Number(point)) {
|
||||
point = parseInt(point)
|
||||
}
|
||||
// datetime 的 end 没有时分秒, 则不限制
|
||||
const hasTime = /[0-9]:[0-9]/
|
||||
if (this.type === 'datetime' && pointType === 'end' && typeof point === 'string' && !hasTime.test(
|
||||
point)) {
|
||||
point = point + ' 23:59:59'
|
||||
}
|
||||
const pointDate = new Date(point)
|
||||
this[pointType + 'Year'] = pointDate.getFullYear()
|
||||
this[pointType + 'Month'] = pointDate.getMonth() + 1
|
||||
this[pointType + 'Day'] = pointDate.getDate()
|
||||
if (this.type === 'datetime') {
|
||||
this[pointType + 'Hour'] = pointDate.getHours()
|
||||
this[pointType + 'Minute'] = pointDate.getMinutes()
|
||||
this[pointType + 'Second'] = pointDate.getSeconds()
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// 获取 年、月、日、时、分、秒 当前可选范围
|
||||
getCurrentRange(value) {
|
||||
const range = []
|
||||
for (let i = this['min' + this.capitalize(value)]; i <= this['max' + this.capitalize(value)]; i++) {
|
||||
range.push(i)
|
||||
}
|
||||
return range
|
||||
},
|
||||
|
||||
// 字符串首字母大写
|
||||
capitalize(str) {
|
||||
return str.charAt(0).toUpperCase() + str.slice(1)
|
||||
},
|
||||
|
||||
// 检查当前值是否在范围内，不在则当前值重置为可选范围第一项
|
||||
checkValue(name, value, values) {
|
||||
if (values.indexOf(value) === -1) {
|
||||
this[name] = values[0]
|
||||
}
|
||||
},
|
||||
|
||||
// 每个月的实际天数
|
||||
daysInMonth(year, month) { // Use 1 for January, 2 for February, etc.
|
||||
return new Date(year, month, 0).getDate();
|
||||
},
|
||||
|
||||
//兼容 iOS、safari 日期格式
|
||||
fixIosDateFormat(value) {
|
||||
if (typeof value === 'string') {
|
||||
value = value.replace(/-/g, '/')
|
||||
}
|
||||
return value
|
||||
},
|
||||
|
||||
/**
|
||||
* 生成时间戳
|
||||
* @param {Object} time
|
||||
*/
|
||||
createTimeStamp(time) {
|
||||
if (!time) return
|
||||
if (typeof time === "number") {
|
||||
return time
|
||||
} else {
|
||||
time = time.replace(/-/g, '/')
|
||||
if (this.type === 'date') {
|
||||
time = time + ' ' + '00:00:00'
|
||||
}
|
||||
return Date.parse(time)
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生成日期或时间的字符串
|
||||
*/
|
||||
createDomSting() {
|
||||
const yymmdd = this.year +
|
||||
'-' +
|
||||
this.lessThanTen(this.month) +
|
||||
'-' +
|
||||
this.lessThanTen(this.day)
|
||||
|
||||
let hhmmss = this.lessThanTen(this.hour) +
|
||||
':' +
|
||||
this.lessThanTen(this.minute)
|
||||
|
||||
if (!this.hideSecond) {
|
||||
hhmmss = hhmmss + ':' + this.lessThanTen(this.second)
|
||||
}
|
||||
|
||||
if (this.type === 'date') {
|
||||
return yymmdd
|
||||
} else if (this.type === 'time') {
|
||||
return hhmmss
|
||||
} else {
|
||||
return yymmdd + ' ' + hhmmss
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 初始化返回值，并抛出 change 事件
|
||||
*/
|
||||
initTime(emit = true) {
|
||||
this.time = this.createDomSting()
|
||||
if (!emit) return
|
||||
if (this.returnType === 'timestamp' && this.type !== 'time') {
|
||||
this.$emit('change', this.createTimeStamp(this.time))
|
||||
this.$emit('input', this.createTimeStamp(this.time))
|
||||
this.$emit('update:modelValue', this.createTimeStamp(this.time))
|
||||
} else {
|
||||
this.$emit('change', this.time)
|
||||
this.$emit('input', this.time)
|
||||
this.$emit('update:modelValue', this.time)
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户选择日期或时间更新 data
|
||||
* @param {Object} e
|
||||
*/
|
||||
bindDateChange(e) {
|
||||
const val = e.detail.value
|
||||
this.year = this.years[val[0]]
|
||||
this.month = this.months[val[1]]
|
||||
this.day = this.days[val[2]]
|
||||
},
|
||||
bindTimeChange(e) {
|
||||
const val = e.detail.value
|
||||
this.hour = this.hours[val[0]]
|
||||
this.minute = this.minutes[val[1]]
|
||||
this.second = this.seconds[val[2]]
|
||||
},
|
||||
|
||||
/**
|
||||
* 初始化弹出层
|
||||
*/
|
||||
initTimePicker() {
|
||||
if (this.disabled) return
|
||||
const value = fixIosDateFormat(this.time)
|
||||
this.initPickerValue(value)
|
||||
this.visible = !this.visible
|
||||
},
|
||||
|
||||
/**
|
||||
* 触发或关闭弹框
|
||||
*/
|
||||
tiggerTimePicker(e) {
|
||||
this.visible = !this.visible
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击“清空”按钮，清空当前值
|
||||
*/
|
||||
clearTime() {
|
||||
this.time = ''
|
||||
this.$emit('change', this.time)
|
||||
this.$emit('input', this.time)
|
||||
this.$emit('update:modelValue', this.time)
|
||||
this.tiggerTimePicker()
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击“确定”按钮
|
||||
*/
|
||||
setTime() {
|
||||
this.initTime()
|
||||
this.tiggerTimePicker()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
$uni-primary: #007aff !default;
|
||||
|
||||
.uni-datetime-picker {
|
||||
/* #ifndef APP-NVUE */
|
||||
/* width: 100%; */
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-datetime-picker-view {
|
||||
height: 130px;
|
||||
width: 270px;
|
||||
/* #ifndef APP-NVUE */
|
||||
cursor: pointer;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-datetime-picker-item {
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.uni-datetime-picker-btn {
|
||||
margin-top: 60px;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.uni-datetime-picker-btn-text {
|
||||
font-size: 14px;
|
||||
color: $uni-primary;
|
||||
}
|
||||
|
||||
.uni-datetime-picker-btn-group {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.uni-datetime-picker-cancel {
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
.uni-datetime-picker-mask {
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
transition-duration: 0.3s;
|
||||
z-index: 998;
|
||||
}
|
||||
|
||||
.uni-datetime-picker-popup {
|
||||
border-radius: 8px;
|
||||
padding: 30px;
|
||||
width: 270px;
|
||||
/* #ifdef APP-NVUE */
|
||||
height: 500px;
|
||||
/* #endif */
|
||||
/* #ifdef APP-NVUE */
|
||||
width: 330px;
|
||||
/* #endif */
|
||||
background-color: #fff;
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
transition-duration: 0.3s;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.fix-nvue-height {
|
||||
/* #ifdef APP-NVUE */
|
||||
height: 330px;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-datetime-picker-time {
|
||||
color: grey;
|
||||
}
|
||||
|
||||
.uni-datetime-picker-column {
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.uni-datetime-picker-timebox {
|
||||
|
||||
border: 1px solid #E5E5E5;
|
||||
border-radius: 5px;
|
||||
padding: 7px 10px;
|
||||
/* #ifndef APP-NVUE */
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-datetime-picker-timebox-pointer {
|
||||
/* #ifndef APP-NVUE */
|
||||
cursor: pointer;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
|
||||
.uni-datetime-picker-disabled {
|
||||
opacity: 0.4;
|
||||
/* #ifdef H5 */
|
||||
cursor: not-allowed !important;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-datetime-picker-text {
|
||||
font-size: 14px;
|
||||
line-height: 50px
|
||||
}
|
||||
|
||||
.uni-datetime-picker-sign {
|
||||
position: absolute;
|
||||
top: 53px;
|
||||
/* 减掉 10px 的元素高度，兼容nvue */
|
||||
color: #999;
|
||||
/* #ifdef APP-NVUE */
|
||||
font-size: 16px;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.sign-left {
|
||||
left: 86px;
|
||||
}
|
||||
|
||||
.sign-right {
|
||||
right: 86px;
|
||||
}
|
||||
|
||||
.sign-center {
|
||||
left: 135px;
|
||||
}
|
||||
|
||||
.uni-datetime-picker__container-box {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.time-hide-second {
|
||||
width: 180px;
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,453 @@
|
|||
class Calendar {
|
||||
constructor({
|
||||
selected,
|
||||
startDate,
|
||||
endDate,
|
||||
range,
|
||||
} = {}) {
|
||||
// 当前日期
|
||||
this.date = this.getDateObj(new Date()) // 当前初入日期
|
||||
// 打点信息
|
||||
this.selected = selected || [];
|
||||
// 起始时间
|
||||
this.startDate = startDate
|
||||
// 终止时间
|
||||
this.endDate = endDate
|
||||
// 是否范围选择
|
||||
this.range = range
|
||||
// 多选状态
|
||||
this.cleanMultipleStatus()
|
||||
// 每周日期
|
||||
this.weeks = {}
|
||||
this.lastHover = false
|
||||
}
|
||||
/**
|
||||
* 设置日期
|
||||
* @param {Object} date
|
||||
*/
|
||||
setDate(date) {
|
||||
const selectDate = this.getDateObj(date)
|
||||
this.getWeeks(selectDate.fullDate)
|
||||
}
|
||||
|
||||
/**
|
||||
* 清理多选状态
|
||||
*/
|
||||
cleanMultipleStatus() {
|
||||
this.multipleStatus = {
|
||||
before: '',
|
||||
after: '',
|
||||
data: []
|
||||
}
|
||||
}
|
||||
|
||||
setStartDate(startDate) {
|
||||
this.startDate = startDate
|
||||
}
|
||||
|
||||
setEndDate(endDate) {
|
||||
this.endDate = endDate
|
||||
}
|
||||
|
||||
getPreMonthObj(date){
|
||||
date = fixIosDateFormat(date)
|
||||
date = new Date(date)
|
||||
|
||||
const oldMonth = date.getMonth()
|
||||
date.setMonth(oldMonth - 1)
|
||||
const newMonth = date.getMonth()
|
||||
if(oldMonth !== 0 && newMonth - oldMonth === 0){
|
||||
date.setMonth(newMonth - 1)
|
||||
}
|
||||
return this.getDateObj(date)
|
||||
}
|
||||
getNextMonthObj(date){
|
||||
date = fixIosDateFormat(date)
|
||||
date = new Date(date)
|
||||
|
||||
const oldMonth = date.getMonth()
|
||||
date.setMonth(oldMonth + 1)
|
||||
const newMonth = date.getMonth()
|
||||
if(newMonth - oldMonth > 1){
|
||||
date.setMonth(newMonth - 1)
|
||||
}
|
||||
return this.getDateObj(date)
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取指定格式Date对象
|
||||
*/
|
||||
getDateObj(date) {
|
||||
date = fixIosDateFormat(date)
|
||||
date = new Date(date)
|
||||
|
||||
return {
|
||||
fullDate: getDate(date),
|
||||
year: date.getFullYear(),
|
||||
month: addZero(date.getMonth() + 1),
|
||||
date: addZero(date.getDate()),
|
||||
day: date.getDay()
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取上一个月日期集合
|
||||
*/
|
||||
getPreMonthDays(amount, dateObj) {
|
||||
const result = []
|
||||
for (let i = amount - 1; i >= 0; i--) {
|
||||
const month = dateObj.month > 1 ? dateObj.month -1 : 12
|
||||
const year = month === 12 ? dateObj.year - 1 : dateObj.year
|
||||
const date = new Date(year,month,-i).getDate()
|
||||
const fullDate = `${year}-${addZero(month)}-${addZero(date)}`
|
||||
let multiples = this.multipleStatus.data
|
||||
let multiplesStatus = -1
|
||||
if (this.range && multiples) {
|
||||
multiplesStatus = multiples.findIndex((item) => {
|
||||
return this.dateEqual(item, fullDate)
|
||||
})
|
||||
}
|
||||
const checked = multiplesStatus !== -1
|
||||
// 获取打点信息
|
||||
const extraInfo = this.selected && this.selected.find((item) => {
|
||||
if (this.dateEqual(fullDate, item.date)) {
|
||||
return item
|
||||
}
|
||||
})
|
||||
result.push({
|
||||
fullDate,
|
||||
year,
|
||||
month,
|
||||
date,
|
||||
multiple: this.range ? checked : false,
|
||||
beforeMultiple: this.isLogicBefore(fullDate, this.multipleStatus.before, this.multipleStatus.after),
|
||||
afterMultiple: this.isLogicAfter(fullDate, this.multipleStatus.before, this.multipleStatus.after),
|
||||
disable: (this.startDate && !dateCompare(this.startDate, fullDate)) || (this.endDate && !dateCompare(fullDate,this.endDate)),
|
||||
isToday: fullDate === this.date.fullDate,
|
||||
userChecked: false,
|
||||
extraInfo
|
||||
})
|
||||
}
|
||||
return result
|
||||
}
|
||||
/**
|
||||
* 获取本月日期集合
|
||||
*/
|
||||
getCurrentMonthDays(amount, dateObj) {
|
||||
const result = []
|
||||
const fullDate = this.date.fullDate
|
||||
for (let i = 1; i <= amount; i++) {
|
||||
const currentDate = `${dateObj.year}-${dateObj.month}-${addZero(i)}`
|
||||
const isToday = fullDate === currentDate
|
||||
// 获取打点信息
|
||||
const extraInfo = this.selected && this.selected.find((item) => {
|
||||
if (this.dateEqual(currentDate, item.date)) {
|
||||
return item
|
||||
}
|
||||
})
|
||||
|
||||
// 日期禁用
|
||||
let disableBefore = true
|
||||
let disableAfter = true
|
||||
if (this.startDate) {
|
||||
disableBefore = dateCompare(this.startDate, currentDate)
|
||||
}
|
||||
|
||||
if (this.endDate) {
|
||||
disableAfter = dateCompare(currentDate, this.endDate)
|
||||
}
|
||||
|
||||
let multiples = this.multipleStatus.data
|
||||
let multiplesStatus = -1
|
||||
if (this.range && multiples) {
|
||||
multiplesStatus = multiples.findIndex((item) => {
|
||||
return this.dateEqual(item, currentDate)
|
||||
})
|
||||
}
|
||||
const checked = multiplesStatus !== -1
|
||||
|
||||
result.push({
|
||||
fullDate: currentDate,
|
||||
year: dateObj.year,
|
||||
month: dateObj.month,
|
||||
date: i,
|
||||
multiple: this.range ? checked : false,
|
||||
beforeMultiple: this.isLogicBefore(currentDate, this.multipleStatus.before, this.multipleStatus.after),
|
||||
afterMultiple: this.isLogicAfter(currentDate, this.multipleStatus.before, this.multipleStatus.after),
|
||||
disable: (this.startDate && !dateCompare(this.startDate, currentDate)) || (this.endDate && !dateCompare(currentDate,this.endDate)),
|
||||
isToday,
|
||||
userChecked: false,
|
||||
extraInfo
|
||||
})
|
||||
}
|
||||
return result
|
||||
}
|
||||
/**
|
||||
* 获取下一个月日期集合
|
||||
*/
|
||||
_getNextMonthDays(amount, dateObj) {
|
||||
const result = []
|
||||
const month = dateObj.month + 1
|
||||
for (let i = 1; i <= amount; i++) {
|
||||
const month = dateObj.month === 12 ? 1 : dateObj.month*1 + 1
|
||||
const year = month === 1 ? dateObj.year + 1 : dateObj.year
|
||||
const fullDate = `${year}-${addZero(month)}-${addZero(i)}`
|
||||
let multiples = this.multipleStatus.data
|
||||
let multiplesStatus = -1
|
||||
if (this.range && multiples) {
|
||||
multiplesStatus = multiples.findIndex((item) => {
|
||||
return this.dateEqual(item, fullDate)
|
||||
})
|
||||
}
|
||||
const checked = multiplesStatus !== -1
|
||||
// 获取打点信息
|
||||
const extraInfo = this.selected && this.selected.find((item) => {
|
||||
if (this.dateEqual(fullDate, item.date)) {
|
||||
return item
|
||||
}
|
||||
})
|
||||
result.push({
|
||||
fullDate,
|
||||
year,
|
||||
date: i,
|
||||
month,
|
||||
multiple: this.range ? checked : false,
|
||||
beforeMultiple: this.isLogicBefore(fullDate, this.multipleStatus.before, this.multipleStatus.after),
|
||||
afterMultiple: this.isLogicAfter(fullDate, this.multipleStatus.before, this.multipleStatus.after),
|
||||
disable: (this.startDate && !dateCompare(this.startDate, fullDate)) || (this.endDate && !dateCompare(fullDate,this.endDate)),
|
||||
isToday: fullDate === this.date.fullDate,
|
||||
userChecked: false,
|
||||
extraInfo
|
||||
})
|
||||
}
|
||||
return result
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取当前日期详情
|
||||
* @param {Object} date
|
||||
*/
|
||||
getInfo(date) {
|
||||
if (!date) {
|
||||
date = new Date()
|
||||
}
|
||||
|
||||
return this.calendar.find(item => item.fullDate === this.getDateObj(date).fullDate)
|
||||
}
|
||||
|
||||
/**
|
||||
* 比较时间是否相等
|
||||
*/
|
||||
dateEqual(before, after) {
|
||||
before = new Date(fixIosDateFormat(before))
|
||||
after = new Date(fixIosDateFormat(after))
|
||||
return before.valueOf() === after.valueOf()
|
||||
}
|
||||
|
||||
/**
|
||||
* 比较真实起始日期
|
||||
*/
|
||||
|
||||
isLogicBefore(currentDate, before, after) {
|
||||
let logicBefore = before
|
||||
if (before && after) {
|
||||
logicBefore = dateCompare(before, after) ? before : after
|
||||
}
|
||||
return this.dateEqual(logicBefore, currentDate)
|
||||
}
|
||||
|
||||
isLogicAfter(currentDate, before, after) {
|
||||
let logicAfter = after
|
||||
if (before && after) {
|
||||
logicAfter = dateCompare(before, after) ? after : before
|
||||
}
|
||||
return this.dateEqual(logicAfter, currentDate)
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取日期范围内所有日期
|
||||
* @param {Object} begin
|
||||
* @param {Object} end
|
||||
*/
|
||||
geDateAll(begin, end) {
|
||||
var arr = []
|
||||
var ab = begin.split('-')
|
||||
var ae = end.split('-')
|
||||
var db = new Date()
|
||||
db.setFullYear(ab[0], ab[1] - 1, ab[2])
|
||||
var de = new Date()
|
||||
de.setFullYear(ae[0], ae[1] - 1, ae[2])
|
||||
var unixDb = db.getTime() - 24 * 60 * 60 * 1000
|
||||
var unixDe = de.getTime() - 24 * 60 * 60 * 1000
|
||||
for (var k = unixDb; k <= unixDe;) {
|
||||
k = k + 24 * 60 * 60 * 1000
|
||||
arr.push(this.getDateObj(new Date(parseInt(k))).fullDate)
|
||||
}
|
||||
return arr
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取多选状态
|
||||
*/
|
||||
setMultiple(fullDate) {
|
||||
if (!this.range) return
|
||||
|
||||
let {
|
||||
before,
|
||||
after
|
||||
} = this.multipleStatus
|
||||
if (before && after) {
|
||||
if (!this.lastHover) {
|
||||
this.lastHover = true
|
||||
return
|
||||
}
|
||||
this.multipleStatus.before = fullDate
|
||||
this.multipleStatus.after = ''
|
||||
this.multipleStatus.data = []
|
||||
this.multipleStatus.fulldate = ''
|
||||
this.lastHover = false
|
||||
} else {
|
||||
if (!before) {
|
||||
this.multipleStatus.before = fullDate
|
||||
this.lastHover = false
|
||||
} else {
|
||||
this.multipleStatus.after = fullDate
|
||||
if (dateCompare(this.multipleStatus.before, this.multipleStatus.after)) {
|
||||
this.multipleStatus.data = this.geDateAll(this.multipleStatus.before, this.multipleStatus
|
||||
.after);
|
||||
} else {
|
||||
this.multipleStatus.data = this.geDateAll(this.multipleStatus.after, this.multipleStatus
|
||||
.before);
|
||||
}
|
||||
this.lastHover = true
|
||||
}
|
||||
}
|
||||
this.getWeeks(fullDate)
|
||||
}
|
||||
|
||||
/**
|
||||
* 鼠标 hover 更新多选状态
|
||||
*/
|
||||
setHoverMultiple(fullDate) {
|
||||
if (!this.range || this.lastHover) return
|
||||
|
||||
const { before } = this.multipleStatus
|
||||
|
||||
if (!before) {
|
||||
this.multipleStatus.before = fullDate
|
||||
} else {
|
||||
this.multipleStatus.after = fullDate
|
||||
if (dateCompare(this.multipleStatus.before, this.multipleStatus.after)) {
|
||||
this.multipleStatus.data = this.geDateAll(this.multipleStatus.before, this.multipleStatus.after);
|
||||
} else {
|
||||
this.multipleStatus.data = this.geDateAll(this.multipleStatus.after, this.multipleStatus.before);
|
||||
}
|
||||
}
|
||||
this.getWeeks(fullDate)
|
||||
}
|
||||
|
||||
/**
|
||||
* 更新默认值多选状态
|
||||
*/
|
||||
setDefaultMultiple(before, after) {
|
||||
this.multipleStatus.before = before
|
||||
this.multipleStatus.after = after
|
||||
if (before && after) {
|
||||
if (dateCompare(before, after)) {
|
||||
this.multipleStatus.data = this.geDateAll(before, after);
|
||||
this.getWeeks(after)
|
||||
} else {
|
||||
this.multipleStatus.data = this.geDateAll(after, before);
|
||||
this.getWeeks(before)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取每周数据
|
||||
* @param {Object} dateData
|
||||
*/
|
||||
getWeeks(dateData) {
|
||||
const {
|
||||
year,
|
||||
month,
|
||||
} = this.getDateObj(dateData)
|
||||
|
||||
const preMonthDayAmount = new Date(year, month - 1, 1).getDay()
|
||||
const preMonthDays = this.getPreMonthDays(preMonthDayAmount, this.getDateObj(dateData))
|
||||
|
||||
const currentMonthDayAmount = new Date(year, month, 0).getDate()
|
||||
const currentMonthDays = this.getCurrentMonthDays(currentMonthDayAmount, this.getDateObj(dateData))
|
||||
|
||||
const nextMonthDayAmount = 42 - preMonthDayAmount - currentMonthDayAmount
|
||||
const nextMonthDays = this._getNextMonthDays(nextMonthDayAmount, this.getDateObj(dateData))
|
||||
|
||||
const calendarDays = [...preMonthDays, ...currentMonthDays, ...nextMonthDays]
|
||||
|
||||
const weeks = new Array(6)
|
||||
for (let i = 0; i < calendarDays.length; i++) {
|
||||
const index = Math.floor(i / 7)
|
||||
if(!weeks[index]){
|
||||
weeks[index] = new Array(7)
|
||||
}
|
||||
weeks[index][i % 7] = calendarDays[i]
|
||||
}
|
||||
|
||||
this.calendar = calendarDays
|
||||
this.weeks = weeks
|
||||
}
|
||||
}
|
||||
|
||||
function getDateTime(date, hideSecond){
|
||||
return `${getDate(date)} ${getTime(date, hideSecond)}`
|
||||
}
|
||||
|
||||
function getDate(date) {
|
||||
date = fixIosDateFormat(date)
|
||||
date = new Date(date)
|
||||
const year = date.getFullYear()
|
||||
const month = date.getMonth()+1
|
||||
const day = date.getDate()
|
||||
return `${year}-${addZero(month)}-${addZero(day)}`
|
||||
}
|
||||
|
||||
function getTime(date, hideSecond){
|
||||
date = fixIosDateFormat(date)
|
||||
date = new Date(date)
|
||||
const hour = date.getHours()
|
||||
const minute = date.getMinutes()
|
||||
const second = date.getSeconds()
|
||||
return hideSecond ? `${addZero(hour)}:${addZero(minute)}` : `${addZero(hour)}:${addZero(minute)}:${addZero(second)}`
|
||||
}
|
||||
|
||||
function addZero(num) {
|
||||
if(num < 10){
|
||||
num = `0${num}`
|
||||
}
|
||||
return num
|
||||
}
|
||||
|
||||
function getDefaultSecond(hideSecond) {
|
||||
return hideSecond ? '00:00' : '00:00:00'
|
||||
}
|
||||
|
||||
function dateCompare(startDate, endDate) {
|
||||
startDate = new Date(fixIosDateFormat(startDate))
|
||||
endDate = new Date(fixIosDateFormat(endDate))
|
||||
return startDate <= endDate
|
||||
}
|
||||
|
||||
function checkDate(date){
|
||||
const dateReg = /((19|20)\d{2})(-|\/)\d{1,2}(-|\/)\d{1,2}/g
|
||||
return date.match(dateReg)
|
||||
}
|
||||
|
||||
const dateTimeReg = /^\d{4}-(0?[1-9]|1[012])-(0?[1-9]|[12][0-9]|3[01])( [0-5]?[0-9]:[0-5]?[0-9]:[0-5]?[0-9])?$/
|
||||
function fixIosDateFormat(value) {
|
||||
if (typeof value === 'string' && dateTimeReg.test(value)) {
|
||||
value = value.replace(/-/g, '/')
|
||||
}
|
||||
return value
|
||||
}
|
||||
|
||||
export {Calendar, getDateTime, getDate, getTime, addZero, getDefaultSecond, dateCompare, checkDate, fixIosDateFormat}
|
||||
|
|
@ -0,0 +1,87 @@
|
|||
{
|
||||
"id": "uni-datetime-picker",
|
||||
"displayName": "uni-datetime-picker 日期选择器",
|
||||
"version": "2.2.24",
|
||||
"description": "uni-datetime-picker 日期时间选择器，支持日历，支持范围选择",
|
||||
"keywords": [
|
||||
"uni-datetime-picker",
|
||||
"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",
|
||||
"uni-icons"
|
||||
],
|
||||
"encrypt": [],
|
||||
"platforms": {
|
||||
"cloud": {
|
||||
"tcb": "y",
|
||||
"aliyun": "y"
|
||||
},
|
||||
"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"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
|
||||
|
||||
> `重要通知：组件升级更新 2.0.0 后，支持日期+时间范围选择，组件 ui 将使用日历选择日期，ui 变化较大，同时支持 PC 和 移动端。此版本不向后兼容，不再支持单独的时间选择（type=time）及相关的 hide-second 属性（时间选可使用内置组件 picker）。若仍需使用旧版本，可在插件市场下载*非uni_modules版本*，旧版本将不再维护`
|
||||
|
||||
## DatetimePicker 时间选择器
|
||||
|
||||
> **组件名：uni-datetime-picker**
|
||||
> 代码块： `uDatetimePicker`
|
||||
|
||||
|
||||
该组件的优势是，支持**时间戳**输入和输出（起始时间、终止时间也支持时间戳），可**同时选择**日期和时间。
|
||||
|
||||
若只是需要单独选择日期和时间，不需要时间戳输入和输出，可使用原生的 picker 组件。
|
||||
|
||||
**_点击 picker 默认值规则：_**
|
||||
|
||||
- 若设置初始值 value, 会显示在 picker 显示框中
|
||||
- 若无初始值 value，则初始值 value 为当前本地时间 Date.now()， 但不会显示在 picker 显示框中
|
||||
|
||||
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-datetime-picker)
|
||||
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
## 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目录规范
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,96 @@
|
|||
<template>
|
||||
<!-- #ifdef APP-NVUE -->
|
||||
<text :style="{ color: color, 'font-size': iconSize }" class="uni-icons" @click="_onClick">{{unicode}}</text>
|
||||
<!-- #endif -->
|
||||
<!-- #ifndef APP-NVUE -->
|
||||
<text :style="{ color: color, 'font-size': iconSize }" class="uni-icons" :class="['uniui-'+type,customPrefix,customPrefix?type:'']" @click="_onClick"></text>
|
||||
<!-- #endif -->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import icons from './icons.js';
|
||||
const getVal = (val) => {
|
||||
const reg = /^[0-9]*$/g
|
||||
return (typeof val === 'number' || reg.test(val) )? val + 'px' : val;
|
||||
}
|
||||
// #ifdef APP-NVUE
|
||||
var domModule = weex.requireModule('dom');
|
||||
import iconUrl from './uniicons.ttf'
|
||||
domModule.addRule('fontFace', {
|
||||
'fontFamily': "uniicons",
|
||||
'src': "url('"+iconUrl+"')"
|
||||
});
|
||||
// #endif
|
||||
|
||||
/**
|
||||
* Icons 图标
|
||||
* @description 用于展示 icons 图标
|
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=28
|
||||
* @property {Number} size 图标大小
|
||||
* @property {String} type 图标图案，参考示例
|
||||
* @property {String} color 图标颜色
|
||||
* @property {String} customPrefix 自定义图标
|
||||
* @event {Function} click 点击 Icon 触发事件
|
||||
*/
|
||||
export default {
|
||||
name: 'UniIcons',
|
||||
emits:['click'],
|
||||
props: {
|
||||
type: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
color: {
|
||||
type: String,
|
||||
default: '#333333'
|
||||
},
|
||||
size: {
|
||||
type: [Number, String],
|
||||
default: 16
|
||||
},
|
||||
customPrefix:{
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
icons: icons.glyphs
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
unicode(){
|
||||
let code = this.icons.find(v=>v.font_class === this.type)
|
||||
if(code){
|
||||
return unescape(`%u${code.unicode}`)
|
||||
}
|
||||
return ''
|
||||
},
|
||||
iconSize(){
|
||||
return getVal(this.size)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
_onClick() {
|
||||
this.$emit('click')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/* #ifndef APP-NVUE */
|
||||
@import './uniicons.css';
|
||||
@font-face {
|
||||
font-family: uniicons;
|
||||
src: url('./uniicons.ttf') format('truetype');
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
.uni-icons {
|
||||
font-family: uniicons;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,663 @@
|
|||
.uniui-color:before {
|
||||
content: "\e6cf";
|
||||
}
|
||||
|
||||
.uniui-wallet:before {
|
||||
content: "\e6b1";
|
||||
}
|
||||
|
||||
.uniui-settings-filled:before {
|
||||
content: "\e6ce";
|
||||
}
|
||||
|
||||
.uniui-auth-filled:before {
|
||||
content: "\e6cc";
|
||||
}
|
||||
|
||||
.uniui-shop-filled:before {
|
||||
content: "\e6cd";
|
||||
}
|
||||
|
||||
.uniui-staff-filled:before {
|
||||
content: "\e6cb";
|
||||
}
|
||||
|
||||
.uniui-vip-filled:before {
|
||||
content: "\e6c6";
|
||||
}
|
||||
|
||||
.uniui-plus-filled:before {
|
||||
content: "\e6c7";
|
||||
}
|
||||
|
||||
.uniui-folder-add-filled:before {
|
||||
content: "\e6c8";
|
||||
}
|
||||
|
||||
.uniui-color-filled:before {
|
||||
content: "\e6c9";
|
||||
}
|
||||
|
||||
.uniui-tune-filled:before {
|
||||
content: "\e6ca";
|
||||
}
|
||||
|
||||
.uniui-calendar-filled:before {
|
||||
content: "\e6c0";
|
||||
}
|
||||
|
||||
.uniui-notification-filled:before {
|
||||
content: "\e6c1";
|
||||
}
|
||||
|
||||
.uniui-wallet-filled:before {
|
||||
content: "\e6c2";
|
||||
}
|
||||
|
||||
.uniui-medal-filled:before {
|
||||
content: "\e6c3";
|
||||
}
|
||||
|
||||
.uniui-gift-filled:before {
|
||||
content: "\e6c4";
|
||||
}
|
||||
|
||||
.uniui-fire-filled:before {
|
||||
content: "\e6c5";
|
||||
}
|
||||
|
||||
.uniui-refreshempty:before {
|
||||
content: "\e6bf";
|
||||
}
|
||||
|
||||
.uniui-location-filled:before {
|
||||
content: "\e6af";
|
||||
}
|
||||
|
||||
.uniui-person-filled:before {
|
||||
content: "\e69d";
|
||||
}
|
||||
|
||||
.uniui-personadd-filled:before {
|
||||
content: "\e698";
|
||||
}
|
||||
|
||||
.uniui-back:before {
|
||||
content: "\e6b9";
|
||||
}
|
||||
|
||||
.uniui-forward:before {
|
||||
content: "\e6ba";
|
||||
}
|
||||
|
||||
.uniui-arrow-right:before {
|
||||
content: "\e6bb";
|
||||
}
|
||||
|
||||
.uniui-arrowthinright:before {
|
||||
content: "\e6bb";
|
||||
}
|
||||
|
||||
.uniui-arrow-left:before {
|
||||
content: "\e6bc";
|
||||
}
|
||||
|
||||
.uniui-arrowthinleft:before {
|
||||
content: "\e6bc";
|
||||
}
|
||||
|
||||
.uniui-arrow-up:before {
|
||||
content: "\e6bd";
|
||||
}
|
||||
|
||||
.uniui-arrowthinup:before {
|
||||
content: "\e6bd";
|
||||
}
|
||||
|
||||
.uniui-arrow-down:before {
|
||||
content: "\e6be";
|
||||
}
|
||||
|
||||
.uniui-arrowthindown:before {
|
||||
content: "\e6be";
|
||||
}
|
||||
|
||||
.uniui-bottom:before {
|
||||
content: "\e6b8";
|
||||
}
|
||||
|
||||
.uniui-arrowdown:before {
|
||||
content: "\e6b8";
|
||||
}
|
||||
|
||||
.uniui-right:before {
|
||||
content: "\e6b5";
|
||||
}
|
||||
|
||||
.uniui-arrowright:before {
|
||||
content: "\e6b5";
|
||||
}
|
||||
|
||||
.uniui-top:before {
|
||||
content: "\e6b6";
|
||||
}
|
||||
|
||||
.uniui-arrowup:before {
|
||||
content: "\e6b6";
|
||||
}
|
||||
|
||||
.uniui-left:before {
|
||||
content: "\e6b7";
|
||||
}
|
||||
|
||||
.uniui-arrowleft:before {
|
||||
content: "\e6b7";
|
||||
}
|
||||
|
||||
.uniui-eye:before {
|
||||
content: "\e651";
|
||||
}
|
||||
|
||||
.uniui-eye-filled:before {
|
||||
content: "\e66a";
|
||||
}
|
||||
|
||||
.uniui-eye-slash:before {
|
||||
content: "\e6b3";
|
||||
}
|
||||
|
||||
.uniui-eye-slash-filled:before {
|
||||
content: "\e6b4";
|
||||
}
|
||||
|
||||
.uniui-info-filled:before {
|
||||
content: "\e649";
|
||||
}
|
||||
|
||||
.uniui-reload:before {
|
||||
content: "\e6b2";
|
||||
}
|
||||
|
||||
.uniui-micoff-filled:before {
|
||||
content: "\e6b0";
|
||||
}
|
||||
|
||||
.uniui-map-pin-ellipse:before {
|
||||
content: "\e6ac";
|
||||
}
|
||||
|
||||
.uniui-map-pin:before {
|
||||
content: "\e6ad";
|
||||
}
|
||||
|
||||
.uniui-location:before {
|
||||
content: "\e6ae";
|
||||
}
|
||||
|
||||
.uniui-starhalf:before {
|
||||
content: "\e683";
|
||||
}
|
||||
|
||||
.uniui-star:before {
|
||||
content: "\e688";
|
||||
}
|
||||
|
||||
.uniui-star-filled:before {
|
||||
content: "\e68f";
|
||||
}
|
||||
|
||||
.uniui-calendar:before {
|
||||
content: "\e6a0";
|
||||
}
|
||||
|
||||
.uniui-fire:before {
|
||||
content: "\e6a1";
|
||||
}
|
||||
|
||||
.uniui-medal:before {
|
||||
content: "\e6a2";
|
||||
}
|
||||
|
||||
.uniui-font:before {
|
||||
content: "\e6a3";
|
||||
}
|
||||
|
||||
.uniui-gift:before {
|
||||
content: "\e6a4";
|
||||
}
|
||||
|
||||
.uniui-link:before {
|
||||
content: "\e6a5";
|
||||
}
|
||||
|
||||
.uniui-notification:before {
|
||||
content: "\e6a6";
|
||||
}
|
||||
|
||||
.uniui-staff:before {
|
||||
content: "\e6a7";
|
||||
}
|
||||
|
||||
.uniui-vip:before {
|
||||
content: "\e6a8";
|
||||
}
|
||||
|
||||
.uniui-folder-add:before {
|
||||
content: "\e6a9";
|
||||
}
|
||||
|
||||
.uniui-tune:before {
|
||||
content: "\e6aa";
|
||||
}
|
||||
|
||||
.uniui-auth:before {
|
||||
content: "\e6ab";
|
||||
}
|
||||
|
||||
.uniui-person:before {
|
||||
content: "\e699";
|
||||
}
|
||||
|
||||
.uniui-email-filled:before {
|
||||
content: "\e69a";
|
||||
}
|
||||
|
||||
.uniui-phone-filled:before {
|
||||
content: "\e69b";
|
||||
}
|
||||
|
||||
.uniui-phone:before {
|
||||
content: "\e69c";
|
||||
}
|
||||
|
||||
.uniui-email:before {
|
||||
content: "\e69e";
|
||||
}
|
||||
|
||||
.uniui-personadd:before {
|
||||
content: "\e69f";
|
||||
}
|
||||
|
||||
.uniui-chatboxes-filled:before {
|
||||
content: "\e692";
|
||||
}
|
||||
|
||||
.uniui-contact:before {
|
||||
content: "\e693";
|
||||
}
|
||||
|
||||
.uniui-chatbubble-filled:before {
|
||||
content: "\e694";
|
||||
}
|
||||
|
||||
.uniui-contact-filled:before {
|
||||
content: "\e695";
|
||||
}
|
||||
|
||||
.uniui-chatboxes:before {
|
||||
content: "\e696";
|
||||
}
|
||||
|
||||
.uniui-chatbubble:before {
|
||||
content: "\e697";
|
||||
}
|
||||
|
||||
.uniui-upload-filled:before {
|
||||
content: "\e68e";
|
||||
}
|
||||
|
||||
.uniui-upload:before {
|
||||
content: "\e690";
|
||||
}
|
||||
|
||||
.uniui-weixin:before {
|
||||
content: "\e691";
|
||||
}
|
||||
|
||||
.uniui-compose:before {
|
||||
content: "\e67f";
|
||||
}
|
||||
|
||||
.uniui-qq:before {
|
||||
content: "\e680";
|
||||
}
|
||||
|
||||
.uniui-download-filled:before {
|
||||
content: "\e681";
|
||||
}
|
||||
|
||||
.uniui-pyq:before {
|
||||
content: "\e682";
|
||||
}
|
||||
|
||||
.uniui-sound:before {
|
||||
content: "\e684";
|
||||
}
|
||||
|
||||
.uniui-trash-filled:before {
|
||||
content: "\e685";
|
||||
}
|
||||
|
||||
.uniui-sound-filled:before {
|
||||
content: "\e686";
|
||||
}
|
||||
|
||||
.uniui-trash:before {
|
||||
content: "\e687";
|
||||
}
|
||||
|
||||
.uniui-videocam-filled:before {
|
||||
content: "\e689";
|
||||
}
|
||||
|
||||
.uniui-spinner-cycle:before {
|
||||
content: "\e68a";
|
||||
}
|
||||
|
||||
.uniui-weibo:before {
|
||||
content: "\e68b";
|
||||
}
|
||||
|
||||
.uniui-videocam:before {
|
||||
content: "\e68c";
|
||||
}
|
||||
|
||||
.uniui-download:before {
|
||||
content: "\e68d";
|
||||
}
|
||||
|
||||
.uniui-help:before {
|
||||
content: "\e679";
|
||||
}
|
||||
|
||||
.uniui-navigate-filled:before {
|
||||
content: "\e67a";
|
||||
}
|
||||
|
||||
.uniui-plusempty:before {
|
||||
content: "\e67b";
|
||||
}
|
||||
|
||||
.uniui-smallcircle:before {
|
||||
content: "\e67c";
|
||||
}
|
||||
|
||||
.uniui-minus-filled:before {
|
||||
content: "\e67d";
|
||||
}
|
||||
|
||||
.uniui-micoff:before {
|
||||
content: "\e67e";
|
||||
}
|
||||
|
||||
.uniui-closeempty:before {
|
||||
content: "\e66c";
|
||||
}
|
||||
|
||||
.uniui-clear:before {
|
||||
content: "\e66d";
|
||||
}
|
||||
|
||||
.uniui-navigate:before {
|
||||
content: "\e66e";
|
||||
}
|
||||
|
||||
.uniui-minus:before {
|
||||
content: "\e66f";
|
||||
}
|
||||
|
||||
.uniui-image:before {
|
||||
content: "\e670";
|
||||
}
|
||||
|
||||
.uniui-mic:before {
|
||||
content: "\e671";
|
||||
}
|
||||
|
||||
.uniui-paperplane:before {
|
||||
content: "\e672";
|
||||
}
|
||||
|
||||
.uniui-close:before {
|
||||
content: "\e673";
|
||||
}
|
||||
|
||||
.uniui-help-filled:before {
|
||||
content: "\e674";
|
||||
}
|
||||
|
||||
.uniui-paperplane-filled:before {
|
||||
content: "\e675";
|
||||
}
|
||||
|
||||
.uniui-plus:before {
|
||||
content: "\e676";
|
||||
}
|
||||
|
||||
.uniui-mic-filled:before {
|
||||
content: "\e677";
|
||||
}
|
||||
|
||||
.uniui-image-filled:before {
|
||||
content: "\e678";
|
||||
}
|
||||
|
||||
.uniui-locked-filled:before {
|
||||
content: "\e668";
|
||||
}
|
||||
|
||||
.uniui-info:before {
|
||||
content: "\e669";
|
||||
}
|
||||
|
||||
.uniui-locked:before {
|
||||
content: "\e66b";
|
||||
}
|
||||
|
||||
.uniui-camera-filled:before {
|
||||
content: "\e658";
|
||||
}
|
||||
|
||||
.uniui-chat-filled:before {
|
||||
content: "\e659";
|
||||
}
|
||||
|
||||
.uniui-camera:before {
|
||||
content: "\e65a";
|
||||
}
|
||||
|
||||
.uniui-circle:before {
|
||||
content: "\e65b";
|
||||
}
|
||||
|
||||
.uniui-checkmarkempty:before {
|
||||
content: "\e65c";
|
||||
}
|
||||
|
||||
.uniui-chat:before {
|
||||
content: "\e65d";
|
||||
}
|
||||
|
||||
.uniui-circle-filled:before {
|
||||
content: "\e65e";
|
||||
}
|
||||
|
||||
.uniui-flag:before {
|
||||
content: "\e65f";
|
||||
}
|
||||
|
||||
.uniui-flag-filled:before {
|
||||
content: "\e660";
|
||||
}
|
||||
|
||||
.uniui-gear-filled:before {
|
||||
content: "\e661";
|
||||
}
|
||||
|
||||
.uniui-home:before {
|
||||
content: "\e662";
|
||||
}
|
||||
|
||||
.uniui-home-filled:before {
|
||||
content: "\e663";
|
||||
}
|
||||
|
||||
.uniui-gear:before {
|
||||
content: "\e664";
|
||||
}
|
||||
|
||||
.uniui-smallcircle-filled:before {
|
||||
content: "\e665";
|
||||
}
|
||||
|
||||
.uniui-map-filled:before {
|
||||
content: "\e666";
|
||||
}
|
||||
|
||||
.uniui-map:before {
|
||||
content: "\e667";
|
||||
}
|
||||
|
||||
.uniui-refresh-filled:before {
|
||||
content: "\e656";
|
||||
}
|
||||
|
||||
.uniui-refresh:before {
|
||||
content: "\e657";
|
||||
}
|
||||
|
||||
.uniui-cloud-upload:before {
|
||||
content: "\e645";
|
||||
}
|
||||
|
||||
.uniui-cloud-download-filled:before {
|
||||
content: "\e646";
|
||||
}
|
||||
|
||||
.uniui-cloud-download:before {
|
||||
content: "\e647";
|
||||
}
|
||||
|
||||
.uniui-cloud-upload-filled:before {
|
||||
content: "\e648";
|
||||
}
|
||||
|
||||
.uniui-redo:before {
|
||||
content: "\e64a";
|
||||
}
|
||||
|
||||
.uniui-images-filled:before {
|
||||
content: "\e64b";
|
||||
}
|
||||
|
||||
.uniui-undo-filled:before {
|
||||
content: "\e64c";
|
||||
}
|
||||
|
||||
.uniui-more:before {
|
||||
content: "\e64d";
|
||||
}
|
||||
|
||||
.uniui-more-filled:before {
|
||||
content: "\e64e";
|
||||
}
|
||||
|
||||
.uniui-undo:before {
|
||||
content: "\e64f";
|
||||
}
|
||||
|
||||
.uniui-images:before {
|
||||
content: "\e650";
|
||||
}
|
||||
|
||||
.uniui-paperclip:before {
|
||||
content: "\e652";
|
||||
}
|
||||
|
||||
.uniui-settings:before {
|
||||
content: "\e653";
|
||||
}
|
||||
|
||||
.uniui-search:before {
|
||||
content: "\e654";
|
||||
}
|
||||
|
||||
.uniui-redo-filled:before {
|
||||
content: "\e655";
|
||||
}
|
||||
|
||||
.uniui-list:before {
|
||||
content: "\e644";
|
||||
}
|
||||
|
||||
.uniui-mail-open-filled:before {
|
||||
content: "\e63a";
|
||||
}
|
||||
|
||||
.uniui-hand-down-filled:before {
|
||||
content: "\e63c";
|
||||
}
|
||||
|
||||
.uniui-hand-down:before {
|
||||
content: "\e63d";
|
||||
}
|
||||
|
||||
.uniui-hand-up-filled:before {
|
||||
content: "\e63e";
|
||||
}
|
||||
|
||||
.uniui-hand-up:before {
|
||||
content: "\e63f";
|
||||
}
|
||||
|
||||
.uniui-heart-filled:before {
|
||||
content: "\e641";
|
||||
}
|
||||
|
||||
.uniui-mail-open:before {
|
||||
content: "\e643";
|
||||
}
|
||||
|
||||
.uniui-heart:before {
|
||||
content: "\e639";
|
||||
}
|
||||
|
||||
.uniui-loop:before {
|
||||
content: "\e633";
|
||||
}
|
||||
|
||||
.uniui-pulldown:before {
|
||||
content: "\e632";
|
||||
}
|
||||
|
||||
.uniui-scan:before {
|
||||
content: "\e62a";
|
||||
}
|
||||
|
||||
.uniui-bars:before {
|
||||
content: "\e627";
|
||||
}
|
||||
|
||||
.uniui-cart-filled:before {
|
||||
content: "\e629";
|
||||
}
|
||||
|
||||
.uniui-checkbox:before {
|
||||
content: "\e62b";
|
||||
}
|
||||
|
||||
.uniui-checkbox-filled:before {
|
||||
content: "\e62c";
|
||||
}
|
||||
|
||||
.uniui-shop:before {
|
||||
content: "\e62f";
|
||||
}
|
||||
|
||||
.uniui-headphones:before {
|
||||
content: "\e630";
|
||||
}
|
||||
|
||||
.uniui-cart:before {
|
||||
content: "\e631";
|
||||
}
|
||||
Binary file not shown.
|
|
@ -0,0 +1,86 @@
|
|||
{
|
||||
"id": "uni-icons",
|
||||
"displayName": "uni-icons 图标",
|
||||
"version": "1.3.5",
|
||||
"description": "图标组件，用于展示移动端常见的图标，可自定义颜色、大小。",
|
||||
"keywords": [
|
||||
"uni-ui",
|
||||
"uniui",
|
||||
"icon",
|
||||
"图标"
|
||||
],
|
||||
"repository": "https://github.com/dcloudio/uni-ui",
|
||||
"engines": {
|
||||
"HBuilderX": "^3.2.14"
|
||||
},
|
||||
"directories": {
|
||||
"example": "../../temps/example_temps"
|
||||
},
|
||||
"dcloudext": {
|
||||
"category": [
|
||||
"前端组件",
|
||||
"通用组件"
|
||||
],
|
||||
"sale": {
|
||||
"regular": {
|
||||
"price": "0.00"
|
||||
},
|
||||
"sourcecode": {
|
||||
"price": "0.00"
|
||||
}
|
||||
},
|
||||
"contact": {
|
||||
"qq": ""
|
||||
},
|
||||
"declaration": {
|
||||
"ads": "无",
|
||||
"data": "无",
|
||||
"permissions": "无"
|
||||
},
|
||||
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
|
||||
},
|
||||
"uni_modules": {
|
||||
"dependencies": ["uni-scss"],
|
||||
"encrypt": [],
|
||||
"platforms": {
|
||||
"cloud": {
|
||||
"tcb": "y",
|
||||
"aliyun": "y"
|
||||
},
|
||||
"client": {
|
||||
"App": {
|
||||
"app-vue": "y",
|
||||
"app-nvue": "y"
|
||||
},
|
||||
"H5-mobile": {
|
||||
"Safari": "y",
|
||||
"Android Browser": "y",
|
||||
"微信浏览器(Android)": "y",
|
||||
"QQ浏览器(Android)": "y"
|
||||
},
|
||||
"H5-pc": {
|
||||
"Chrome": "y",
|
||||
"IE": "y",
|
||||
"Edge": "y",
|
||||
"Firefox": "y",
|
||||
"Safari": "y"
|
||||
},
|
||||
"小程序": {
|
||||
"微信": "y",
|
||||
"阿里": "y",
|
||||
"百度": "y",
|
||||
"字节跳动": "y",
|
||||
"QQ": "y"
|
||||
},
|
||||
"快应用": {
|
||||
"华为": "u",
|
||||
"联盟": "u"
|
||||
},
|
||||
"Vue": {
|
||||
"vue2": "y",
|
||||
"vue3": "y"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
## Icons 图标
|
||||
> **组件名：uni-icons**
|
||||
> 代码块： `uIcons`
|
||||
|
||||
用于展示 icons 图标 。
|
||||
|
||||
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-icons)
|
||||
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839
|
||||
|
|
@ -0,0 +1,68 @@
|
|||
## 1.8.3（2023-04-17）
|
||||
- 修复 uni-popup 重复打开时的 bug
|
||||
## 1.8.2（2023-02-02）
|
||||
- uni-popup-dialog 组件新增 inputType 属性
|
||||
## 1.8.1（2022-12-01）
|
||||
- 修复 nvue 下 v-show 报错
|
||||
## 1.8.0（2022-11-29）
|
||||
- 优化 主题样式
|
||||
## 1.7.9（2022-04-02）
|
||||
- 修复 弹出层内部无法滚动的bug
|
||||
## 1.7.8（2022-03-28）
|
||||
- 修复 小程序中高度错误的bug
|
||||
## 1.7.7（2022-03-17）
|
||||
- 修复 快速调用open出现问题的Bug
|
||||
## 1.7.6（2022-02-14）
|
||||
- 修复 safeArea 属性不能设置为false的bug
|
||||
## 1.7.5（2022-01-19）
|
||||
- 修复 isMaskClick 失效的bug
|
||||
## 1.7.4（2022-01-19）
|
||||
- 新增 cancelText \ confirmText 属性 ，可自定义文本
|
||||
- 新增 maskBackgroundColor 属性 ，可以修改蒙版颜色
|
||||
- 优化 maskClick属性 更新为 isMaskClick ，解决微信小程序警告的问题
|
||||
## 1.7.3（2022-01-13）
|
||||
- 修复 设置 safeArea 属性不生效的bug
|
||||
## 1.7.2（2021-11-26）
|
||||
- 优化 组件示例
|
||||
## 1.7.1（2021-11-26）
|
||||
- 修复 vuedoc 文字错误
|
||||
## 1.7.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-popup](https://uniapp.dcloud.io/component/uniui/uni-popup)
|
||||
## 1.6.2（2021-08-24）
|
||||
- 新增 支持国际化
|
||||
## 1.6.1（2021-07-30）
|
||||
- 优化 vue3下事件警告的问题
|
||||
## 1.6.0（2021-07-13）
|
||||
- 组件兼容 vue3，如何创建vue3项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
|
||||
## 1.5.0（2021-06-23）
|
||||
- 新增 mask-click 遮罩层点击事件
|
||||
## 1.4.5（2021-06-22）
|
||||
- 修复 nvue 平台中间弹出后，点击内容，再点击遮罩无法关闭的Bug
|
||||
## 1.4.4（2021-06-18）
|
||||
- 修复 H5平台中间弹出后，点击内容，再点击遮罩无法关闭的Bug
|
||||
## 1.4.3（2021-06-08）
|
||||
- 修复 错误的 watch 字段
|
||||
- 修复 safeArea 属性不生效的问题
|
||||
- 修复 点击内容，再点击遮罩无法关闭的Bug
|
||||
## 1.4.2（2021-05-12）
|
||||
- 新增 组件示例地址
|
||||
## 1.4.1（2021-04-29）
|
||||
- 修复 组件内放置 input 、textarea 组件，无法聚焦的问题
|
||||
## 1.4.0 （2021-04-29）
|
||||
- 新增 type 属性的 left\right 值，支持左右弹出
|
||||
- 新增 open(String:type) 方法参数 ，可以省略 type 属性 ，直接传入类型打开指定弹窗
|
||||
- 新增 backgroundColor 属性，可定义主窗口背景色,默认不显示背景色
|
||||
- 新增 safeArea 属性，是否适配底部安全区
|
||||
- 修复 App\h5\微信小程序底部安全区占位不对的Bug
|
||||
- 修复 App 端弹出等待的Bug
|
||||
- 优化 提升低配设备性能，优化动画卡顿问题
|
||||
- 优化 更简单的组件自定义方式
|
||||
## 1.2.9（2021-02-05）
|
||||
- 优化 组件引用关系，通过uni_modules引用组件
|
||||
## 1.2.8（2021-02-05）
|
||||
- 调整为uni_modules目录规范
|
||||
## 1.2.7（2021-02-05）
|
||||
- 调整为uni_modules目录规范
|
||||
- 新增 支持 PC 端
|
||||
- 新增 uni-popup-message 、uni-popup-dialog扩展组件支持 PC 端
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
// #ifdef H5
|
||||
export default {
|
||||
name: 'Keypress',
|
||||
props: {
|
||||
disable: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
const keyNames = {
|
||||
esc: ['Esc', 'Escape'],
|
||||
tab: 'Tab',
|
||||
enter: 'Enter',
|
||||
space: [' ', 'Spacebar'],
|
||||
up: ['Up', 'ArrowUp'],
|
||||
left: ['Left', 'ArrowLeft'],
|
||||
right: ['Right', 'ArrowRight'],
|
||||
down: ['Down', 'ArrowDown'],
|
||||
delete: ['Backspace', 'Delete', 'Del']
|
||||
}
|
||||
const listener = ($event) => {
|
||||
if (this.disable) {
|
||||
return
|
||||
}
|
||||
const keyName = Object.keys(keyNames).find(key => {
|
||||
const keyName = $event.key
|
||||
const value = keyNames[key]
|
||||
return value === keyName || (Array.isArray(value) && value.includes(keyName))
|
||||
})
|
||||
if (keyName) {
|
||||
// 避免和其他按键事件冲突
|
||||
setTimeout(() => {
|
||||
this.$emit(keyName, {})
|
||||
}, 0)
|
||||
}
|
||||
}
|
||||
document.addEventListener('keyup', listener)
|
||||
this.$once('hook:beforeDestroy', () => {
|
||||
document.removeEventListener('keyup', listener)
|
||||
})
|
||||
},
|
||||
render: () => {}
|
||||
}
|
||||
// #endif
|
||||
|
|
@ -0,0 +1,275 @@
|
|||
<template>
|
||||
<view class="uni-popup-dialog">
|
||||
<view class="uni-dialog-title">
|
||||
<text class="uni-dialog-title-text" :class="['uni-popup__'+dialogType]">{{titleText}}</text>
|
||||
</view>
|
||||
<view v-if="mode === 'base'" class="uni-dialog-content">
|
||||
<slot>
|
||||
<text class="uni-dialog-content-text">{{content}}</text>
|
||||
</slot>
|
||||
</view>
|
||||
<view v-else class="uni-dialog-content">
|
||||
<slot>
|
||||
<input class="uni-dialog-input" v-model="val" :type="inputType" :placeholder="placeholderText" :focus="focus" >
|
||||
</slot>
|
||||
</view>
|
||||
<view class="uni-dialog-button-group">
|
||||
<view class="uni-dialog-button" @click="closeDialog">
|
||||
<text class="uni-dialog-button-text">{{closeText}}</text>
|
||||
</view>
|
||||
<view class="uni-dialog-button uni-border-left" @click="onOk">
|
||||
<text class="uni-dialog-button-text uni-button-color">{{okText}}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import popup from '../uni-popup/popup.js'
|
||||
import {
|
||||
initVueI18n
|
||||
} from '@dcloudio/uni-i18n'
|
||||
import messages from '../uni-popup/i18n/index.js'
|
||||
const { t } = initVueI18n(messages)
|
||||
/**
|
||||
* PopUp 弹出层-对话框样式
|
||||
* @description 弹出层-对话框样式
|
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=329
|
||||
* @property {String} value input 模式下的默认值
|
||||
* @property {String} placeholder input 模式下输入提示
|
||||
* @property {String} type = [success|warning|info|error] 主题样式
|
||||
* @value success 成功
|
||||
* @value warning 提示
|
||||
* @value info 消息
|
||||
* @value error 错误
|
||||
* @property {String} mode = [base|input] 模式、
|
||||
* @value base 基础对话框
|
||||
* @value input 可输入对话框
|
||||
* @property {String} content 对话框内容
|
||||
* @property {Boolean} beforeClose 是否拦截取消事件
|
||||
* @event {Function} confirm 点击确认按钮触发
|
||||
* @event {Function} close 点击取消按钮触发
|
||||
*/
|
||||
|
||||
export default {
|
||||
name: "uniPopupDialog",
|
||||
mixins: [popup],
|
||||
emits:['confirm','close'],
|
||||
props: {
|
||||
inputType:{
|
||||
type: String,
|
||||
default: 'text'
|
||||
},
|
||||
value: {
|
||||
type: [String, Number],
|
||||
default: ''
|
||||
},
|
||||
placeholder: {
|
||||
type: [String, Number],
|
||||
default: ''
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
default: 'error'
|
||||
},
|
||||
mode: {
|
||||
type: String,
|
||||
default: 'base'
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
content: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
beforeClose: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
cancelText:{
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
confirmText:{
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogType: 'error',
|
||||
focus: false,
|
||||
val: ""
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
okText() {
|
||||
return this.confirmText || t("uni-popup.ok")
|
||||
},
|
||||
closeText() {
|
||||
return this.cancelText || t("uni-popup.cancel")
|
||||
},
|
||||
placeholderText() {
|
||||
return this.placeholder || t("uni-popup.placeholder")
|
||||
},
|
||||
titleText() {
|
||||
return this.title || t("uni-popup.title")
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
type(val) {
|
||||
this.dialogType = val
|
||||
},
|
||||
mode(val) {
|
||||
if (val === 'input') {
|
||||
this.dialogType = 'info'
|
||||
}
|
||||
},
|
||||
value(val) {
|
||||
this.val = val
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// 对话框遮罩不可点击
|
||||
this.popup.disableMask()
|
||||
// this.popup.closeMask()
|
||||
if (this.mode === 'input') {
|
||||
this.dialogType = 'info'
|
||||
this.val = this.value
|
||||
} else {
|
||||
this.dialogType = this.type
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.focus = true
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 点击确认按钮
|
||||
*/
|
||||
onOk() {
|
||||
if (this.mode === 'input'){
|
||||
this.$emit('confirm', this.val)
|
||||
}else{
|
||||
this.$emit('confirm')
|
||||
}
|
||||
if(this.beforeClose) return
|
||||
this.popup.close()
|
||||
},
|
||||
/**
|
||||
* 点击取消按钮
|
||||
*/
|
||||
closeDialog() {
|
||||
this.$emit('close')
|
||||
if(this.beforeClose) return
|
||||
this.popup.close()
|
||||
},
|
||||
close(){
|
||||
this.popup.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" >
|
||||
.uni-popup-dialog {
|
||||
width: 300px;
|
||||
border-radius: 11px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.uni-dialog-title {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
padding-top: 25px;
|
||||
}
|
||||
|
||||
.uni-dialog-title-text {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.uni-dialog-content {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.uni-dialog-content-text {
|
||||
font-size: 14px;
|
||||
color: #6C6C6C;
|
||||
}
|
||||
|
||||
.uni-dialog-button-group {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
border-top-color: #f5f5f5;
|
||||
border-top-style: solid;
|
||||
border-top-width: 1px;
|
||||
}
|
||||
|
||||
.uni-dialog-button {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
|
||||
flex: 1;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 45px;
|
||||
}
|
||||
|
||||
.uni-border-left {
|
||||
border-left-color: #f0f0f0;
|
||||
border-left-style: solid;
|
||||
border-left-width: 1px;
|
||||
}
|
||||
|
||||
.uni-dialog-button-text {
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.uni-button-color {
|
||||
color: #007aff;
|
||||
}
|
||||
|
||||
.uni-dialog-input {
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
border: 1px #eee solid;
|
||||
height: 40px;
|
||||
padding: 0 10px;
|
||||
border-radius: 5px;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.uni-popup__success {
|
||||
color: #4cd964;
|
||||
}
|
||||
|
||||
.uni-popup__warn {
|
||||
color: #f0ad4e;
|
||||
}
|
||||
|
||||
.uni-popup__error {
|
||||
color: #dd524d;
|
||||
}
|
||||
|
||||
.uni-popup__info {
|
||||
color: #909399;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,143 @@
|
|||
<template>
|
||||
<view class="uni-popup-message">
|
||||
<view class="uni-popup-message__box fixforpc-width" :class="'uni-popup__'+type">
|
||||
<slot>
|
||||
<text class="uni-popup-message-text" :class="'uni-popup__'+type+'-text'">{{message}}</text>
|
||||
</slot>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import popup from '../uni-popup/popup.js'
|
||||
/**
|
||||
* PopUp 弹出层-消息提示
|
||||
* @description 弹出层-消息提示
|
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=329
|
||||
* @property {String} type = [success|warning|info|error] 主题样式
|
||||
* @value success 成功
|
||||
* @value warning 提示
|
||||
* @value info 消息
|
||||
* @value error 错误
|
||||
* @property {String} message 消息提示文字
|
||||
* @property {String} duration 显示时间，设置为 0 则不会自动关闭
|
||||
*/
|
||||
|
||||
export default {
|
||||
name: 'uniPopupMessage',
|
||||
mixins:[popup],
|
||||
props: {
|
||||
/**
|
||||
* 主题 success/warning/info/error 默认 success
|
||||
*/
|
||||
type: {
|
||||
type: String,
|
||||
default: 'success'
|
||||
},
|
||||
/**
|
||||
* 消息文字
|
||||
*/
|
||||
message: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
/**
|
||||
* 显示时间，设置为 0 则不会自动关闭
|
||||
*/
|
||||
duration: {
|
||||
type: Number,
|
||||
default: 3000
|
||||
},
|
||||
maskShow:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
created() {
|
||||
this.popup.maskShow = this.maskShow
|
||||
this.popup.messageChild = this
|
||||
},
|
||||
methods: {
|
||||
timerClose(){
|
||||
if(this.duration === 0) return
|
||||
clearTimeout(this.timer)
|
||||
this.timer = setTimeout(()=>{
|
||||
this.popup.close()
|
||||
},this.duration)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" >
|
||||
.uni-popup-message {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.uni-popup-message__box {
|
||||
background-color: #e1f3d8;
|
||||
padding: 10px 15px;
|
||||
border-color: #eee;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 500px) {
|
||||
.fixforpc-width {
|
||||
margin-top: 20px;
|
||||
border-radius: 4px;
|
||||
flex: none;
|
||||
min-width: 380px;
|
||||
/* #ifndef APP-NVUE */
|
||||
max-width: 50%;
|
||||
/* #endif */
|
||||
/* #ifdef APP-NVUE */
|
||||
max-width: 500px;
|
||||
/* #endif */
|
||||
}
|
||||
}
|
||||
|
||||
.uni-popup-message-text {
|
||||
font-size: 14px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.uni-popup__success {
|
||||
background-color: #e1f3d8;
|
||||
}
|
||||
|
||||
.uni-popup__success-text {
|
||||
color: #67C23A;
|
||||
}
|
||||
|
||||
.uni-popup__warn {
|
||||
background-color: #faecd8;
|
||||
}
|
||||
|
||||
.uni-popup__warn-text {
|
||||
color: #E6A23C;
|
||||
}
|
||||
|
||||
.uni-popup__error {
|
||||
background-color: #fde2e2;
|
||||
}
|
||||
|
||||
.uni-popup__error-text {
|
||||
color: #F56C6C;
|
||||
}
|
||||
|
||||
.uni-popup__info {
|
||||
background-color: #F2F6FC;
|
||||
}
|
||||
|
||||
.uni-popup__info-text {
|
||||
color: #909399;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,187 @@
|
|||
<template>
|
||||
<view class="uni-popup-share">
|
||||
<view class="uni-share-title"><text class="uni-share-title-text">{{shareTitleText}}</text></view>
|
||||
<view class="uni-share-content">
|
||||
<view class="uni-share-content-box">
|
||||
<view class="uni-share-content-item" v-for="(item,index) in bottomData" :key="index" @click.stop="select(item,index)">
|
||||
<image class="uni-share-image" :src="item.icon" mode="aspectFill"></image>
|
||||
<text class="uni-share-text">{{item.text}}</text>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="uni-share-button-box">
|
||||
<button class="uni-share-button" @click="close">{{cancelText}}</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import popup from '../uni-popup/popup.js'
|
||||
import {
|
||||
initVueI18n
|
||||
} from '@dcloudio/uni-i18n'
|
||||
import messages from '../uni-popup/i18n/index.js'
|
||||
const { t } = initVueI18n(messages)
|
||||
export default {
|
||||
name: 'UniPopupShare',
|
||||
mixins:[popup],
|
||||
emits:['select'],
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
beforeClose: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
bottomData: [{
|
||||
text: '微信',
|
||||
icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/c2b17470-50be-11eb-b680-7980c8a877b8.png',
|
||||
name: 'wx'
|
||||
},
|
||||
{
|
||||
text: '支付宝',
|
||||
icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/d684ae40-50be-11eb-8ff1-d5dcf8779628.png',
|
||||
name: 'wx'
|
||||
},
|
||||
{
|
||||
text: 'QQ',
|
||||
icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/e7a79520-50be-11eb-b997-9918a5dda011.png',
|
||||
name: 'qq'
|
||||
},
|
||||
{
|
||||
text: '新浪',
|
||||
icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/0dacdbe0-50bf-11eb-8ff1-d5dcf8779628.png',
|
||||
name: 'sina'
|
||||
},
|
||||
// {
|
||||
// text: '百度',
|
||||
// icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/1ec6e920-50bf-11eb-8a36-ebb87efcf8c0.png',
|
||||
// name: 'copy'
|
||||
// },
|
||||
// {
|
||||
// text: '其他',
|
||||
// icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/2e0fdfe0-50bf-11eb-b997-9918a5dda011.png',
|
||||
// name: 'more'
|
||||
// }
|
||||
]
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
computed: {
|
||||
cancelText() {
|
||||
return t("uni-popup.cancel")
|
||||
},
|
||||
shareTitleText() {
|
||||
return this.title || t("uni-popup.shareTitle")
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 选择内容
|
||||
*/
|
||||
select(item, index) {
|
||||
this.$emit('select', {
|
||||
item,
|
||||
index
|
||||
})
|
||||
this.close()
|
||||
|
||||
},
|
||||
/**
|
||||
* 关闭窗口
|
||||
*/
|
||||
close() {
|
||||
if(this.beforeClose) return
|
||||
this.popup.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" >
|
||||
.uni-popup-share {
|
||||
background-color: #fff;
|
||||
border-top-left-radius: 11px;
|
||||
border-top-right-radius: 11px;
|
||||
}
|
||||
.uni-share-title {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 40px;
|
||||
}
|
||||
.uni-share-title-text {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
.uni-share-content {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.uni-share-content-box {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
width: 360px;
|
||||
}
|
||||
|
||||
.uni-share-content-item {
|
||||
width: 90px;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
padding: 10px 0;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.uni-share-content-item:active {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.uni-share-image {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.uni-share-text {
|
||||
margin-top: 10px;
|
||||
font-size: 14px;
|
||||
color: #3B4144;
|
||||
}
|
||||
|
||||
.uni-share-button-box {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
padding: 10px 15px;
|
||||
}
|
||||
|
||||
.uni-share-button {
|
||||
flex: 1;
|
||||
border-radius: 50px;
|
||||
color: #666;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.uni-share-button::after {
|
||||
border-radius: 50px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"uni-popup.cancel": "cancel",
|
||||
"uni-popup.ok": "ok",
|
||||
"uni-popup.placeholder": "pleace enter",
|
||||
"uni-popup.title": "Hint",
|
||||
"uni-popup.shareTitle": "Share to"
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
import en from './en.json'
|
||||
import zhHans from './zh-Hans.json'
|
||||
import zhHant from './zh-Hant.json'
|
||||
export default {
|
||||
en,
|
||||
'zh-Hans': zhHans,
|
||||
'zh-Hant': zhHant
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"uni-popup.cancel": "取消",
|
||||
"uni-popup.ok": "确定",
|
||||
"uni-popup.placeholder": "请输入",
|
||||
"uni-popup.title": "提示",
|
||||
"uni-popup.shareTitle": "分享到"
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"uni-popup.cancel": "取消",
|
||||
"uni-popup.ok": "確定",
|
||||
"uni-popup.placeholder": "請輸入",
|
||||
"uni-popup.title": "提示",
|
||||
"uni-popup.shareTitle": "分享到"
|
||||
}
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
// #ifdef H5
|
||||
export default {
|
||||
name: 'Keypress',
|
||||
props: {
|
||||
disable: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
const keyNames = {
|
||||
esc: ['Esc', 'Escape'],
|
||||
tab: 'Tab',
|
||||
enter: 'Enter',
|
||||
space: [' ', 'Spacebar'],
|
||||
up: ['Up', 'ArrowUp'],
|
||||
left: ['Left', 'ArrowLeft'],
|
||||
right: ['Right', 'ArrowRight'],
|
||||
down: ['Down', 'ArrowDown'],
|
||||
delete: ['Backspace', 'Delete', 'Del']
|
||||
}
|
||||
const listener = ($event) => {
|
||||
if (this.disable) {
|
||||
return
|
||||
}
|
||||
const keyName = Object.keys(keyNames).find(key => {
|
||||
const keyName = $event.key
|
||||
const value = keyNames[key]
|
||||
return value === keyName || (Array.isArray(value) && value.includes(keyName))
|
||||
})
|
||||
if (keyName) {
|
||||
// 避免和其他按键事件冲突
|
||||
setTimeout(() => {
|
||||
this.$emit(keyName, {})
|
||||
}, 0)
|
||||
}
|
||||
}
|
||||
document.addEventListener('keyup', listener)
|
||||
// this.$once('hook:beforeDestroy', () => {
|
||||
// document.removeEventListener('keyup', listener)
|
||||
// })
|
||||
},
|
||||
render: () => {}
|
||||
}
|
||||
// #endif
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.popup = this.getParent()
|
||||
},
|
||||
methods:{
|
||||
/**
|
||||
* 获取父元素实例
|
||||
*/
|
||||
getParent(name = 'uniPopup') {
|
||||
let parent = this.$parent;
|
||||
let parentName = parent.$options.name;
|
||||
while (parentName !== name) {
|
||||
parent = parent.$parent;
|
||||
if (!parent) return false
|
||||
parentName = parent.$options.name;
|
||||
}
|
||||
return parent;
|
||||
},
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,473 @@
|
|||
<template>
|
||||
<view v-if="showPopup" class="uni-popup" :class="[popupstyle, isDesktop ? 'fixforpc-z-index' : '']">
|
||||
<view @touchstart="touchstart">
|
||||
<uni-transition key="1" v-if="maskShow" name="mask" mode-class="fade" :styles="maskClass"
|
||||
:duration="duration" :show="showTrans" @click="onTap" />
|
||||
<uni-transition key="2" :mode-class="ani" name="content" :styles="transClass" :duration="duration"
|
||||
:show="showTrans" @click="onTap">
|
||||
<view class="uni-popup__wrapper" :style="{ backgroundColor: bg }" :class="[popupstyle]" @click="clear">
|
||||
<slot />
|
||||
</view>
|
||||
</uni-transition>
|
||||
</view>
|
||||
<!-- #ifdef H5 -->
|
||||
<keypress v-if="maskShow" @esc="onTap" />
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// #ifdef H5
|
||||
import keypress from './keypress.js'
|
||||
// #endif
|
||||
|
||||
/**
|
||||
* PopUp 弹出层
|
||||
* @description 弹出层组件，为了解决遮罩弹层的问题
|
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=329
|
||||
* @property {String} type = [top|center|bottom|left|right|message|dialog|share] 弹出方式
|
||||
* @value top 顶部弹出
|
||||
* @value center 中间弹出
|
||||
* @value bottom 底部弹出
|
||||
* @value left 左侧弹出
|
||||
* @value right 右侧弹出
|
||||
* @value message 消息提示
|
||||
* @value dialog 对话框
|
||||
* @value share 底部分享示例
|
||||
* @property {Boolean} animation = [true|false] 是否开启动画
|
||||
* @property {Boolean} maskClick = [true|false] 蒙版点击是否关闭弹窗(废弃)
|
||||
* @property {Boolean} isMaskClick = [true|false] 蒙版点击是否关闭弹窗
|
||||
* @property {String} backgroundColor 主窗口背景色
|
||||
* @property {String} maskBackgroundColor 蒙版颜色
|
||||
* @property {Boolean} safeArea 是否适配底部安全区
|
||||
* @event {Function} change 打开关闭弹窗触发，e={show: false}
|
||||
* @event {Function} maskClick 点击遮罩触发
|
||||
*/
|
||||
|
||||
export default {
|
||||
name: 'uniPopup',
|
||||
components: {
|
||||
// #ifdef H5
|
||||
keypress
|
||||
// #endif
|
||||
},
|
||||
emits: ['change', 'maskClick'],
|
||||
props: {
|
||||
// 开启动画
|
||||
animation: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
// 弹出层类型，可选值，top: 顶部弹出层；bottom：底部弹出层；center：全屏弹出层
|
||||
// message: 消息提示 ; dialog : 对话框
|
||||
type: {
|
||||
type: String,
|
||||
default: 'center'
|
||||
},
|
||||
// maskClick
|
||||
isMaskClick: {
|
||||
type: Boolean,
|
||||
default: null
|
||||
},
|
||||
// TODO 2 个版本后废弃属性 ，使用 isMaskClick
|
||||
maskClick: {
|
||||
type: Boolean,
|
||||
default: null
|
||||
},
|
||||
backgroundColor: {
|
||||
type: String,
|
||||
default: 'none'
|
||||
},
|
||||
safeArea: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
maskBackgroundColor: {
|
||||
type: String,
|
||||
default: 'rgba(0, 0, 0, 0.4)'
|
||||
},
|
||||
},
|
||||
|
||||
watch: {
|
||||
/**
|
||||
* 监听type类型
|
||||
*/
|
||||
type: {
|
||||
handler: function(type) {
|
||||
if (!this.config[type]) return
|
||||
this[this.config[type]](true)
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
isDesktop: {
|
||||
handler: function(newVal) {
|
||||
if (!this.config[newVal]) return
|
||||
this[this.config[this.type]](true)
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
/**
|
||||
* 监听遮罩是否可点击
|
||||
* @param {Object} val
|
||||
*/
|
||||
maskClick: {
|
||||
handler: function(val) {
|
||||
this.mkclick = val
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
isMaskClick: {
|
||||
handler: function(val) {
|
||||
this.mkclick = val
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
// H5 下禁止底部滚动
|
||||
showPopup(show) {
|
||||
// #ifdef H5
|
||||
// fix by mehaotian 处理 h5 滚动穿透的问题
|
||||
document.getElementsByTagName('body')[0].style.overflow = show ? 'hidden' : 'visible'
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
duration: 300,
|
||||
ani: [],
|
||||
showPopup: false,
|
||||
showTrans: false,
|
||||
popupWidth: 0,
|
||||
popupHeight: 0,
|
||||
config: {
|
||||
top: 'top',
|
||||
bottom: 'bottom',
|
||||
center: 'center',
|
||||
left: 'left',
|
||||
right: 'right',
|
||||
message: 'top',
|
||||
dialog: 'center',
|
||||
share: 'bottom'
|
||||
},
|
||||
maskClass: {
|
||||
position: 'fixed',
|
||||
bottom: 0,
|
||||
top: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
backgroundColor: 'rgba(0, 0, 0, 0.4)'
|
||||
},
|
||||
transClass: {
|
||||
position: 'fixed',
|
||||
left: 0,
|
||||
right: 0
|
||||
},
|
||||
maskShow: true,
|
||||
mkclick: true,
|
||||
popupstyle: this.isDesktop ? 'fixforpc-top' : 'top'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isDesktop() {
|
||||
return this.popupWidth >= 500 && this.popupHeight >= 500
|
||||
},
|
||||
bg() {
|
||||
if (this.backgroundColor === '' || this.backgroundColor === 'none') {
|
||||
return 'transparent'
|
||||
}
|
||||
return this.backgroundColor
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
const fixSize = () => {
|
||||
const {
|
||||
windowWidth,
|
||||
windowHeight,
|
||||
windowTop,
|
||||
safeArea,
|
||||
screenHeight,
|
||||
safeAreaInsets
|
||||
} = uni.getSystemInfoSync()
|
||||
this.popupWidth = windowWidth
|
||||
this.popupHeight = windowHeight + (windowTop || 0)
|
||||
// TODO fix by mehaotian 是否适配底部安全区 ,目前微信ios 、和 app ios 计算有差异，需要框架修复
|
||||
if (safeArea && this.safeArea) {
|
||||
// #ifdef MP-WEIXIN
|
||||
this.safeAreaInsets = screenHeight - safeArea.bottom
|
||||
// #endif
|
||||
// #ifndef MP-WEIXIN
|
||||
this.safeAreaInsets = safeAreaInsets.bottom
|
||||
// #endif
|
||||
} else {
|
||||
this.safeAreaInsets = 0
|
||||
}
|
||||
}
|
||||
fixSize()
|
||||
// #ifdef H5
|
||||
// window.addEventListener('resize', fixSize)
|
||||
// this.$once('hook:beforeDestroy', () => {
|
||||
// window.removeEventListener('resize', fixSize)
|
||||
// })
|
||||
// #endif
|
||||
},
|
||||
// #ifndef VUE3
|
||||
// TODO vue2
|
||||
destroyed() {
|
||||
this.setH5Visible()
|
||||
},
|
||||
// #endif
|
||||
// #ifdef VUE3
|
||||
// TODO vue3
|
||||
unmounted() {
|
||||
this.setH5Visible()
|
||||
},
|
||||
// #endif
|
||||
created() {
|
||||
// this.mkclick = this.isMaskClick || this.maskClick
|
||||
if (this.isMaskClick === null && this.maskClick === null) {
|
||||
this.mkclick = true
|
||||
} else {
|
||||
this.mkclick = this.isMaskClick !== null ? this.isMaskClick : this.maskClick
|
||||
}
|
||||
if (this.animation) {
|
||||
this.duration = 300
|
||||
} else {
|
||||
this.duration = 0
|
||||
}
|
||||
// TODO 处理 message 组件生命周期异常的问题
|
||||
this.messageChild = null
|
||||
// TODO 解决头条冒泡的问题
|
||||
this.clearPropagation = false
|
||||
this.maskClass.backgroundColor = this.maskBackgroundColor
|
||||
},
|
||||
methods: {
|
||||
setH5Visible() {
|
||||
// #ifdef H5
|
||||
// fix by mehaotian 处理 h5 滚动穿透的问题
|
||||
document.getElementsByTagName('body')[0].style.overflow = 'visible'
|
||||
// #endif
|
||||
},
|
||||
/**
|
||||
* 公用方法，不显示遮罩层
|
||||
*/
|
||||
closeMask() {
|
||||
this.maskShow = false
|
||||
},
|
||||
/**
|
||||
* 公用方法，遮罩层禁止点击
|
||||
*/
|
||||
disableMask() {
|
||||
this.mkclick = false
|
||||
},
|
||||
// TODO nvue 取消冒泡
|
||||
clear(e) {
|
||||
// #ifndef APP-NVUE
|
||||
e.stopPropagation()
|
||||
// #endif
|
||||
this.clearPropagation = true
|
||||
},
|
||||
|
||||
open(direction) {
|
||||
// fix by mehaotian 处理快速打开关闭的情况
|
||||
if (this.showPopup) {
|
||||
return
|
||||
}
|
||||
let innerType = ['top', 'center', 'bottom', 'left', 'right', 'message', 'dialog', 'share']
|
||||
if (!(direction && innerType.indexOf(direction) !== -1)) {
|
||||
direction = this.type
|
||||
}
|
||||
if (!this.config[direction]) {
|
||||
console.error('缺少类型：', direction)
|
||||
return
|
||||
}
|
||||
this[this.config[direction]]()
|
||||
this.$emit('change', {
|
||||
show: true,
|
||||
type: direction
|
||||
})
|
||||
},
|
||||
close(type) {
|
||||
this.showTrans = false
|
||||
this.$emit('change', {
|
||||
show: false,
|
||||
type: this.type
|
||||
})
|
||||
clearTimeout(this.timer)
|
||||
// // 自定义关闭事件
|
||||
// this.customOpen && this.customClose()
|
||||
this.timer = setTimeout(() => {
|
||||
this.showPopup = false
|
||||
}, 300)
|
||||
},
|
||||
// TODO 处理冒泡事件，头条的冒泡事件有问题 ，先这样兼容
|
||||
touchstart() {
|
||||
this.clearPropagation = false
|
||||
},
|
||||
|
||||
onTap() {
|
||||
if (this.clearPropagation) {
|
||||
// fix by mehaotian 兼容 nvue
|
||||
this.clearPropagation = false
|
||||
return
|
||||
}
|
||||
this.$emit('maskClick')
|
||||
if (!this.mkclick) return
|
||||
this.close()
|
||||
},
|
||||
/**
|
||||
* 顶部弹出样式处理
|
||||
*/
|
||||
top(type) {
|
||||
this.popupstyle = this.isDesktop ? 'fixforpc-top' : 'top'
|
||||
this.ani = ['slide-top']
|
||||
this.transClass = {
|
||||
position: 'fixed',
|
||||
left: 0,
|
||||
right: 0,
|
||||
backgroundColor: this.bg
|
||||
}
|
||||
// TODO 兼容 type 属性 ，后续会废弃
|
||||
if (type) return
|
||||
this.showPopup = true
|
||||
this.showTrans = true
|
||||
this.$nextTick(() => {
|
||||
if (this.messageChild && this.type === 'message') {
|
||||
this.messageChild.timerClose()
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 底部弹出样式处理
|
||||
*/
|
||||
bottom(type) {
|
||||
this.popupstyle = 'bottom'
|
||||
this.ani = ['slide-bottom']
|
||||
this.transClass = {
|
||||
position: 'fixed',
|
||||
left: 0,
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
paddingBottom: this.safeAreaInsets + 'px',
|
||||
backgroundColor: this.bg
|
||||
}
|
||||
// TODO 兼容 type 属性 ，后续会废弃
|
||||
if (type) return
|
||||
this.showPopup = true
|
||||
this.showTrans = true
|
||||
},
|
||||
/**
|
||||
* 中间弹出样式处理
|
||||
*/
|
||||
center(type) {
|
||||
this.popupstyle = 'center'
|
||||
this.ani = ['zoom-out', 'fade']
|
||||
this.transClass = {
|
||||
position: 'fixed',
|
||||
/* #ifndef APP-NVUE */
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
/* #endif */
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
top: 0,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center'
|
||||
}
|
||||
// TODO 兼容 type 属性 ，后续会废弃
|
||||
if (type) return
|
||||
this.showPopup = true
|
||||
this.showTrans = true
|
||||
},
|
||||
left(type) {
|
||||
this.popupstyle = 'left'
|
||||
this.ani = ['slide-left']
|
||||
this.transClass = {
|
||||
position: 'fixed',
|
||||
left: 0,
|
||||
bottom: 0,
|
||||
top: 0,
|
||||
backgroundColor: this.bg,
|
||||
/* #ifndef APP-NVUE */
|
||||
display: 'flex',
|
||||
flexDirection: 'column'
|
||||
/* #endif */
|
||||
}
|
||||
// TODO 兼容 type 属性 ，后续会废弃
|
||||
if (type) return
|
||||
this.showPopup = true
|
||||
this.showTrans = true
|
||||
},
|
||||
right(type) {
|
||||
this.popupstyle = 'right'
|
||||
this.ani = ['slide-right']
|
||||
this.transClass = {
|
||||
position: 'fixed',
|
||||
bottom: 0,
|
||||
right: 0,
|
||||
top: 0,
|
||||
backgroundColor: this.bg,
|
||||
/* #ifndef APP-NVUE */
|
||||
display: 'flex',
|
||||
flexDirection: 'column'
|
||||
/* #endif */
|
||||
}
|
||||
// TODO 兼容 type 属性 ，后续会废弃
|
||||
if (type) return
|
||||
this.showPopup = true
|
||||
this.showTrans = true
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.uni-popup {
|
||||
position: fixed;
|
||||
/* #ifndef APP-NVUE */
|
||||
z-index: 99;
|
||||
|
||||
/* #endif */
|
||||
&.top,
|
||||
&.left,
|
||||
&.right {
|
||||
/* #ifdef H5 */
|
||||
top: var(--window-top);
|
||||
/* #endif */
|
||||
/* #ifndef H5 */
|
||||
top: 0;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-popup__wrapper {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: block;
|
||||
/* #endif */
|
||||
position: relative;
|
||||
|
||||
/* iphonex 等安全区设置，底部安全区适配 */
|
||||
/* #ifndef APP-NVUE */
|
||||
// padding-bottom: constant(safe-area-inset-bottom);
|
||||
// padding-bottom: env(safe-area-inset-bottom);
|
||||
/* #endif */
|
||||
&.left,
|
||||
&.right {
|
||||
/* #ifdef H5 */
|
||||
padding-top: var(--window-top);
|
||||
/* #endif */
|
||||
/* #ifndef H5 */
|
||||
padding-top: 0;
|
||||
/* #endif */
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fixforpc-z-index {
|
||||
/* #ifndef APP-NVUE */
|
||||
z-index: 999;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.fixforpc-top {
|
||||
top: 0;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,87 @@
|
|||
{
|
||||
"id": "uni-popup",
|
||||
"displayName": "uni-popup 弹出层",
|
||||
"version": "1.8.3",
|
||||
"description": " Popup 组件，提供常用的弹层",
|
||||
"keywords": [
|
||||
"uni-ui",
|
||||
"弹出层",
|
||||
"弹窗",
|
||||
"popup",
|
||||
"弹框"
|
||||
],
|
||||
"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-transition"
|
||||
],
|
||||
"encrypt": [],
|
||||
"platforms": {
|
||||
"cloud": {
|
||||
"tcb": "y",
|
||||
"aliyun": "y"
|
||||
},
|
||||
"client": {
|
||||
"App": {
|
||||
"app-vue": "y",
|
||||
"app-nvue": "y"
|
||||
},
|
||||
"H5-mobile": {
|
||||
"Safari": "y",
|
||||
"Android Browser": "y",
|
||||
"微信浏览器(Android)": "y",
|
||||
"QQ浏览器(Android)": "y"
|
||||
},
|
||||
"H5-pc": {
|
||||
"Chrome": "y",
|
||||
"IE": "y",
|
||||
"Edge": "y",
|
||||
"Firefox": "y",
|
||||
"Safari": "y"
|
||||
},
|
||||
"小程序": {
|
||||
"微信": "y",
|
||||
"阿里": "y",
|
||||
"百度": "y",
|
||||
"字节跳动": "y",
|
||||
"QQ": "y"
|
||||
},
|
||||
"快应用": {
|
||||
"华为": "u",
|
||||
"联盟": "u"
|
||||
},
|
||||
"Vue": {
|
||||
"vue2": "y",
|
||||
"vue3": "y"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
|
||||
|
||||
## Popup 弹出层
|
||||
> **组件名：uni-popup**
|
||||
> 代码块： `uPopup`
|
||||
> 关联组件：`uni-transition`
|
||||
|
||||
|
||||
弹出层组件，在应用中弹出一个消息提示窗口、提示框等
|
||||
|
||||
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-popup)
|
||||
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -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
|
||||
|
|
@ -0,0 +1 @@
|
|||
@import './styles/index.scss';
|
||||
|
|
@ -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"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
`uni-sass` 是 `uni-ui`提供的一套全局样式 ，通过一些简单的类名和`sass`变量，实现简单的页面布局操作，比如颜色、边距、圆角等。
|
||||
|
||||
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-sass)
|
||||
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839
|
||||
|
|
@ -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';
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue