1、完善常用菜单功能

app.json

@@ -327,7 +327,8 @@
         "dk-drag-item": "components/dkbase/dk-drag-item/dk-drag-item",
         "dk-drag-to-sort": "components/dkbase/dk-drag-to-sort/dk-drag-to-sort",
         "dk-multi-owner": "components/dkbase/dk-multi-owner/dk-multi-owner",
-        "dk-collapse-item-more": "components/dkbase/dk-collapse-item-more/dk-collapse-item-more"
+        "dk-collapse-item-more": "components/dkbase/dk-collapse-item-more/dk-collapse-item-more",
+        "dk-drag":"components/dkbase/dk-drag/index"
     },
     "tabBar": {
         "color": "#95A8CB",

components/dkbase/dk-drag/index.js

@@ -0,0 +1,231 @@
+/**
+ * 版本号比较
+ */
+const compareVersion = (v1, v2) => {
+	v1 = v1.split('.')
+	v2 = v2.split('.')
+	const len = Math.max(v1.length, v2.length)
+
+	while (v1.length < len) {
+		v1.push('0')
+	}
+	while (v2.length < len) {
+		v2.push('0')
+	}
+
+	for (let i = 0; i < len; i++) {
+		const num1 = parseInt(v1[i])
+		const num2 = parseInt(v2[i])
+
+		if (num1 > num2) {
+			return 1
+		} else if (num1 < num2) {
+			return -1
+		}
+	}
+
+	return 0
+}
+
+Component({
+	externalClasses: ['item-wrap-class'],
+	options: {
+		multipleSlots: true
+	},
+	properties: {
+		imageCol: {				// 图片名称
+			type: String,
+			value: 'images'
+		},
+		titleCol: {				// 标题名称
+			type: String,
+			value: 'title'
+		},
+		editFlag:{				// 是否是编辑模式
+			type:Boolean,
+			value:false,
+		},
+		extraNodes: {            // 额外节点
+			type: Array,
+			value: []
+		},
+		listData: {              // 数据源
+			type: Array,
+			value: []
+		},
+		columns: {               // 列数
+			type: Number,
+			value: 1
+		},
+		topSize: {               // 顶部固定高度
+			type: Number,
+			value: 0
+		},
+		bottomSize: {            // 底部固定高度
+			type: Number,
+			value: 0
+		},
+		itemHeight: {            // 每个 item 高度, 用于计算 item-wrap 高度
+			type: Number,
+			value: 0
+		},
+		scrollTop: {             // 页面滚动高度
+			type: Number,
+			value: 0
+		},
+	},
+	data: {
+		/* 未渲染数据 */
+		baseData: {},
+		pageMetaSupport: false,                                 // 当前版本是否支持 page-meta 标签
+		platform: '',                                           // 平台信息
+		listWxs: [],                                            // wxs 传回的最新 list 数据
+		rows: 0,                                                // 行数
+
+		/* 渲染数据 */
+		wrapStyle: '',                                          // item-wrap 样式
+		list: [],                                               // 渲染数据列
+		dragging: false,
+	},
+	methods: {
+		vibrate() {
+			if (this.data.platform !== "devtools") wx.vibrateShort();
+		},
+		pageScroll(e) {
+			if (this.data.pageMetaSupport) {
+				this.triggerEvent("scroll", {
+					scrollTop: e.scrollTop
+				});
+			} else {
+				wx.pageScrollTo({
+					scrollTop: e.scrollTop,
+					duration: 300
+				});
+			}
+		},
+		drag(e) {
+			this.setData({
+				dragging: e.dragging
+			})
+		},
+		listChange(e) {
+			this.data.listWxs = e.list;
+		},
+		itemClick(e) {
+			let index = e.currentTarget.dataset.index;
+			let item = this.data.listWxs[index];
+
+			this.triggerEvent('click', {
+				key: item.realKey,
+				data: item.data,
+				extra: e.detail
+			});
+		},
+		/**
+		 *  初始化获取 dom 信息
+		 */
+		initDom() {
+			let {windowWidth, windowHeight, platform, SDKVersion} = wx.getSystemInfoSync();
+			let remScale = (windowWidth || 375) / 375;
+
+			this.data.pageMetaSupport = compareVersion(SDKVersion, '2.9.0') >= 0;
+			this.data.platform = platform;
+
+			let baseData = {};
+			baseData.windowHeight = windowHeight;
+			baseData.realTopSize = this.data.topSize * remScale / 2;
+			baseData.realBottomSize = this.data.bottomSize * remScale / 2;
+			baseData.columns = this.data.columns;
+			baseData.rows =  this.data.rows;
+
+			const query = this.createSelectorQuery();
+			query.select(".item").boundingClientRect();
+			query.select(".item-wrap").boundingClientRect();
+			query.exec((res) => {
+				baseData.itemWidth = res[0].width;
+				baseData.itemHeight = res[0].height;
+				baseData.wrapLeft = res[1].left;
+				baseData.wrapTop = res[1].top + this.data.scrollTop;
+				this.setData({
+					dragging: false,
+					baseData
+				});
+			});
+		},
+		/**
+		 * column 改变时候需要清空 list, 以防页面溢出
+		 */
+		columnChange() {
+			this.setData({
+				list: []
+			})
+			this.init();
+		},
+		/**
+		 *  初始化函数
+		 *  {listData, topSize, bottomSize, itemHeight} 参数改变需要手动调用初始化方法
+		 */
+		init() {
+			// 初始必须为true以绑定wxs中的函数,
+			this.setData({dragging: true});
+
+			let delItem = (item, extraNode) => ({
+				id: item.dragId,
+				extraNode: extraNode,
+				fixed: item.fixed,
+				slot: item.slot,
+				data: item
+			});
+
+			let {listData, extraNodes} = this.data;
+			let _list = [], _before = [], _after = [], destBefore = [], destAfter = [];
+
+			extraNodes.forEach((item, index) => {
+				if (item.type === "before") {
+					_before.push(delItem(item, true));
+				} else if (item.type === "after") {
+					_after.push(delItem(item, true));
+				} else if (item.type === "destBefore") {
+					destBefore.push(delItem(item, true));
+				} else if (item.type === "destAfter") {
+					destAfter.push(delItem(item, true));
+				}
+			});
+
+			// 遍历数据源增加扩展项, 以用作排序使用
+			listData.forEach((item, index) => {
+				destBefore.forEach((i) => {
+					if (i.data.destKey === index) _list.push(i);
+				});
+				_list.push(delItem(item, false));
+				destAfter.forEach((i) => {
+					if (i.data.destKey === index) _list.push(i);
+				});
+			});
+
+			let i = 0, columns = this.data.columns;
+			let list = (_before.concat(_list, _after) || []).map((item, index) => {
+				item.realKey = item.extraNode ? -1 : i++; // 真实顺序
+				item.sortKey = index; // 整体顺序
+				item.tranX = `${(item.sortKey % columns) * 100}%`;
+				item.tranY = `${Math.floor(item.sortKey / columns) * 100}%`;
+				return item;
+			});
+
+			this.data.rows = Math.ceil(list.length / columns);
+
+			this.setData({
+				list,
+				listWxs: list,
+				wrapStyle: `height: ${this.data.rows * this.data.itemHeight}rpx`
+			});
+			if (list.length === 0) return;
+
+			// 异步加载数据时候, 延迟执行 initDom 方法, 防止基础库 2.7.1 版本及以下无法正确获取 dom 信息
+			setTimeout(() => this.initDom(), 0);
+		}
+	},
+	ready() {
+		this.init();
+	}
+});

components/dkbase/dk-drag/index.json

@@ -0,0 +1,6 @@
+{
+	"usingComponents": {
+		"drag-item": "./item/index"
+	},
+	"component": true
+}

components/dkbase/dk-drag/index.scss

@@ -0,0 +1,20 @@
+// @import "../../assets/css/variables";
+
+.item-wrap {
+	position: relative;
+	.item {
+		position: absolute;
+		z-index: 1;
+		top: 0;
+		left: 0;
+		&.tran {
+			transition: transform 0.3s !important;
+		}
+		&.cur {
+			z-index: 2;
+		}
+		&.fixed {
+			z-index: 0 !important;
+		}
+	}
+}

components/dkbase/dk-drag/index.wxml

@@ -0,0 +1,28 @@
+<wxs module="handler" src="./index.wxs"></wxs>
+
+<view class="item-wrap item-wrap-class"
+			list="{{list}}"
+			style="{{wrapStyle}}"
+			baseData="{{baseData}}"
+			change:list="{{handler.listObserver}}"
+			change:baseData="{{handler.baseDataObserver}}">
+
+	<view
+		class="item"
+		wx:for="{{list}}"
+		wx:key="id"
+		data-index="{{index}}"
+		style="width: {{100/columns}}%"
+		bind:longpress="{{handler.longPress}}"
+		catch:touchmove="{{dragging ? handler.touchMove : ''}}"
+		catch:touchend="{{dragging ? handler.touchEnd : ''}}">
+
+		<block wx:if="{{item.extraNode}}">
+			<slot name="{{item.slot}}"></slot>
+		</block>
+		<block wx:else>
+			<drag-item editFlag="{{editFlag}}" data-index="{{index}}" imageCol="{{imageCol}}" titleCol="{{titleCol}}" columns="{{columns}}" item-data="{{item.data}}" bind:click="itemClick"/>
+		</block>
+
+	</view>
+</view>

components/dkbase/dk-drag/index.wxs

@@ -0,0 +1,223 @@
+var isOutRange = function (x1, y1, x2, y2, x3, y3) {
+	return x1 < 0 || x1 >= y1 || x2 < 0 || x2 >= y2 || x3 < 0 || x3 >= y3
+};
+
+var sortCore = function (sKey, eKey, st) {
+	var _ = st.baseData;
+
+	var excludeFix = function (cKey, type) {
+		if (st.list[cKey].fixed) { // fixed 元素位置不会变化, 这里直接用 cKey(sortKey) 获取, 更加快捷
+			type ? --cKey : ++cKey;
+			return excludeFix(cKey, type);
+		}
+		return cKey;
+	}
+
+	// 先获取到 endKey 对应的 realKey, 防止下面排序过程中该 realKey 被修改
+	var endRealKey = -1;
+	st.list.forEach(function (item) {
+		if(item.sortKey === eKey) endRealKey = item.realKey;
+	});
+
+	return st.list.map(function (item) {
+		if (item.fixed) return item;
+		var cKey = item.sortKey;
+		var rKey = item.realKey;
+
+		if (sKey < eKey) {
+			// 正序拖动
+			if (cKey > sKey && cKey <= eKey) {
+				--rKey;
+				cKey = excludeFix(--cKey, true);
+			} else if (cKey === sKey) {
+				rKey = endRealKey;
+				cKey = eKey;
+			}
+		} else if (sKey > eKey) {
+			// 倒序拖动
+			if (cKey >= eKey && cKey < sKey) {
+				++rKey
+				cKey = excludeFix(++cKey, false);
+			} else if (cKey === sKey) {
+				rKey = endRealKey;
+				cKey = eKey;
+			}
+		}
+
+		if (item.sortKey !== cKey) {
+			item.tranX = (cKey % _.columns) * 100 + "%";
+			item.tranY = Math.floor(cKey / _.columns) * 100 + "%";
+			item.sortKey = cKey;
+			item.realKey = rKey;
+		}
+		return item;
+	});
+}
+
+var triggerCustomEvent = function(list, type, ins) {
+	var _list = [], listData = [];
+
+	list.forEach(function (item) {
+		_list[item.sortKey] = item;
+	});
+
+	_list.forEach(function (item) {
+		if (!item.extraNode) {
+			listData.push(item.data);
+		}
+	});
+
+	ins.triggerEvent(type, {listData: listData});
+}
+
+var longPress = function (event, ownerInstance) {
+	var ins = event.instance;
+	var st = ownerInstance.getState();
+	var _ = st.baseData;
+
+	var sTouch = event.changedTouches[0];
+	if (!sTouch) return;
+
+	st.cur = ins.getDataset().index;
+
+	// 初始项是固定项则返回
+	var item = st.list[st.cur];
+	if (item && item.fixed) return;
+
+	// 如果已经在 drag 中则返回, 防止多指触发 drag 动作, touchstart 事件中有效果
+	if (st.dragging) return;
+	st.dragging = true;
+	ownerInstance.callMethod("drag", {dragging: true});
+
+	// 计算X,Y轴初始位移, 使 item 中心移动到点击处, 单列时候X轴初始不做位移
+	st.tranX = _.columns === 1 ? 0 : sTouch.pageX - (_.itemWidth / 2 + _.wrapLeft);
+	st.tranY = sTouch.pageY - (_.itemHeight / 2 + _.wrapTop);
+	st.sId = sTouch.identifier;
+
+	ins.setStyle({
+		'transform': 'translate3d(' + st.tranX + 'px, ' + st.tranY + 'px, 0)'
+	});
+
+	st.itemsInstance.forEach(function (item, index) {
+		item.removeClass("tran").removeClass("cur");
+		item.addClass(index === st.cur ? "cur" : "tran");
+	})
+
+	ownerInstance.callMethod("vibrate");
+};
+
+var touchMove = function (event, ownerInstance) {
+	var ins = event.instance;
+	var st = ownerInstance.getState();
+	var _ = st.baseData;
+
+	var mTouch = event.changedTouches[0];
+	if (!mTouch) return;
+
+	if (!st.dragging) return;
+
+	// 如果不是同一个触发点则返回
+	if (st.sId !== mTouch.identifier) return;
+
+	// 计算X,Y轴位移, 单列时候X轴初始不做位移
+	var tranX = _.columns === 1 ? 0 : mTouch.pageX - (_.itemWidth / 2 + _.wrapLeft);
+	var tranY = mTouch.pageY - (_.itemHeight / 2 + _.wrapTop);
+
+	// 到顶到底自动滑动
+	if (mTouch.clientY > _.windowHeight - _.itemHeight - _.realBottomSize) {
+		// 当前触摸点pageY + item高度 - (屏幕高度 - 底部固定区域高度)
+		ownerInstance.callMethod("pageScroll", {
+			scrollTop: mTouch.pageY + _.itemHeight - (_.windowHeight - _.realBottomSize)
+		});
+	} else if (mTouch.clientY < _.itemHeight + _.realTopSize) {
+		// 当前触摸点pageY - item高度 - 顶部固定区域高度
+		ownerInstance.callMethod("pageScroll", {
+			scrollTop: mTouch.pageY - _.itemHeight - _.realTopSize
+		});
+	}
+
+	// 设置当前激活元素偏移量
+	ins.setStyle({
+		'transform': 'translate3d(' + tranX + 'px, ' + tranY + 'px, 0)'
+	})
+
+	var startKey = st.list[st.cur].sortKey;
+	var curX = Math.round(tranX / _.itemWidth);
+	var curY = Math.round(tranY / _.itemHeight);
+	var endKey = curX + _.columns * curY;
+
+	// 目标项是固定项则返回
+	var item = st.list[endKey];
+	if (item && item.fixed) return;
+
+	// X轴或Y轴超出范围则返回
+	if (isOutRange(curX, _.columns, curY, _.rows, endKey, st.list.length)) return;
+
+	// 防止拖拽过程中发生乱序问题
+	if (startKey === endKey || startKey === st.preStartKey) return;
+	st.preStartKey = startKey;
+
+	var list = sortCore(startKey, endKey, st);
+	st.itemsInstance.forEach(function (itemIns, index) {
+		var item = list[index];
+		if (index !== st.cur) {
+			itemIns.setStyle({
+				'transform': 'translate3d(' + item.tranX + ',' + item.tranY + ', 0)'
+			});
+		}
+	});
+
+	ownerInstance.callMethod("vibrate");
+	ownerInstance.callMethod("listChange", {list: list});
+	triggerCustomEvent(list, "change", ownerInstance);
+}
+
+var touchEnd = function (event, ownerInstance) {
+	var ins = event.instance;
+	var st = ownerInstance.getState();
+
+	if (!st.dragging) return;
+	triggerCustomEvent(st.list, "sortend", ownerInstance);
+
+	ins.addClass("tran");
+	ins.setStyle({
+		'transform': 'translate3d(' + st.list[st.cur].tranX + ',' + st.list[st.cur].tranY + ', 0)'
+	});
+
+	st.preStartKey = -1;
+	st.dragging = false;
+	ownerInstance.callMethod("drag", {dragging: false});
+	st.cur = -1;
+	st.tranX = 0;
+	st.tranY = 0;
+}
+
+var baseDataObserver = function (newVal, oldVal, ownerInstance, ins) {
+	var st = ownerInstance.getState();
+	st.baseData = newVal;
+}
+
+var listObserver = function (newVal, oldVal, ownerInstance, ins) {
+	var st = ownerInstance.getState();
+	st.itemsInstance = ownerInstance.selectAllComponents('.item');
+
+	st.list = newVal || [];
+
+	st.list.forEach(function (item, index) {
+		var itemIns = st.itemsInstance[index];
+		if (item && itemIns) {
+			itemIns.setStyle({
+				'transform': 'translate3d(' + item.tranX + ',' + item.tranY + ', 0)'
+			});
+			if (item.fixed) itemIns.addClass("fixed");
+		}
+	})
+}
+
+module.exports = {
+	longPress: longPress,
+	touchMove: touchMove,
+	touchEnd: touchEnd,
+	baseDataObserver: baseDataObserver,
+	listObserver: listObserver
+}

components/dkbase/dk-drag/index.wxss

@@ -0,0 +1,13 @@
+.item-wrap {
+  position: relative; }
+  .item-wrap .item {
+    position: absolute;
+    z-index: 1;
+    top: 0;
+    left: 0; }
+    .item-wrap .item.tran {
+      transition: transform 0.3s !important; }
+    .item-wrap .item.cur {
+      z-index: 2; }
+    .item-wrap .item.fixed {
+      z-index: 0 !important; }

components/dkbase/dk-drag/item/index.js

@@ -0,0 +1,33 @@
+Component({
+	properties: {
+		imageCol: {
+			type: String,
+			value: 'images'
+		},
+		titleCol: {
+			type: String,
+			value: 'title'
+		},
+		editFlag:{				// 是否是编辑模式
+			type:Boolean,
+			value:false,
+		},
+		columns: {
+			type: Number,
+			value: 1
+		},
+		itemData: {
+			type: Object,
+			value: {}
+		}
+	},
+	methods: {
+		itemClick(e) {
+			this.triggerEvent('click', {
+				test: "这是一个来自 drag-item 的测试信息"
+			});
+		}
+	},
+	ready() {
+	}
+})

components/dkbase/dk-drag/item/index.json

@@ -0,0 +1,3 @@
+{
+	"component": true
+}

components/dkbase/dk-drag/item/index.scss

@@ -0,0 +1,51 @@
+@import "../../../assets/css/variables";
+
+.info {
+	position: relative;
+	padding-top: 100%;
+	background: #ffffff;
+	box-sizing: border-box;
+	&__item {
+		position: absolute;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 100%;
+		overflow: hidden;
+		padding: 10rpx;
+		box-sizing: border-box;
+		.image {
+			width: 100%;
+			height: 100%;
+		}
+	}
+}
+
+.cell {
+	display: flex;
+	padding: 20rpx;
+	box-sizing: border-box;
+	background: #FFFFFF;
+	&__hd {
+		font-size: 0;
+		.image {
+			width: 160rpx;
+			height: 160rpx;
+			margin-right: 20rpx;
+			border-radius: 12rpx;
+		}
+	}
+	&__bd {
+		flex: 1;
+		.name {
+			@include line(2);
+			font-size: 28rpx;
+			margin-bottom: 4rpx;
+		}
+		.des {
+			@include line(2);
+			color: $black2;
+			font-size: 24rpx;
+		}
+	}
+}

components/dkbase/dk-drag/item/index.wxml

@@ -0,0 +1,24 @@
+<view catchtap="itemClick">
+	<view wx:if="{{columns === 1}}" class="cell">
+		<view class="cell__hd">
+			<image class="image" mode="aspectFill" src="{{itemData[imageCol]}}" alt="" />
+		</view>
+		<view class="cell__bd">
+			<view class="name">{{itemData[titleCol]}}</view>
+			<view class="des">{{itemData.description}}</view>
+		</view>
+	</view>
+
+	<view wx:else class="info">
+		<view class="info__item">
+			<view style="display: flex;justify-content: center;margin-left: 20rpx;margin-top: 10rpx;">
+				<image class="image" style="height: 80rpx;width:80rpx;margin-bottom: 11rpx;" src="{{itemData[imageCol]?('/static/img/' +itemData[imageCol]):''}}"></image>
+				<view style="margin-left: -6rpx; margin-top: -20rpx" wx:if="{{editFlag}}">
+					<van-icon size="15px" name="clear" color="#D3D3D3" />
+				</view>
+			</view>
+
+			<view class="name">{{itemData[titleCol]}}</view>
+		</view>
+	</view>
+</view>

components/dkbase/dk-drag/item/index.wxss

@@ -0,0 +1,65 @@
+.info {
+  position: relative;
+  padding-top: 100%;
+  background: #ffffff;
+  box-sizing: border-box;
+}
+
+.info__item {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  padding: 10rpx;
+  box-sizing: border-box;
+}
+
+.info__item .image {
+  width: 100%;
+  height: 100%;
+}
+
+.cell {
+  display: flex;
+  padding: 20rpx;
+  box-sizing: border-box;
+  background: #FFFFFF;
+}
+
+.cell__hd {
+  font-size: 0;
+}
+
+.cell__hd .image {
+  width: 160rpx;
+  height: 160rpx;
+  margin-right: 20rpx;
+  border-radius: 12rpx;
+}
+
+.cell__bd {
+  flex: 1;
+}
+
+.info__item .name {
+  color: #1B365D !important;
+  font-style: normal;
+  font-weight: 400;
+  font-size: 12px !important;
+  /* line-height: 34px; */
+  color: #1B365D;
+  display: flex;
+  justify-content: center;
+}
+
+.cell__bd .des {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+  word-break: break-all;
+  color: #666666;
+  font-size: 24rpx;
+}

pages/index/index.js

@@ -19,10 +19,11 @@ Page({
    * 页面的初始数据
    */
   data: {
+    size: 4,
     showMore: false,
     editFlag: false, // 编辑模式
     comMenuList: [], // 常用功能
-    comMenuListForCheck:[] ,// 常用功能（简单数组）用于判断
+    comMenuListForCheck: [],// 常用功能（简单数组）用于判断
     allCondition: '',//搜索菜单
     noticeShowFlag: true,// 是否显示通知的
     loadingShow: false,
@@ -475,6 +476,40 @@ Page({
     })
   },
   /**
+  * @desc : 操作常用应用
+  * @author : 周兴
+  * @date : 2024/3/29
+  */
+  comItemClick(e){
+    console.log('e',e);
+    // 操作常用应用
+    this.toApp(e,true);
+    setTimeout(()=>{
+      this.initDrag()
+    },50)
+  },
+  /**
+  * @desc : 初始化drag组件
+  * @author : 周兴
+  * @date : 2024/3/29
+  */
+  initDrag(){
+    let drag = this.selectComponent('#drag');
+    if(drag){
+      drag.init();
+    }
+  },
+  /**
+  * @desc : drag结束
+  * @author : 周兴
+  * @date : 2024/3/29
+  */
+  dragEnd(e) {
+    this.setData({
+      comMenuList:e.detail.listData
+    })
+	},
+  /**
   * @desc : 进入编辑模式
   * @author : 周兴
   * @date : 2024/3/29
@@ -482,7 +517,10 @@ Page({
   toEdit() {
     let editFlag = this.data.editFlag
     // 变为编辑模式
-    if(!editFlag){
+    if (!editFlag) {
+      // wx.setNavigationBarTitle({
+      //   title: mixins.$t('管理应用'),
+      // })
       editFlag = !editFlag;
       let showMore = this.data.showMore
       if (editFlag) {
@@ -492,22 +530,40 @@ Page({
         showMore: showMore,
         editFlag: editFlag
       })
-    }else{
+      // 模仿异步加载数据
+      setTimeout(() => {
+        this.initDrag();
+      }, 100)
+    } else {
       // 保存常用功能
       this.saveComMenu();
     }
   },
   /**
+  * @desc : 退出编辑模式
+  * @author : 周兴
+  * @date : 2024/3/29
+  */
+  cancel() {
+    // wx.setNavigationBarTitle({
+    //   title: mixins.$t('menuCenter'),
+    // })
+    this.setData({
+      editFlag: false,
+      showMore: false
+    })
+  },
+  /**
   * @desc : 保存常用功能
   * @author : 周兴
   * @date : 2024/3/29
   */
-  saveComMenu(){
+  saveComMenu() {
     let comMenuList = this.data.comMenuList || []
-    comMenuList.forEach((it,index)=>{
-      it.staffId =  app.globalData.user.staffId,
-      it.appCode = Constants.APP_CODE,
-      it.displayNo = index
+    comMenuList.forEach((it, index) => {
+      it.staffId = app.globalData.user.staffId,
+        it.appCode = Constants.APP_CODE,
+        it.displayNo = index
     })
 
     let service = app.globalData['comMenuService']
@@ -535,10 +591,10 @@ Page({
     api.request(service.prefix + service.selectByCond, 'POST', params).then(res => {
       if (res.data.code == Constants.SUCESS_CODE) {
         let comMenuList = res.data.data
-        let comMenuListForCheck = comMenuList.map(it=>it.menuUuid)
+        let comMenuListForCheck = comMenuList.map(it => it.menuUuid)
         this.setData({
           comMenuList: comMenuList,
-          comMenuListForCheck:comMenuListForCheck
+          comMenuListForCheck: comMenuListForCheck
         })
       }
     });
@@ -725,17 +781,28 @@ Page({
   },
 
   /* 点击icon事件 */
-  toApp(e) {
+  toApp(e,comFlag) {
     // 编辑模式不跳页
     if (this.data.editFlag) {
-      let comFlag = e.currentTarget.dataset.com
-      // 删除常用功能
       if(comFlag){
-        this.delCom(e.currentTarget.dataset.item);
+        // 删除常用功能
+        this.delCom(e.detail.data);
       }else{
         // 增加到常用功能
         this.addToCom(e.currentTarget.dataset.item);
+        // 刷新drag组件
+        setTimeout(() => {
+          this.initDrag();
+        }, 100)
       }
+      // let comFlag = e.currentTarget.dataset.com
+      // // 删除常用功能
+      // if (comFlag) {
+      //   this.delCom(e.currentTarget.dataset.item);
+      // } else {
+      //   // 增加到常用功能
+      //   this.addToCom(e.currentTarget.dataset.item);
+      // }
       return;
     }
     let url = e.currentTarget.dataset.url
@@ -762,14 +829,14 @@ Page({
    * @author : 周兴
    * @date : 2024/3/29 9:16
    */
-  delCom(item){
+  delCom(item) {
     let comMenuList = this.data.comMenuList
     let comMenuListForCheck = this.data.comMenuListForCheck
-    comMenuList = comMenuList.filter(it=>it.menuUuid != item.menuUuid)
-    comMenuListForCheck = comMenuListForCheck.filter(it=>it != item.menuUuid)
+    comMenuList = comMenuList.filter(it => it.menuUuid != item.menuUuid)
+    comMenuListForCheck = comMenuListForCheck.filter(it => it != item.menuUuid)
     this.setData({
-      comMenuList:comMenuList,
-      comMenuListForCheck:comMenuListForCheck
+      comMenuList: comMenuList,
+      comMenuListForCheck: comMenuListForCheck
     })
   },
   /**
@@ -803,7 +870,7 @@ Page({
     }
     this.setData({
       comMenuList: comMenuList,
-      comMenuListForCheck:comMenuListForCheck
+      comMenuListForCheck: comMenuListForCheck
     })
   },
 

pages/index/index.wxml

@@ -1,4 +1,13 @@
 <wxs module="m1">
+  var ceiling = function(val){
+    var value = parseInt(val);
+    if(val > value){
+      value = value + 1
+    }
+    return value
+  }
+  module.exports.ceiling = ceiling;
+
   var hasAuth = function (array, auth) {
     return array.indexOf(auth) !== -1;
   }
@@ -60,11 +69,14 @@
           </view>
         </view>
       </view>
+      <dk-tag wx:if="{{editFlag}}" style="margin-right: 5rpx;" type="default" padding="0 20rpx" height="40rpx" textColor="#FFFFFF" radius="5rpx" roundFlag="{{true}}" value="{{'取消'}}" catchtap="cancel"></dk-tag>
       <dk-tag type="primary" padding="0 20rpx" height="40rpx" color="#1E90FF" textColor="#FFFFFF" radius="5rpx" roundFlag="{{true}}" value="{{editFlag?'保存':'编辑'}}" catchtap="toEdit"></dk-tag>
     </view>
     <view wx:if="{{showMore}}" style="background: #fff;border-radius: 15rpx;">
-      <view  style="display: flex;flex-wrap: wrap;padding: 43rpx 0;align-items: center;">
-        <view class="app-item "  
+      <view style="flex-wrap: wrap;padding: 43rpx 0;align-items: center;height: {{m1.ceiling(comMenuList.length/size)*160 + 'rpx'}};">
+        <dk-drag id="drag" imageCol="objectIcon" titleCol="menuName" generic:item="drag-item" bind:click="comItemClick" bind:sortend="dragEnd" list-data="{{comMenuList}}" columns="{{size}}"  editFlag="{{editFlag}}">
+        </dk-drag>
+        <!-- <view class="app-item "  
         style="width:25%;text-align: center;" wx:for="{{comMenuList}}" wx:for-item="item" data-item="{{item}}" data-code="{{item.menuUuid}}" data-url="{{item.objectPath}}" data-com="{{true}}" bindtap="toApp" wx:key="i" >
           <view style="display: flex;justify-content: center;">
             <image src="{{item.objectIcon?('/static/img/' + item.objectIcon):''}}" style="height: 80rpx;width:80rpx;margin-bottom: 11rpx;"></image>
@@ -73,7 +85,7 @@
             </view>
           </view>
           <view class="index-grid-item-text-class">{{item.menuName}}</view>
-        </view>
+        </view> -->
       </view>
     </view>
   </view>