molong/coloruicss
1
0
Fork 0
mirror of https://github.com/weilanwl/coloruicss.git synced 2026-03-12 02:24:01 +08:00
Code Issues Packages Projects Releases Wiki Activity

v2.1.2

Browse Source
This commit is contained in:
Weilanwl
2019-03-28 23:54:51 +08:00
parent d4c5eec751
commit 2e6fa65afa
16 changed files with 403 additions and 380 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
Colorui-UniApp/pages/component/bar.vue
View File

@@ -439,10 +439,10 @@
<style>
.box {
margin: 20rpx 0;
margin: 20upx 0;
}
.box view.cu-bar {
margin-top: 20rpx;
margin-top: 20upx;
}
</style>

4
Colorui-UniApp/pages/component/card.vue
View File

@@ -17,7 +17,7 @@
<view class="cu-tag bg-blue">史诗</view>
<view class="cu-bar bg-shadeBottom"> <text class="text-cut">我已天理为凭，踏入这片荒芜，不再受凡人的枷锁遏制。我已天理为凭，踏入这片荒芜，不再受凡人的枷锁遏制。</text></view>
</view>
<view class="cu-list menu menu-avatar">
<view class="cu-list menu-avatar">
<view class="cu-item">
<view class="cu-avatar round lg" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big10006.jpg);"></view>
<view class="content flex-sub">
@@ -45,7 +45,7 @@
</view>
<view class="cu-card dynamic" :class="isCard?'no-card':''">
<view class="cu-item shadow">
<view class="cu-list menu menu-avatar">
<view class="cu-list menu-avatar">
<view class="cu-item">
<view class="cu-avatar round lg" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big10006.jpg);"></view>
<view class="content flex-sub">

1
Colorui-UniApp/pages/component/chat.vue
View File

@@ -98,7 +98,6 @@
methods: {
InputFocus(e) {
this.InputBottom = e.detail.height
},
InputBlur(e) {
this.InputBottom = 0

12
Colorui-UniApp/pages/component/form.vue
View File

@@ -36,8 +36,6 @@
</view>
</view>
</view>
<view class="cu-form-group margin-top">
<view class="title">普通选择</view>
<picker @change="PickerChange" :value="index" :range="picker">
@@ -80,7 +78,6 @@
</picker>
</view>
<!-- #endif -->
<view class="cu-form-group margin-top">
<view class="title">开关选择</view>
<switch @change="SwitchA" :class="switchA?'checked':''" :checked="switchA?true:false"></switch>
@@ -129,7 +126,6 @@
value="C"></checkbox>
</view>
</checkbox-group>
<view class="cu-bar bg-white margin-top">
<view class="action">
图片上传
@@ -153,13 +149,12 @@
</view>
<!-- !!!!! placeholder 在ios表现有偏移 建议使用 第一种样式 -->
<view class="cu-form-group margin-top">
<textarea data-placeholder="多行文本输入框" maxlength="-1" :disabled="modalName!=null" placeholder-class='placeholder'
<textarea data-placeholder="多行文本输入框" maxlength="-1" :disabled="modalName!=null" placeholder-class="placeholder"
:class="textareaAValue?'value':''" @input="textareaAInput"></textarea>
</view>
</view>
<view class="cu-form-group top">
<view class="title">点文本框</view>
<textarea data-placeholder="多行文本输入框" maxlength="-1" :disabled="modalName!=null" placeholder-class='placeholder'
<textarea data-placeholder="多行文本输入框" maxlength="-1" :disabled="modalName!=null" placeholder-class="placeholder"
:class="textareaBValue?'value':''" @input="textareaBInput"></textarea>
</view>
</form>
@@ -364,7 +359,6 @@
});
},
ViewImage(e) {
console.log(e)
uni.previewImage({
urls: this.imgList,
current: e.currentTarget.dataset.url

495
Colorui-UniApp/pages/component/list.vue
View File

@@ -1,282 +1,284 @@
<template>
<view>
<cu-custom bgColor="bg-gradual-pink" :isBack="true">
<block slot="backText">返回</block>
<block slot="content">列表</block>
</cu-custom>
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<text class="icon-title text-orange "></text> 宫格列表
<scroll-view :scroll-y="modalName==null" class="page" :class="modalName!=null?'show':''">
<cu-custom bgColor="bg-gradual-pink" :isBack="true">
<block slot="backText">返回</block>
<block slot="content">列表</block>
</cu-custom>
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<text class="icon-title text-orange "></text> 宫格列表
</view>
<view class="action">
<button class="cu-btn bg-green shadow" @tap="showModal" data-target="gridModal">设置</button>
</view>
</view>
<view class="action">
<button class="cu-btn bg-green shadow" @tap="showModal" data-target="gridModal">设置</button>
</view>
</view>
<view class="cu-modal" :class="modalName=='gridModal'?'show':''" @tap="hideModal">
<view class="cu-dialog" @tap.stop>
<radio-group class="block" @change="Gridchange">
<view class="cu-list menu text-left">
<view class="cu-item" v-for="(item,index) in 3" :key="index">
<label class="flex justify-between align-center flex-sub">
<view class="flex-sub">{{index +3}} 列</view>
<radio class="round" :value="(index + 3) + ''" :class="gridCol==index+3?'checked':''" :checked="gridCol==index+3"></radio>
</label>
<view class="cu-modal" :class="modalName=='gridModal'?'show':''" @tap="hideModal">
<view class="cu-dialog" @tap.stop>
<radio-group class="block" @change="Gridchange">
<view class="cu-list menu text-left">
<view class="cu-item" v-for="(item,index) in 3" :key="index">
<label class="flex justify-between align-center flex-sub">
<view class="flex-sub">{{index +3}} 列</view>
<radio class="round" :value="(index + 3) + ''" :class="gridCol==index+3?'checked':''" :checked="gridCol==index+3"></radio>
</label>
</view>
</view>
</view>
</radio-group>
<view class="cu-list menu text-left solid-top">
<view class="cu-item">
<view class="content">
<text class="text-grey">边框</text>
</view>
<view class="action">
<switch @change="Gridswitch" :class="gridBorder?'checked':''" :checked="gridBorder?true:false"></switch>
</radio-group>
<view class="cu-list menu text-left solid-top">
<view class="cu-item">
<view class="content">
<text class="text-grey">边框</text>
</view>
<view class="action">
<switch @change="Gridswitch" :class="gridBorder?'checked':''" :checked="gridBorder?true:false"></switch>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="cu-list grid" :class="['col-' + gridCol,gridBorder?'':'no-border']">
<view class="cu-item" v-for="(item,index) in iconList" :key="index" v-if="index<gridCol*2">
<view :class="['icon-' + item.icon,'text-' + item.color]">
<view class="cu-tag badge" v-if="item.badge!=0">
<block v-if="item.badge!=1">{{item.badge>99?'99+':item.badge}}</block>
<view class="cu-list grid" :class="['col-' + gridCol,gridBorder?'':'no-border']">
<view class="cu-item" v-for="(item,index) in iconList" :key="index" v-if="index<gridCol*2">
<view :class="['icon-' + item.icon,'text-' + item.color]">
<view class="cu-tag badge" v-if="item.badge!=0">
<block v-if="item.badge!=1">{{item.badge>99?'99+':item.badge}}</block>
</view>
</view>
<text>{{item.name}}</text>
</view>
<text>{{item.name}}</text>
</view>
</view>
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<text class="icon-title text-orange"></text> 菜单列表
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<text class="icon-title text-orange"></text> 菜单列表
</view>
<view class="action">
<button class="cu-btn bg-green shadow" @tap="showModal" data-target="menuModal">设置</button>
</view>
</view>
<view class="action">
<button class="cu-btn bg-green shadow" @tap="showModal" data-target="menuModal">设置</button>
</view>
</view>
<view class="cu-modal" :class="modalName=='menuModal'?'show':''" @tap="hideModal">
<view class="cu-dialog" @tap.stop>
<view class="cu-list menu text-left solid-top">
<view class="cu-item">
<view class="content">
<text class="text-grey">短边框</text>
<view class="cu-modal" :class="modalName=='menuModal'?'show':''" @tap="hideModal">
<view class="cu-dialog" @tap.stop>
<view class="cu-list menu text-left solid-top">
<view class="cu-item">
<view class="content">
<text class="text-grey">短边框</text>
</view>
<view class="action">
<switch @change="MenuBorder" :class="menuBorder?'checked':''" :checked="menuBorder?true:false"></switch>
</view>
</view>
<view class="action">
<switch @change="MenuBorder" :class="menuBorder?'checked':''" :checked="menuBorder?true:false"></switch>
<view class="cu-item">
<view class="content">
<text class="text-grey">箭头</text>
</view>
<view class="action">
<switch @change="MenuArrow" :class="menuArrow?'checked':''" :checked="menuArrow?true:false"></switch>
</view>
</view>
</view>
<view class="cu-item">
<view class="content">
<text class="text-grey">箭头</text>
</view>
<view class="action">
<switch @change="MenuArrow" :class="menuArrow?'checked':''" :checked="menuArrow?true:false"></switch>
</view>
</view>
<view class="cu-item">
<view class="content">
<text class="text-grey">卡片</text>
</view>
<view class="action">
<switch @change="MenuCard" :class="menuCard?'checked':''" :checked="menuCard?true:false"></switch>
<view class="cu-item">
<view class="content">
<text class="text-grey">卡片</text>
</view>
<view class="action">
<switch @change="MenuCard" :class="menuCard?'checked':''" :checked="menuCard?true:false"></switch>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="cu-list menu" :class="[menuBorder?'sm-border':'',menuCard?'card-menu margin-top':'']">
<view class="cu-item" :class="menuArrow?'arrow':''">
<view class="content">
<text class="icon-circlefill text-grey"></text>
<text class="text-grey">图标 + 标题</text>
</view>
</view>
<view class="cu-item" :class="menuArrow?'arrow':''">
<view class="content">
<image src="/static/logo.png" class="png" mode="aspectFit"></image>
<text class="text-grey">图片 + 标题</text>
</view>
</view>
<view class="cu-item" :class="menuArrow?'arrow':''">
<button class="cu-btn content" open-type="contact">
<text class="icon-btn text-olive"></text>
<text class="text-grey">Open-type 按钮</text>
</button>
</view>
<view class="cu-item" :class="menuArrow?'arrow':''">
<navigator class="content" hover-class="none" url="../list/list" open-type="redirect">
<text class="icon-discoverfill text-orange"></text>
<text class="text-grey">Navigator 跳转</text>
</navigator>
</view>
<view class="cu-item" :class="menuArrow?'arrow':''">
<view class="content">
<text class="icon-emojiflashfill text-pink"></text>
<text class="text-grey">头像组</text>
</view>
<view class="action">
<view class="cu-avatar-group">
<view class="cu-avatar round sm" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big10001.jpg);"></view>
<view class="cu-avatar round sm" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big81005.jpg);"></view>
<view class="cu-avatar round sm" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big25002.jpg);"></view>
<view class="cu-avatar round sm" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big91012.jpg);"></view>
<view class="cu-list menu" :class="[menuBorder?'sm-border':'',menuCard?'card-menu margin-top':'']">
<view class="cu-item" :class="menuArrow?'arrow':''">
<view class="content">
<text class="icon-circlefill text-grey"></text>
<text class="text-grey">图标 + 标题</text>
</view>
</view>
<view class="cu-item" :class="menuArrow?'arrow':''">
<view class="content">
<image src="/static/logo.png" class="png" mode="aspectFit"></image>
<text class="text-grey">图片 + 标题</text>
</view>
</view>
<view class="cu-item" :class="menuArrow?'arrow':''">
<button class="cu-btn content" open-type="contact">
<text class="icon-btn text-olive"></text>
<text class="text-grey">Open-type 按钮</text>
</button>
</view>
<view class="cu-item" :class="menuArrow?'arrow':''">
<navigator class="content" hover-class="none" url="../list/list" open-type="redirect">
<text class="icon-discoverfill text-orange"></text>
<text class="text-grey">Navigator 跳转</text>
</navigator>
</view>
<view class="cu-item" :class="menuArrow?'arrow':''">
<view class="content">
<text class="icon-emojiflashfill text-pink"></text>
<text class="text-grey">头像组</text>
</view>
<view class="action">
<view class="cu-avatar-group">
<view class="cu-avatar round sm" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big10001.jpg);"></view>
<view class="cu-avatar round sm" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big81005.jpg);"></view>
<view class="cu-avatar round sm" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big25002.jpg);"></view>
<view class="cu-avatar round sm" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big91012.jpg);"></view>
</view>
<text class="text-grey text-sm">4 人</text>
</view>
</view>
<view class="cu-item" :class="menuArrow?'arrow':''">
<view class="content">
<text class="icon-btn text-green"></text>
<text class="text-grey">按钮</text>
</view>
<view class="action">
<button class="cu-btn round bg-green shadow">
<text class="icon-upload"></text> 上传</button>
</view>
</view>
<view class="cu-item" :class="menuArrow?'arrow':''">
<view class="content">
<text class="icon-tagfill text-red margin-right-xs"></text>
<text class="text-grey">标签</text>
</view>
<view class="action">
<view class="cu-tag round bg-orange light">音乐</view>
<view class="cu-tag round bg-olive light">电影</view>
<view class="cu-tag round bg-blue light">旅行</view>
</view>
</view>
<view class="cu-item" :class="menuArrow?'arrow':''">
<view class="content">
<text class="icon-warn text-green"></text>
<text class="text-grey">文本</text>
</view>
<view class="action">
<text class="text-grey text-sm">小目标还没有实现！</text>
</view>
</view>
<view class="cu-item">
<view class="content padding-tb-sm">
<view>
<text class="icon-clothesfill text-blue margin-right-xs"></text> 多行Item</view>
<view class="text-gray text-sm">
<text class="icon-infofill margin-right-xs"></text> 小目标还没有实现！</view>
</view>
<view class="action">
<switch class="switch-sex" @change="SwitchSex" :class="skin?'checked':''" :checked="skin?true:false"></switch>
</view>
<text class="text-grey text-sm">4 人</text>
</view>
</view>
<view class="cu-item" :class="menuArrow?'arrow':''">
<view class="content">
<text class="icon-btn text-green"></text>
<text class="text-grey">按钮</text>
</view>
<view class="action">
<button class="cu-btn round bg-green shadow">
<text class="icon-upload"></text> 上传</button>
</view>
</view>
<view class="cu-item" :class="menuArrow?'arrow':''">
<view class="content">
<text class="icon-tagfill text-red margin-right-xs"></text>
<text class="text-grey">标签</text>
</view>
<view class="action">
<view class="cu-tag round bg-orange light">音乐</view>
<view class="cu-tag round bg-olive light">电影</view>
<view class="cu-tag round bg-blue light">旅行</view>
</view>
</view>
<view class="cu-item" :class="menuArrow?'arrow':''">
<view class="content">
<text class="icon-warn text-green"></text>
<text class="text-grey">文本</text>
</view>
<view class="action">
<text class="text-grey text-sm">小目标还没有实现！</text>
</view>
</view>
<view class="cu-item">
<view class="content padding-tb-sm">
<view>
<text class="icon-clothesfill text-blue margin-right-xs"></text> 多行Item</view>
<view class="text-gray text-sm">
<text class="icon-infofill margin-right-xs"></text> 小目标还没有实现！</view>
</view>
<view class="action">
<switch class="switch-sex" @change="SwitchSex" :class="skin?'checked':''" :checked="skin?true:false"></switch>
</view>
</view>
</view>
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<text class="icon-title text-orange "></text> 消息列表
</view>
</view>
<view class="cu-list menu-avatar">
<view class="cu-item">
<view class="cu-avatar round lg" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big10001.jpg);"></view>
<view class="content">
<view class="text-grey">凯尔</view>
<view class="text-gray text-sm flex">
<text class="text-cut">
<text class="icon-infofill text-red margin-right-xs"></text> 我已天理为凭，踏入这片荒芜，不再受凡人的枷锁遏制。我已天理为凭，踏入这片荒芜，不再受凡人的枷锁遏制。
</text> </view>
</view>
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<view class="text-grey text-xs">22:20</view>
<view class="cu-tag round bg-grey sm">5</view>
<text class="icon-title text-orange "></text> 消息列表
</view>
</view>
<view class="cu-item">
<view class="cu-avatar round lg" style="background-image:url(https://ossweb-img.qq.com/images/lol/img/champion/Taric.png);">
<view class="cu-tag badge">99+</view>
</view>
<view class="content">
<view class="text-grey">
<text class="text-cut">瓦洛兰之盾-塔里克</text>
<view class="cu-tag round bg-orange sm">战士</view>
<view class="cu-list menu-avatar">
<view class="cu-item">
<view class="cu-avatar round lg" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big10001.jpg);"></view>
<view class="content">
<view class="text-grey">凯尔</view>
<view class="text-gray text-sm flex">
<text class="text-cut">
<text class="icon-infofill text-red margin-right-xs"></text>
我已天理为凭，踏入这片荒芜，不再受凡人的枷锁遏制。我已天理为凭，踏入这片荒芜，不再受凡人的枷锁遏制。
</text> </view>
</view>
<view class="text-gray text-sm flex">
<text class="text-cut">
塔里克是保护者星灵，用超乎寻常的力量守护着符文之地的生命、仁爱以及万物之美。塔里克由于渎职而被放逐，离开了祖国德玛西亚，前去攀登巨神峰寻找救赎，但他找到的却是来自星界的更高层的召唤。现在的塔里克与古代巨神族的神力相融合，以瓦洛兰之盾的身份，永不疲倦地警惕着阴险狡诈的虚空腐化之力。
</text>
<view class="action">
<view class="text-grey text-xs">22:20</view>
<view class="cu-tag round bg-grey sm">5</view>
</view>
</view>
<view class="action">
<view class="text-grey text-xs">22:20</view>
<view class="icon-notice_forbid_fill text-gray"></view>
</view>
</view>
<view class="cu-item ">
<view class="cu-avatar radius lg" style="background-image:url(https://ossweb-img.qq.com/images/lol/img/champion/Morgana.png);"></view>
<view class="content">
<view class="text-pink"><text class="text-cut">莫甘娜</text></view>
<view class="text-gray text-sm flex"> <text class="text-cut">凯尔，你被自己的光芒变的盲目！</text></view>
</view>
<view class="action">
<view class="text-grey text-xs">22:20</view>
<view class="cu-tag round bg-red sm">5</view>
</view>
</view>
<view class="cu-item grayscale">
<view class="cu-avatar radius lg" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big81007.jpg);"></view>
<view class="content">
<view><text class="text-cut">伊泽瑞尔</text>
<view class="cu-tag round bg-orange sm">断开连接...</view>
<view class="cu-item">
<view class="cu-avatar round lg" style="background-image:url(https://ossweb-img.qq.com/images/lol/img/champion/Taric.png);">
<view class="cu-tag badge">99+</view>
</view>
<view class="text-gray text-sm flex"> <text class="text-cut"> 等我回来一个打十个</text></view>
</view>
<view class="action">
<view class="text-grey text-xs">22:20</view>
<view class="cu-tag round bg-red sm">5</view>
</view>
</view>
<view class="cu-item cur">
<view class="cu-avatar radius lg" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big81020.jpg);">
<view class="cu-tag badge"></view>
</view>
<view class="content">
<view>
<text class="text-cut">瓦罗兰大陆-睡衣守护者-新手保护营</text>
<view class="cu-tag round bg-orange sm">6人</view>
<view class="content">
<view class="text-grey">
<text class="text-cut">瓦洛兰之盾-塔里克</text>
<view class="cu-tag round bg-orange sm">战士</view>
</view>
<view class="text-gray text-sm flex">
<text class="text-cut">
塔里克是保护者星灵，用超乎寻常的力量守护着符文之地的生命、仁爱以及万物之美。塔里克由于渎职而被放逐，离开了祖国德玛西亚，前去攀登巨神峰寻找救赎，但他找到的却是来自星界的更高层的召唤。现在的塔里克与古代巨神族的神力相融合，以瓦洛兰之盾的身份，永不疲倦地警惕着阴险狡诈的虚空腐化之力。
</text>
</view>
</view>
<view class="action">
<view class="text-grey text-xs">22:20</view>
<view class="icon-notice_forbid_fill text-gray"></view>
</view>
<view class="text-gray text-sm flex">
<text class="text-cut"> 伊泽瑞尔：<text class="icon-locationfill text-orange margin-right-xs"></text> 传送中...</text></view>
</view>
<view class="action">
<view class="text-grey text-xs">22:20</view>
<view class="icon-notice_forbid_fill text-gray"></view>
<view class="cu-item ">
<view class="cu-avatar radius lg" style="background-image:url(https://ossweb-img.qq.com/images/lol/img/champion/Morgana.png);"></view>
<view class="content">
<view class="text-pink"><text class="text-cut">莫甘娜</text></view>
<view class="text-gray text-sm flex"> <text class="text-cut">凯尔，你被自己的光芒变的盲目！</text></view>
</view>
<view class="action">
<view class="text-grey text-xs">22:20</view>
<view class="cu-tag round bg-red sm">5</view>
</view>
</view>
<view class="cu-item grayscale">
<view class="cu-avatar radius lg" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big81007.jpg);"></view>
<view class="content">
<view><text class="text-cut">伊泽瑞尔</text>
<view class="cu-tag round bg-orange sm">断开连接...</view>
</view>
<view class="text-gray text-sm flex"> <text class="text-cut"> 等我回来一个打十个</text></view>
</view>
<view class="action">
<view class="text-grey text-xs">22:20</view>
<view class="cu-tag round bg-red sm">5</view>
</view>
</view>
<view class="cu-item cur">
<view class="cu-avatar radius lg" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big81020.jpg);">
<view class="cu-tag badge"></view>
</view>
<view class="content">
<view>
<text class="text-cut">瓦罗兰大陆-睡衣守护者-新手保护营</text>
<view class="cu-tag round bg-orange sm">6人</view>
</view>
<view class="text-gray text-sm flex">
<text class="text-cut"> 伊泽瑞尔：<text class="icon-locationfill text-orange margin-right-xs"></text> 传送中...</text></view>
</view>
<view class="action">
<view class="text-grey text-xs">22:20</view>
<view class="icon-notice_forbid_fill text-gray"></view>
</view>
</view>
</view>
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<text class="icon-title text-orange "></text> 列表左滑
</view>
</view>
<view class="cu-list menu-avatar">
<view class="cu-item" :class="modalName=='move-box-'+ index?'move-cur':''" v-for="(item,index) in 4" :key="index"
@touchstart="ListTouchStart" @touchmove="ListTouchMove" @touchend="ListTouchEnd" :data-target="'move-box-' + index">
<view class="cu-avatar round lg" :style="[{backgroundImage:'url(https://ossweb-img.qq.com/images/lol/web201310/skin/big2100'+ (index+2) +'.jpg)'}]"></view>
<view class="content">
<view class="text-grey">文晓港</view>
<view class="text-gray text-sm">
<text class="icon-infofill text-red margin-right-xs"></text> 消息未送达</view>
</view>
<view class="action">
<view class="text-grey text-xs">22:20</view>
<view class="cu-tag round bg-grey sm">5</view>
</view>
<view class="move">
<view class="bg-grey">置顶</view>
<view class="bg-red">删除</view>
</view>
</view>
</view>
</view>
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<text class="icon-title text-orange "></text> 列表左滑
</view>
</view>
<view class="cu-list menu menu-avatar">
<view class="cu-item" :class="modalName=='move-box-'+ index?'move-cur':''" v-for="(item,index) in 4" :key="index"
@touchstart="ListTouchStart" @touchmove="ListTouchMove" @touchend="ListTouchEnd" :data-target="'move-box-' + index">
<view class="cu-avatar round lg" :style="[{backgroundImage:'url(https://ossweb-img.qq.com/images/lol/web201310/skin/big2100'+ (index+2) +'.jpg)'}]"></view>
<view class="content">
<view class="text-grey">文晓港</view>
<view class="text-gray text-sm">
<text class="icon-infofill text-red margin-right-xs"></text> 消息未送达</view>
</view>
<view class="action">
<view class="text-grey text-xs">22:20</view>
<view class="cu-tag round bg-grey sm">5</view>
</view>
<view class="move">
<view class="bg-grey">置顶</view>
<view class="bg-red">删除</view>
</view>
</view>
</view>
</scroll-view>
</view>
</template>
@@ -397,7 +399,12 @@
<style>
.page {
background: #f1f1f1;
height: 100Vh;
width: 100vw;
}
.page.show {
overflow: hidden;
}
.switch-sex::after {

11
Colorui-UniApp/pages/component/modal.vue
View File

@@ -1,6 +1,9 @@
<template>
<view>
<cu-custom bgColor="bg-gradual-pink" :isBack="true"><block slot="backText">返回</block><block slot="content">模态窗口</block></cu-custom>
<cu-custom bgColor="bg-gradual-pink" :isBack="true">
<block slot="backText">返回</block>
<block slot="content">模态窗口</block>
</cu-custom>
<view class="cu-bar bg-white margin-top">
<view class="action">
<text class="icon-title text-orange "></text> 普通窗口
@@ -254,9 +257,9 @@
this.radio = e.detail.value
},
ChooseCheckbox(e) {
var items = this.checkbox,
values = e.currentTarget.dataset.value;
for (var i = 0, lenI = items.length; i < lenI; ++i) {
let items = this.checkbox;
let values = e.currentTarget.dataset.value;
for (let i = 0, lenI = items.length; i < lenI; ++i) {
if (items[i].value == values) {
items[i].checked = !items[i].checked;
break

2
Colorui-UniApp/pages/component/timeline.vue
View File

@@ -50,7 +50,7 @@
</view>
<view class="cu-item text-blue">
<view class="bg-blue shadow-blur content">
<view class="cu-list menu menu-avatar radius">
<view class="cu-list menu-avatar radius">
<view class="cu-item">
<view class="cu-avatar round lg" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big10006.jpg);"></view>
<view class="content">