Commit 4ff7214e by baihong

签到-早起

parents
# Created by .ignore support plugin (hsz.mobi)
### Node template
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Runtime data
pids
*.pid
*.seed
*.pid.lock
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
# nyc test coverage
.nyc_output
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# Bower dependency directory (https://bower.io/)
bower_components
# node-waf configuration
.lock-wscript
# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
jspm_packages/
unpackage/
# TypeScript v1 declaration files
typings/
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Optional REPL history
.node_repl_history
# Output of 'npm pack'
*.tgz
# Yarn Integrity file
.yarn-integrity
# dotenv environment variables file
.env
# parcel-bundler cache (https://parceljs.org/)
.cache
# next.js build output
.next
# nuxt.js build output
.nuxt
# vuepress build output
.vuepress/dist
# Serverless directories
.serverless
# IDE / Editor
.idea
# Service worker
sw.*
# Mac OSX
.DS_Store
.vscode/
# Vim swap files
*.swp
{ // 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": [{
"type": "uniCloud",
"default": {
"launchtype": "remote"
}
}
]
}
<script>
import Vue from 'vue';
export default {
onLaunch: function() {
console.log('App Launch');
uni.getSystemInfo({
success: e => {
this.initSize(e);
}
});
},
methods: {
/**
* 存储设备信息 参考colorUI
* @param {Object}
*/
initSize(e) {
const systemInfo = e;
let navigationBarHeight;
let custom = {};
// #ifndef MP
custom = { height: 36, width: 88 };
navigationBarHeight = 44;
// #endif
// #ifdef MP-WEIXIN
custom = wx.getMenuButtonBoundingClientRect();
navigationBarHeight = custom.bottom + custom.top - e.statusBarHeight * 2;
// 导航栏高度 = 状态栏到胶囊的间距(胶囊距上距离-状态栏高度) * 2 + 胶囊高度 + 状态栏高度
navigationBarHeight = (custom.top - systemInfo.statusBarHeight) * 2 + custom.height + systemInfo.statusBarHeight;
systemInfo.menuBotton = custom.top - systemInfo.statusBarHeight;
systemInfo.menuRight = systemInfo.screenWidth - custom.right;
systemInfo.menuHeight = custom.height;
// #endif
systemInfo.custom = custom;
systemInfo.navigationBarHeight = navigationBarHeight;
Vue.prototype.systemInfo = systemInfo;
}
},
onShow: function() {
console.log('App Show');
},
onHide: function() {
console.log('App Hide');
}
};
</script>
<style lang="scss">
/*每个页面公共css */
@import 'uview-ui/index.scss';
.app{
background-color: #F5F7F9;
height: 100vh;
}
</style>
# paotang-v2ex
#### Description
跑堂小程序查询版
#### Software Architecture
Software architecture description
#### Installation
1. xxxx
2. xxxx
3. xxxx
#### Instructions
1. xxxx
2. xxxx
3. xxxx
#### Contribution
1. Fork the repository
2. Create Feat_xxx branch
3. Commit your code
4. Create Pull Request
#### Gitee Feature
1. You can use Readme\_XXX.md to support different languages, such as Readme\_en.md, Readme\_zh.md
2. Gitee blog [blog.gitee.com](https://blog.gitee.com)
3. Explore open source project [https://gitee.com/explore](https://gitee.com/explore)
4. The most valuable open source project [GVP](https://gitee.com/gvp)
5. The manual of Gitee [https://gitee.com/help](https://gitee.com/help)
6. The most popular members [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)
# paotang-v2ex
#### 介绍
跑堂小程序查询版
#### 软件架构
软件架构说明
#### 安装教程
1. xxxx
2. xxxx
3. xxxx
#### 使用说明
1. xxxx
2. xxxx
3. xxxx
#### 参与贡献
1. Fork 本仓库
2. 新建 Feat_xxx 分支
3. 提交代码
4. 新建 Pull Request
#### 特技
1. 使用 Readme\_XXX.md 来支持不同的语言,例如 Readme\_en.md, Readme\_zh.md
2. Gitee 官方博客 [blog.gitee.com](https://blog.gitee.com)
3. 你可以 [https://gitee.com/explore](https://gitee.com/explore) 这个地址来了解 Gitee 上的优秀开源项目
4. [GVP](https://gitee.com/gvp) 全称是 Gitee 最有价值开源项目,是综合评定出的优秀开源项目
5. Gitee 官方提供的使用手册 [https://gitee.com/help](https://gitee.com/help)
6. Gitee 封面人物是一档用来展示 Gitee 会员风采的栏目 [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)
// 如果没有通过拦截器配置域名的话,可以在这里写上完整的URL(加上域名部分)
let hotSearchUrl = '/ebapi/store_api/hot_search';
let indexUrl = '/ebapi/public_api/index';
// 此处第二个参数vm,就是我们在页面使用的this,你可以通过vm获取vuex等操作,更多内容详见uView对拦截器的介绍部分:
// https://uviewui.com/js/http.html#%E4%BD%95%E8%B0%93%E8%AF%B7%E6%B1%82%E6%8B%A6%E6%88%AA%EF%BC%9F
const install = (Vue, vm) => {
// 此处没有使用传入的params参数
let getSearch = (params = {}) => vm.$u.get(hotSearchUrl, {
id: 2
});
// 此处使用了传入的params参数,一切自定义即可
let getInfo = (params = {}) => vm.$u.post(indexUrl, params);
// 将各个定义的接口名称,统一放进对象挂载到vm.$u.api(因为vm就是this,也即this.$u.api)下
vm.$u.api = {getSearch, getInfo};
}
export default {
install
}
\ No newline at end of file
// 这里的vm,就是我们在vue文件里面的this,所以我们能在这里获取vuex的变量,比如存放在里面的token
// 同时,我们也可以在此使用getApp().globalData,如果你把token放在getApp().globalData的话,也是可以使用的
const install = (Vue, vm) => {
Vue.prototype.$u.http.setConfig({
baseUrl: 'https://api.youzixy.com',
// 如果将此值设置为true,拦截回调中将会返回服务端返回的所有数据response,而不是response.data
// 设置为true后,就需要在this.$u.http.interceptor.response进行多一次的判断,请打印查看具体值
// originalData: true,
// 设置自定义头部content-type
// header: {
// 'content-type': 'xxx'
// }
});
// 请求拦截,配置Token等参数
Vue.prototype.$u.http.interceptor.request = (config) => {
config.header.Token = 'xxxxxx';
// 方式一,存放在vuex的token,假设使用了uView封装的vuex方式,见:https://uviewui.com/components/globalVariable.html
// config.header.token = vm.token;
// 方式二,如果没有使用uView封装的vuex方法,那么需要使用$store.state获取
// config.header.token = vm.$store.state.token;
// 方式三,如果token放在了globalData,通过getApp().globalData获取
// config.header.token = getApp().globalData.username;
// 方式四,如果token放在了Storage本地存储中,拦截是每次请求都执行的,所以哪怕您重新登录修改了Storage,下一次的请求将会是最新值
// const token = uni.getStorageSync('token');
// config.header.token = token;
return config;
}
// 响应拦截,判断状态码是否通过
Vue.prototype.$u.http.interceptor.response = (res) => {
// 如果把originalData设置为了true,这里得到将会是服务器返回的所有的原始数据
// 判断可能变成了res.statueCode,或者res.data.code之类的,请打印查看结果
if(res.code == 200) {
// 如果把originalData设置为了true,这里return回什么,this.$u.post的then回调中就会得到什么
return res.data;
} else return false;
}
}
export default {
install
}
\ No newline at end of file
<template>
<view>
<view class="flex a-center content" v-if="lineData">
<view><slot name="content"></slot></view>
</view>
<view class="flex a-center" style="padding-right: 10rpx;">
<view class="progress-container" id="container" ref="progressContainer" :style="{ background: inBgColor }">
<view
class="progress-content flex j-end"
id="content"
ref="progressContent"
:style="{ height: strokeWidth + 'px', background: bgColor, width: contentWidth, transition: `width ${duration / 1000}s ease` }"
v-if="isAnimate"
>
<view class="textInside flex a-center j-center" v-if="textInside && !noData">
<view>{{ percentage }}%</view>
</view>
</view>
<view v-if="!isAnimate" class="progress-content flex j-end" :style="{ width: percentage + '%', height: strokeWidth + 'rpx', background: bgColor }">
<view class="textInside flex a-center j-center" v-if="textInside && !noData">
<view class="text">{{ percentage }}%</view>
</view>
</view>
</view>
<view>
<view class="percentage" v-if="!textInside && !lineData && !noData && !isAnimate">{{ percentage }}%</view>
</view>
</view>
</view>
</template>
<script>
export default {
name: 'AiProgress',
components: {},
props: {
// 进度条的值
percentage: {
type: [Number, String],
required: true
},
// 是否内联显示数据
textInside: {
type: Boolean,
default: false
},
// 进度条高度
strokeWidth: {
type: [Number, String],
default: 20
},
// 默认动画时长
duration: {
type: [Number, String],
default: 2000
},
// 是否有动画
isAnimate: {
type: Boolean,
default: false
},
// 背景颜色
bgColor: {
type: String,
default: '#409eff'
},
// 是否不显示数据
noData: {
type: Boolean,
default: false
},
// 是否自定义显示内容
lineData: {
type: Boolean,
default: false
},
// 自定义底色
inBgColor: {
type: String,
default: '#ebeef5'
}
},
data() {
return {
width: 0,
timer: null,
containerWidth: 0,
contentWidth: 0
};
},
methods: {
start() {
if (this.isAnimate) {
// #ifdef H5
this.$nextTick(() => {
let progressContainer = this.$refs.progressContainer.$el;
let progressContent = this.$refs.progressContent.$el;
let style = window.getComputedStyle(progressContainer, null);
let width = style.width.replace('px', '') * ((this.percentage * 1) / 100);
progressContent.style.width = width.toFixed(2) + 'px';
progressContent.style.transition = `width ${this.duration / 1000}s ease`;
});
// #endif
const container = uni
.createSelectorQuery()
.in(this)
.selectAll('#container');
const content = uni
.createSelectorQuery()
.in(this)
.selectAll('#content');
container.boundingClientRect().exec(res1 => {
this.contentWidth = res1[0][0].width * 1 * ((this.percentage * 1) / 100).toFixed(2) + 'px';
});
}
}
},
mounted() {
this.$nextTick(() => {
this.start();
});
},
created() {},
filters: {},
computed: {},
watch: {},
directives: {}
};
</script>
<style scoped lang="scss">
.content {
margin-bottom: 10px;
.c-per {
font-size: 26px;
}
}
.progress-container {
width: 85%;
border-radius: 10rpx;
.progress-content {
border-radius: 10rpx;
width: 0;
}
.textInside {
color: #fff;
margin-right: 10rpx;
position: relative;
}
}
.text {
margin-left: 10rpx;
}
.percentage {
margin-left: 6px;
font-size: 12px;
width: 30px;
font-size: 48rpx;
font-family: Microsoft Sans Serif;
font-weight: 400;
line-height: 54rpx;
color: #D3D3D3;
}
.flex {
display: flex;
}
.a-center {
align-items: center;
}
.j-center {
justify-content: center;
}
.j-between {
justify-content: space-between;
}
.content {
margin-bottom: 10px;
color: #666;
font-size: 32rpx;
}
</style>
<template>
<view class="nav" :style="{height:navigationBarHeight+'px'}">
<view class="nav-main">
<!-- 胶囊区域 -->
<view
class="capsule-box"
:style="{height:menuHeight+'px',minHeight:menuHeight+'px', lineHeight:menuHeight+'px', bottom:menuBotton+'px',left:menuRight+'px'}"
>
<!-- 导航内容区域 -->
<slot></slot>
</view>
</view>
</view>
</template>
<script>
export default {
name: 'HomePageHeader',
data() {
return {
};
},
computed: {
menuRight(){
return this.systemInfo.menuRight
},
navigationBarHeight(){
return this.systemInfo.navigationBarHeight;
},
menuBotton(){
return this.systemInfo.menuBotton;
},
menuHeight(){
return this.systemInfo.menuHeight;
}
},
methods: {
}
}
</script>
<style scoped lang="scss">
.nav {
position: fixed;
top: 0;
left: 0;
width: 100vw;
}
.nav-main {
width: 100%;
height: 100%;
position: relative;
}
.nav .capsule-box {
position: absolute;
box-sizing: border-box;
width: 100%;
}
</style>
<template>
<view class="histogram_chart">
<canvas
:canvasId="canvasId"
id="canvasId"
disable-scroll="true"
:style="{ width: cWidth + 'px', height: cHeight + 'px' }"
@touchstart="touchstart"
@touchmove="touchmove"
@touchend="touchend"
/>
<slot />
</view>
</template>
<script>
import uCharts from '@/plugins/stan-ucharts/u-charts/u-charts.js'; //可以优化放全局 uCharts ==>使用全局
const histogramuCharts = {},
optionAs = {};
export default {
name: 'HistogramChart',
props: {
dataAs: {
//数据
type: Object,
default: () => ({})
},
basicAs: {
////通用基础项设置
type: Object,
default: () => ({})
},
xAxisAs: {
//xAxis YAxis等轴线基础设置(圆环饼图无轴线无需设置)
type: Object,
default: () => ({})
},
yAxisAs: {
//xAxis YAxis等轴线基础设置(圆环饼图无轴线无需设置)
type: Object,
default: () => ({})
},
legendAs: {
//图例设置
type: Object,
default: () => ({})
},
extraAs: {
//详情请看 http://doc.ucharts.cn/1172130
type: Object,
default: () => ({})
},
width: {
//图标宽度
type: Number,
default: 690
},
height: {
//图标高度
type: Number,
default: 450
},
labelKey: {
type: String,
default: 'categories'
},
valueKey: {
type: String,
default: 'series'
},
canvasId: {
type: String,
default: `histogram_canvas_${Math.ceil(Math.random(5) * 10000)}`
}
},
data() {
return {};
},
computed: {
cWidth() {
return uni.upx2px(this.width);
},
cHeight() {
return uni.upx2px(this.height);
}
},
mounted() {},
methods: {
showCharts() {
let defaultOption = {
//通用基础项设置 basicAs
$this: this, //this实例组件内使用图表,必须传入this实例
canvasId: this.canvasId, //页面组件canvas-id,支付宝中为id
type: 'column', //图表类型,可选值为pie、line、column、area、ring、radar、arcbar、gauge、candle、bar、mix、rose、word
padding: [15, 15, 0, 15], //画布填充边距,顺序为上右下左,同css,但必须4位
colors: ['#1890ff', '#2fc25b', '#facc14', '#f04864', '#8543e0', '#90ed7d'], //图表配色方案,不传则使用系统默认配置
rotate: false, //是否横屏展示
rotateLock: true, // 锁定横屏模式,如果在支付宝和百度小程序中使用横屏模式,请赋值true,否则每次都会旋转90度。跨端使用通过uni-app的条件编译来赋值
enableScroll: false, //是否开启图表可拖拽滚动 默认false 支持line, area, column, candle图表类型(需配合绑定@touchstart, @touchmove, @touchend方法)
enableMarkLine: false, //是否显示辅助线 默认false 支持line, area, column, candle, mix图表类型
animation: true, //是否动画展示
dataLabel: true, //是否在图表中显示数据标签内容值
duration: 1000, //动画展示时长单位毫秒
fontSize: 12, //全局默认字体大小(可选,单位为px,默认13px)高分屏不必乘像素比,自动根据pixelRatio计算
background: '#fff', //canvas背景颜色(如果页面背景颜色不是白色请设置为页面的背景颜色,默认#ffffff)无作用
pixelRatio: 1, //像素比,默认为1,仅支付宝小程序需要大于1,其他平台必须为1
width: this.cWidth, //canvas宽度,单位为px,支付宝高分屏需要乘像素比(pixelRatio)
height: this.cHeight, //canvas高度,单位为px,支付宝高分屏需要乘像素比
//数据列表配置项 dataAS
categories: this.dataAs[this.labelKey], //数据类别(饼图、圆环图不需要)
series: this.dataAs[this.valueKey], //数据列表
//坐标轴配置项 axisAs
xAxis: {
// X轴配置
type: 'grid',
rotateLabel: true, //X轴刻度(数值)标签是否旋转(仅在文案超过单屏宽度时有效)
itemCount: 5, //X轴可见区域数据数量(即X轴数据密度),配合拖拽滚动使用(即仅在启用enableScroll时有效)
// labelCount:Number,//X轴可见区域标签数量(即X轴数刻度标签单屏幕限制显示的数量)
scrollShow: true, //是否显示滚动条,配合拖拽滚动使用(即仅在启用enableScroll时有效)
scrollAlign: 'left', //滚动条初始位置,left为数据整体左对齐,right为右对齐
scrollBackgroundColor: '#EFEBEF', // X轴滚动条背景颜色,配合拖拽滚动使用(即仅在启用enableScroll时有效)
scrollColor: '#A6A6A6', //X轴滚动条颜色,配合拖拽滚动使用(即仅在启用enableScroll时有效)
disabled: false, //不绘制X轴
disableGrid: true, //不绘制X轴网格(即默认绘制网格)
fontColor: '#666666', //X轴数据点颜色
boundaryGap: 'center', //折线图、区域图起画点结束点方法:center为单元格中间起画,justify为0点起画即两端对齐
axisLine: false, //坐标轴轴线是否显示
axisLineColor: '#cccccc' //坐标轴轴线颜色
},
yAxis: {
//如果是多坐标系则传数组型对象[{disabled:true},{disabled:false}]
disabled: true, //不绘制Y轴
position: 'left', //Y轴位置,可选值左侧left右侧right(未起效果)
format: val => {
let defaultSetting = { type: 'number', fixed: 0, name: '' };
let { type, fixed, name } = this.yAxisAs && this.yAxisAs.formatter ? Object.assign(defaultSetting, this.yAxisAs.formatter) : defaultSetting;
if (type == 'number') {
return `${val.toFixed(fixed)}${name}`;
} else if (type == 'percent') {
let newName = name || '%';
return `${(val * 100).toFixed(fixed)}${name}${newName}`;
} else {
return val.toFixed(0);
}
},
title: '' //Y轴标题
},
//图列配置 legendAs
legend: {
show: false, //是否显示各类别的图例标识
position: 'top',
float: 'left',
padding: 10,
margin: 0
// itemGap:10,//各个item之间的间隔,单位px,默认为10,横向布局时为水平间隔,纵向布局时为纵向间隔
// fontColor:'666666',
// lineHeight:17,//默认opts.fontSize+5
// fontSize:12,//默认opts.fontSize
// backgroundColor:rgba(0,0,0,0),//图例背景颜色
// borderColor:rgba(0,0,0,0),//图例边框颜色
// format:()=>{}//未来预留,暂未生效】自定义显示数据内容
},
//扩展配置 extraAs 详情请看 http://doc.ucharts.cn/1172130
extra: {
column: {
//参考官网配置
type: 'group',
width: (this.cWidth * 0.45) / this.dataAs[this.labelKey].length
}
}
};
optionAs[this.canvasId] = Object.assign(defaultOption, this.basicAs, this.xAxisAS, this.yAxisAS, this.legendAs, this.extraAs);
histogramuCharts[this.canvasId] = new uCharts(optionAs[this.canvasId]);
},
touchstart(e) {
let that = this;
histogramuCharts[this.canvasId].touchLegend(e, { animation: false });
histogramuCharts[this.canvasId].scrollStart(e);
histogramuCharts[this.canvasId].showToolTip(e, {
//修改点击事弹出文字
format: function(item, category) {
let defaultSetting = { type: 'number', fixed: 0, name: '' };
let newName;
let { type, fixed, name } = that.yAxisAs && that.yAxisAs.formatter ? Object.assign(defaultSetting, that.yAxisAs.formatter) : defaultSetting;
if (typeof item.data === 'object') {
if (type == 'number') {
return `${category} ${item.name}:${item.data.value.toFixed(fixed)}${name}`;
} else if (type == 'percent') {
newName = name || '%';
return `${category} ${item.name}:${(item.data.value * 100).toFixed(fixed)}${newName}`;
} else {
return `${category} ${item.name}:${item.data.value}`;
}
} else {
if (type == 'number') {
return `${category} ${item.name}:${item.data.toFixed(fixed)}${name}`;
} else if (type == 'percent') {
newName = name || '%';
return `${category} ${item.name}:${(item.data * 100).toFixed(fixed)}${newName}`;
} else {
return `${category} ${item.name}:${item.data}`;
}
}
}
});
},
touchmove(e) {
histogramuCharts[this.canvasId].scroll(e);
},
touchend(e) {
histogramuCharts[this.canvasId].scrollEnd(e);
},
changeData({ series, categories }) {
histogramuCharts[this.canvasId].updateData({
series,
categories
});
}
}
};
</script>
<style scoped></style>
<template>
<view class="line_chart">
<canvas
:canvasId="canvasId"
id="canvasId"
disable-scroll="true"
:style="{ width: cWidth + 'px', height: cHeight + 'px' }"
@touchstart="touchstart"
@touchmove="touchmove"
@touchend="touchend"
/>
<slot />
</view>
</template>
<script>
import uCharts from '@/plugins/stan-ucharts/u-charts/u-charts.js'; //可以优化放全局 uCharts ==>使用全局
const lineCharts = {},
optionAs = {};
export default {
name: 'LineChart',
props: {
dataAs: {
//数据
type: Object,
default: () => ({})
},
basicAs: {
////通用基础项设置
type: Object,
default: () => ({})
},
xAxisAs: {
//xAxis YAxis等轴线基础设置(圆环饼图无轴线无需设置)
type: Object,
default: () => ({})
},
yAxisAs: {
//xAxis YAxis等轴线基础设置(圆环饼图无轴线无需设置)
type: Object,
default: () => ({})
},
legendAs: {
//图例设置
type: Object,
default: () => ({})
},
extraAs: {
//详情请看 http://doc.ucharts.cn/1172130
type: Object,
default: () => ({})
},
width: {
//图标宽度
type: Number,
default: 690
},
height: {
//图标高度
type: Number,
default: 450
},
// 是否不显示x轴
disabledx: {
type: Boolean,
default: false
},
// 是否在图表中显示数据标签内容值
dataLabel: {
type: Boolean,
default: true
},
labelKey: {
type: String,
default: 'categories'
},
valueKey: {
type: String,
default: 'series'
},
lineType: {
type: String,
default: 'straight'
},
canvasId: {
type: String,
default: `line_canvas_${Math.ceil(Math.random(5) * 10000)}`
}
},
data() {
return {};
},
computed: {
cWidth() {
return uni.upx2px(this.width);
},
cHeight() {
return uni.upx2px(this.height);
}
},
methods: {
showCharts() {
let defaultOption = {
//通用基础项设置 basicAs
$this: this, //this实例组件内使用图表,必须传入this实例
canvasId: this.canvasId, //页面组件canvas-id,支付宝中为id
type: 'line', //图表类型,可选值为pie、line、column、area、ring、radar、arcbar、gauge、candle、bar、mix、rose、word
padding: [15, 15, 0, 15], //画布填充边距,顺序为上右下左,同css,但必须4位
colors: ['#F65352', '#2fc25b', '#facc14', '#f04864', '#8543e0', '#90ed7d'], //图表配色方案,不传则使用系统默认配置
rotate: false, //是否横屏展示
rotateLock: true, // 锁定横屏模式,如果在支付宝和百度小程序中使用横屏模式,请赋值true,否则每次都会旋转90度。跨端使用通过uni-app的条件编译来赋值
enableScroll: false, //是否开启图表可拖拽滚动 默认false 支持line, area, column, candle图表类型(需配合绑定@touchstart, @touchmove, @touchend方法)
enableMarkLine: false, //是否显示辅助线 默认false 支持line, area, column, candle, mix图表类型
animation: true, //是否动画展示
dataLabel: this.dataLabel, //是否在图表中显示数据标签内容值
dataPointShape: true,
duration: 1000, //动画展示时长单位毫秒
fontSize: 12, //全局默认字体大小(可选,单位为px,默认13px)高分屏不必乘像素比,自动根据pixelRatio计算
background: '#ffffff', //canvas背景颜色(如果页面背景颜色不是白色请设置为页面的背景颜色,默认#ffffff)无作用
pixelRatio: 1, //像素比,默认为1,仅支付宝小程序需要大于1,其他平台必须为1
width: this.cWidth, //canvas宽度,单位为px,支付宝高分屏需要乘像素比(pixelRatio)
height: this.cHeight, //canvas高度,单位为px,支付宝高分屏需要乘像素比
//数据列表配置项 dataAS
categories: this.dataAs[this.labelKey], //数据类别(饼图、圆环图不需要)
series: this.dataAs[this.valueKey], //数据列表
//坐标轴配置项 axisAs
xAxis: {
// X轴配置
type: 'grid',
rotateLabel: true, //X轴刻度(数值)标签是否旋转(仅在文案超过单屏宽度时有效)
itemCount: 24, //X轴可见区域数据数量(即X轴数据密度),配合拖拽滚动使用(即仅在启用enableScroll时有效)
// labelCount:Number,//X轴可见区域标签数量(即X轴数刻度标签单屏幕限制显示的数量)
scrollShow: true, //是否显示滚动条,配合拖拽滚动使用(即仅在启用enableScroll时有效)
scrollAlign: 'left', //滚动条初始位置,left为数据整体左对齐,right为右对齐
scrollBackgroundColor: '#EFEBEF', // X轴滚动条背景颜色,配合拖拽滚动使用(即仅在启用enableScroll时有效)
scrollColor: '#A6A6A6', //X轴滚动条颜色,配合拖拽滚动使用(即仅在启用enableScroll时有效)
disabled: this.disabledx, //不绘制X轴
disableGrid: true, //不绘制X轴网格(即默认绘制网格)
calibration: true, //坐标轴刻度线是否显示 注v1.9.0有效
gridColor: '#cccccc', //X轴网格颜色 例如#7cb5ec
gridType: 'dash', // X轴网格线型 'solid'为实线、'dash'为虚线`
gridEval: 1, //X轴网格线显示间隔,即假设为2时,是隔一个刻度显示间隔
dashLength: 4, //X轴网格为虚线时,单段虚线长度
fontColor: '#666666', //X轴数据点颜色
boundaryGap: 'center', //折线图、区域图起画点结束点方法:center为单元格中间起画,justify为0点起画即两端对齐
axisLine: false, //坐标轴轴线是否显示
axisLineColor: '#cccccc' //坐标轴轴线颜色
// splitNumber:Number
},
yAxis: {
//如果是多坐标系则传数组型对象[{disabled:true},{disabled:false}]
disabled: false, //不绘制Y轴
position: 'left', //Y轴位置,可选值左侧left右侧right(未起效果)
format: val => {
let defaultSetting = { type: 'number', fixed: 0, name: '' };
let { type, fixed, name } = this.yAxisAs && this.yAxisAs.formatter ? Object.assign(defaultSetting, this.yAxisAs.formatter) : defaultSetting;
if (type == 'number') {
return val.toFixed(fixed) + name;
} else if (type == 'percent') {
let newName = name || '%';
return (val * 100).toFixed(fixed) + newName;
} else if (type == 'add') {
return '+'+val;
} else {
return val;
}
}
// title:'Y轴标题',//Y轴标题
// titleFontSize:basic.fontSize titleFontColor==>#666666 fontColor==>666666 Y轴数据点颜色 fontSizeY轴数据标签字体大小 等详见http://doc.ucharts.cn/1172128
},
//图列配置 legendAs
legend: {
show: false, //是否显示各类别的图例标识
position: 'top',
float: 'left',
padding: 10,
margin: 0
// itemGap:10,//各个item之间的间隔,单位px,默认为10,横向布局时为水平间隔,纵向布局时为纵向间隔
// fontColor:'666666',
// lineHeight:17,//默认opts.fontSize+5
// fontSize:12,//默认opts.fontSize
// backgroundColor:rgba(0,0,0,0),//图例背景颜色
// borderColor:rgba(0,0,0,0),//图例边框颜色
// format:()=>{}//未来预留,暂未生效】自定义显示数据内容
},
//扩展配置 extraAs 详情请看 http://doc.ucharts.cn/1172130
extra: {
line: {
type: this.lineType
}
}
};
optionAs[this.canvasId] = Object.assign(defaultOption, this.basicAs, this.xAxisAs, this.yAxisAs, this.legendAs, this.extraAs);
lineCharts[this.canvasId] = new uCharts(optionAs[this.canvasId]);
},
touchstart(e) {
let that = this;
lineCharts[this.canvasId].touchLegend(e, { animation: false });
lineCharts[this.canvasId].scrollStart(e);
lineCharts[this.canvasId].showToolTip(e, {
//修改点击事弹出文字
format: function(item, category) {
let defaultSetting = { type: 'number', fixed: 0, name: '' };
let newName;
let { type, fixed, name } = that.yAxisAs && that.yAxisAs.formatter ? Object.assign(defaultSetting, that.yAxisAs.formatter) : defaultSetting;
if (typeof item.data === 'object') {
if (type == 'number') {
return `${category} ${item.name}:${item.data.value.toFixed(fixed)}${name}`;
} else if (type == 'percent') {
newName = name || '%';
return `${category} ${item.name}:${(item.data.value * 100).toFixed(fixed)}${newName}`;
} else {
return `${category} ${item.name}:${item.data.value}`;
}
} else {
if (type == 'number') {
return `${category} ${item.name}:${item.data.toFixed(fixed)}${name}`;
} else if (type == 'percent') {
newName = name || '%';
return `${category} ${item.name}:${(item.data * 100).toFixed(fixed)}${newName}`;
} else {
return `${category} ${item.name}:${item.data}`;
}
}
}
});
},
touchmove(e) {
lineCharts[this.canvasId].scroll(e);
},
touchend(e) {
lineCharts[this.canvasId].scrollEnd(e);
},
changeData({ series, categories }) {
lineCharts[this.canvasId].updateData({
series,
categories
});
}
}
};
</script>
<style></style>
<template>
<view class="ring_chart">
<canvas :canvasId="canvasId" id="canvasId" :style="{ width: cWidth + 'px', height: cHeight + 'px' }" @touchstart="touchstart" />
<slot />
</view>
</template>
<script>
import uCharts from '@/plugins/stan-ucharts/u-charts/u-charts.js'; //可以优化放全局 uCharts ==>使用全局
const ringCharts = {},
optionAs = {};
export default {
name: 'PieChart',
props: {
dataAs: {
//数据
type: Object,
default: () => ({})
},
basicAs: {
////通用基础项设置
type: Object,
default: () => ({})
},
titleAs: {
//只适用于适用于ring 环形、arcbar 弧线、gauge量规
type: Object,
default: () => ({})
},
legendAs: {
//图例设置
type: Object,
default: () => ({})
},
extraAs: {
//详情请看 http://doc.ucharts.cn/1172130
type: Object,
default: () => ({})
},
width: {
//图标宽度
type: Number,
default: 720
},
height: {
//图标高度
type: Number,
default: 500
},
valueKey: {
type: String,
default: 'series'
},
canvasId: {
type: String,
default: `ring_canvas_${Math.ceil(Math.random(5) * 10000)}`
}
},
data() {
return {};
},
computed: {
cWidth() {
return uni.upx2px(this.width);
},
cHeight() {
return uni.upx2px(this.height);
}
},
methods: {
showCharts() {
let defaultOption = {
//通用基础项设置 basicAs
$this: this, //this实例组件内使用图表,必须传入this实例
canvasId: this.canvasId, //页面组件canvas-id,支付宝中为id
type: 'ring', //图表类型,可选值为pie、line、column、area、ring、radar、arcbar、gauge、candle、bar、mix、rose、word
padding: [0, 15, 0, 15], //画布填充边距,顺序为上右下左,同css,但必须4位
colors: ['#FB7857', '#FACD60', '#1BC0C6'], //图表配色方案,不传则使用系统默认配置
rotate: false, //是否横屏展示
rotateLock: true, // 锁定横屏模式,如果在支付宝和百度小程序中使用横屏模式,请赋值true,否则每次都会旋转90度。跨端使用通过uni-app的条件编译来赋值
animation: true, //是否动画展示
dataPointShape: true,
duration: 1000, //动画展示时长单位毫秒
fontSize: 12, //全局默认字体大小(可选,单位为px,默认13px)高分屏不必乘像素比,自动根据pixelRatio计算
background: '#ffffff', //canvas背景颜色(如果页面背景颜色不是白色请设置为页面的背景颜色,默认#ffffff)无作用
pixelRatio: 1, //像素比,默认为1,仅支付宝小程序需要大于1,其他平台必须为1
width: this.cWidth, //canvas宽度,单位为px,支付宝高分屏需要乘像素比(pixelRatio)
height: this.cHeight, //canvas高度,单位为px,支付宝高分屏需要乘像素比
//数据列表配置项 dataAS
series: this.dataAs[this.valueKey], //数据列表
//图列配置 legendAs
legend: {
show: true, //是否显示各类别的图例标识
position: 'top',
float: 'left',
padding: 10,
margin: 0
},
//titleAs
title: {
name: '支付'
},
subtitle: {
name: '百分比占比'
},
//扩展配置 extraAs 详情请看 http://doc.ucharts.cn/1172130
extra: {
pie: {
lableWidth: 15,
ringWidth: 40, //圆环的宽度
offsetAngle: 0 //圆环的角度
}
}
};
optionAs[this.canvasId] = Object.assign(defaultOption, this.basicAs, this.titleAs, this.legendAs, this.extraAs);
ringCharts[this.canvasId] = new uCharts(optionAs[this.canvasId]);
},
touchstart(e) {
ringCharts[this.canvasId].touchLegend(e, {
animation: false
});
ringCharts[this.canvasId].showToolTip(e, {
format: function(item) {
if (typeof item.data === 'object') {
return `${item.name}:${item.data.value}`;
} else {
return `${item.name}:${item.data}`;
}
}
});
},
changeData(series) {
ringCharts[this.canvasId].updateData({
series
});
}
}
};
</script>
<style></style>
import Vue from 'vue'
import App from './App'
import uView from 'uview-ui';
Vue.use(uView);
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({
...App
})
app.$mount()
{
"name" : "辉码云助手",
"appid" : "",
"description" : "",
"versionName" : "1.0.1",
"versionCode" : 101,
"transformPx" : false,
/* 5+App特有相关 */
"app-plus" : {
"usingComponents" : true,
"nvueCompiler" : "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.READ_CONTACTS\"/>",
"<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.WRITE_CONTACTS\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
"<uses-permission android:name=\"android.permission.RECORD_AUDIO\"/>",
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
"<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>",
"<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.CALL_PHONE\"/>",
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>",
"<uses-feature android:name=\"android.hardware.camera\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>",
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
]
},
/* ios打包配置 */
"ios" : {},
/* SDK配置 */
"sdkConfigs" : {}
}
},
/* 快应用特有相关 */
"quickapp" : {},
/* 小程序特有相关 */
"mp-weixin" : {
"appid" : "wx2069580e73a0190f",
"setting" : {
"urlCheck" : false,
"postcss" : true,
"minified" : true,
"es6" : true
},
"usingComponents" : true
},
"mp-alipay" : {
"usingComponents" : true
},
"mp-baidu" : {
"usingComponents" : true
},
"mp-toutiao" : {
"usingComponents" : true
},
"uniStatistics" : {
"enable" : false
}
}
{
"dependencies": {
"vue-i18n": "^8.24.1"
}
}
{
"easycom": {
// 下载安装的方式需要前面的"@/",npm安装的方式无需"@/"
// 下载安装方式
"^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue"
// npm安装方式
// "^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
},
"pages": [
{
"path": "pages/home/home",
"style": {
"navigationStyle": "custom",
"app-plus": {
"titleView": false
},
"enablePullDownRefresh": false
}
}
],
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app",
"navigationBarBackgroundColor": "#ffffff",
"backgroundColor": "#ffffff"
},
"tabBar": {
"color": "#C0C4CC",
"selectedColor": "#fa436a",
"borderStyle": "white",
"backgroundColor": "#ffffff"
}
}
<template>
<view class="app">
<view class="nav">
<u-tabs
ref="tabs"
bg-color="#F5F7F9"
:item-width="156"
:bar-width="88"
active-color="#EA4847"
inactive-color="#949494"
:list="list"
:current="current"
@change="change"
></u-tabs>
<u-icon size="80" :name="require('../../static/svg/calendar_icon.svg')"></u-icon>
</view>
<view class="info-box">
<view class="item">
<text>今日实收</text>
<text>€2408,50</text>
</view>
<view class="item">
<text>客单均价</text>
<text>€127,68</text>
</view>
<view class="item">
<text>订单数</text>
<text>888</text>
</view>
</view>
<view class="charts-box">
<view class="header">
<text>收入走势</text>
<u-icon size="80" :name="require('../../static/svg/calendar_icon.svg')"></u-icon>
</view>
<view class="time">
<text>2021/02/28</text>
<text>
历史最低价:
<text style="color: #EA4847;font-weight: 600;">€5990,0</text>
</text>
</view>
<view class="line">
<line-chart
canvasId="index_line_1"
:lineType="'curve'"
ref="lineData1"
:dataAs="lineData"
:yAxisAs="{
formatter: {
type: 'string' //type:number percent String,额外参数:fixed:NUmber,name:String
}
}"
/>
</view>
</view>
<view class="charts-box">
<view class="header">
<text>支付方式占比</text>
<u-icon size="80" :name="require('../../static/svg/calendar_icon.svg')"></u-icon>
</view>
<view class="time">
<text>2021/02/28</text>
</view>
<!-- 环状图 -->
<view class="ring_chart">
<ring-chart
:dataAs="pieData"
ref="ringChart0"
canvasId="index_ring_1"
/>
<view class="progress">
<view class="titel">
<text>刷卡</text>
<text>€5000</text>
</view>
<AiProgress :percentage='50' bgColor='#FB7857'></AiProgress>
<view class="titel">
<text>现金</text>
<text>€5000</text>
</view>
<AiProgress :percentage='40' bgColor='#FACD60'></AiProgress>
<view class="titel">
<text>其它</text>
<text>€5000</text>
</view>
<AiProgress :percentage='10' bgColor='#1BC0C6'></AiProgress>
</view>
</view>
</view>
</view>
</template>
<script>
import LineChart from '@/components/stan-ucharts/LineChart.vue';
import RingChart from '@/components/stan-ucharts/RingChart.vue';
import AiProgress from '@/components/ai-progress/ai-progress.vue';
export default {
components: {
LineChart,
RingChart,
AiProgress
},
data() {
return {
lineData: {
//带百分比的图--折线图数据
categories: ['0:00', '4:00', '8:00', '12:00', '18:00', '24:00'],
series: [{ name: '成交量B', data: [6000, 5500, 6300, 7990, 7000, 7500] }]
},
pieData: {
//饼状图数据
series: [
{
name: '刷卡',
data: 50
},
{
name: '现金',
data: 40
},
{
name: '其它',
data: 10
}
]
},
src: 'https://ss0.baidu.com/-Po3dSag_xI4khGko9WTAnF6hhy/baike/pic/item/9825bc315c6034a8cda67260c11349540823768f.jpg',
list: [
{
name: '日'
},
{
name: '周'
},
{
name: '月'
},
{
name: '年'
}
],
current: 0
};
},
onLoad() {
//ajax调用
this.getServerData();
this.$refs['ringChart0'].showCharts();
},
methods: {
getServerData() {
setTimeout(() => {
//延迟模拟ajax嗲用后台数据
let categories = ['0:00', '4:00', '8:00', '12:00', '18:00', '24:00'];
let series = [{ name: '成交量A', data: [6000, 5500, 6300, 7990, 7000, 7500] }];
this.$set(this.lineData, 'categories', categories);
this.$set(this.lineData, 'series', series);
this.$refs['lineData1'].showCharts();
}, 1000);
},
change(index) {
this.current = index;
}
}
};
</script>
<style lang="scss" scoped>
.app {
height: 100%;
padding-bottom: 30rpx;
.nav {
display: flex;
}
.charts-box {
width: 702rpx;
box-sizing: border-box;
padding: 24rpx 0 24rpx 0;
background: #ffffff;
box-shadow: 0px 4rpx 8rpx rgba(0, 0, 0, 0.04);
border-radius: 16rpx;
margin: 0 auto 20rpx auto;
.progress {
width: 100%;
box-sizing: border-box;
padding: 0 28rpx;
margin-top:80rpx;
.titel {
width: 82%;
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 30rpx;
text:nth-child(1){
font-size: 32rpx;
font-family: PingFangSC-Regular;
line-height: 44rpx;
color: #000000;
}
text:nth-child(2){
font-size: 28rpx;
line-height: 40rpx;
color: #A1A1A1;
}
}
}
.time {
display: flex;
justify-content: space-between;
font-size: 20rpx;
font-family: PingFang SC;
font-weight: 600;
line-height: 28rpx;
color: #949494;
padding: 10rpx 28rpx;
}
.header {
display: flex;
align-items: center;
justify-content: space-between;
padding-left: 28rpx;
text {
font-size: 36rpx;
font-family: PingFang SC;
font-weight: 600;
line-height: 50rpx;
color: #282828;
}
}
}
.info-box {
width: 702rpx;
padding: 40rpx 28rpx;
background: #ffffff;
box-shadow: 0px 4rpx 8rpx rgba(0, 0, 0, 0.04);
border-radius: 16rpx;
margin: 5rpx auto 20rpx auto;
display: flex;
align-items: center;
justify-content: space-between;
.item {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text:nth-child(1) {
font-size: 32rpx;
font-family: PingFangSC-Regular;
line-height: 44rpx;
color: #282828;
}
text:nth-child(2) {
font-size: 40rpx;
font-family: PingFangSC-Semibold;
line-height: 56rpx;
color: #ea4847;
margin-top: 10rpx;
}
}
}
}
</style>
<template>
<view class="app">
<view class="nav">
<u-tabs ref="tabs" bg-color='#F5F7F9' :item-width='160' :bar-width='88' active-color='#EA4847' inactive-color='#949494' :list="list" :current="current" @change="change"></u-tabs>
<u-icon size="80" :name="require('../../static/svg/calendar_icon.svg')"></u-icon>
</view>
<p>收银员总数:5人</p>
<view class="list">
<view class="left">
<u-image width="144rpx" height="144rpx" :src="src" shape="circle">
<u-loading slot="loading"></u-loading>
</u-image>
<view class="name">
<text>001 珍 妮</text>
<text>刷卡:€600,00</text>
</view>
</view>
<view class="right">
<text>€1000,00</text>
<text>€1888,00</text>
<text>现金:€400,00</text>
</view>
</view>
<view class="list">
<view class="left">
<u-image width="144rpx" height="144rpx" :src="src" shape="circle">
<u-loading slot="loading"></u-loading>
</u-image>
<view class="name">
<text>001 珍 妮</text>
<text>刷卡:€600,00</text>
</view>
</view>
<view class="right">
<text>€1000,00</text>
<text>€1888,00</text>
<text>现金:€400,00</text>
</view>
</view>
<view class="list">
<view class="left">
<u-image width="144rpx" height="144rpx" :src="src" shape="circle">
<u-loading slot="loading"></u-loading>
</u-image>
<view class="name">
<text>001 珍 妮</text>
<text>刷卡:€600,00</text>
</view>
</view>
<view class="right">
<text>€1000,00</text>
<text>€1888,00</text>
<text>现金:€400,00</text>
</view>
</view>
<view class="list">
<view class="left">
<u-image width="144rpx" height="144rpx" :src="src" shape="circle">
<u-loading slot="loading"></u-loading>
</u-image>
<view class="name">
<text>001 珍 妮</text>
<text>刷卡:€600,00</text>
</view>
</view>
<view class="right">
<text>€1000,00</text>
<text>€1888,00</text>
<text>现金:€400,00</text>
</view>
</view>
<view class="list">
<view class="left">
<u-image width="144rpx" height="144rpx" :src="src" shape="circle">
<u-loading slot="loading"></u-loading>
</u-image>
<view class="name">
<text>001 珍 妮</text>
<text>刷卡:€600,00</text>
</view>
</view>
<view class="right">
<text>€1000,00</text>
<text>€1888,00</text>
<text>现金:€400,00</text>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
src: 'https://ss0.baidu.com/-Po3dSag_xI4khGko9WTAnF6hhy/baike/pic/item/9825bc315c6034a8cda67260c11349540823768f.jpg',
list: [{
name: '日'
}, {
name: '周'
}, {
name: '月'
}, {
name: '年'
}],
current: 0
}
},
methods: {
change(index) {
this.current = index;
}
}
}
</script>
<style lang="scss">
.app {
.nav{
display: flex;
}
p {
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
line-height: 40rpx;
color: #282828;
margin: 32rpx;
}
.list {
width: 702rpx;
box-sizing: border-box;
padding: 18rpx 24rpx 14rpx 24rpx;
background: #FFFFFF;
box-shadow: 0px 4rpx 8rpx rgba(0, 0, 0, 0.04);
border-radius: 16rpx;
margin: 0 auto 20rpx auto;
display: flex;
align-items: center;
justify-content: space-between;
.right {
display: flex;
flex-direction: column;
align-items: flex-end;
text:nth-child(1){
font-size: 36rpx;
font-family: PingFang SC;
font-weight: bold;
line-height: 50rpx;
color: #EA4847;
}
text:nth-child(2){
font-size: 24rpx;
font-family: PingFangSC-Regular;
line-height: 34rpx;
color: #1BC0C6;
}
text:nth-child(3){
font-size: 28rpx;
font-family: PingFangSC-Regular;
line-height: 40rpx;
color: #949494;
}
}
.left {
display: flex;
align-items: center;
.name {
margin-left: 20rpx;
display: flex;
flex-direction: column;
min-width: 250rpx;
text:nth-child(1){
font-size: 36rpx;
font-family: PingFang SC;
font-weight: 600;
line-height: 50rpx;
color: #282828;
}
text:nth-child(2){
font-size: 28rpx;
font-family: PingFangSC-Regular;
line-height: 40rpx;
color: #949494;
margin-top:30rpx;
}
}
}
}
}
</style>
<template>
<view class="app">
<view class="header">
<page-header>
<view class="nav">
<u-icon name="arrow-left" color="#000000" size="38"></u-icon>
<text class="title">早起活动</text>
</view>
<view class="header-main">
<view class="header-left">
<text>26888</text>
<text>明天早起打开可瓜分</text>
<text>(真我币)</text>
</view>
<view class="header-right">
<view class="tag">
我的战绩
</view>
<view class="user">
个人中心
<u-icon name="arrow-right" color="#000000" size="28"></u-icon>
</view>
</view>
</view>
</page-header>
</view>
<view class="pay-box">
<view class="top">
<view class="item">
<u-icon name="photo" color="#2979ff" size="28"></u-icon>
<view class="text">
<text>参加人数</text>
<text>1000</text>
</view>
</view>
<view class="item">
<u-icon name="photo" color="#2979ff" size="28"></u-icon>
<view class="text">
<text>上次人均瓜分</text>
<text>1000</text>
</view>
</view>
</view>
<view class="time-box">
<view class="time">
<text>9:00-22:00</text>
<text>sing up</text>
</view>
<view class="line-box">
<text>NEXT DAY</text>
<view class="line"></view>
</view>
<view class="time">
<text>9:00-22:00</text>
<text>clock in</text>
</view>
<view class="line-box">
<text>NEXT DAY</text>
<view class="line"></view>
</view>
<view class="time">
<text>9:00-22:00</text>
<text>settlement</text>
</view>
</view>
<view class="btn">
支付100(真我币),参加活动
</view>
<view class="gz">
<text>规则</text>
<u-icon name="arrow-right" color="#999999" size="10"></u-icon>
</view>
</view>
</view>
</template>
<script>
import pageHeader from '@/components/page-header.vue';
export default {
components: {
pageHeader
},
data() {
return {
number: 0,
};
},
computed: {
},
onLoad(option) {
},
methods: {
goSalesInquiry() {
uni.navigateTo({
url: '../salesInquiry/salesInquiry'
});
},
startMove() {
// eslint-disable-next-line
let timer = setTimeout(() => {
if (this.number === 2) {
this.number = 0;
} else {
this.number += 1;
}
this.startMove();
}, 2000); // 滚动不需要停顿则将2000改成动画持续时间
}
}
};
</script>
<style lang="scss" scoped>
.app {
background: #f5f7f9;
height: 100vh;
.gz{
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
line-height: 24rpx;
margin: 0 auto;
text-align: center;
text {
margin-right: 4rpx;
}
}
.btn {
width: 510rpx;
height: 74rpx;
background: #FFC915;
border-radius: 8rpx;
display: flex;
align-items: center;
justify-content: center;
font-size: 28rpx;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #000000;
line-height: 40rpx;
margin: 50rpx auto 32rpx auto;
}
.header {
width: 100vw;
height: 435rpx;
background: linear-gradient(136deg, #FFCA16 0%, #FFD64A 100%);
&-main {
padding: 0 40rpx 0 60rpx;
box-sizing: border-box;
display: flex;
margin-top: 47rpx;
justify-content: space-between;
.header-right {
margin-top: 37rpx;
.tag {
padding: 8rpx 14rpx;
font-size: 28rpx;
font-family: OpenSans;
color: #000000;
line-height: 34rpx;
border-radius: 4rpx;
border: 1rpx solid #555555;
margin-bottom: 37rpx;
}
}
.header-left {
display: flex;
flex-direction: column;
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
line-height: 30rpx;
text:nth-child(1){
font-size: 64rpx;
font-family: OpenSans;
color: #000000;
line-height: 72rpx;
margin-bottom: 20rpx;
}
}
}
.nav {
display: flex;
align-items: center;
margin-top: 20rpx;
padding-left: 15rpx;
.title {
margin-left: 250rpx;
font-size: 36rpx;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #000000;
line-height: 50rpx;
}
}
}
.pay-box {
width: 690rpx;
box-sizing: border-box;
padding: 40rpx 30rpx 40rpx 55rpx;
background: #FFFFFF;
border-radius: 7rpx;
margin: -88rpx auto 0 auto;
.time-box {
display: flex;
font-size: 24rpx;
font-family: OpenSans;
color: #999999;
line-height: 29rpx;
margin-top: 70rpx;
.time {
display: flex;
flex-direction: column;
min-width: 120rpx;
align-items: center;
}
.line-box {
width: 70rpx;
margin: 0 25rpx;
text{
font-size: 22rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #FFC915;
line-height: 24rpx;
display: block;
margin-top: -20rpx;
margin-bottom: 6rpx;
}
.line {
width: 70rpx;
height: 1rpx;
background-color: #999999;
}
}
}
.top {
display: flex;
justify-content:space-between;
padding: 0 30rpx;
.item {
display: flex;
.text{
display: flex;
flex-direction: column;
margin-left: 27rpx;
font-size: 24rpx;
font-family: OpenSans;
color: #333333;
line-height: 30rpx;
}
}
}
}
}
</style>
<template>
<view class="language">
<p>选择您的语言</p>
<view class="lang" v-for="(i, idx) in langList" :key="idx">
<view class="left">
<text>{{ i.title }}</text>
<text>{{ i.value }}</text>
</view>
<view class="icon" v-if="i.default"><u-icon name="checkbox-mark" color="#FFFFFF" size="28"></u-icon></view>
</view>
<u-tabbar :list="list"></u-tabbar>
</view>
</template>
<script>
export default {
data() {
return {
list: [
{
pagePath: "/pages/home/home",
iconPath: require('../../static/svg/index_icon.svg'),
selectedIconPath: require('../../static/svg/index_icon_hover.svg'),
text: '首页',
customIcon: false
},
{
pagePath: "/pages/language/language",
iconPath: require('../../static/svg/Language_icon.svg'),
selectedIconPath: require('../../static/svg/Language_icon_hover.svg'),
text: '切换语言',
customIcon: false
},
{
pagePath: "/pages/user/user",
iconPath: require('../../static/svg/my_icon.svg'),
selectedIconPath: require('../../static/svg/my_icon_hover.svg'),
text: '我的',
customIcon: false
}
],
langList: [
{ title: '简体中文', value: '简体中文', default: true },
{ title: 'English', value: '英语' },
{ title: '繁體中文', value: '繁体中文' },
{ title: 'Español', value: '西班牙语' },
{ title: 'Français', value: '法语' },
{ title: 'Deutsch', value: '德语' }
]
};
}
};
</script>
<style lang="scss" scoped>
.language {
background: #f5f7f9;
min-height: 100vh;
p {
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 400;
line-height: 34rpx;
color: #282828;
padding: 30rpx 48rpx 24rpx 48rpx;
}
.lang {
width: 702rpx;
padding: 16rpx 24rpx;
box-sizing: border-box;
background: #ffffff;
box-shadow: 0px 4rpx 8rpx rgba(0, 0, 0, 0.04);
border-radius: 8rpx;
display: flex;
align-items: center;
justify-content: space-between;
margin: 0 auto 16rpx auto;
.icon {
width: 48rpx;
height: 48rpx;
background: #e74645;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
.left {
display: flex;
flex-direction: column;
font-size: 32rpx;
font-family: PingFang SC;
font-weight: 500;
line-height: 44rpx;
color: #282828;
text:nth-child(2) {
font-size: 24rpx;
line-height: 40rpx;
}
}
}
}
</style>
<template>
<view>
<web-view :webview-styles="webviewStyles" :src="articleurl"></web-view>
</view>
</template>
<script>
export default {
data() {
return {
articleurl: '',
webviewStyles: {
progress: {
color: '#FF7200'
}
}
};
},
onLoad(options) {
this.articleurl = 'http://www.baidu.com/';
}
}
</script>
<style>
</style>
<template>
<view class="content">
<view class="list">
<view class="tishi">若您忘记了密码,可在此重新设置新密码。</view>
<view class="list-call">
<image class="img" src="/static/shilu-login/1.png"></image>
<input class="sl-input" type="number" v-model="phone" maxlength="11" placeholder="请输入手机号" />
</view>
<view class="list-call">
<image class="img" src="/static/shilu-login/2.png"></image>
<input class="sl-input" type="text" v-model="password" maxlength="32" placeholder="请输入新密码" :password="!showPassword" />
<image class="img" :src="showPassword?'/static/shilu-login/op.png':'/static/shilu-login/cl.png'" @tap="display"></image>
</view>
<view class="list-call">
<image class="img" src="/static/shilu-login/3.png"></image>
<input class="sl-input" type="number" v-model="code" maxlength="4" placeholder="验证码" />
<view class="yzm" :class="{ yzms: second>0 }" @tap="getcode">{{yanzhengma}}</view>
</view>
</view>
<view class="button-login" hover-class="button-hover" @tap="bindLogin()">
<text>修改密码</text>
</view>
</view>
</template>
<script>
var _this, js;
export default {
data() {
return {
phone: '',
second: 0,
code: "",
showPassword: false,
password: ''
}
},
onLoad() {
_this = this;
},
computed: {
yanzhengma() {
if (this.second == 0) {
return '获取验证码';
} else {
if (this.second < 10) {
return '重新获取0' + this.second;
} else {
return '重新获取' + this.second;
}
}
}
},
onUnload() {
this.clear()
},
methods: {
display() {
this.showPassword = !this.showPassword
},
clear(){
clearInterval(js)
js = null
this.second = 0
},
getcode() {
if (this.phone.length != 11) {
uni.showToast({
icon: 'none',
title: '手机号不正确'
});
return;
}
if (this.second > 0) {
return;
}
_this.second = 60;
js = setInterval(function() {
_this.second--;
if (_this.second == 0) {
_this.clear()
}
}, 1000)
uni.request({
url: 'http://***/getcode.html', //仅为示例,并非真实接口地址。
data: {
phone: this.phone,
type: 'forget'
},
method: 'POST',
dataType: 'json',
success: (res) => {
if (res.data.code != 200) {
uni.showToast({
title: res.data.msg,
icon: 'none'
});
_this.second = 0;
} else {
uni.showToast({
title: res.data.msg
});
_this.second = 60;
js = setInterval(function() {
_this.second--;
if (_this.second == 0) {
_this.clear()
}
}, 1000)
}
},fail() {
this.clear()
}
});
},
bindLogin() {
if (this.phone.length != 11) {
uni.showToast({
icon: 'none',
title: '手机号不正确'
});
return;
}
if (this.password.length < 6) {
uni.showToast({
icon: 'none',
title: '密码不正确'
});
return;
}
if (this.code.length != 4) {
uni.showToast({
icon: 'none',
title: '验证码不正确'
});
return;
}
uni.request({
url: 'http://***/forget.html',
data: {
phone: this.phone,
password: this.password,
code: this.code
},
method: 'POST',
dataType: 'json',
success: (res) => {
if (res.data.code != 200) {
uni.showToast({
title: res.data.msg,
icon: 'none'
});
} else {
uni.showToast({
title: res.data.msg
});
setTimeout(function() {
uni.navigateBack();
}, 1500)
}
}
});
}
}
}
</script>
<style>
.content {
display: flex;
flex-direction: column;
justify-content: center;
}
.tishi {
color: #999999;
font-size: 28rpx;
line-height: 50rpx;
margin-bottom: 50rpx;
}
.list {
display: flex;
flex-direction: column;
padding-top: 50rpx;
padding-left: 70rpx;
padding-right: 70rpx;
}
.list-call {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
height: 100rpx;
color: #333333;
border-bottom: 0.5px solid #e2e2e2;
}
.list-call .img {
width: 40rpx;
height: 40rpx;
}
.list-call .sl-input {
flex: 1;
text-align: left;
font-size: 32rpx;
margin-left: 16rpx;
}
.button-login {
color: #FFFFFF;
font-size: 34rpx;
width: 470rpx;
height: 100rpx;
background: linear-gradient(-90deg, rgba(63, 205, 235, 1), rgba(188, 226, 158, 1));
box-shadow: 0rpx 0rpx 13rpx 0rpx rgba(164, 217, 228, 0.2);
border-radius: 50rpx;
line-height: 100rpx;
text-align: center;
margin-left: auto;
margin-right: auto;
margin-top: 100rpx;
}
.button-hover {
background: linear-gradient(-90deg, rgba(63, 205, 235, 0.8), rgba(188, 226, 158, 0.8));
}
.yzm {
color: #FF7D13;
font-size: 24rpx;
line-height: 64rpx;
padding-left: 10rpx;
padding-right: 10rpx;
width: auto;
height: 64rpx;
border: 1rpx solid rgba(255, 131, 30, 1);
border-radius: 50rpx;
}
.yzms {
color: #999999 !important;
border: 1rpx solid #999999;
}
</style>
<template>
<view class="content">
<view class="header">
<image src="../../static/svg/logo.svg"></image>
<p>辉码云助手</p>
</view>
<view class="list">
<view class="list-call">
<image class="img" src="/static/svg/user_icon.svg"></image>
<input class="sl-input" @input="validateFields" v-model="userName" type="number" maxlength="11" placeholder="输入用户名" />
<image @click="userName=''" class="img" src="/static/svg/x_icon.svg"></image>
</view>
<view class="list-call">
<image class="img" src="/static/svg/password_icon.svg"></image>
<input class="sl-input" @input="validateFields" v-model="password" type="text" maxlength="32" placeholder="输入密码" :password="!showPassword" />
<image class="img" :src="showPassword ? '/static/svg/Password_open_eyes.svg' : '/static/svg/Password_Eyes_closed_icon.svg'" @tap="display"></image>
</view>
</view>
<view class="tips" v-if="false">*用户名或密码错误,请重新输入</view>
<view v-if="isLogin" class="button-login isLogin" hover-class="button-hover" @tap="bindLogin()"><text>登录</text></view>
<view v-else class="button-login" hover-class="button-hover"><text>登录</text></view>
<view class="agreenment"><u-divider>设备号2.0xxxx</u-divider></view>
</view>
</template>
<script>
export default {
data() {
return {
showPassword: false,
isLogin: false,
userName: '',
password: ''
};
},
methods: {
display() {
this.showPassword = !this.showPassword
},
// 未填写用户名或密码,登录不可点
validateFields() {
if (this.userName && this.password) {
this.isLogin = true;
} else {
this.isLogin = false;
}
},
bindLogin() {
uni.reLaunch({
url: '../home/home'
});
// if (this.userName.length != 11) {
// uni.showToast({
// icon: 'none',
// title: '手机号不正确'
// });
// return;
// }
// if (this.password.length < 6) {
// uni.showToast({
// icon: 'none',
// title: '密码不正确'
// });
// return;
// }
// uni.request({
// url: 'http://***/login.html',
// data: {
// userName: this.userName,
// password: this.password
// },
// method: 'POST',
// dataType: 'json',
// success: res => {
// if (res.data.code != 200) {
// uni.showToast({
// title: res.data.msg,
// icon: 'none'
// });
// } else {
// //成功后的逻辑
// uni.navigateBack();
// }
// }
// });
}
}
};
</script>
<style lang="scss" scoped>
.content {
display: flex;
flex-direction: column;
justify-content: center;
}
.header {
width: 161rpx;
height: 161rpx;
//box-shadow: 0rpx 12rpx 13rpx 0rpx rgba(63, 205, 235, 0.47);
border-radius: 50%;
margin-top: 30%;
margin-left: auto;
margin-right: auto;
p {
font-size: 32rpx;
font-family: PingFang SC;
font-weight: 600;
line-height: 44rpx;
color: #e74645;
margin: 24rpx 0 0 0;
}
}
.header image {
width: 161rpx;
height: 161rpx;
//border-radius: 50%;
}
.list {
display: flex;
flex-direction: column;
padding-top: 50rpx;
padding-left: 70rpx;
padding-right: 70rpx;
margin-top: 106rpx;
}
.list-call {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
height: 100rpx;
color: #333333;
border-bottom: 0.5px solid #e2e2e2;
}
.list-call .img {
width: 48rpx;
height: 48rpx;
}
.list-call .sl-input {
flex: 1;
text-align: left;
font-size: 32rpx;
margin-left: 16rpx;
}
.button-login {
color: #ffffff;
font-size: 34rpx;
width: 630rpx;
height: 90rpx;
background: rgba(231, 70, 69, 0.3);
border-radius: 45rpx;
line-height: 100rpx;
margin-left: auto;
margin-right: auto;
margin-top: 100rpx;
display: flex;
align-items: center;
justify-content: center;
}
.button-hover {
background: rgba(231, 70, 69, 0.3);
}
.isLogin {
background: #e74645;
}
.tips {
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 500;
line-height: 34rpx;
color: #e74645;
opacity: 1;
margin: 24rpx auto 0 auto;
}
.agreenment {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
font-size: 30rpx;
margin-top: 180rpx;
color: #ffa800;
text-align: center;
height: 40rpx;
line-height: 40rpx;
width: 100vw;
position: absolute;
bottom: 53rpx;
}
.agreenment text {
font-size: 24rpx;
margin-left: 15rpx;
margin-right: 15rpx;
}
</style>
<template>
<view class="content">
<view class="header">
<image src="../../static/shilu-login/logo.png"></image>
</view>
<view class="list">
<view class="list-call">
<image class="img" src="/static/shilu-login/1.png"></image>
<input class="sl-input" v-model="phone" type="number" maxlength="11" placeholder="手机号" />
</view>
<view class="list-call">
<image class="img" src="/static/shilu-login/2.png"></image>
<input class="sl-input" v-model="password" type="text" maxlength="32" placeholder="登录密码" :password="!showPassword" />
<image class="img" :src="showPassword?'/static/shilu-login/op.png':'/static/shilu-login/cl.png'" @tap="display"></image>
</view>
<view class="list-call">
<image class="img" src="/static/shilu-login/3.png"></image>
<input class="sl-input" v-model="code" type="number" maxlength="4" placeholder="验证码" />
<view class="yzm" :class="{ yzms: second>0 }" @tap="getcode">{{yanzhengma}}</view>
</view>
<view class="list-call">
<image class="img" src="/static/shilu-login/4.png"></image>
<input class="sl-input" v-model="invitation" type="text" maxlength="12" placeholder="邀请码" />
</view>
</view>
<view class="button-login" hover-class="button-hover" @tap="bindLogin">
<text>注册</text>
</view>
<view class="agreement">
<image @tap="agreementSuccess" :src="agreement==true?'/static/shilu-login/ty1.png':'/static/shilu-login/ty0.png'"></image>
<text @tap="agreementSuccess"> 同意</text>
<navigator url="agreement?id=1" open-type="navigate">《软件用户协议》</navigator>
</view>
</view>
</template>
<script>
var _this, js;
export default {
onLoad() {
_this = this;
},
onUnload() {
clearInterval(js)
this.second = 0;
},
data() {
return {
phone: '',
password: '',
code: '',
invitation: '',
agreement: true,
showPassword: false,
second: 0
};
},
computed: {
yanzhengma() {
if (this.second == 0) {
return '获取验证码';
} else {
if (this.second < 10) {
return '重新获取0' + this.second;
} else {
return '重新获取' + this.second;
}
}
}
},
onUnload() {
this.clear()
},
methods: {
clear(){
clearInterval(js)
js = null
this.second = 0
},
display() {
this.showPassword = !this.showPassword
},
agreementSuccess() {
this.agreement = !this.agreement;
},
getcode() {
if (this.phone.length != 11) {
uni.showToast({
icon: 'none',
title: '手机号不正确'
});
return;
}
if (this.second > 0) {
return;
}
this.second = 60;
//请求业务
js = setInterval(function() {
_this.second--;
if (_this.second == 0) {
_this.clear()
}
}, 1000)
// uni.request({
// url: 'http://***/getcode.html', //仅为示例,并非真实接口地址。
// data: {
// phone: this.phone,
// type: 'reg'
// },
// method: 'POST',
// dataType: 'json',
// success: (res) => {
// if (res.data.code != 200) {
// uni.showToast({
// title: res.data.msg,
// icon: 'none'
// });
// } else {
// uni.showToast({
// title: res.data.msg
// });
// js = setInterval(function() {
// _this.second--;
// if (_this.second == 0) {
// _this.clear()
// }
// }, 1000)
// }
// },
// fail() {
// this.second == 0
// }
// });
},
bindLogin() {
if (this.agreement == false) {
uni.showToast({
icon: 'none',
title: '请先阅读《软件用户协议》'
});
return;
}
if (this.phone.length != 11) {
uni.showToast({
icon: 'none',
title: '手机号不正确'
});
return;
}
if (this.password.length < 6) {
uni.showToast({
icon: 'none',
title: '密码不正确'
});
return;
}
if (this.code.length != 4) {
uni.showToast({
icon: 'none',
title: '验证码不正确'
});
return;
}
uni.request({
url: 'http://***/reg.html',
data: {
phone: this.phone,
password: this.password,
code: this.code,
invitation: this.invitation
},
method: 'POST',
dataType: 'json',
success: (res) => {
if (res.data.code != 200) {
uni.showToast({
title: res.data.msg,
icon: 'none'
});
} else {
uni.showToast({
title: res.data.msg
});
setTimeout(function() {
uni.navigateBack();
}, 1500)
}
}
});
}
}
}
</script>
<style>
.content {
display: flex;
flex-direction: column;
justify-content: center;
}
.header {
width: 161rpx;
height: 161rpx;
background: rgba(63, 205, 235, 1);
box-shadow: 0rpx 12rpx 13rpx 0rpx rgba(63, 205, 235, 0.47);
border-radius: 50%;
margin-top: 30rpx;
margin-left: auto;
margin-right: auto;
}
.header image {
width: 161rpx;
height: 161rpx;
border-radius: 50%;
}
.list {
display: flex;
flex-direction: column;
padding-top: 50rpx;
padding-left: 70rpx;
padding-right: 70rpx;
}
.list-call {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
height: 100rpx;
color: #333333;
border-bottom: 0.5px solid #e2e2e2;
}
.list-call .img {
width: 40rpx;
height: 40rpx;
}
.list-call .sl-input {
flex: 1;
text-align: left;
font-size: 32rpx;
margin-left: 16rpx;
}
.yzm {
color: #FF7D13;
font-size: 24rpx;
line-height: 64rpx;
padding-left: 10rpx;
padding-right: 10rpx;
width: auto;
height: 64rpx;
border: 1rpx solid #FFA800;
border-radius: 50rpx;
}
.yzms {
color: #999999 !important;
border: 1rpx solid #999999;
}
.button-login {
color: #FFFFFF;
font-size: 34rpx;
width: 470rpx;
height: 100rpx;
line-height: 100rpx;
background: linear-gradient(-90deg, rgba(63, 205, 235, 1), rgba(188, 226, 158, 1));
box-shadow: 0rpx 0rpx 13rpx 0rpx rgba(164, 217, 228, 0.2);
border-radius: 50rpx;
text-align: center;
margin-left: auto;
margin-right: auto;
margin-top: 100rpx;
}
.button-hover {
background: linear-gradient(-90deg, rgba(63, 205, 235, 0.8), rgba(188, 226, 158, 0.8));
}
.agreement {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
font-size: 30rpx;
margin-top: 80rpx;
color: #FFA800;
text-align: center;
height: 40rpx;
line-height: 40rpx;
}
.agreement image {
width: 40rpx;
height: 40rpx;
}
</style>
<template>
<view class="u-wrap">
<view class="u-search-box">
<text>2019年1月1日—2021年1月1日</text>
<u-icon size="80" :name="require('../../static/svg/calendar_icon.svg')"></u-icon>
</view>
<view class="u-menu-wrap">
<scroll-view scroll-y scroll-with-animation class="u-tab-view menu-scroll-view" :scroll-top="scrollTop">
<view v-for="(item,index) in tabbar" :key="index" class="u-tab-item" :class="[current==index ? 'u-tab-item-active' : '']"
:data-current="index" @tap.stop="swichMenu(index)">
<text class="u-line-1">{{item.name}}</text>
</view>
</scroll-view>
<block v-for="(item,index) in tabbar" :key="index">
<scroll-view scroll-y class="right-box" v-if="current==index">
<view class="page-view">
<view class="class-item">
<view class="item-title">
<text>{{item.name}}({{item.foods.length}})</text>
<view class="sall">
<text>销量</text>
<u-icon size="30" :name="require('../../static/svg/Sales_icon.svg')"></u-icon>
</view>
</view>
<view class="item-container">
<view class="thumb-box" v-for="(item1, index1) in item.foods" :key="index1">
<image class="item-menu-image" :src="item1.icon" mode=""></image>
<view class="item-menu-name">
<text>{{item1.name}}</text>
<text>月销售:108 &nbsp;&nbsp;&nbsp; 库存:10</text>
<text>€85,12</text>
</view>
</view>
</view>
</view>
</view>
</scroll-view>
</block>
</view>
</view>
</template>
<script>
import classifyData from "@/common/classify.data.js";
export default {
data() {
return {
tabbar: classifyData,
scrollTop: 0, //tab标题的滚动条位置
current: 0, // 预设当前项的值
menuHeight: 0, // 左边菜单的高度
menuItemHeight: 0, // 左边菜单item的高度
}
},
computed: {
},
methods: {
getImg() {
return Math.floor(Math.random() * 35);
},
// 点击左边的栏目切换
async swichMenu(index) {
if(index == this.current) return ;
this.current = index;
// 如果为0,意味着尚未初始化
if(this.menuHeight == 0 || this.menuItemHeight == 0) {
await this.getElRect('menu-scroll-view', 'menuHeight');
await this.getElRect('u-tab-item', 'menuItemHeight');
}
// 将菜单菜单活动item垂直居中
this.scrollTop = index * this.menuItemHeight + this.menuItemHeight / 2 - this.menuHeight / 2;
},
// 获取一个目标元素的高度
getElRect(elClass, dataVal) {
new Promise((resolve, reject) => {
const query = uni.createSelectorQuery().in(this);
query.select('.' + elClass).fields({size: true},res => {
// 如果节点尚未生成,res值为null,循环调用执行
if(!res) {
setTimeout(() => {
this.getElRect(elClass);
}, 10);
return ;
}
this[dataVal] = res.height;
}).exec();
})
}
}
}
</script>
<style lang="scss" scoped>
.u-wrap {
height: calc(100vh);
/* #ifdef H5 */
height: calc(100vh - var(--window-top));
/* #endif */
display: flex;
flex-direction: column;
}
.u-search-box {
padding: 18rpx 28rpx 18rpx 48rpx;
box-sizing: border-box;
height: 92rpx;
background: #FFFFFF;
box-shadow: 0px 4rpx 8rpx rgba(0, 0, 0, 0.04);
display: flex;
justify-content: space-between;
align-items: center;
text {
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 600;
line-height: 34rpx;
color: #282828;
}
}
.u-menu-wrap {
flex: 1;
display: flex;
overflow: hidden;
}
.u-search-inner {
background-color: rgb(234, 234, 234);
border-radius: 100rpx;
display: flex;
align-items: center;
padding: 10rpx 16rpx;
}
.u-search-text {
font-size: 26rpx;
color: $u-tips-color;
margin-left: 10rpx;
}
.u-tab-view {
width: 200rpx;
height: 100%;
}
.u-tab-item {
height: 110rpx;
background: #f6f6f6;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
font-size: 26rpx;
color: #444;
font-weight: 400;
line-height: 1;
}
.u-tab-item-active {
position: relative;
color: #EA4847;
font-size: 30rpx;
font-weight: 600;
background: #fff;
}
.u-tab-item-active::before {
content: "";
position: absolute;
border-left: 4px solid #EA4847;
height: 32rpx;
left: 0;
top: 39rpx;
}
.u-tab-view {
height: 100%;
}
.right-box {
background-color: rgb(250, 250, 250);
}
.page-view {
//padding: 16rpx;
}
.class-item {
margin-bottom: 30rpx;
background-color: #fff;
padding: 16rpx;
border-radius: 8rpx;
}
.item-title {
font-size: 32rpx;
font-family: PingFang SC;
font-weight: 500;
line-height: 44rpx;
color: #949494;
display: flex;
align-items: center;
justify-content: space-between;
.sall {
display: flex;
align-items: center;
text {
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
line-height: 40rpx;
color: #282828;
margin-right:10rpx ;
}
}
}
.item-menu-name {
font-weight: normal;
font-size: 24rpx;
color: $u-main-color;
width: 385rpx;
margin-left: 10rpx;
display: flex;
flex-direction: column;
text:nth-child(1){
font-size: 32rpx;
font-family: PingFang SC;
font-weight: 500;
line-height: 48rpx;
color: #282828;
}
text:nth-child(2){
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
line-height: 40rpx;
color: #949494;
margin:6rpx 0;
}
text:nth-child(3){
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
line-height: 40rpx;
color: #EA4847;
}
}
.item-container {
display: flex;
flex-wrap: wrap;
padding-left: 24rpx;
padding-right: 34rpx;
}
.thumb-box {
width: 100%;
display: flex;
align-items: flex-start;
justify-content: space-between;
margin-top: 20rpx;
}
.item-menu-image {
width: 120rpx;
height: 128rpx;
}
</style>
<template>
<view class="app">
<view class="u-search-box">
<text>2019年1月1日—2021年1月1日</text>
<u-icon size="80" :name="require('../../static/svg/calendar_icon.svg')"></u-icon>
</view>
<view class="info-box">
<p>总收入</p>
<p class="total">€ 240,850,00</p>
<p class="time">账户收入 | 2021年1月1日</p>
<view class="flex">
<view class="item">
<view class="i">
<view class="dot" style="background: #EA4847;"></view>
<text>现金收入</text>
<text class="text">127,680,00</text>
</view>
<view class="i">
<view class="dot" style="background: #FACD60;"></view>
<text>其它收入</text>
<text class="text">127,680,00</text>
</view>
</view>
<view class="item">
<view class="i">
<view class="dot" style="background: #FB7857;"></view>
<text>刷卡收入</text>
<text class="text">127,680,00</text>
</view>
<view class="i">
<view class="dot" style="background: #1BC0C6;"></view>
<text>订单数</text>
<text class="text">1888</text>
</view>
</view>
</view>
<view class="syysr">收银员收入</view>
<u-grid :col="3" :border="false">
<u-grid-item bg-color="rgba(250, 205, 96, 0.2)" defaultWidth="31%">
<text class="name">珍妮</text>
<view class="grid-text">€1000,00</view>
</u-grid-item>
<u-grid-item bg-color="rgba(250, 205, 96, 0.2)" defaultWidth="31%">
<text class="name">爱丽丝</text>
<view class="grid-text">€1000,00</view>
</u-grid-item>
<u-grid-item bg-color="rgba(250, 205, 96, 0.2)" defaultWidth="31%">
<text class="name">珍妮佛</text>
<view class="grid-text">€1000,00</view>
</u-grid-item>
</u-grid>
<u-grid :col="3" :border="false">
<u-grid-item bg-color="rgba(250, 205, 96, 0.2)" defaultWidth="31%">
<text class="name">Tina</text>
<view class="grid-text">€1000,00</view>
</u-grid-item>
<u-grid-item bg-color="rgba(250, 205, 96, 0.2)" defaultWidth="31%">
<text class="name">查尔斯</text>
<view class="grid-text">€1000,00</view>
</u-grid-item>
<u-grid-item bg-color="rgba(250, 205, 96, 0.2)" defaultWidth="31%">
<text class="name">威廉</text>
<view class="grid-text">€1000,00</view>
</u-grid-item>
</u-grid>
</view>
<view class="charts-box">
<view class="titel">收益走势图</view>
<view class="date">
<text>2021/01/01</text>
<text>+4880,80</text>
</view>
<view class="line">
<line-chart
:disabledx="true"
:dataLabel='false'
:height="450"
canvasId="index_line_1"
ref="lineData1"
:dataAs="lineData"
:yAxisAs="{
formatter: {
type: 'add'
}
}"
/>
<view class="time">
<text>2019/01/01</text>
<text>2021/01/01</text>
</view>
</view>
<view class="x"></view>
<view class="titel">收益构成</view>
<view class="hisChart">
<histogram-chart ref="histogramData0" :dataAs="histogramData" canvasId="ht0" />
</view>
</view>
</view>
</template>
<script>
import LineChart from '@/components/stan-ucharts/LineChart.vue';
import HistogramChart from '@/components/stan-ucharts/HistogramChart.vue';
export default {
components: {
LineChart,
HistogramChart
},
data() {
return {
histogramData: {
categories: ['现金', '刷卡', '其它'],
series: [
{
name: '收益', //数据名称
data: [
{
//(饼图、圆环图、玫瑰图为Number) 数据,如果传入null图表该处出现断点
value: 2890, // 仅针对柱状图有效,主要作用为柱状图显示数值
color: '#FB7857' //仅针对柱状图有效,主要作用为柱状图自定义颜色,可覆盖外框定义主题颜色
},
{
value: 1898,
color: '#FACD60'
},
{
value: 890,
color: '#1BC0C6'
},
],
show: true, //图形显示状态,配合点击图例显示状态,也可默认指定是否显示
color: '#FF7600', // 图形颜色 不传入则使用系统默认配色方案 即统一柱状图颜色
textSize: 12 //图形上方标注文字的字体大小
//如涉及混合图表请看 http://doc.ucharts.cn/1172126
}
]
},
lineData: {
categories: ['2019/01/01', '2020/01/01', '2020/08/01', '2020/12/01', '2020/012/05', '2021/01/01'],
series: [{ name: '收益', data: [1000, 3000, 2000, 3000,5000, 2800] }]
}
};
},
onLoad() {
this.getServerData();
this.$refs['histogramData0'].showCharts();
},
methods: {
getServerData() {
setTimeout(() => {
let categories = ['2019/01/01', '2020/01/01', '2020/08/01', '2020/12/01', '2020/12/05', '2021/01/01'];
let series = [{ name: '收益', data: [1000, 3000, 2000, 3000, 5000, 2800] }];
this.$set(this.lineData, 'categories', categories);
this.$set(this.lineData, 'series', series);
this.$refs['lineData1'].showCharts();
}, 1000);
}
}
};
</script>
<style lang="scss" scoped>
.app {
height: auto;
background-color: #f5f7f9;
padding-bottom: 30rpx;
.charts-box {
width: 702rpx;
background: #ffffff;
border-radius: 16rpx;
margin: 0 auto;
padding: 24rpx;
box-sizing: border-box;
.hisChart{
margin-left: -20rpx;
}
.x{
width: 656rpx;
height: 2rpx;
background-color: #E8E8E8;
margin: 28rpx auto;
}
.line {
margin-left: -16rpx;
.time {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 18rpx;
font-family: PingFang SC;
font-weight: 500;
line-height: 26rpx;
color: #282828;
padding-left: 120rpx;
margin-top: -100rpx;
}
}
.titel {
font-size: 32rpx;
font-family: PingFang SC;
font-weight: 600;
line-height: 44rpx;
color: #282828;
margin-bottom: 28rpx;
}
.date {
width: 656rpx;
height: 52rpx;
background: #fef5df;
border-radius: 4rpx;
padding: 11rpx 16rpx;
box-sizing: border-box;
font-size: 20rpx;
font-family: PingFang SC;
font-weight: 600;
line-height: 28rpx;
color: #2c2d31;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20rpx;
text:nth-child(2) {
font-size: 24rpx;
font-weight: 600;
line-height: 34rpx;
color: #ea4847;
}
}
}
/deep/ .u-grid-item {
border-radius: 8rpx;
margin-bottom: 16rpx;
margin-right: 2.333%;
}
.flex {
display: flex;
justify-content: space-between;
margin-top: 30rpx;
padding-right: 16rpx;
.item {
font-size: 28rpx;
font-family: PingFangSC-Regular;
line-height: 40rpx;
color: #888888;
.i {
display: flex;
align-items: center;
margin-bottom: 20rpx;
}
.text {
font-family: PingFangSC-Semibold;
font-weight: 600;
margin-left: 5rpx;
}
.dot {
width: 12rpx;
height: 12rpx;
border-radius: 50%;
margin-right: 12rpx;
}
.top {
margin-bottom: 20rpx;
}
}
}
.syysr {
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 600;
line-height: 40rpx;
color: #333333;
margin: 22rpx 0;
}
.u-search-box {
padding: 18rpx 28rpx 18rpx 48rpx;
box-sizing: border-box;
height: 92rpx;
display: flex;
justify-content: space-between;
align-items: center;
text {
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 600;
line-height: 34rpx;
color: #282828;
}
}
.info-box {
width: 702rpx;
background: #ffffff;
box-shadow: 0px 4rpx 8rpx rgba(0, 0, 0, 0.04);
border-radius: 16rpx;
padding: 28rpx 8rpx 15rpx 24rpx;
box-sizing: border-box;
margin: 5rpx auto 20rpx auto;
.name {
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 400;
line-height: 34rpx;
color: #333333;
}
.grid-text {
font-size: 24rpx;
font-family: PingFang SC;
font-weight: bold;
line-height: 34rpx;
color: #fb7857;
margin-top: 8rpx;
}
p {
text-align: center;
font-size: 32rpx;
font-family: PingFangSC-Regular;
line-height: 44rpx;
color: #282828;
}
.total {
font-size: 56rpx;
font-family: PingFangSC-Semibold;
line-height: 80rpx;
color: #ea4847;
margin: 10rpx 0;
}
.time {
font-size: 24rpx;
font-family: PingFangSC-Regular;
line-height: 34rpx;
color: #949494;
}
}
}
</style>
<template>
<view>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style>
</style>
<template>
<view class="app">
<view class="line"></view>
<view class="avatar">
<image :src="src" mode=""></image>
<image src="../../static/img/cam.png" mode=""></image>
</view>
<view class="form">
<u-form :model="form" ref="uForm" label-position="top">
<u-row gutter="16">
<u-col span="6">
<u-form-item :border-bottom="borderBottom" label="*姓"><u-input :border="border" v-model="form.sex" /></u-form-item>
</u-col>
<u-col span="6">
<u-form-item :border-bottom="borderBottom" label="*名"><u-input :border="border" v-model="form.name" /></u-form-item>
</u-col>
</u-row>
<u-row gutter="16">
<u-col span="12">
<u-form-item :border-bottom="borderBottom" label="昵称"><u-input :border="border" v-model="form.nickname" /></u-form-item>
</u-col>
</u-row>
<u-row gutter="16">
<u-col span="6">
<u-form-item :border-bottom="borderBottom" label="*代码"><u-input :border="border" v-model="form.code" /></u-form-item>
</u-col>
<u-col span="6">
<u-form-item :border-bottom="borderBottom" label="级别"><u-input @click='showSelct=true' type="select" :border="border" v-model="form.level" /></u-form-item>
</u-col>
</u-row>
<u-row gutter="16">
<u-col span="12">
<u-form-item :border-bottom="borderBottom" label="生日">
<u-input @click="show = true" type="select" :border="border" v-model="form.birthday" />
</u-form-item>
</u-col>
</u-row>
<u-row gutter="16">
<u-col span="12">
<u-form-item :border-bottom="borderBottom" label="电话号码"><u-input :border="border" v-model="form.tel" /></u-form-item>
</u-col>
</u-row>
<u-row gutter="16">
<u-col span="12">
<u-form-item :border-bottom="borderBottom" label="*密码">
<u-input :password-icon="true" type="password" :border="border" v-model="form.password" />
</u-form-item>
</u-col>
</u-row>
<u-row gutter="16">
<u-col span="12">
<u-form-item :border-bottom="borderBottom" label="*确认密码">
<u-input :password-icon="true" type="password" :border="border" v-model="form.password1" />
</u-form-item>
</u-col>
</u-row>
<u-row gutter="16">
<u-col span="16">
<u-form-item label-width="150" label-position="left" :border-bottom="borderBottom" label="是否激活"><switch /></u-form-item>
</u-col>
</u-row>
</u-form>
<view class="btn" style="margin: 28rpx auto 26rpx auto;background-color: #EA4847;">确认</view>
<view class="btn">删除</view>
</view>
<u-picker mode="time" v-model="show" :params="params" @confirm="confirm"></u-picker>
<u-select @confirm="selectConfirm" v-model="showSelct" :list="list"></u-select>
</view>
</template>
<script>
export default {
data() {
return {
list: [
{
value: '1',
label: 'shop assistant'
},
{
value: '2',
label: 'shopowner'
}
],
params: {
year: true,
month: true,
day: true,
hour: false,
minute: false,
second: false
},
show: false,
showSelct:false,
border: true,
borderBottom: false,
form: {
sex: 'Tang',
name: 'Tina',
nickname: 'Tina',
code: '001',
level: 'shop assistant',
birthday: '2021-1-1',
tel: '010-560204',
password: '123456',
password1: '123456'
},
src: 'https://ss0.baidu.com/-Po3dSag_xI4khGko9WTAnF6hhy/baike/pic/item/9825bc315c6034a8cda67260c11349540823768f.jpg'
};
},
onLoad() {
uni.setNavigationBarTitle({
title: '员工管理编辑'
});
},
methods: {
selectConfirm(e){
console.log(e)
let level = e[0].label
this.$set(this.form, 'level', level);
},
confirm(i) {
console.log(i);
let birthday = `${i.year}-${i.month}-${i.day}`;
this.$set(this.form, 'birthday', birthday);
}
}
};
</script>
<style lang="scss" scoped>
.app {
background-color: #ffffff;
/deep/ .u-form-item {
padding: 10rpx 0;
}
.form {
width: 100vw;
box-sizing: border-box;
padding: 0 32rpx 48rpx 32rpx;
.btn {
width: 688rpx;
height: 80rpx;
background: #fb7857;
border-radius: 12rpx;
font-size: 36rpx;
font-weight: 400;
line-height: 42rpx;
color: #ffffff;
margin: 0 auto;
display: flex;
align-items: center;
justify-content: center;
}
}
.line {
width: 749rpx;
height: 2rpx;
background-color: #dfdfdf;
margin: 0 auto;
}
.avatar {
width: 250rpx;
height: 250rpx;
margin: 30rpx auto 10rpx auto;
display: flex;
align-items: center;
justify-content: center;
position: relative;
image:nth-child(1) {
width: 192rpx;
height: 192rpx;
background: rgba(0, 0, 0, 0);
border: 8rpx solid #ffffff;
box-shadow: 0px 8rpx 16rpx rgba(0, 0, 0, 0.08);
border-radius: 50%;
}
image:nth-child(2) {
width: 48rpx;
height: 48rpx;
background: #1bc0c6;
border: 4rpx solid #ffffff;
border-radius: 50%;
position: absolute;
right: 25rpx;
top: 28rpx;
}
}
}
</style>
<template>
<view class="app">
<view class="tool">
<view class="totle">
我的团队 共
<text>6</text>
</view>
<text class="add">+ 添加用户</text>
</view>
<view class="content">
<u-swipe-action :show="item.show" :index="index" v-for="(item, index) in list" :key="item.id" @click="click" @open="open" :options="options">
<view class="item u-border-bottom" @click="goEdit">
<view style="display: flex;width: 580rpx;align-items: center;">
<image mode="aspectFill" :src="item.images" />
<!-- 此层wrap在此为必写的,否则可能会出现标题定位错误 -->
<view class="title-wrap">
<view class="name">
<text>{{ item.title }}</text>
<u-tag text="店员" mode="dark" bg-color='#FFE8AA' shape="circle" color='#E9AA51'/>
</view>
<text class="title u-line-2">{{ item.title }}</text>
<text class="title u-line-2">{{ item.title }}</text>
</view>
</view>
<u-icon name="arrow-right" color="#B1B1B1" size="28"></u-icon>
</view>
</u-swipe-action>
</view>
</view>
</template>
<script>
export default {
data() {
return {
list: [
{
id: 1,
title: '002 珍 妮',
images: '../../static/person.png',
show: false
},
{
id: 2,
title: '002 珍 妮',
images: '../../static/person.png',
show: false
},
{
id: 3,
title: '002 珍 妮',
images: '../../static/person.png',
show: false
}
],
disabled: false,
btnWidth: 180,
show: false,
options: [
{
text: '删除',
style: {
backgroundColor: '#EB4A49'
}
}
]
};
},
methods: {
goEdit(){
uni.navigateTo({
url:'./edit'
})
},
click(index, index1) {
if (index1 == 1) {
this.list.splice(index, 1);
this.$u.toast(`删除了第${index}个cell`);
} else {
this.list[index].show = false;
this.$u.toast(`收藏成功`);
}
},
// 如果打开一个的时候,不需要关闭其他,则无需实现本方法
open(index) {
// 先将正在被操作的swipeAction标记为打开状态,否则由于props的特性限制,
// 原本为'false',再次设置为'false'会无效
this.list[index].show = true;
this.list.map((val, idx) => {
if (index != idx) this.list[idx].show = false;
});
}
}
};
</script>
<style lang="scss" scoped>
.app {
background: #f5f7f9;
min-height: 100vh;
.content {
width: 702rpx;
margin: 0 auto;
.name {
display: flex;
align-items: center;
font-size: 36rpx;
font-family: PingFang SC;
font-weight: 600;
line-height: 50rpx;
color: #333333;
u-tag {
margin-left: 10rpx;
}
}
}
.tool {
padding: 24rpx 28rpx 24rpx 0;
display: flex;
align-items: center;
justify-content: space-between;
.add {
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
line-height: 40rpx;
color: #959595;
}
.totle {
width: 284rpx;
height: 60rpx;
background: #ffe8aa;
border-radius: 0 30rpx 30rpx 0;
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 500;
line-height: 34rpx;
color: #e9aa51;
display: flex;
align-items: center;
padding-left: 48rpx;
box-sizing: border-box;
text {
color: #dc3d40;
}
}
}
/deep/ .u-swipe-action {
background: #ffffff;
box-shadow: 0px 0px 24rpx rgba(0, 0, 0, 0.04);
border-radius: 16rpx;
margin-bottom: 24rpx;
}
.item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 20rpx;
image {
width: 138rpx;
height: 138rpx;
border-radius: 50%;
margin-right: 20rpx;
}
}
.title {
font-size: 24rpx;
font-weight: 400;
line-height: 38rpx;
color: #959595;
}
}
</style>
<template>
<view class="app">
<image src="../../static/svg/logo_icon.svg" mode=""></image>
<p>辉码云助手</p>
<view class="agreenment">
<u-divider>设备号2.0xxxx</u-divider>
</view>
</view>
</template>
<script>
export default {
data() {
return {};
},
onLoad() {
setTimeout(()=>{
this.go()
},2000)
},
methods:{
go(){
let token = uni.getStorageSync('token');
if (!token) {
uni.reLaunch({
url: '../login/login'
});
} else {
uni.reLaunch({
url: '../home/home'
});
}
}
}
};
</script>
<style lang="scss" scoped>
.app {
width: 100vw;
height: 100vh;
background: #FFFFFF;
display: flex;
flex-direction: column;
align-items: center;
image {
width: 256rpx;
height: 256rpx;
margin-top:40%;
margin-bottom: 48rpx;
}
p {
font-size: 32rpx;
font-family: PingFang SC;
font-weight: 500;
line-height: 44rpx;
color: #E74645;
}
.agreenment {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
font-size: 30rpx;
margin-top: 180rpx;
color: #FFA800;
text-align: center;
height: 40rpx;
line-height: 40rpx;
width: 100vw;
position: absolute;
bottom: 53rpx;
}
.agreenment text {
font-size: 24rpx;
margin-left: 15rpx;
margin-right: 15rpx;
}
}
</style>
This source diff could not be displayed because it is too large. You can view the blob instead.
{
"user":{
"myShop":"myshop"
}
}
\ No newline at end of file
{
"user":{
"myShop":"我的店铺"
}
}
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.cls-1{fill:#ea4847;}.cls-2{fill:none;stroke:#fff;stroke-linecap:round;stroke-linejoin:round;}</style></defs><circle id="椭圆_51" data-name="椭圆 51" class="cls-1" cx="12" cy="11.99" r="12"/><path id="联合_13" data-name="联合 13" class="cls-2" d="M17.74,9.21l-6.55,6.56ZM7.25,11.84l3.94,3.93Z"/></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.cls-1{fill:#282828;}</style></defs><g id="密码闭眼"><path id="路径" class="cls-1" d="M19.49,9.34a.58.58,0,0,0-.11-.76.53.53,0,0,0-.74.09l0,0s-3,3.58-6.62,3.58S5.38,8.69,5.36,8.67a.54.54,0,1,0-.82.7A12.78,12.78,0,0,0,6.28,11L4.89,12.44a.52.52,0,0,0,0,.74l0,0a.36.36,0,0,0,.33.16.55.55,0,0,0,.38-.16l1.48-1.55a10.7,10.7,0,0,0,2.47,1.27L9,14.85a.55.55,0,0,0,.37.68h.18a.52.52,0,0,0,.51-.41l.57-1.92a7.13,7.13,0,0,0,2.71,0l.57,1.9a.54.54,0,0,0,.52.4.2.2,0,0,0,.13,0,.56.56,0,0,0,.39-.67h0l-.57-1.9a11.14,11.14,0,0,0,2.47-1.28l1.46,1.52a.56.56,0,0,0,.38.17.5.5,0,0,0,.38-.17.54.54,0,0,0,0-.76l-1.38-1.44A10.65,10.65,0,0,0,19.49,9.34Z"/></g></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24"><defs><style>.cls-1{fill:none;}.cls-2{fill:#040000;}.cls-3{clip-path:url(#clip-path);}</style><clipPath id="clip-path"><rect class="cls-1" x="-0.54" width="24" height="24"/></clipPath></defs><g class="cls-3"><path class="cls-2" d="M18.22,11a.39.39,0,0,0-.37.4v7.35a.58.58,0,0,1-.56.6h-1.2a.38.38,0,0,0-.37.39.39.39,0,0,0,.37.4h1.2a1.35,1.35,0,0,0,1.3-1.39V11.4A.38.38,0,0,0,18.22,11Zm-4.78,8.35h-8a.59.59,0,0,1-.56-.6V6a.59.59,0,0,1,.56-.6h6.88a.4.4,0,0,0,0-.79H5.39A1.35,1.35,0,0,0,4.09,6V18.74a1.36,1.36,0,0,0,1.3,1.39h8a.39.39,0,0,0,.38-.4A.37.37,0,0,0,13.44,19.35Zm1,.39a.39.39,0,0,0,.37.4.38.38,0,0,0,.37-.4.37.37,0,0,0-.37-.39A.38.38,0,0,0,14.4,19.74Z"/><path class="cls-2" d="M18.84,6.75l-7.29,7.82a.14.14,0,0,1-.1,0l-2,.47L9.91,13a.31.31,0,0,1,.05-.1l7.3-7.81A.17.17,0,0,1,17.39,5a.2.2,0,0,1,.13.06l1.31,1.4A.2.2,0,0,1,18.84,6.75Zm.53-.84-1.32-1.4a.86.86,0,0,0-.66-.29.89.89,0,0,0-.66.29L9.44,12.32a1,1,0,0,0-.25.49l-.52,2.42a.63.63,0,0,0,.15.56.57.57,0,0,0,.39.18.23.23,0,0,0,.12,0l2.28-.55a.91.91,0,0,0,.46-.27l7.3-7.81A1.06,1.06,0,0,0,19.37,5.91Z"/></g></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.cls-1,.cls-2{fill:#040000;}.cls-2{stroke:#040000;stroke-width:0.4px;}</style></defs><g id="语言切换"><g id="语言切换-2"><path id="减去_14" data-name="减去 14" class="cls-1" d="M19,24H2a2,2,0,0,1-2-2V5A2,2,0,0,1,2,3H19a2,2,0,0,1,2,2V22A2,2,0,0,1,19,24ZM3,5A1,1,0,0,0,2,6V21a1,1,0,0,0,1,1H18a1,1,0,0,0,1-1V6a1,1,0,0,0-1-1Z"/><path id="联合_12" data-name="联合 12" class="cls-1" d="M22,20V3a1,1,0,0,0-1-1H4A1,1,0,0,1,4,0H21a3,3,0,0,1,3,3V20a1,1,0,0,1-2,0Z"/><path id="路径_243" data-name="路径 243" class="cls-1" d="M15.59,17.1a.46.46,0,0,1-.18.38.59.59,0,0,1-.42.15.53.53,0,0,1-.53-.36l-1.07-2.46H7.67L6.58,17.27a.54.54,0,0,1-.53.36.62.62,0,0,1-.43-.16.52.52,0,0,1-.18-.39.53.53,0,0,1,.06-.24L9.84,7.2a.61.61,0,0,1,.27-.32.8.8,0,0,1,.4-.11.73.73,0,0,1,.41.12.63.63,0,0,1,.27.31l4.34,9.64A.58.58,0,0,1,15.59,17.1Zm-2.66-3.32-2.4-5.45-2.4,5.45Z"/><path id="路径_244" data-name="路径 244" class="cls-2" d="M15,17.77a.67.67,0,0,1-.66-.45L13.3,15H7.76l-1,2.37a.68.68,0,0,1-.66.45.77.77,0,0,1-.52-.2.62.62,0,0,1-.23-.49.82.82,0,0,1,.07-.31L9.71,7.13A.81.81,0,0,1,10,6.75a.93.93,0,0,1,1,0,.84.84,0,0,1,.33.37l4.34,9.65a.82.82,0,0,1,.07.31.64.64,0,0,1-.22.49A.8.8,0,0,1,15,17.77Zm-7.42-3.1h5.91l1.11,2.55a.41.41,0,0,0,.4.28.49.49,0,0,0,.33-.11.36.36,0,0,0,.12-.28.48.48,0,0,0,0-.2L11.06,7.25A.65.65,0,0,0,10.84,7a.62.62,0,0,0-.32-.09.63.63,0,0,0-.33.09.57.57,0,0,0-.21.25L5.63,16.9a.39.39,0,0,0,0,.18.33.33,0,0,0,.13.29.5.5,0,0,0,.33.12.4.4,0,0,0,.4-.28Zm5.57-.75H7.92L10.52,8Zm-4.81-.28h4.38l-2.2-5Zm7,7.27H6a.71.71,0,0,1,0-1.42h9.34a.7.7,0,0,1,.73.68.71.71,0,0,1-.68.74Z"/></g></g></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.cls-1{fill:#ea4847;}.cls-2,.cls-3{fill:#fff;}.cls-3{stroke:#fff;stroke-width:0.4px;}</style></defs><g id="蒙版组_15" data-name="蒙版组 15"><g id="语言切换"><path id="减去_14" data-name="减去 14" class="cls-1" d="M2,3H19a2,2,0,0,1,2,2V22a2,2,0,0,1-2,2H2a2,2,0,0,1-2-2V5A2,2,0,0,1,2,3Z"/><path id="联合_12" data-name="联合 12" class="cls-1" d="M22,20V3a1,1,0,0,0-1-1H4A1,1,0,0,1,4,0H21a3,3,0,0,1,3,3V20a1,1,0,0,1-2,0Z"/><path id="路径_243" data-name="路径 243" class="cls-2" d="M15.59,17.1a.46.46,0,0,1-.18.38.59.59,0,0,1-.42.15.53.53,0,0,1-.53-.36l-1.07-2.46H7.67L6.58,17.27a.54.54,0,0,1-.53.36.62.62,0,0,1-.43-.16.52.52,0,0,1-.18-.39.53.53,0,0,1,.06-.24L9.84,7.2a.61.61,0,0,1,.27-.32.8.8,0,0,1,.4-.11.73.73,0,0,1,.41.12.63.63,0,0,1,.27.31l4.34,9.64A.58.58,0,0,1,15.59,17.1Zm-2.66-3.32-2.4-5.45-2.4,5.45Z"/><path id="路径_244" data-name="路径 244" class="cls-3" d="M15,17.77a.67.67,0,0,1-.66-.45L13.3,15H7.76l-1,2.37a.68.68,0,0,1-.66.45.77.77,0,0,1-.52-.2.62.62,0,0,1-.23-.49.82.82,0,0,1,.07-.31L9.71,7.13A.81.81,0,0,1,10,6.75a.93.93,0,0,1,1,0,.84.84,0,0,1,.33.37l4.34,9.65a.82.82,0,0,1,.07.31.64.64,0,0,1-.22.49A.8.8,0,0,1,15,17.77Zm-7.42-3.1h5.91l1.11,2.55a.41.41,0,0,0,.4.28.49.49,0,0,0,.33-.11.36.36,0,0,0,.12-.28.48.48,0,0,0,0-.2L11.06,7.25A.65.65,0,0,0,10.84,7a.62.62,0,0,0-.32-.09.63.63,0,0,0-.33.09.57.57,0,0,0-.21.25L5.63,16.9a.39.39,0,0,0,0,.18.33.33,0,0,0,.13.29.5.5,0,0,0,.33.12.4.4,0,0,0,.4-.28Zm5.57-.75H7.92L10.52,8Zm-4.81-.28h4.38l-2.2-5Zm7,7.27H6a.71.71,0,0,1,0-1.42h9.34a.7.7,0,0,1,.73.68.71.71,0,0,1-.68.74Z"/></g></g></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24"><defs><style>.cls-1{fill:none;}.cls-2{clip-path:url(#clip-path);}.cls-3{fill:#d7d7d8;}</style><clipPath id="clip-path"><rect class="cls-1" x="0.21" y="-0.03" width="24" height="24"/></clipPath></defs><g class="cls-2"><g id="闭眼icon"><g id="密码闭眼"><path id="路径" class="cls-3" d="M19.9,9.2a.61.61,0,0,0-.11-.8.57.57,0,0,0-.79.09v0s-3.21,3.78-7,3.78S5,8.51,5,8.48a.58.58,0,0,0-.8-.06.59.59,0,0,0-.06.8A13,13,0,0,0,6,10.94L4.51,12.46a.54.54,0,0,0,0,.78v0a.4.4,0,0,0,.35.17.56.56,0,0,0,.4-.17l1.57-1.63A11.11,11.11,0,0,0,9.46,13l-.6,2a.57.57,0,0,0,.39.71h.18a.55.55,0,0,0,.55-.43l.6-2A7.62,7.62,0,0,0,12,13.4a7.7,7.7,0,0,0,1.43-.14l.6,2a.57.57,0,0,0,.54.43.17.17,0,0,0,.14,0,.57.57,0,0,0,.41-.7h0l-.61-2a11.26,11.26,0,0,0,2.6-1.35l1.55,1.6a.56.56,0,0,0,.4.17.54.54,0,0,0,.4-.17.59.59,0,0,0,0-.8L18,10.88A11,11,0,0,0,19.9,9.2Z"/></g></g></g></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24"><defs><style>.cls-1{fill:none;}.cls-2{clip-path:url(#clip-path);}.cls-3{fill:#d7d7d8;}</style><clipPath id="clip-path"><rect class="cls-1" x="0.01" width="24" height="24"/></clipPath></defs><g class="cls-2"><path id="睁眼" class="cls-3" d="M12,6.47c-5,0-8.29,5-8.29,5s2.43,6,8.29,6,8.29-6,8.29-6S17,6.47,12,6.47Zm0,9A3.51,3.51,0,1,1,15.68,12,3.6,3.6,0,0,1,12,15.51Zm0-5.35A1.84,1.84,0,1,0,13.84,12h0A1.84,1.84,0,0,0,12,10.16Z"/></g></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12"><defs><style>.cls-1{fill:#f04d4c;}.cls-2{fill:#1bc0c6;}</style></defs><path id="联合_11" data-name="联合 11" class="cls-1" d="M1.5,10.44V4.71H.17L2.5,1.6,4.83,4.71H3.5v5.73Z"/><path id="联合_14" data-name="联合 14" class="cls-2" d="M7.17,7.33H8.5V1.6h2V7.33h1.33L9.5,10.44Z"/></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.cls-1{fill:#949494;}</style></defs><path id="日历" class="cls-1" d="M8,7.5a.76.76,0,0,0,.75-.75v-2a.75.75,0,0,0-1.5,0v2A.75.75,0,0,0,8,7.5ZM19.43,6.29H17.71l0,.46a1.75,1.75,0,0,1-3.5,0l0-.46H9.71l0,.46a1.75,1.75,0,0,1-3.5,0l0-.46H4.57c-.41,0-.57.15-.57.57V19.25a.76.76,0,0,0,.75.75h14.5a.76.76,0,0,0,.75-.75V6.86c0-.42-.16-.57-.57-.57Zm-1.15,12H5.71v-8H18.28ZM16,7.5a.76.76,0,0,0,.75-.75v-2a.75.75,0,0,0-1.5,0v2A.75.75,0,0,0,16,7.5ZM8.57,13.71a1.14,1.14,0,1,0-1.14-1.14h0A1.14,1.14,0,0,0,8.57,13.71Zm3.43,0a1.14,1.14,0,1,0-1.14-1.14h0A1.14,1.14,0,0,0,12,13.71Zm3.43,0a1.14,1.14,0,1,0-1.14-1.14h0a1.14,1.14,0,0,0,1.14,1.14ZM8.57,16.57a1.14,1.14,0,1,0,0-2.28,1.13,1.13,0,0,0-1.14,1.14h0A1.14,1.14,0,0,0,8.57,16.57Zm3.43,0a1.14,1.14,0,1,0-1.14-1.14h0A1.14,1.14,0,0,0,12,16.57Zm3.43,0a1.14,1.14,0,1,0-1.14-1.14h0a1.14,1.14,0,0,0,1.14,1.14Z"/></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.cls-1{fill:#ea4847;}</style></defs><path id="日历" class="cls-1" d="M8,7.5a.76.76,0,0,0,.75-.75v-2a.75.75,0,0,0-1.5,0v2A.75.75,0,0,0,8,7.5ZM19.43,6.29H17.71l0,.46a1.75,1.75,0,0,1-3.5,0l0-.46H9.71l0,.46a1.75,1.75,0,0,1-3.5,0l0-.46H4.57c-.41,0-.57.15-.57.57V19.25a.76.76,0,0,0,.75.75h14.5a.76.76,0,0,0,.75-.75V6.86c0-.42-.16-.57-.57-.57Zm-1.15,12H5.71v-8H18.28ZM16,7.5a.76.76,0,0,0,.75-.75v-2a.75.75,0,0,0-1.5,0v2A.75.75,0,0,0,16,7.5ZM8.57,13.71a1.14,1.14,0,1,0-1.14-1.14h0A1.14,1.14,0,0,0,8.57,13.71Zm3.43,0a1.14,1.14,0,1,0-1.14-1.14h0A1.14,1.14,0,0,0,12,13.71Zm3.43,0a1.14,1.14,0,1,0-1.14-1.14h0a1.14,1.14,0,0,0,1.14,1.14ZM8.57,16.57a1.14,1.14,0,1,0,0-2.28,1.13,1.13,0,0,0-1.14,1.14h0A1.14,1.14,0,0,0,8.57,16.57Zm3.43,0a1.14,1.14,0,1,0-1.14-1.14h0A1.14,1.14,0,0,0,12,16.57Zm3.43,0a1.14,1.14,0,1,0-1.14-1.14h0a1.14,1.14,0,0,0,1.14,1.14Z"/></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24"><defs><style>.cls-1{fill:none;}.cls-2{clip-path:url(#clip-path);}.cls-3{fill:#040000;}</style><clipPath id="clip-path"><rect class="cls-1" width="24" height="24"/></clipPath></defs><g class="cls-2"><path class="cls-3" d="M5.48,11.51H6.7v2.85H5.48Zm13,2.85H17.3V11.51h1.22ZM5.08,10.29a.82.82,0,0,0-.82.82v3.67a.81.81,0,0,0,.82.81h2a.81.81,0,0,0,.82-.81V11.11a.82.82,0,0,0-.82-.82h-.4a5.3,5.3,0,0,1,10.59,0h-.41a.81.81,0,0,0-.82.82v3.67a.83.83,0,0,0,.44.72,5.23,5.23,0,0,1-3.45,2.43,1.72,1.72,0,0,0-1.47-.7c-.9,0-1.63.55-1.63,1.22s.73,1.22,1.63,1.22a1.8,1.8,0,0,0,1.27-.47,6.48,6.48,0,0,0,5-3.6h1.08a.81.81,0,0,0,.82-.81V11.11a.82.82,0,0,0-.82-.82h-.41a6.52,6.52,0,0,0-13,0Z"/></g></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24"><defs><style>.cls-1{fill:none;}.cls-2{clip-path:url(#clip-path);}.cls-3{fill:#fff;}</style><clipPath id="clip-path"><rect class="cls-1" width="24" height="24"/></clipPath></defs><g class="cls-2"><g id="蒙版组_27" data-name="蒙版组 27"><g id="删除"><path id="路径_207" data-name="路径 207" class="cls-3" d="M14.85,16.76H9.07a.75.75,0,0,0,0,1.5h5.78a.75.75,0,0,0,0-1.5Z"/><path id="路径_208" data-name="路径 208" class="cls-3" d="M20.22,6.31H16.33V4.66A1.73,1.73,0,0,0,14.55,3H9.44A1.73,1.73,0,0,0,7.66,4.66V6.31H3.78a.73.73,0,0,0-.11,1.45H5l.72,12A1.33,1.33,0,0,0,7,21H17a1.33,1.33,0,0,0,1.33-1.24l.72-12h1.2a.73.73,0,1,0,.11-1.45Zm-11-1.65a.21.21,0,0,1,.22-.21h5.11a.21.21,0,0,1,.22.21V6.31H9.22Zm7.53,14.9H7.25L6.54,7.77H17.47Z"/></g></g></g></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.cls-1{fill:#2f3030;}</style></defs><path class="cls-1" d="M12.32,1.93h0m0,0L22,14a.12.12,0,0,1,0,.07v5.71a2.07,2.07,0,0,1-2,2.12H4a2.07,2.07,0,0,1-2-2.12V14.18a.14.14,0,0,1,0-.07L12.29,2m0-2a2,2,0,0,0-1.51.71L.48,12.82A2.1,2.1,0,0,0,0,14.18v5.64a4.06,4.06,0,0,0,4,4.12H20a4.06,4.06,0,0,0,4-4.12V14.11a2.16,2.16,0,0,0-.46-1.32L13.83.69a2,2,0,0,0-1.54-.75Z"/><path class="cls-1" d="M12,15.84a1.31,1.31,0,0,1,1.31,1.31v4.59H10.71V17.15A1.31,1.31,0,0,1,12,15.84m0-2a3.31,3.31,0,0,0-3.3,3.31v6.59h6.61V17.15A3.31,3.31,0,0,0,12,13.84Z"/></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.cls-1{fill:#ea4847;}</style></defs><path class="cls-1" d="M12.33,0a2.06,2.06,0,0,1,1.41.56l.15.15L23.49,13a2.45,2.45,0,0,1,.5,1.3v5.64a3.94,3.94,0,0,1-3.58,4.05H15.32V17.29A3.43,3.43,0,0,0,12,13.75a3.43,3.43,0,0,0-3.3,3.54v6.65H3.78A3.89,3.89,0,0,1,0,20.1V14.5a2.45,2.45,0,0,1,.43-1.42l.12-.15L10.78.71A2.08,2.08,0,0,1,12.33,0Z"/></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24"><defs><style>.cls-1{fill:none;}.cls-2{clip-path:url(#clip-path);}.cls-3{fill:#040000;fill-rule:evenodd;}</style><clipPath id="clip-path"><rect class="cls-1" width="24" height="24"/></clipPath></defs><g class="cls-2"><path class="cls-3" d="M18.47,4.26H5.79a1.33,1.33,0,0,0-1.36,1.3v10a1.33,1.33,0,0,0,1.36,1.3H8.51V19a.56.56,0,0,0,.53.48c.05,0,0,0,0,0a.7.7,0,0,0,.48-.19l2.57-2.47h6.38a1.32,1.32,0,0,0,1.35-1.3v-10A1.32,1.32,0,0,0,18.47,4.26Zm.45,10.86A.89.89,0,0,1,18,16H11.73a1.07,1.07,0,0,0-.16.14L9.41,18.2V16.43A.45.45,0,0,0,9,16H6.24a.88.88,0,0,1-.9-.87V6a.88.88,0,0,1,.9-.87H18a.89.89,0,0,1,.91.87Z"/><path class="cls-3" d="M14.84,10.34a.91.91,0,0,0,1.81,0,.88.88,0,0,0-.9-.86.88.88,0,0,0-.91.86"/><path class="cls-3" d="M11.22,10.34a.91.91,0,0,0,1.81,0,.88.88,0,0,0-.9-.86.88.88,0,0,0-.91.86"/><path class="cls-3" d="M7.6,10.34a.91.91,0,0,0,1.81,0,.88.88,0,0,0-.9-.86.88.88,0,0,0-.91.86"/></g></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.cls-1{fill:#ea4847;}</style></defs><path class="cls-1" d="M12.16,19.53h0a1,1,0,0,1-.69-.31,40.54,40.54,0,0,1-2.71-3.44C7,13.31,6.15,11.34,6.15,9.92a6.21,6.21,0,0,1,6-6.39,6.21,6.21,0,0,1,6,6.39A7.28,7.28,0,0,1,17.23,13a26.06,26.06,0,0,1-2.63,4h0l-1.72,2.1A.9.9,0,0,1,12.16,19.53Zm0-6.62a2.9,2.9,0,0,0,2.81-3,2.9,2.9,0,0,0-2.81-3,2.92,2.92,0,0,0-2.81,3A2.91,2.91,0,0,0,12.15,12.91Z"/></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 56 64"><defs><style>.cls-1{fill:#e74645;}.cls-2{fill:url(#未命名的渐变_5);}.cls-3{fill:url(#未命名的渐变_4);}</style><linearGradient id="未命名的渐变_5" x1="-1023.77" y1="599.29" x2="-1024.53" y2="600.09" gradientTransform="matrix(31.03, 0, 0, -50.63, 31800.9, 30388.93)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#e74645" stop-opacity="0.2"/><stop offset="0.51" stop-color="#e74645"/><stop offset="1" stop-color="#e74645"/></linearGradient><linearGradient id="未命名的渐变_4" x1="-1024.07" y1="600.21" x2="-1024.07" y2="599.21" gradientTransform="matrix(30.58, 0, 0, -50.63, 31351.55, 30392.59)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#e74645" stop-opacity="0.2"/><stop offset="0.48" stop-color="#e74645"/><stop offset="1" stop-color="#e74645"/></linearGradient></defs><g id="组_212" data-name="组 212"><path id="矩形_160" data-name="矩形 160" class="cls-1" d="M43.06,51.46h0a5.44,5.44,0,0,1,7.67,0L53.28,54a5.42,5.42,0,0,1,0,7.67h0a5.42,5.42,0,0,1-7.67,0l-2.55-2.55A5.43,5.43,0,0,1,43.06,51.46Z"/><path id="路径_247" data-name="路径 247" class="cls-2" d="M26.73,1.53a5.44,5.44,0,0,0-.57,0v0a25.31,25.31,0,0,0,0,50.62V41.31a14.46,14.46,0,0,1,0-28.92v0a5.43,5.43,0,1,0,.57-10.82Z"/><path id="路径_248" data-name="路径 248" class="cls-3" d="M51.65,26.85A25.31,25.31,0,0,0,26.33,1.53h-.27V12.39h.27a14.47,14.47,0,1,1,0,28.93h-.27v0a5.42,5.42,0,0,0,0,10.8v0h.61A25.3,25.3,0,0,0,51.65,26.85Z"/></g></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 128 128"><defs><style>.cls-1{fill:url(#未命名的渐变_2);}.cls-2{fill:#fff;}.cls-3{fill:url(#未命名的渐变_3);}.cls-4{fill:url(#未命名的渐变_3-2);}</style><linearGradient id="未命名的渐变_2" x1="-891.91" y1="603.12" x2="-891.91" y2="602.12" gradientTransform="matrix(128, 0, 0, -128, 114229, 77199)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#e74645"/><stop offset="1" stop-color="#e74645"/></linearGradient><linearGradient id="未命名的渐变_3" x1="-885.78" y1="600.42" x2="-886.53" y2="601.23" gradientTransform="matrix(40.41, 0, 0, -65.94, 35861.97, 39674.83)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fff" stop-opacity="0.2"/><stop offset="0.05" stop-color="#fff" stop-opacity="0.34"/><stop offset="0.11" stop-color="#fff" stop-opacity="0.5"/><stop offset="0.18" stop-color="#fff" stop-opacity="0.63"/><stop offset="0.25" stop-color="#fff" stop-opacity="0.75"/><stop offset="0.33" stop-color="#fff" stop-opacity="0.84"/><stop offset="0.43" stop-color="#fff" stop-opacity="0.91"/><stop offset="0.54" stop-color="#fff" stop-opacity="0.96"/><stop offset="0.68" stop-color="#fff" stop-opacity="0.99"/><stop offset="1" stop-color="#fff"/></linearGradient><linearGradient id="未命名的渐变_3-2" x1="-886.19" y1="601.35" x2="-886.19" y2="600.35" gradientTransform="matrix(39.83, 0, 0, -65.96, 35371.43, 39682.73)" xlink:href="#未命名的渐变_3"/></defs><g id="组_211" data-name="组 211"><rect id="矩形_158" data-name="矩形 158" class="cls-1" width="128" height="128" rx="24"/><rect id="矩形_159" data-name="矩形 159" class="cls-2" x="84.76" y="81.84" width="14.13" height="18.84" rx="7.07" transform="translate(-37.63 91.66) rotate(-45)"/><path id="路径_245" data-name="路径 245" class="cls-3" d="M63.76,20.32a6,6,0,0,0-.74,0v0a33,33,0,0,0,0,65.93V72.13a18.84,18.84,0,0,1,0-37.67v-.05a7.06,7.06,0,1,0,1.46-14A5.79,5.79,0,0,0,63.76,20.32Z"/><path id="路径_246" data-name="路径 246" class="cls-4" d="M96.36,53.29a33,33,0,0,0-33-33H63V34.46h.36a18.85,18.85,0,1,1,0,37.69H63v0a7.06,7.06,0,0,0,0,14.08v0h.8A33,33,0,0,0,96.36,53.29Z"/></g></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.cls-1{fill:#1f0f08;fill-rule:evenodd;}.cls-2{fill:none;stroke:#20110b;stroke-linejoin:round;stroke-width:2px;}</style></defs><path class="cls-1" d="M12.91,2.18A5.24,5.24,0,1,1,7.68,7.42a5.25,5.25,0,0,1,5.23-5.24m0-2.18a7.42,7.42,0,1,0,7.42,7.42A7.42,7.42,0,0,0,12.91,0"/><path class="cls-2" d="M8.49,15.7a2,2,0,0,0-1.63.86L4.43,20.11a2,2,0,0,0,1.63,3.1H19.77a2,2,0,0,0,1.63-3.1L19,16.56a2,2,0,0,0-1.64-.86"/><path class="cls-1" d="M12.91,23.76h0a1.26,1.26,0,0,1-1.26-1.26V18.72a1.27,1.27,0,1,1,2.53,0V22.5a1.26,1.26,0,0,1-1.27,1.26"/></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.cls-1,.cls-3{fill:#ea4847;}.cls-1,.cls-4{fill-rule:evenodd;}.cls-2{fill:none;stroke:#ea4847;stroke-miterlimit:10;stroke-width:2px;}.cls-4{fill:#fff;}</style></defs><path class="cls-1" d="M12.91,0a7.42,7.42,0,1,0,7.42,7.42A7.42,7.42,0,0,0,12.91,0"/><path class="cls-2" d="M17.33,15.7a2,2,0,0,1,1.64.84L21.4,20a1.92,1.92,0,0,1-1.63,3H6.06a1.92,1.92,0,0,1-1.63-3l2.43-3.44a2,2,0,0,1,1.63-.84"/><polygon class="cls-3" points="21.75 22.56 4.08 22.67 7.84 15.71 17.77 15.71 21.75 22.56"/><path class="cls-4" d="M12.91,22.61h0a1.17,1.17,0,0,1-1.26-1v-3.1a1.17,1.17,0,0,1,1.26-1,1.17,1.17,0,0,1,1.27,1v3.1a1.17,1.17,0,0,1-1.27,1"/></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="眼睛"><path id="路径_205" data-name="路径 205" d="M12,8.5a6.12,6.12,0,0,1,2.24.44A8.92,8.92,0,0,1,16.17,10a7.85,7.85,0,0,1,1.36,1.28A3.39,3.39,0,0,1,18,12a3.65,3.65,0,0,1-.47.69A8.63,8.63,0,0,1,14.23,15a5.75,5.75,0,0,1-4.46,0,8.5,8.5,0,0,1-3.29-2.36A3.44,3.44,0,0,1,6,12a3.19,3.19,0,0,1,.46-.69A8.61,8.61,0,0,1,7.83,10,8,8,0,0,1,9.76,9,6.13,6.13,0,0,1,12,8.5m0-1C8.12,7.5,5,11,5,12s3.15,4.5,7,4.5,7-3.56,7-4.5S15.88,7.5,12,7.5Z"/><path id="路径_206" data-name="路径 206" d="M9,12a3,3,0,1,0,3-3h0A3,3,0,0,0,9,12Z"/></g></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24"><defs><style>.cls-1{fill:none;}.cls-2{clip-path:url(#clip-path);}.cls-3{fill:#ea4847;}</style><clipPath id="clip-path"><rect class="cls-1" y="-0.09" width="24" height="24"/></clipPath></defs><g class="cls-2"><g id="密码icon"><g id="密码"><path id="路径_1" data-name="路径 1" class="cls-3" d="M17.87,8.8h-1.3V7.22a4.58,4.58,0,1,0-9.15,0h0V8.8H6.13A2.13,2.13,0,0,0,4,10.93v8.3a2.13,2.13,0,0,0,2.13,2.13H17.87A2.13,2.13,0,0,0,20,19.23v-8.3A2.13,2.13,0,0,0,17.87,8.8ZM8.76,7.22a3.24,3.24,0,0,1,6.48,0V8.8H8.76Zm9.9,12a.79.79,0,0,1-.79.79H6.13a.79.79,0,0,1-.79-.79v-8.3a.79.79,0,0,1,.79-.79H17.87a.79.79,0,0,1,.79.79Z"/><path id="路径_2" data-name="路径 2" class="cls-3" d="M12,12.44a.83.83,0,0,0-.83.83h0v3.21a.83.83,0,1,0,1.66,0V13.28a.84.84,0,0,0-.83-.84Z"/></g></g></g></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24"><defs><style>.cls-1{fill:none;}.cls-2{clip-path:url(#clip-path);}.cls-3{fill:#b1b1b1;stroke:#b1b1b1;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5px;}</style><clipPath id="clip-path"><rect class="cls-1" width="24" height="24"/></clipPath></defs><g class="cls-2"><path id="联合_17" data-name="联合 17" class="cls-3" d="M15,12,9,18ZM9,6l6,6Z"/></g></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24"><defs><style>.cls-1{fill:none;}.cls-2{clip-path:url(#clip-path);}.cls-3{fill:#ea4847;}</style><clipPath id="clip-path"><rect class="cls-1" y="-0.04" width="24" height="24"/></clipPath></defs><g class="cls-2"><g id="用户icon"><path id="用户" class="cls-3" d="M19.4,16.87a7.92,7.92,0,0,0-1.72-2.55,8,8,0,0,0-2.55-1.72,5.3,5.3,0,1,0-6.2,0A7.91,7.91,0,0,0,4.6,16.87,7.46,7.46,0,0,0,4,19.08a.79.79,0,0,0,.67.9h.14a.84.84,0,0,0,.81-.71,6.3,6.3,0,0,1,1.84-3.81,6.43,6.43,0,0,1,10.91,3.81.81.81,0,1,0,1.61-.2h0A7.38,7.38,0,0,0,19.4,16.87ZM12,12a3.68,3.68,0,1,1,3.68-3.69A3.67,3.67,0,0,1,12,12Z"/></g></g></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24"><defs><style>.cls-1,.cls-4{fill:none;}.cls-2{clip-path:url(#clip-path);}.cls-3{fill:#d7d7d8;}.cls-4{stroke:#fff;stroke-linecap:square;stroke-miterlimit:10;}</style><clipPath id="clip-path"><rect class="cls-1" width="24" height="24"/></clipPath></defs><g class="cls-2"><g id="x"><circle id="椭圆形" class="cls-3" cx="12" cy="12" r="10"/><path id="x-2" class="cls-4" d="M12,12,8.46,15.54,12,12,8.46,8.46,12,12l3.54-3.54L12,12l3.54,3.54Z"/></g></g></svg>
\ No newline at end of file
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24"><defs><style>.cls-1,.cls-4{fill:none;}.cls-2{clip-path:url(#clip-path);}.cls-3{fill:#ea4847;}.cls-4{stroke:#fff;stroke-linecap:square;stroke-miterlimit:10;}</style><clipPath id="clip-path"><rect class="cls-1" y="-0.09" width="24" height="24"/></clipPath></defs><g class="cls-2"><g id="x"><circle id="椭圆形" class="cls-3" cx="12" cy="12" r="10"/><path id="x-2" class="cls-4" d="M12,12,8.46,15.54,12,12,8.46,8.46,12,12l3.54-3.54L12,12l3.54,3.54Z"/></g></g></svg>
\ No newline at end of file
/**
* 下方引入的为uView UI的集成样式文件,为scss预处理器,其中包含了一些"u-"开头的自定义变量
* 使用的时候,请将下面的一行复制到您的uniapp项目根目录的uni.scss中即可
* uView自定义的css类名和scss变量,均以"u-"开头,不会造成冲突,请放心使用
*/
@import 'uview-ui/theme.scss';
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed. Click to expand it.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment