微信截图_20200115135429.png
xxx.wxml
<view style="padding-bottom: 230rpx;">
<scroll-view wx:key="item" wx:for="{{data}}" class="content0">
<view data-index='{{index}}' class="order-item" bindtouchstart="drawStart" bindtouchmove="drawMove" bindtouchend="drawEnd" style="right:{{item.right}}rpx">
<view class="content">
<view class="content1" bindtap="contentTap" data-url="../../my/New-invoice-information/New-invoice-information?id={{item.id}}">
<text>{{item.qiyename}}</text>
<text wx:if="{{item.type==1}}">个人</text>
<text wx:if="{{item.type==0}}">企业</text>
</view>
<view class="default" wx:if="{{item.isdefault==1}}">默认</view>
</view>
<view class="remove">
<view class="leftBtn" bindtap="setDefault" data-id="{{item.id}}">
设为默认
</view>
<view class="rightBtn" bindtap="del" data-id="{{item.id}}">
删除抬头
</view>
</view>
</view>
</scroll-view>
<view class="add">
<view bindtap="add" data-url="../../my/New-invoice-information/New-invoice-information">新增+</view>
</view>
</view>
xxx.wxss
.order-item {
width: 100%;
display: flex;
position: relative;
}
view, textarea, input, checkbox, radio, text, icon ,scroll-view{
box-sizing: border-box;
}
.content0{
width:100%;
padding:50rpx 0rpx 50rpx 47rpx;
background: #fff;
border-bottom: 1rpx solid #f5f5f5;
}
.content{
width:94%;
display: flex;
justify-content: space-between;
}
.content1{
width:80%;
}
.content1 text{
display: block;
width:100%;
}
.content1 text:nth-of-type(1){
font-size: 34rpx;
color:#323334 ;
font-weight: bold;
margin-bottom:10rpx;
}
.content1 text:nth-of-type(2){
font-size: 30rpx;
color:#797979 ;
}
.remove{
width: 210rpx;
background-color: red;
color: white;
position: absolute;
top: 0;
right: -256rpx;
display: flex;
justify-content: center;
align-items: center;
}
.remove>view{
width: 50%;
color: #fff;
font-size: 26rpx;
text-align: center;
}
.leftBtn{
width:50%;
background: #636161;
padding: 12rpx 18rpx;
}
.rightBtn{
width:50%;
background: #FF7B06;
padding: 12rpx 18rpx;
}
.default{
height: 42rpx;
line-height: 42rpx;
border: 1px solid #FF7B06;
padding: 0px 10rpx;
font-size: 24rpx;
color: #FF7B06;
margin-left: 20rpx;
}
page{
background: #F7F6F6;
}
.add{
position: fixed;
bottom: 100rpx;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
}
.add > view{
width: 600rpx;
height: 110rpx;
background: linear-gradient(149deg,rgba(237,165,72,1),rgba(234,131,40,1));
color: #fff;
display: flex;
align-items: center;
justify-content: center;
border-radius: 10px;
}
xxx.js
// pages/my/controlInvoices/controlInvoices.js
const app = getApp();
Page({
/**
* 页面的初始数据
*/
data: {
delBtnWidth: 256,
data: [],
isScroll: true,
windowHeight: 0,
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
var that = this;
// 用户id
this.Setdata("userId", app.globalData.userId);
// 获取 高度
wx.getSystemInfo({
success: function (res) {
that.setData({
windowHeight: res.windowHeight
});
}
});
},
/**
* 监听页面 数据
*/
onShow() {
this.taitouList();
},
/**
* 获取抬头 数据
*/
taitouList() {
let data = {
zid: this.data.userId
};
app.globalData.request.post(data, url).then(res => {
// console.log(res);
if (res.data.code == 0) {
if (res.data.data.length != 0) {
this.Setdata("data", res.data.data)
} else {
this.Setdata("data", []);
}
}
}, err => {
console.log(err)
});
},
/**
* 手指触摸动作开始
*/
drawStart: function (e) {
var touch = e.touches[0];
for (var index in this.data.data) {
var item = this.data.data[index]
item.right = 0
}
this.Setdata("data", this.data.data);
this.Setdata("startX", touch.clientX);
},
/**
* 手指触摸后移动
*/
drawMove: function (e) {
var touch = e.touches[0]
var item = this.data.data[e.currentTarget.dataset.index]
var disX = this.data.startX - touch.clientX
if (disX >= 20) {
if (disX > this.data.delBtnWidth) {
disX = this.data.delBtnWidth
}
item.right = disX;
this.Setdata("isScroll", false);
this.Setdata("data", this.data.data);
} else {
item.right = 0;
this.Setdata("isScroll", true);
this.Setdata("data", this.data.data);
}
},
/**
* 手指触摸动作结束
*/
drawEnd: function (e) {
var item = this.data.data[e.currentTarget.dataset.index]
if (item.right >= this.data.delBtnWidth / 2) {
item.right = this.data.delBtnWidth;
this.Setdata("isScroll", true);
this.Setdata("data", this.data.data);
} else {
item.right = 0;
this.Setdata("isScroll", true);
this.Setdata("data", this.data.data);
}
},
/**
* 设为默认
*/
setDefault(e) {
var that=this;
wx.showModal({
title: '提示',
content: '确认要设置为默认吗？',
success: (res) => {
if (res.confirm) {
let data = {
taiid: e.currentTarget.dataset.id
};
app.globalData.request.post(data, url).then(res => {
// console.log(res);
if (res.data.code == 0) {
that.ToastShow("设置成功")
that.taitouList();
}
}, err => {
console.log(err)
});
}
}
})
},
/**
* 删除
*/
del(e) {
var that=this;
wx.showModal({
title: '提示',
content: '确认要删除吗？',
success: (res) => {
if (res.confirm) {
let data = {
tid: e.currentTarget.dataset.id
};
app.globalData.request.post(data, url).then(res => {
// console.log(res);
if (res.data.code == 0) {
that.ToastShow("删除成功")
that.taitouList();
}
}, err => {
console.log(err)
});
}
}
})
},
/**
* 每当输入 或 选择值的时候 进行的 赋值
*/
Setdata: function (data, value) {
this.setData({
[data]: value,
});
},
/**
* navigateTo 跳页
* url => 路劲
*/
navigateTo: function (url) {
wx.navigateTo({
url: url,
});
},
/**
* 小黑窗 toast
*/
ToastShow: function (msg) {
wx.showToast({
title: msg,
icon: 'none',
duration: 2000
});
}
})
网友评论