Skip to content

梁建民 / wmsMin

Go to a project
Commit 48831b8e by LJM
Options

新增出入库删除功能

parent eb26f476
Expand all
Inline Side-by-side
Showing with 1818 additions and 15 deletions
assets/css/pda/exWarehouse.scss
...@@ -57,3 +57,40 @@ ...@@ -57,3 +57,40 @@
} }
} }
} }
::v-deep {
.checkbox {
width: 45px !important;
display: flex !important;
align-items: center;
}
.uni-table-tr {
display: flex !important;
}
.uni-table-th,
.uni-table-td {
width: 204rpx !important;
display: flex !important;
}
.uni-table-td {
border-right: 1px #ebeef5 solid;
&:last-child {
border-right: none;
}
}
.uni-swipe_text--center {
width: 640rpx !important;
display: flex;
}
uni-swipe-action {
display: flex;
uni-swipe-action-item {
width: 100%;
display: flex;
.uni-swipe {
width: 100%;
display: flex;
}
}
}
}
assets/css/pda/warehousing.scss
...@@ -57,3 +57,40 @@ ...@@ -57,3 +57,40 @@
} }
} }
} }
::v-deep {
.checkbox {
width: 45px !important;
display: flex !important;
align-items: center;
}
.uni-table-tr {
display: flex !important;
}
.uni-table-th,
.uni-table-td {
width: 204rpx !important;
display: flex !important;
}
.uni-table-td {
border-right: 1px #ebeef5 solid;
&:last-child {
border-right: none;
}
}
.uni-swipe_text--center {
width: 640rpx !important;
display: flex;
}
uni-swipe-action {
display: flex;
uni-swipe-action-item {
width: 100%;
display: flex;
.uni-swipe {
width: 100%;
display: flex;
}
}
}
}
pages/pda/exWarehouse.vue
...@@ -8,9 +8,13 @@ ...@@ -8,9 +8,13 @@
<uni-th align="center">汇总件数</uni-th> <uni-th align="center">汇总件数</uni-th>
</uni-tr> </uni-tr>
<uni-tr v-for="(item, index) in list" :key="index"> <uni-tr v-for="(item, index) in list" :key="index">
<uni-td align="center">{{ item.erp_order_sn }}</uni-td> <uni-swipe-action ref="swipeAction">
<uni-td align="center">{{ item.car_sort }}</uni-td> <uni-swipe-action-item :right-options="options" @click="bindClick($event, index)" @change="swipeChange($event, index)">
<uni-td align="center">{{ item.num }}</uni-td> <uni-td align="center">{{ item.erp_order_sn || '' }}</uni-td>
<uni-td align="center">{{ item.car_sort || '' }}</uni-td>
<uni-td align="center">{{ item.num || '' }}</uni-td>
</uni-swipe-action-item>
</uni-swipe-action>
</uni-tr> </uni-tr>
</uni-table> </uni-table>
</view> </view>
...@@ -34,9 +38,34 @@ import { API } from '@/util/api.js'; ...@@ -34,9 +38,34 @@ import { API } from '@/util/api.js';
export default { export default {
data() { data() {
return { return {
options: [
{
text: '取消',
style: {
backgroundColor: '#007aff'
}
},
{
text: '删除',
style: {
backgroundColor: '#dd524d'
}
}
],
selectedIndexs: [], selectedIndexs: [],
erp_order_sn: '', erp_order_sn: '',
list: [], list: [
{
erp_order_sn: 'B154542',
car_sort: '1车次',
num: 100
},
{
erp_order_sn: 'B1542',
car_sort: '2车次',
num: 10
}
],
filterList: [], filterList: [],
startTime: '', startTime: '',
endTime: '' endTime: ''
...@@ -52,6 +81,15 @@ export default { ...@@ -52,6 +81,15 @@ export default {
this.selectedIndexs = []; this.selectedIndexs = [];
}, },
methods: { methods: {
bindClick(e, index) {
console.log('点击了' + (e.position === 'left' ? '左侧' : '右侧') + e.content.text + '按钮');
if (e.content.text == '删除') {
this.list.splice(index, 1);
}
},
swipeChange(e, index) {
//console.log('当前状态：' + e + '，下标：' + index);
},
selectionChange(e) { selectionChange(e) {
this.selectedIndexs = e.detail.index; this.selectedIndexs = e.detail.index;
this.filterList = this.selectedIndexs.map(i => this.list[i]); this.filterList = this.selectedIndexs.map(i => this.list[i]);
...@@ -83,6 +121,7 @@ export default { ...@@ -83,6 +121,7 @@ export default {
num: res.data.num num: res.data.num
}); });
} else { } else {
this.list = [];
uni.showToast({ uni.showToast({
title: res.err_msg, title: res.err_msg,
icon: 'none' icon: 'none'
...@@ -112,9 +151,10 @@ export default { ...@@ -112,9 +151,10 @@ export default {
}); });
}, 2000); }, 2000);
} else { } else {
uni.showToast({ uni.showModal({
title: res.err_msg, title: '提示',
icon: 'none' content: res.err_msg,
showCancel: false
}); });
} }
}); });
......
pages/pda/warehousing.vue
...@@ -8,9 +8,13 @@ ...@@ -8,9 +8,13 @@
<uni-th align="center">汇总件数</uni-th> <uni-th align="center">汇总件数</uni-th>
</uni-tr> </uni-tr>
<uni-tr v-for="(item, index) in list" :key="index"> <uni-tr v-for="(item, index) in list" :key="index">
<uni-td align="center">{{ item.erp_order_sn || '' }}</uni-td> <uni-swipe-action ref="swipeAction">
<uni-td align="center">{{ item.car_sort || '' }}</uni-td> <uni-swipe-action-item :right-options="options" @click="bindClick($event, index)" @change="swipeChange($event, index)">
<uni-td align="center">{{ item.num || '' }}</uni-td> <uni-td align="center">{{ item.erp_order_sn || '' }}</uni-td>
<uni-td align="center">{{ item.car_sort || '' }}</uni-td>
<uni-td align="center">{{ item.num || '' }}</uni-td>
</uni-swipe-action-item>
</uni-swipe-action>
</uni-tr> </uni-tr>
</uni-table> </uni-table>
</view> </view>
...@@ -34,6 +38,20 @@ import { API } from '@/util/api.js'; ...@@ -34,6 +38,20 @@ import { API } from '@/util/api.js';
export default { export default {
data() { data() {
return { return {
options: [
{
text: '取消',
style: {
backgroundColor: '#007aff'
}
},
{
text: '删除',
style: {
backgroundColor: '#dd524d'
}
}
],
selectedIndexs: [], selectedIndexs: [],
erp_order_sn: '', erp_order_sn: '',
list: [], list: [],
...@@ -52,6 +70,15 @@ export default { ...@@ -52,6 +70,15 @@ export default {
this.selectedIndexs = []; this.selectedIndexs = [];
}, },
methods: { methods: {
bindClick(e, index) {
console.log('点击了' + (e.position === 'left' ? '左侧' : '右侧') + e.content.text + '按钮');
if (e.content.text == '删除') {
this.list.splice(index, 1);
}
},
swipeChange(e, index) {
//console.log('当前状态：' + e + '，下标：' + index);
},
selectionChange(e) { selectionChange(e) {
this.selectedIndexs = e.detail.index; this.selectedIndexs = e.detail.index;
this.filterList = this.selectedIndexs.map(i => this.list[i]); this.filterList = this.selectedIndexs.map(i => this.list[i]);
...@@ -83,6 +110,7 @@ export default { ...@@ -83,6 +110,7 @@ export default {
num: res.data.num num: res.data.num
}); });
} else { } else {
this.list = [];
uni.showToast({ uni.showToast({
title: res.err_msg, title: res.err_msg,
icon: 'none' icon: 'none'
...@@ -112,9 +140,10 @@ export default { ...@@ -112,9 +140,10 @@ export default {
}); });
}, 2000); }, 2000);
} else { } else {
uni.showToast({ uni.showModal({
title: res.err_msg, title: '提示',
icon: 'none' content: res.err_msg,
showCancel: false
}); });
} }
}); });
......
uni_modules/uni-swipe-action/changelog.md 0 → 100644
## 1.3.7（2022-06-06）
- 修复 vue3 下使用组件不能正常运行的Bug
## 1.3.6（2022-05-31）
- 修复 h5端点击click触发两次的Bug
## 1.3.5（2022-05-23）
- 修复 isPC 找不到的Bug
## 1.3.4（2022-05-19）
- 修复 在 nvue 下 disabled 失效的bug
## 1.3.3（2022-03-31）
- 修复 按钮字体大小不能设置的bug
## 1.3.2（2022-03-16）
- 修复 h5和app端下报el错误的bug
## 1.3.1（2022-03-07）
- 修复 HBuilderX 1.4.X 版本中，h5和app端下报错的bug
## 1.3.0（2021-11-19）
- 优化 组件UI，并提供设计资源，详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移，详见:[https://uniapp.dcloud.io/component/uniui/uni-swipe-action](https://uniapp.dcloud.io/component/uniui/uni-swipe-action)
## 1.2.4（2021-08-20）
- 优化 close-all 方法
## 1.2.3（2021-08-20）
- 新增 close-all 方法，关闭所有已打开的组件
## 1.2.2（2021-08-17）
- 新增 resize() 方法，在非微信小程序、h5、app-vue端出现不能滑动的问题的时候，重置组件
- 修复 app 端偶尔出现类似 Page[x][-x,xx;-x,xx,x,x-x] 的问题
- 优化 微信小程序、h5、app-vue 滑动逻辑，避免出现动态新增组件后不能滑动的问题
## 1.2.1（2021-07-30）
- 组件兼容 vue3，如何创建vue3项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
- 修复 跨页面修改组件数据 ，导致不能滑动的问题
## 1.1.10（2021-06-17）
- 修复 按钮点击执行两次的bug
## 1.1.9（2021-05-12）
- 新增 项目示例地址
## 1.1.8（2021-03-26）
- 修复 微信小程序 nv_navigator is not defined 报错的bug
## 1.1.7（2021-02-05）
- 调整为uni_modules目录规范
- 新增 左侧滑动
- 新增 插槽使用方式
- 新增 threshold 属性，可以控制滑动缺省值
- 优化 长列表滚动性能
- 修复 滚动页面时触发组件滑动的Bug
uni_modules/uni-swipe-action/components/uni-swipe-action-item/bindingx.js 0 → 100644
let bindIngXMixins = {}
// #ifdef APP-NVUE
const BindingX = uni.requireNativePlugin('bindingx');
const dom = uni.requireNativePlugin('dom');
const animation = uni.requireNativePlugin('animation');
bindIngXMixins = {
data() {
return {}
},
watch: {
show(newVal) {
if (this.autoClose) return
if (this.stop) return
this.stop = true
if (newVal) {
this.open(newVal)
} else {
this.close()
}
},
leftOptions() {
this.getSelectorQuery()
this.init()
},
rightOptions(newVal) {
this.init()
}
},
created() {
this.swipeaction = this.getSwipeAction()
if (this.swipeaction.children !== undefined) {
this.swipeaction.children.push(this)
}
},
mounted() {
this.box = this.getEl(this.$refs['selector-box--hock'])
this.selector = this.getEl(this.$refs['selector-content--hock']);
this.leftButton = this.getEl(this.$refs['selector-left-button--hock']);
this.rightButton = this.getEl(this.$refs['selector-right-button--hock']);
this.init()
},
// beforeDestroy() {
// this.swipeaction.children.forEach((item, index) => {
// if (item === this) {
// this.swipeaction.children.splice(index, 1)
// }
// })
// },
methods: {
init() {
this.$nextTick(() => {
this.x = 0
this.button = {
show: false
}
setTimeout(() => {
this.getSelectorQuery()
}, 200)
})
},
onClick(index, item, position) {
this.$emit('click', {
content: item,
index,
position
})
},
touchstart(e) {
// fix by mehaotian 禁止滑动
if (this.disabled) return
// 每次只触发一次，避免多次监听造成闪烁
if (this.stop) return
this.stop = true
if (this.autoClose) {
this.swipeaction.closeOther(this)
}
const leftWidth = this.button.left.width
const rightWidth = this.button.right.width
let expression = this.range(this.x, -rightWidth, leftWidth)
let leftExpression = this.range(this.x - leftWidth, -leftWidth, 0)
let rightExpression = this.range(this.x + rightWidth, 0, rightWidth)
this.eventpan = BindingX.bind({
anchor: this.box,
eventType: 'pan',
props: [{
element: this.selector,
property: 'transform.translateX',
expression
}, {
element: this.leftButton,
property: 'transform.translateX',
expression: leftExpression
}, {
element: this.rightButton,
property: 'transform.translateX',
expression: rightExpression
}, ]
}, (e) => {
// nope
if (e.state === 'end') {
this.x = e.deltaX + this.x;
this.isclick = true
this.bindTiming(e.deltaX)
}
});
},
touchend(e) {
if (this.isopen !== 'none' && !this.isclick) {
this.open('none')
}
},
bindTiming(x) {
const left = this.x
const leftWidth = this.button.left.width
const rightWidth = this.button.right.width
const threshold = this.threshold
if (!this.isopen || this.isopen === 'none') {
if (left > threshold) {
this.open('left')
} else if (left < -threshold) {
this.open('right')
} else {
this.open('none')
}
} else {
if ((x > -leftWidth && x < 0) || x > rightWidth) {
if ((x > -threshold && x < 0) || (x - rightWidth > threshold)) {
this.open('left')
} else {
this.open('none')
}
} else {
if ((x < threshold && x > 0) || (x + leftWidth < -threshold)) {
this.open('right')
} else {
this.open('none')
}
}
}
},
/**
* 移动范围
* @param {Object} num
* @param {Object} mix
* @param {Object} max
*/
range(num, mix, max) {
return `min(max(x+${num}, ${mix}), ${max})`
},
/**
* 开启swipe
*/
open(type) {
this.animation(type)
},
/**
* 关闭swipe
*/
close() {
this.animation('none')
},
/**
* 开启关闭动画
* @param {Object} type
*/
animation(type) {
const time = 300
const leftWidth = this.button.left.width
const rightWidth = this.button.right.width
if (this.eventpan && this.eventpan.token) {
BindingX.unbind({
token: this.eventpan.token,
eventType: 'pan'
})
}
switch (type) {
case 'left':
Promise.all([
this.move(this.selector, leftWidth),
this.move(this.leftButton, 0),
this.move(this.rightButton, rightWidth * 2)
]).then(() => {
this.setEmit(leftWidth, type)
})
break
case 'right':
Promise.all([
this.move(this.selector, -rightWidth),
this.move(this.leftButton, -leftWidth * 2),
this.move(this.rightButton, 0)
]).then(() => {
this.setEmit(-rightWidth, type)
})
break
default:
Promise.all([
this.move(this.selector, 0),
this.move(this.leftButton, -leftWidth),
this.move(this.rightButton, rightWidth)
]).then(() => {
this.setEmit(0, type)
})
}
},
setEmit(x, type) {
const leftWidth = this.button.left.width
const rightWidth = this.button.right.width
this.isopen = this.isopen || 'none'
this.stop = false
this.isclick = false
// 只有状态不一致才会返回结果
if (this.isopen !== type && this.x !== x) {
if (type === 'left' && leftWidth > 0) {
this.$emit('change', 'left')
}
if (type === 'right' && rightWidth > 0) {
this.$emit('change', 'right')
}
if (type === 'none') {
this.$emit('change', 'none')
}
}
this.x = x
this.isopen = type
},
move(ref, value) {
return new Promise((resolve, reject) => {
animation.transition(ref, {
styles: {
transform: `translateX(${value})`,
},
duration: 150, //ms
timingFunction: 'linear',
needLayout: false,
delay: 0 //ms
}, function(res) {
resolve(res)
})
})
},
/**
* 获取ref
* @param {Object} el
*/
getEl(el) {
return el.ref
},
/**
* 获取节点信息
*/
getSelectorQuery() {
Promise.all([
this.getDom('left'),
this.getDom('right'),
]).then((data) => {
let show = 'none'
if (this.autoClose) {
show = 'none'
} else {
show = this.show
}
if (show === 'none') {
// this.close()
} else {
this.open(show)
}
})
},
getDom(str) {
return new Promise((resolve, reject) => {
dom.getComponentRect(this.$refs[`selector-${str}-button--hock`], (data) => {
if (data) {
this.button[str] = data.size
resolve(data)
} else {
reject()
}
})
})
}
}
}
// #endif
export default bindIngXMixins
uni_modules/uni-swipe-action/components/uni-swipe-action-item/isPC.js 0 → 100644
export function isPC() {
var userAgentInfo = navigator.userAgent;
var Agents = ["Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod"];
var flag = true;
for (let v = 0; v < Agents.length - 1; v++) {
if (userAgentInfo.indexOf(Agents[v]) > 0) {
flag = false;
break;
}
}
return flag;
}
uni_modules/uni-swipe-action/components/uni-swipe-action-item/mpalipay.js 0 → 100644
export default {
data() {
return {
x: 0,
transition: false,
width: 0,
viewWidth: 0,
swipeShow: 0
}
},
watch: {
show(newVal) {
if (this.autoClose) return
if (newVal && newVal !== 'none') {
this.transition = true
this.open(newVal)
} else {
this.close()
}
}
},
created() {
this.swipeaction = this.getSwipeAction()
if (this.swipeaction.children !== undefined) {
this.swipeaction.children.push(this)
}
},
mounted() {
this.isopen = false
setTimeout(() => {
this.getQuerySelect()
}, 50)
},
methods: {
appTouchStart(e) {
const {
clientX
} = e.changedTouches[0]
this.clientX = clientX
this.timestamp = new Date().getTime()
},
appTouchEnd(e, index, item, position) {
const {
clientX
} = e.changedTouches[0]
// fixed by xxxx 模拟点击事件，解决 ios 13 点击区域错位的问题
let diff = Math.abs(this.clientX - clientX)
let time = (new Date().getTime()) - this.timestamp
if (diff < 40 && time < 300) {
this.$emit('click', {
content: item,
index,
position
})
}
},
/**
* 移动触发
* @param {Object} e
*/
onChange(e) {
this.moveX = e.detail.x
this.isclose = false
},
touchstart(e) {
this.transition = false
this.isclose = true
this.autoClose && this.swipeaction.closeOther(this)
},
touchmove(e) {},
touchend(e) {
// 0的位置什么都不执行
if (this.isclose && this.isopen === 'none') return
if (this.isclose && this.isopen !== 'none') {
this.transition = true
this.close()
} else {
this.move(this.moveX + this.leftWidth)
}
},
/**
* 移动
* @param {Object} moveX
*/
move(moveX) {
// 打开关闭的处理逻辑不太一样
this.transition = true
// 未打开状态
if (!this.isopen || this.isopen === 'none') {
if (moveX > this.threshold) {
this.open('left')
} else if (moveX < -this.threshold) {
this.open('right')
} else {
this.close()
}
} else {
if (moveX < 0 && moveX < this.rightWidth) {
const rightX = this.rightWidth + moveX
if (rightX < this.threshold) {
this.open('right')
} else {
this.close()
}
} else if (moveX > 0 && moveX < this.leftWidth) {
const leftX = this.leftWidth - moveX
if (leftX < this.threshold) {
this.open('left')
} else {
this.close()
}
}
}
},
/**
* 打开
*/
open(type) {
this.x = this.moveX
this.animation(type)
},
/**
* 关闭
*/
close() {
this.x = this.moveX
// TODO 解决 x 值不更新的问题，所以会多触发一次 nextTick ，待优化
this.$nextTick(() => {
this.x = -this.leftWidth
if (this.isopen !== 'none') {
this.$emit('change', 'none')
}
this.isopen = 'none'
})
},
/**
* 执行结束动画
* @param {Object} type
*/
animation(type) {
this.$nextTick(() => {
if (type === 'left') {
this.x = 0
} else {
this.x = -this.rightWidth - this.leftWidth
}
if (this.isopen !== type) {
this.$emit('change', type)
}
this.isopen = type
})
},
getSlide(x) {},
getQuerySelect() {
const query = uni.createSelectorQuery().in(this);
query.selectAll('.movable-view--hock').boundingClientRect(data => {
this.leftWidth = data[1].width
this.rightWidth = data[2].width
this.width = data[0].width
this.viewWidth = this.width + this.rightWidth + this.leftWidth
if (this.leftWidth === 0) {
// TODO 疑似bug ,初始化的时候如果x 是0，会导致移动位置错误，所以让元素超出一点
this.x = -0.1
} else {
this.x = -this.leftWidth
}
this.moveX = this.x
this.$nextTick(() => {
this.swipeShow = 1
})
if (!this.buttonWidth) {
this.disabledView = true
}
if (this.autoClose) return
if (this.show !== 'none') {
this.transition = true
this.open(this.shows)
}
}).exec();
}
}
}
uni_modules/uni-swipe-action/components/uni-swipe-action-item/mpother.js 0 → 100644
let otherMixins = {}
// #ifndef APP-PLUS|| MP-WEIXIN || H5
const MIN_DISTANCE = 10;
otherMixins = {
data() {
// TODO 随机生生元素ID，解决百度小程序获取同一个元素位置信息的bug
const elClass = `Uni_${Math.ceil(Math.random() * 10e5).toString(36)}`
return {
uniShow: false,
left: 0,
buttonShow: 'none',
ani: false,
moveLeft: '',
elClass
}
},
watch: {
show(newVal) {
if (this.autoClose) return
this.openState(newVal)
},
left() {
this.moveLeft = `translateX(${this.left}px)`
},
buttonShow(newVal) {
if (this.autoClose) return
this.openState(newVal)
},
leftOptions() {
this.init()
},
rightOptions() {
this.init()
}
},
mounted() {
this.swipeaction = this.getSwipeAction()
if (this.swipeaction.children !== undefined) {
this.swipeaction.children.push(this)
}
this.init()
},
methods: {
init() {
clearTimeout(this.timer)
this.timer = setTimeout(() => {
this.getSelectorQuery()
}, 100)
// 移动距离
this.left = 0
this.x = 0
},
closeSwipe(e) {
if (!this.autoClose) return
this.swipeaction.closeOther(this)
},
appTouchStart(e) {
const {
clientX
} = e.changedTouches[0]
this.clientX = clientX
this.timestamp = new Date().getTime()
},
appTouchEnd(e, index, item, position) {
const {
clientX
} = e.changedTouches[0]
// fixed by xxxx 模拟点击事件，解决 ios 13 点击区域错位的问题
let diff = Math.abs(this.clientX - clientX)
let time = (new Date().getTime()) - this.timestamp
if (diff < 40 && time < 300) {
this.$emit('click', {
content: item,
index,
position
})
}
},
touchstart(e) {
if (this.disabled) return
this.ani = false
this.x = this.left || 0
this.stopTouchStart(e)
this.autoClose && this.closeSwipe()
},
touchmove(e) {
if (this.disabled) return
// 是否可以滑动页面
this.stopTouchMove(e);
if (this.direction !== 'horizontal') {
return;
}
this.move(this.x + this.deltaX)
return false
},
touchend() {
if (this.disabled) return
this.moveDirection(this.left)
},
/**
* 设置移动距离
* @param {Object} value
*/
move(value) {
value = value || 0
const leftWidth = this.leftWidth
const rightWidth = this.rightWidth
// 获取可滑动范围
this.left = this.range(value, -rightWidth, leftWidth);
},
/**
* 获取范围
* @param {Object} num
* @param {Object} min
* @param {Object} max
*/
range(num, min, max) {
return Math.min(Math.max(num, min), max);
},
/**
* 移动方向判断
* @param {Object} left
* @param {Object} value
*/
moveDirection(left) {
const threshold = this.threshold
const isopen = this.isopen || 'none'
const leftWidth = this.leftWidth
const rightWidth = this.rightWidth
if (this.deltaX === 0) {
this.openState('none')
return
}
if ((isopen === 'none' && rightWidth > 0 && -left > threshold) || (isopen !== 'none' && rightWidth >
0 && rightWidth +
left < threshold)) {
// right
this.openState('right')
} else if ((isopen === 'none' && leftWidth > 0 && left > threshold) || (isopen !== 'none' && leftWidth >
0 &&
leftWidth - left < threshold)) {
// left
this.openState('left')
} else {
// default
this.openState('none')
}
},
/**
* 开启状态
* @param {Boolean} type
*/
openState(type) {
const leftWidth = this.leftWidth
const rightWidth = this.rightWidth
let left = ''
this.isopen = this.isopen ? this.isopen : 'none'
switch (type) {
case "left":
left = leftWidth
break
case "right":
left = -rightWidth
break
default:
left = 0
}
if (this.isopen !== type) {
this.throttle = true
this.$emit('change', type)
}
this.isopen = type
// 添加动画类
this.ani = true
this.$nextTick(() => {
this.move(left)
})
// 设置最终移动位置,理论上只要进入到这个函数，肯定是要打开的
},
close() {
this.openState('none')
},
getDirection(x, y) {
if (x > y && x > MIN_DISTANCE) {
return 'horizontal';
}
if (y > x && y > MIN_DISTANCE) {
return 'vertical';
}
return '';
},
/**
* 重置滑动状态
* @param {Object} event
*/
resetTouchStatus() {
this.direction = '';
this.deltaX = 0;
this.deltaY = 0;
this.offsetX = 0;
this.offsetY = 0;
},
/**
* 设置滑动开始位置
* @param {Object} event
*/
stopTouchStart(event) {
this.resetTouchStatus();
const touch = event.touches[0];
this.startX = touch.clientX;
this.startY = touch.clientY;
},
/**
* 滑动中，是否禁止打开
* @param {Object} event
*/
stopTouchMove(event) {
const touch = event.touches[0];
this.deltaX = touch.clientX - this.startX;
this.deltaY = touch.clientY - this.startY;
this.offsetX = Math.abs(this.deltaX);
this.offsetY = Math.abs(this.deltaY);
this.direction = this.direction || this.getDirection(this.offsetX, this.offsetY);
},
getSelectorQuery() {
const views = uni.createSelectorQuery().in(this)
views
.selectAll('.' + this.elClass)
.boundingClientRect(data => {
if (data.length === 0) return
let show = 'none'
if (this.autoClose) {
show = 'none'
} else {
show = this.show
}
this.leftWidth = data[0].width || 0
this.rightWidth = data[1].width || 0
this.buttonShow = show
})
.exec()
}
}
}
// #endif
export default otherMixins
uni_modules/uni-swipe-action/components/uni-swipe-action-item/mpwxs.js 0 → 100644
let mpMixins = {}
let is_pc = null
// #ifdef H5
import {
isPC
} from "./isPC"
is_pc = isPC()
// #endif
// #ifdef APP-VUE|| MP-WEIXIN || H5
mpMixins = {
data() {
return {
is_show: 'none'
}
},
watch: {
show(newVal) {
this.is_show = this.show
}
},
created() {
this.swipeaction = this.getSwipeAction()
if (this.swipeaction.children !== undefined) {
this.swipeaction.children.push(this)
}
},
mounted() {
this.is_show = this.show
},
methods: {
// wxs 中调用
closeSwipe(e) {
if (!this.autoClose) return
this.swipeaction.closeOther(this)
},
change(e) {
this.$emit('change', e.open)
if (this.is_show !== e.open) {
this.is_show = e.open
}
},
appTouchStart(e) {
if (is_pc) return
const {
clientX
} = e.changedTouches[0]
this.clientX = clientX
this.timestamp = new Date().getTime()
},
appTouchEnd(e, index, item, position) {
if (is_pc) return
const {
clientX
} = e.changedTouches[0]
// fixed by xxxx 模拟点击事件，解决 ios 13 点击区域错位的问题
let diff = Math.abs(this.clientX - clientX)
let time = (new Date().getTime()) - this.timestamp
if (diff < 40 && time < 300) {
this.$emit('click', {
content: item,
index,
position
})
}
},
onClickForPC(index, item, position) {
if (!is_pc) return
// #ifdef H5
this.$emit('click', {
content: item,
index,
position
})
// #endif
}
}
}
// #endif
export default mpMixins
uni_modules/uni-swipe-action/components/uni-swipe-action-item/render.js 0 → 100644
const MIN_DISTANCE = 10;
export default {
showWatch(newVal, oldVal, ownerInstance, instance, self) {
var state = self.state
var $el = ownerInstance.$el || ownerInstance.$vm && ownerInstance.$vm.$el
if (!$el) return
this.getDom(instance, ownerInstance, self)
if (newVal && newVal !== 'none') {
this.openState(newVal, instance, ownerInstance, self)
return
}
if (state.left) {
this.openState('none', instance, ownerInstance, self)
}
this.resetTouchStatus(instance, self)
},
/**
* 开始触摸操作
* @param {Object} e
* @param {Object} ins
*/
touchstart(e, ownerInstance, self) {
let instance = e.instance;
let disabled = instance.getDataset().disabled
let state = self.state;
this.getDom(instance, ownerInstance, self)
// fix by mehaotian, TODO 兼容 app-vue 获取dataset为字符串 , h5 获取 为 undefined 的问题,待框架修复
disabled = this.getDisabledType(disabled)
if (disabled) return
// 开始触摸时移除动画类
instance.requestAnimationFrame(function() {
instance.removeClass('ani');
ownerInstance.callMethod('closeSwipe');
})
// 记录上次的位置
state.x = state.left || 0
// 计算滑动开始位置
this.stopTouchStart(e, ownerInstance, self)
},
/**
* 开始滑动操作
* @param {Object} e
* @param {Object} ownerInstance
*/
touchmove(e, ownerInstance, self) {
let instance = e.instance;
// 删除之后已经那不到实例了
if (!instance) return;
let disabled = instance.getDataset().disabled
let state = self.state
// fix by mehaotian, TODO 兼容 app-vue 获取dataset为字符串 , h5 获取 为 undefined 的问题,待框架修复
disabled = this.getDisabledType(disabled)
if (disabled) return
// 是否可以滑动页面
this.stopTouchMove(e, self);
if (state.direction !== 'horizontal') {
return;
}
if (e.preventDefault) {
// 阻止页面滚动
e.preventDefault()
}
let x = state.x + state.deltaX
this.move(x, instance, ownerInstance, self)
},
/**
* 结束触摸操作
* @param {Object} e
* @param {Object} ownerInstance
*/
touchend(e, ownerInstance, self) {
let instance = e.instance;
let disabled = instance.getDataset().disabled
let state = self.state
// fix by mehaotian, TODO 兼容 app-vue 获取dataset为字符串 , h5 获取 为 undefined 的问题,待框架修复
disabled = this.getDisabledType(disabled)
if (disabled) return
// 滑动过程中触摸结束,通过阙值判断是开启还是关闭
// fixed by mehaotian 定时器解决点击按钮，touchend 触发比 click 事件时机早的问题 ，主要是 ios13
this.moveDirection(state.left, instance, ownerInstance, self)
},
/**
* 设置移动距离
* @param {Object} value
* @param {Object} instance
* @param {Object} ownerInstance
*/
move(value, instance, ownerInstance, self) {
value = value || 0
let state = self.state
let leftWidth = state.leftWidth
let rightWidth = state.rightWidth
// 获取可滑动范围
state.left = this.range(value, -rightWidth, leftWidth);
instance.requestAnimationFrame(function() {
instance.setStyle({
transform: 'translateX(' + state.left + 'px)',
'-webkit-transform': 'translateX(' + state.left + 'px)'
})
})
},
/**
* 获取元素信息
* @param {Object} instance
* @param {Object} ownerInstance
*/
getDom(instance, ownerInstance, self) {
var state = self.state
var $el = ownerInstance.$el || ownerInstance.$vm && ownerInstance.$vm.$el
var leftDom = $el.querySelector('.button-group--left')
var rightDom = $el.querySelector('.button-group--right')
state.leftWidth = leftDom.offsetWidth || 0
state.rightWidth = rightDom.offsetWidth || 0
state.threshold = instance.getDataset().threshold
},
getDisabledType(value) {
return (typeof(value) === 'string' ? JSON.parse(value) : value) || false;
},
/**
* 获取范围
* @param {Object} num
* @param {Object} min
* @param {Object} max
*/
range(num, min, max) {
return Math.min(Math.max(num, min), max);
},
/**
* 移动方向判断
* @param {Object} left
* @param {Object} value
* @param {Object} ownerInstance
* @param {Object} ins
*/
moveDirection(left, ins, ownerInstance, self) {
var state = self.state
var threshold = state.threshold
var position = state.position
var isopen = state.isopen || 'none'
var leftWidth = state.leftWidth
var rightWidth = state.rightWidth
if (state.deltaX === 0) {
this.openState('none', ins, ownerInstance, self)
return
}
if ((isopen === 'none' && rightWidth > 0 && -left > threshold) || (isopen !== 'none' && rightWidth > 0 &&
rightWidth +
left < threshold)) {
// right
this.openState('right', ins, ownerInstance, self)
} else if ((isopen === 'none' && leftWidth > 0 && left > threshold) || (isopen !== 'none' && leftWidth > 0 &&
leftWidth - left < threshold)) {
// left
this.openState('left', ins, ownerInstance, self)
} else {
// default
this.openState('none', ins, ownerInstance, self)
}
},
/**
* 开启状态
* @param {Boolean} type
* @param {Object} ins
* @param {Object} ownerInstance
*/
openState(type, ins, ownerInstance, self) {
let state = self.state
let leftWidth = state.leftWidth
let rightWidth = state.rightWidth
let left = ''
state.isopen = state.isopen ? state.isopen : 'none'
switch (type) {
case "left":
left = leftWidth
break
case "right":
left = -rightWidth
break
default:
left = 0
}
// && !state.throttle
if (state.isopen !== type) {
state.throttle = true
ownerInstance.callMethod('change', {
open: type
})
}
state.isopen = type
// 添加动画类
ins.requestAnimationFrame(() => {
ins.addClass('ani');
this.move(left, ins, ownerInstance, self)
})
},
getDirection(x, y) {
if (x > y && x > MIN_DISTANCE) {
return 'horizontal';
}
if (y > x && y > MIN_DISTANCE) {
return 'vertical';
}
return '';
},
/**
* 重置滑动状态
* @param {Object} event
*/
resetTouchStatus(instance, self) {
let state = self.state;
state.direction = '';
state.deltaX = 0;
state.deltaY = 0;
state.offsetX = 0;
state.offsetY = 0;
},
/**
* 设置滑动开始位置
* @param {Object} event
*/
stopTouchStart(event, ownerInstance, self) {
let instance = event.instance;
let state = self.state
this.resetTouchStatus(instance, self);
var touch = event.touches[0];
state.startX = touch.clientX;
state.startY = touch.clientY;
},
/**
* 滑动中，是否禁止打开
* @param {Object} event
*/
stopTouchMove(event, self) {
let instance = event.instance;
let state = self.state;
let touch = event.touches[0];
state.deltaX = touch.clientX - state.startX;
state.deltaY = touch.clientY - state.startY;
state.offsetY = Math.abs(state.deltaY);
state.offsetX = Math.abs(state.deltaX);
state.direction = state.direction || this.getDirection(state.offsetX, state.offsetY);
}
}
uni_modules/uni-swipe-action/components/uni-swipe-action-item/wx.wxs 0 → 100644
var MIN_DISTANCE = 10;
/**
* 判断当前是否为H5、app-vue
*/
var IS_HTML5 = false
if (typeof window === 'object') IS_HTML5 = true
/**
* 监听页面内值的变化,主要用于动态开关swipe-action
* @param {Object} newValue
* @param {Object} oldValue
* @param {Object} ownerInstance
* @param {Object} instance
*/
function showWatch(newVal, oldVal, ownerInstance, instance) {
var state = instance.getState()
getDom(instance, ownerInstance)
if (newVal && newVal !== 'none') {
openState(newVal, instance, ownerInstance)
return
}
if (state.left) {
openState('none', instance, ownerInstance)
}
resetTouchStatus(instance)
}
/**
* 开始触摸操作
* @param {Object} e
* @param {Object} ins
*/
function touchstart(e, ownerInstance) {
var instance = e.instance;
var disabled = instance.getDataset().disabled
var state = instance.getState();
getDom(instance, ownerInstance)
// fix by mehaotian, TODO 兼容 app-vue 获取dataset为字符串 , h5 获取 为 undefined 的问题,待框架修复
disabled = (typeof(disabled) === 'string' ? JSON.parse(disabled) : disabled) || false;
if (disabled) return
// 开始触摸时移除动画类
instance.requestAnimationFrame(function() {
instance.removeClass('ani');
ownerInstance.callMethod('closeSwipe');
})
// 记录上次的位置
state.x = state.left || 0
// 计算滑动开始位置
stopTouchStart(e, ownerInstance)
}
/**
* 开始滑动操作
* @param {Object} e
* @param {Object} ownerInstance
*/
function touchmove(e, ownerInstance) {
var instance = e.instance;
var disabled = instance.getDataset().disabled
var state = instance.getState()
// fix by mehaotian, TODO 兼容 app-vue 获取dataset为字符串 , h5 获取 为 undefined 的问题,待框架修复
disabled = (typeof(disabled) === 'string' ? JSON.parse(disabled) : disabled) || false;
if (disabled) return
// 是否可以滑动页面
stopTouchMove(e);
if (state.direction !== 'horizontal') {
return;
}
if (e.preventDefault) {
// 阻止页面滚动
e.preventDefault()
}
move(state.x + state.deltaX, instance, ownerInstance)
}
/**
* 结束触摸操作
* @param {Object} e
* @param {Object} ownerInstance
*/
function touchend(e, ownerInstance) {
var instance = e.instance;
var disabled = instance.getDataset().disabled
var state = instance.getState()
// fix by mehaotian, TODO 兼容 app-vue 获取dataset为字符串 , h5 获取 为 undefined 的问题,待框架修复
disabled = (typeof(disabled) === 'string' ? JSON.parse(disabled) : disabled) || false;
if (disabled) return
// 滑动过程中触摸结束,通过阙值判断是开启还是关闭
// fixed by mehaotian 定时器解决点击按钮，touchend 触发比 click 事件时机早的问题 ，主要是 ios13
moveDirection(state.left, instance, ownerInstance)
}
/**
* 设置移动距离
* @param {Object} value
* @param {Object} instance
* @param {Object} ownerInstance
*/
function move(value, instance, ownerInstance) {
value = value || 0
var state = instance.getState()
var leftWidth = state.leftWidth
var rightWidth = state.rightWidth
// 获取可滑动范围
state.left = range(value, -rightWidth, leftWidth);
instance.requestAnimationFrame(function() {
instance.setStyle({
transform: 'translateX(' + state.left + 'px)',
'-webkit-transform': 'translateX(' + state.left + 'px)'
})
})
}
/**
* 获取元素信息
* @param {Object} instance
* @param {Object} ownerInstance
*/
function getDom(instance, ownerInstance) {
var state = instance.getState()
var leftDom = ownerInstance.selectComponent('.button-group--left')
var rightDom = ownerInstance.selectComponent('.button-group--right')
var leftStyles = {
width: 0
}
var rightStyles = {
width: 0
}
leftStyles = leftDom.getBoundingClientRect()
rightStyles = rightDom.getBoundingClientRect()
state.leftWidth = leftStyles.width || 0
state.rightWidth = rightStyles.width || 0
state.threshold = instance.getDataset().threshold
}
/**
* 获取范围
* @param {Object} num
* @param {Object} min
* @param {Object} max
*/
function range(num, min, max) {
return Math.min(Math.max(num, min), max);
}
/**
* 移动方向判断
* @param {Object} left
* @param {Object} value
* @param {Object} ownerInstance
* @param {Object} ins
*/
function moveDirection(left, ins, ownerInstance) {
var state = ins.getState()
var threshold = state.threshold
var position = state.position
var isopen = state.isopen || 'none'
var leftWidth = state.leftWidth
var rightWidth = state.rightWidth
if (state.deltaX === 0) {
openState('none', ins, ownerInstance)
return
}
if ((isopen === 'none' && rightWidth > 0 && -left > threshold) || (isopen !== 'none' && rightWidth > 0 &&
rightWidth +
left < threshold)) {
// right
openState('right', ins, ownerInstance)
} else if ((isopen === 'none' && leftWidth > 0 && left > threshold) || (isopen !== 'none' && leftWidth > 0 &&
leftWidth - left < threshold)) {
// left
openState('left', ins, ownerInstance)
} else {
// default
openState('none', ins, ownerInstance)
}
}
/**
* 开启状态
* @param {Boolean} type
* @param {Object} ins
* @param {Object} ownerInstance
*/
function openState(type, ins, ownerInstance) {
var state = ins.getState()
var leftWidth = state.leftWidth
var rightWidth = state.rightWidth
var left = ''
state.isopen = state.isopen ? state.isopen : 'none'
switch (type) {
case "left":
left = leftWidth
break
case "right":
left = -rightWidth
break
default:
left = 0
}
// && !state.throttle
if (state.isopen !== type) {
state.throttle = true
ownerInstance.callMethod('change', {
open: type
})
}
state.isopen = type
// 添加动画类
ins.requestAnimationFrame(function() {
ins.addClass('ani');
move(left, ins, ownerInstance)
})
// 设置最终移动位置,理论上只要进入到这个函数，肯定是要打开的
}
function getDirection(x, y) {
if (x > y && x > MIN_DISTANCE) {
return 'horizontal';
}
if (y > x && y > MIN_DISTANCE) {
return 'vertical';
}
return '';
}
/**
* 重置滑动状态
* @param {Object} event
*/
function resetTouchStatus(instance) {
var state = instance.getState();
state.direction = '';
state.deltaX = 0;
state.deltaY = 0;
state.offsetX = 0;
state.offsetY = 0;
}
/**
* 设置滑动开始位置
* @param {Object} event
*/
function stopTouchStart(event) {
var instance = event.instance;
var state = instance.getState();
resetTouchStatus(instance);
var touch = event.touches[0];
if (IS_HTML5 && isPC()) {
touch = event;
}
state.startX = touch.clientX;
state.startY = touch.clientY;
}
/**
* 滑动中，是否禁止打开
* @param {Object} event
*/
function stopTouchMove(event) {
var instance = event.instance;
var state = instance.getState();
var touch = event.touches[0];
if (IS_HTML5 && isPC()) {
touch = event;
}
state.deltaX = touch.clientX - state.startX;
state.deltaY = touch.clientY - state.startY;
state.offsetY = Math.abs(state.deltaY);
state.offsetX = Math.abs(state.deltaX);
state.direction = state.direction || getDirection(state.offsetX, state.offsetY);
}
function isPC() {
var userAgentInfo = navigator.userAgent;
var Agents = ["Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod"];
var flag = true;
for (var v = 0; v < Agents.length - 1; v++) {
if (userAgentInfo.indexOf(Agents[v]) > 0) {
flag = false;
break;
}
}
return flag;
}
var movable = false
function mousedown(e, ins) {
if (!IS_HTML5) return
if (!isPC()) return
touchstart(e, ins)
movable = true
}
function mousemove(e, ins) {
if (!IS_HTML5) return
if (!isPC()) return
if (!movable) return
touchmove(e, ins)
}
function mouseup(e, ins) {
if (!IS_HTML5) return
if (!isPC()) return
touchend(e, ins)
movable = false
}
function mouseleave(e, ins) {
if (!IS_HTML5) return
if (!isPC()) return
movable = false
}
module.exports = {
showWatch: showWatch,
touchstart: touchstart,
touchmove: touchmove,
touchend: touchend,
mousedown: mousedown,
mousemove: mousemove,
mouseup: mouseup,
mouseleave: mouseleave
}
uni_modules/uni-swipe-action/components/uni-swipe-action/uni-swipe-action.vue 0 → 100644
<template>
<view>
<slot></slot>
</view>
</template>
<script>
/**
* SwipeAction 滑动操作
* @description 通过滑动触发选项的容器
* @tutorial https://ext.dcloud.net.cn/plugin?id=181
*/
export default {
name:"uniSwipeAction",
data() {
return {};
},
created() {
this.children = [];
},
methods: {
// 公开给用户使用，重制组件样式
resize(){
// wxs 会自己计算组件大小，所以无需执行下面代码
// #ifndef APP-VUE || H5 || MP-WEIXIN
this.children.forEach(vm=>{
vm.init()
})
// #endif
},
// 公开给用户使用，关闭全部 已经打开的组件
closeAll(){
this.children.forEach(vm=>{
// #ifdef APP-VUE || H5 || MP-WEIXIN
vm.is_show = 'none'
// #endif
// #ifndef APP-VUE || H5 || MP-WEIXIN
vm.close()
// #endif
})
},
closeOther(vm) {
if (this.openItem && this.openItem !== vm) {
// #ifdef APP-VUE || H5 || MP-WEIXIN
this.openItem.is_show = 'none'
// #endif
// #ifndef APP-VUE || H5 || MP-WEIXIN
this.openItem.close()
// #endif
}
// 记录上一个打开的 swipe-action-item ,用于 auto-close
this.openItem = vm
}
}
};
</script>
<style></style>
uni_modules/uni-swipe-action/package.json 0 → 100644
{
"id": "uni-swipe-action",
"displayName": "uni-swipe-action 滑动操作",
"version": "1.3.7",
"description": "SwipeAction 滑动操作操作组件",
"keywords": [
"",
"uni-ui",
"uniui",
"滑动删除",
"侧滑删除"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"category": [
"前端组件",
"通用组件"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
},
"uni_modules": {
"dependencies": ["uni-scss"],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "y",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}
uni_modules/uni-swipe-action/readme.md 0 → 100644
## SwipeAction 滑动操作
> **组件名：uni-swipe-action**
> 代码块： `uSwipeAction`、`uSwipeActionItem`
通过滑动触发选项的容器
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-swipe-action)
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839
\ No newline at end of file
util/api.js
const API_BASE = 'https://api.ichunt.com'; //const API_BASE = 'https://api.ichunt.com';
//const API_BASE = 'http://api.liexin.com'; const API_BASE = 'http://api.liexin.com';
const API = { const API = {
/** /**
* 上传数据 * 上传数据
......
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 sign in to comment