-
Notifications
You must be signed in to change notification settings - Fork 53
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: addresslist, barrage, card, category, comment, ecard, invoice, …
…timeselect
- Loading branch information
Showing
90 changed files
with
7,694 additions
and
33 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,112 @@ | ||
<script lang="ts"> | ||
import { reactive, ref } from 'vue' | ||
/* eslint-disable no-console */ | ||
export default { | ||
setup() { | ||
const data = ref([ | ||
{ | ||
testid: 3, | ||
testaddressName: '姓名', | ||
phone: '123****4567', | ||
defaultAddress: false, | ||
fullAddress: '北京市通州区测试测试测试测试测试测试测试测试测试', | ||
}, | ||
{ | ||
testid: 4, | ||
testaddressName: '姓名', | ||
phone: '123****4567', | ||
defaultAddress: true, | ||
fullAddress: '北京市通州区测试测试测试测试测试测试测试测试测试', | ||
}, | ||
]) | ||
const dataOptions = reactive({ | ||
id: 'testid', | ||
addressDetail: 'testaddressDetail', | ||
addressName: 'testaddressName', | ||
}) | ||
const clickItem = () => { | ||
console.log('Click To Address') | ||
} | ||
const delClick = () => { | ||
console.log('Click To Delete') | ||
} | ||
const editClick = () => { | ||
console.log('Click To Edit') | ||
} | ||
const copyClick = () => { | ||
console.log('Click To Copy') | ||
} | ||
const setClick = () => { | ||
console.log('Click On Settings') | ||
} | ||
const delClickLong = () => { | ||
console.log('Click On DelClickLong') | ||
} | ||
const delClickSwipe = () => { | ||
console.log('Click On DelClickSwipe') | ||
} | ||
const addAddress = () => { | ||
console.log('Click To Add') | ||
} | ||
return { | ||
clickItem, | ||
data, | ||
delClick, | ||
editClick, | ||
copyClick, | ||
setClick, | ||
delClickLong, | ||
delClickSwipe, | ||
addAddress, | ||
dataOptions, | ||
} | ||
}, | ||
} | ||
</script> | ||
|
||
<template> | ||
<div class="demo full"> | ||
<h2 class="title"> | ||
基础用法 | ||
</h2> | ||
<nut-address-list | ||
:data="data" | ||
:show-bottom-button="false" | ||
:options="dataOptions" | ||
@del-icon="delClick" | ||
@edit-icon="editClick" | ||
@click-item="clickItem" | ||
/> | ||
<h2 class="title"> | ||
长按功能 | ||
</h2> | ||
<nut-address-list | ||
:data="data" | ||
long-press | ||
:show-bottom-button="false" | ||
:options="dataOptions" | ||
@del-icon="delClick" | ||
@edit-icon="editClick" | ||
@click-item="clickItem" | ||
@long-copy="copyClick" | ||
@long-set="setClick" | ||
@long-del="delClickLong" | ||
/> | ||
<h2 class="title"> | ||
滑动功能 | ||
</h2> | ||
<nut-address-list | ||
:data="data" | ||
swipe-edition | ||
show-bottom-button | ||
:options="dataOptions" | ||
@del-icon="delClick" | ||
@edit-icon="editClick" | ||
@click-item="clickItem" | ||
@swipe-del="delClickSwipe" | ||
@add="addAddress" | ||
/> | ||
</div> | ||
</template> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,50 @@ | ||
<script lang="ts"> | ||
import { ref } from 'vue' | ||
export default { | ||
setup() { | ||
const inputVal = ref<any>('') | ||
const danmu = ref<any>(null) | ||
const list = ref(['画美不看', '不明觉厉', '喜大普奔', '男默女泪', '累觉不爱', '爷青结']) | ||
function addDanmu() { | ||
const n = Math.random() | ||
danmu.value.add(`随机——${String(n).substr(2, 10)}`) | ||
} | ||
return { | ||
inputVal, | ||
danmu, | ||
list, | ||
addDanmu, | ||
} | ||
}, | ||
} | ||
</script> | ||
|
||
<template> | ||
<div class="demo barrage-demo"> | ||
<h2 class="title"> | ||
基础用法 | ||
</h2> | ||
<nut-cell custom-class="danmu-box"> | ||
<nut-barrage ref="danmu" :danmu="list" /> | ||
</nut-cell> | ||
<div class="test"> | ||
<nut-button custom-class="add nut-button--primary" @click="addDanmu"> | ||
随机添加 | ||
</nut-button> | ||
</div> | ||
</div> | ||
</template> | ||
|
||
<style lang="scss"> | ||
.barrage-demo { | ||
.danmu-box, | ||
.nut-barrage { | ||
padding: 20px 0; | ||
height: 150px; | ||
} | ||
.nut-button { | ||
width: 100%; | ||
} | ||
} | ||
</style> |
Oops, something went wrong.