Skip to content

Add files via upload #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
paician wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Add files via upload #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions approval/delete-icon.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions approval/grab-icon.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
124 changes: 124 additions & 0 deletions approval/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,124 @@
Page({
data: {
widgets: [
{ type: 'single-line-text', label: '单行文本' },
{ type: 'multi-line-text', label: '多行文本' },
{ type: 'description', label: '说明' },
{ type: 'number', label: '数字' },
{ type: 'currency', label: '金额' },
{ type: 'formula', label: '计算公式' }
],
formItems: [],
touchStartY: null,
draggedItemIndex: null,
insertPosition: null
},

onLoad() {
console.log('页面加载');
},

// 控件点击事件处理
onWidgetTap(e) {
const widgetType = e.currentTarget.dataset.type;
const newItem = this.createFormItem(widgetType);

const updatedFormItems = [...this.data.formItems, newItem];

this.setData({
formItems: updatedFormItems
});
},

// 创建表单项
createFormItem(type) {
const itemMap = {
'single-line-text': {
label: '单行文本',
type: 'text'
},
'multi-line-text': {
label: '多行文本',
type: 'textarea'
},
'number': {
label: '数字',
type: 'number'
},
'currency': {
label: '金额',
type: 'number'
},
'formula': {
label: '计算公式',
type: 'text'
},
'description': {
label: '说明',
type: 'text'
}
};

return {
...itemMap[type],
unique: Date.now()
};
},

// 移除表单项
removeFormItem(e) {
const index = e.currentTarget.dataset.index;
const updatedFormItems = this.data.formItems.filter((_, i) => i !== index);

this.setData({
formItems: updatedFormItems
});
},

// 触摸开始
onTouchStart(e) {
this.setData({
touchStartY: e.touches[0].clientY,
draggedItemIndex: e.currentTarget.dataset.index
});
},

// 触摸移动
onTouchMove(e) {
const { touchStartY, draggedItemIndex } = this.data;
const touchMoveY = e.touches[0].clientY;
const yDiff = touchMoveY - touchStartY;

// 判断移动方向和距离
if (Math.abs(yDiff) > 50) {
const { formItems } = this.data;
const newIndex = yDiff > 0 ?
parseInt(draggedItemIndex) + 1 :
parseInt(draggedItemIndex) - 1;

// 确保新索引在数组范围内
if (newIndex >= 0 && newIndex < formItems.length) {
// 交换位置
const newFormItems = [...formItems];
[newFormItems[draggedItemIndex], newFormItems[newIndex]] =
[newFormItems[newIndex], newFormItems[draggedItemIndex]];

this.setData({
formItems: newFormItems,
touchStartY: touchMoveY,
draggedItemIndex: newIndex,
insertPosition: newIndex
});
}
}
},

// 触摸结束
onTouchEnd() {
this.setData({
touchStartY: null,
draggedItemIndex: null,
insertPosition: null
});
}
});
119 changes: 119 additions & 0 deletions approval/index.ttml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,119 @@
<view class="app-container">
<view class="widget-panel">
<text class="panel-title">控件</text>
<view class="control-group">
<text class="group-title">文本</text>
<view
class="widget"
data-type="single-line-text"
bind:tap="onWidgetTap"
>
单行文本
</view>
<view
class="widget"
data-type="multi-line-text"
bind:tap="onWidgetTap"
>
多行文本
</view>
<view
class="widget"
data-type="description"
bind:tap="onWidgetTap"
>
说明
</view>
</view>
<view class="control-group">
<text class="group-title">数值</text>
<view
class="widget"
data-type="number"
bind:tap="onWidgetTap"
>
数字
</view>
<view
class="widget"
data-type="currency"
bind:tap="onWidgetTap"
>
金额
</view>
<view
class="widget"
data-type="formula"
bind:tap="onWidgetTap"
>
计算公式
</view>
</view>
</view>

<view class="design-area">
<text class="area-title">测试审批2</text>
<view class="drop-zone">点击左侧控件自动新增</view>

<!-- 动态渲染的输入项 -->
<block wx:for="{{formItems}}" wx:key="unique">
<view
class="form-item-wrapper"
data-index="{{index}}"
data-dragging="{{item.isDragging}}" // 添加这个属性
>
<view
class="insert-indicator"
wx:if="{{draggedItemIndex === index || item.isDragging}}" // 修改条件
></view>
<view
class="form-item"
data-index="{{index}}"
data-type="{{item.type}}"
bind:longpress="onLongPress"
bind:touchstart="onTouchStart"
bind:touchmove="onTouchMove"
bind:touchend="onTouchEnd"
>
<!-- 拖拽手柄 -->
<view
wx:if="{{item.isDragging}}"
class="drag-handle"
>
<image
src="grab-icon.svg"
class="grab-icon"
></image>
</view>

<view class="form-item-content">
<text class="form-item-label">
{{item.label}}
<text class="required-mark">*</text>
</text>

<!-- 多行文本特殊处理 -->
<block wx:if="{{item.type === 'textarea'}}">
<view class="multi-line-placeholder">
<text>\n\n请输入</text>
</view>
</block>
<block wx:else>
<text class="form-item-placeholder">请输入</text>
</block>
</view>
<view
class="remove-item"
bind:tap="removeFormItem"
data-index="{{index}}"
>
<image
src="delete-icon.svg"
class="delete-icon"
></image>
</view>
</view>
</view>
</block>
</view>
</view>
Loading