<view class='dialogue-box'>
? ? ? <scroll-view scroll-y="true" style="height:{{winHeight-50}}px">
? ? ? ? <view class='top-list'>
? ? ? ? ? <view class='standard_text1'>#</view>
? ? ? ? ? <view class='standard_text2'>積分項目</view>
? ? ? ? ? <view class='standard_text3'>標準分</view>
? ? ? ? ? <view class='standard_text4' bindtap='AddIntegrationProject'>
? ? ? ? ? ? <view class='standard_btn'>+</view>
? ? ? ? ? </view>
? ? ? ? </view>
? ? ? ? <view wx:if="{{lists.length>0}}">
? ? ? ? ? <view class='top-list'>
? ? ? ? ? ? <view wx:for="{{lists}}" wx:key="{{index}}" class='main_item'>
? ? ? ? ? ? ? <view bindtouchstart="touchS" bindtouchmove="touchM" bindtouchend="touchE" data-index='{{index}}' style="{{item.txtStyle}}" class="inner txt">
? ? ? ? ? ? ? ? <view class='standard_text1'>{{index+1}}</view>
? ? ? ? ? ? ? ? <view class='standard_text2'>{{item.itemName}}</view>
? ? ? ? ? ? ? ? <view class='standard_text3'>{{item.score}}分</view>
? ? ? ? ? ? ? ? <view class='standard_text4'>
? ? ? ? ? ? ? ? ? <image class='standard_icon' bindtap='editStanderClick' data-item='{{item}}' src='{{BaseURL}}uploadFile/groupImages/edit-h2.png'></image>
? ? ? ? ? ? ? ? </view>
? ? ? ? ? ? ? </view>
? ? ? ? ? ? ? <view data-index="{{index}}" bindtap='delectOrganizationTeamScoreStandard' data-id='{{item.ID}}' class="inner del">刪除</view>
? ? ? ? ? ? </view>
? ? ? ? ? </view>
? ? ? ? </view>
? ? ? ? <view class='No-data' wx:else>
? ? ? ? ? <image src='{{BaseURL}}uploadFile/groupImages/No-data.png'></image>
? ? ? ? ? <view class='No-text'>親！暫無您的上月積分記錄！</view>
? ? ? ? </view>
? ? ? </scroll-view>
</view>

2.樣式

/* 標準s */
?
.standard_text1 {
? height: 80rpx;
? line-height: 80rpx;
? float: left;
? width: 60rpx;
? font-size: 28rpx;
? color: #3b3c42;
? padding-left: 30rpx;
}
?
.standard_text2 {
? line-height: 80rpx;
? float: left;
? width: 380rpx;
? font-size: 28rpx;
? color: #3b3c42;
}
?
.standard_text3 {
? height: 80rpx;
? line-height: 80rpx;
? float: left;
? width: 130rpx;
? font-size: 28rpx;
? color: #3b3c42;
}
?
.standard_text4 {
? height: 80rpx;
? line-height: 80rpx;
? float: left;
? width: 140rpx;
? font-size: 28rpx;
? color: #3b3c42;
}
?
.standard_btn {
? height: 50rpx;
? line-height: 50rpx;
? float: left;
? border: 1px solid #3891f8;
? color: #3891f8;
? width: 50rpx;
? text-align: center;
? font-size: 36rpx;
? border-radius: 60px;
? margin-top: 10rpx;
? ?margin-left: 60rpx;
}
?
.standard_icon {
? height: 60rpx;
? width: 60rpx;
? margin-top: 8rpx;
? float: left;
? margin-left: 55rpx;
}
?
/* 側滑刪除s */
.main_item {
? float: left;
? width: 100%;
? background-color: #fff;
? position: relative;
? overflow: hidden;
? height: 40px;
? line-height: 40px;
}
.inner {
? position: absolute;
? top: 0;
? width: 100%;
? line-height: 80rpx;
? height: 80rpx;
? float: left;
}
?
.inner.txt {
? background-color: #fff;
? width: 100%;
? z-index: 5;
? transition: left 0.2s ease-in-out;
? white-space: nowrap;
? overflow: hidden;
? text-overflow: ellipsis;
}
?
.inner.del {
? background-color: #e64340;
? width: 150rpx;
? text-align: center;
? z-index: 4;
? right: 0;
? color: #fff;
}
?
/* 側滑刪除e */

3.js

var app = getApp();
Page({
?
? /**
? ?* 頁面的初始數據
? ?*/
? data: {
? ? currentTab: 0,
? ? BaseURL: app.globalData.BaseURL, //圖片后臺
? ? mDate: '',
?
? ? delBtnWidth: 180 //刪除按鈕寬度單位（rpx）
? },
?
? /**
? ?* 生命周期函數--監(jiān)聽頁面加載
? ?*/
? onLoad: function(options) {
? ? var that = this;
? ? that.getOrganizationTeamScore(); //獲取標準積分
? ? // 獲取系統(tǒng)寬高信息?
? ? wx.getSystemInfo({
? ? ? success: function(res) {
? ? ? ? that.setData({
? ? ? ? ? winWidth: res.windowWidth,
? ? ? ? ? winHeight: res.windowHeight
? ? ? ? });
? ? ? }
? ? });
? ? that.initEleWidth(); //側滑刪除S
? },
?
? /*****************側滑刪除S*******************/
? touchS: function(e) {
? ? if (e.touches.length == 1) {
? ? ? this.setData({
? ? ? ? //設置觸摸起始點水平方向位置
? ? ? ? startX: e.touches[0].clientX
? ? ? });
? ? }
? },
? touchM: function(e) {
? ? if (e.touches.length == 1) {
? ? ? //手指移動時水平方向位置
? ? ? var moveX = e.touches[0].clientX;
? ? ? //手指起始點位置與移動期間的差值
? ? ? var disX = this.data.startX - moveX;
? ? ? var delBtnWidth = this.data.delBtnWidth;
? ? ? var txtStyle = "";
? ? ? if (disX == 0 || disX < 0) { //如果移動距離小于等于0，文本層位置不變
? ? ? ? txtStyle = "left:0px";
? ? ? } else if (disX > 0) { //移動距離大于0，文本層left值等于手指移動距離
? ? ? ? txtStyle = "left:-" + disX + "px";
? ? ? ? if (disX >= delBtnWidth) {
? ? ? ? ? //控制手指移動距離最大值為刪除按鈕的寬度
? ? ? ? ? txtStyle = "left:-" + delBtnWidth + "px";
? ? ? ? }
? ? ? }
? ? ? //獲取手指觸摸的是哪一項
? ? ? var index = e.currentTarget.dataset.index
? ? ? // var index = e.target.dataset.index;
? ? ? var lists = this.data.lists;
? ? ? lists[index].txtStyle = txtStyle;
? ? ? //更新列表的狀態(tài)
? ? ? this.setData({
? ? ? ? lists: lists
? ? ? });
? ? }
? },
?
? touchE: function(e) {
? ? if (e.changedTouches.length == 1) {
? ? ? //手指移動結束后水平位置
? ? ? var endX = e.changedTouches[0].clientX;
? ? ? //觸摸開始與結束，手指移動的距離
? ? ? var disX = this.data.startX - endX;
? ? ? var delBtnWidth = this.data.delBtnWidth;
? ? ? //如果距離小于刪除按鈕的1/2，不顯示刪除按鈕
? ? ? var txtStyle = disX > delBtnWidth / 2 ? "left:-" + delBtnWidth + "px" : "left:0px";
? ? ? //獲取手指觸摸的是哪一項
? ? ? var index = e.currentTarget.dataset.index
? ? ? // var index = e.target.dataset.index;
? ? ? var lists = this.data.lists;
? ? ? lists[index].txtStyle = txtStyle;
? ? ? //更新列表的狀態(tài)
? ? ? this.setData({
? ? ? ? lists: lists
? ? ? });
? ? }
? },
?
? //獲取元素自適應后的實際寬度
? getEleWidth: function(w) {
? ? var real = 0;
? ? try {
? ? ? var res = wx.getSystemInfoSync().windowWidth;
? ? ? var scale = (750 / 2) / (w / 2); //以寬度750px設計稿做寬度的自適應
? ? ? // console.log(scale);
? ? ? real = Math.floor(res / scale);
? ? ? return real;
? ? } catch (e) {
? ? ? return false;
? ? ? // Do something when catch error
? ? }
? },
?
? initEleWidth: function() {
? ? var delBtnWidth = this.getEleWidth(this.data.delBtnWidth);
? ? this.setData({
? ? ? delBtnWidth: delBtnWidth
? ? });
? },
?
? //點擊刪除按鈕事件
? delItem: function(e) {
? ? //獲取列表中要刪除項的下標
? ? var index = e.currentTarget.dataset.index
? ? // var index = e.target.dataset.index;
? ? var lists = this.data.lists;
? ? //移除列表中下標為index的項
? ? lists.splice(index, 1);
? ? //更新列表的狀態(tài)
? ? this.setData({
? ? ? lists: lists
? ? });
? },
? /*****************側滑刪除e*******************/
?
? /************************標準制定s***************/
? /**獲取積分標準 */
? getOrganizationTeamScore: function() {
? ? var that = this;
? ? wx.request({
? ? ? header: {
? ? ? ? "Content-Type": "application/x-www-form-urlencoded"
? ? ? },
? ? ? method: 'POST',
? ? ? url: app.globalData.BaseURL + 'group/v1/getOrganizationTeamScore.html',
? ? ? data: {
? ? ? ? organizationTeamID: that.data.organizationTeamID,
? ? ? },
? ? ? success: function(res) {
? ? ? ? wx.hideLoading();
? ? ? ? console.log("獲取積分標準", res.data)
? ? ? ? var status = res.data.status;
? ? ? ? var info = res.data.info
? ? ? ? if (status.indexOf("SUCCESS") == 0) {
? ? ? ? ? that.setData({
? ? ? ? ? ? lists: info
? ? ? ? ? })
? ? ? ? } else {
? ? ? ? ? wx.showToast({
? ? ? ? ? ? title: '獲取失敗',
? ? ? ? ? ? icon: 'none'
? ? ? ? ? })
? ? ? ? }
? ? ? }
? ? })
? },
?
? /**刪除標準 */
? delectOrganizationTeamScoreStandard: function(e) {
? ? var organizationTeamScoreStandardID = e.currentTarget.dataset.id;
? ? var that = this;
? ? wx.showModal({
? ? ? title: '刪除此條標準記錄',
? ? ? content: '是否刪除？',
? ? ? success: function(res) {
? ? ? ? if (res.confirm) {
? ? ? ? ? console.log('用戶點擊確定')
? ? ? ? ? wx.request({
? ? ? ? ? ? header: {
? ? ? ? ? ? ? "Content-Type": "application/x-www-form-urlencoded"
? ? ? ? ? ? },
? ? ? ? ? ? method: 'POST',
? ? ? ? ? ? url: app.globalData.BaseURL + 'group/v1/delectOrganizationTeamScoreStandard.do',
? ? ? ? ? ? data: {
? ? ? ? ? ? ? organizationTeamScoreStandardID: organizationTeamScoreStandardID,
? ? ? ? ? ? },
? ? ? ? ? ? success: function(res) {
? ? ? ? ? ? ? var status = res.data.status;
? ? ? ? ? ? ? var info = res.data.info
? ? ? ? ? ? ? if (status.indexOf("SUCCESS") == 0) {
? ? ? ? ? ? ? ? wx.showToast({
? ? ? ? ? ? ? ? ? title: '操作成功',
? ? ? ? ? ? ? ? ? icon: 'none'
? ? ? ? ? ? ? ? })
? ? ? ? ? ? ? ? that.getOrganizationTeamScore();
? ? ? ? ? ? ? } else {
? ? ? ? ? ? ? ? wx.showToast({
? ? ? ? ? ? ? ? ? title: '數據使用中，無法刪除！',
? ? ? ? ? ? ? ? ? icon: 'none'
? ? ? ? ? ? ? ? })
? ? ? ? ? ? ? }
? ? ? ? ? ? }
? ? ? ? ? })
? ? ? ? } else if (res.cancel) {
? ? ? ? ? console.log('用戶點擊取消')
? ? ? ? }
? ? ? }
? ? })
? },
?
? /**修改標準 */
? editStanderClick: function(e) {
? ? var item = e.currentTarget.dataset.item;
? ? wx.navigateTo({
? ? ? url: '/pages/My/Groupmanagement/Leanapproach/Employeeperformance/IntegralStandard/AddIntegrationProject/AddIntegrationProject?organizationTeamID=' + this.data.organizationTeamID +
? ? ? ? '&organizationTeamScoreStandardID=' + item.ID +
? ? ? ? '&scoreStanderFixID=' + item.scoreStanderFixID +
? ? ? ? '&itemName=' + item.itemName +
? ? ? ? '&score=' + item.score +
? ? ? ? '&unit=' + item.unit +
? ? ? ? '&isEdit=1',
? ? })
? },
?
? // 添加積分項目
? AddIntegrationProject: function() {
? ? wx.navigateTo({
? ? ? url: '/pages/My/Groupmanagement/Leanapproach/Employeeperformance/IntegralStandard/AddIntegrationProject/AddIntegrationProject?organizationTeamID=' + this.data.organizationTeamID,
? ? ? success: function(res) {},
? ? ? fail: function(res) {},
? ? ? complete: function(res) {},
? ? })
? },
? /************************標準制定e***************/
? /**
? ?* 生命周期函數--監(jiān)聽頁面初次渲染完成
? ?*/
? onReady: function() {
?
? },
?
? /**
? ?* 生命周期函數--監(jiān)聽頁面顯示
? ?*/
? onShow: function() {
? ? var that = this;
? ? that.getOrganizationTeamScore(); //標準制定
? },
?
? /**
? ?* 生命周期函數--監(jiān)聽頁面隱藏
? ?*/
? onHide: function() {
?
? },
?
? /**
? ?* 生命周期函數--監(jiān)聽頁面卸載
? ?*/
? onUnload: function() {
?
? },
?
? /**
? ?* 頁面相關事件處理函數--監(jiān)聽用戶下拉動作
? ?*/
? onPullDownRefresh: function() {
?
? },
?
? /**
? ?* 頁面上拉觸底事件的處理函數
? ?*/
? onReachBottom: function() {
?
? },
?
? /**
? ?* 用戶點擊右上角分享
? ?*/
? onShareAppMessage: function() {
?
? }
})

4.效果圖