diff --git a/.gitignore b/.gitignore
index 922cc09..ee9fc3f 100644
--- a/.gitignore
+++ b/.gitignore
@@ -4,4 +4,5 @@ __pycache__
 **/*.exe
 /loras_userdatas/info
 init.json
-/panel
\ No newline at end of file
+/panel
+user_cloud_package.json
\ No newline at end of file
diff --git a/dist/lora_stack.css b/dist/lora_stack.css
index 305cba4..ba28b8c 100644
--- a/dist/lora_stack.css
+++ b/dist/lora_stack.css
@@ -323,4 +323,83 @@
 .lora-item.drag-over-top,
 .lora-item.drag-over-bottom {
     border: none;
+}
+
+/* 在现有CSS基础上添加以下样式 */
+
+.lora-header-item {
+    position: relative;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 6px 10px 6px 30px; /* 增加左边距为拖拽把手留空间 */
+    background: var(--p-dialog-background);
+    border-bottom: 1px solid var(--p-dialog-border-color);
+}
+
+.drag-handle {
+    position: absolute;
+    top: 50%;
+    left: 6px;
+    transform: translateY(-50%);
+    width: 18px;
+    height: 18px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    cursor: grab;
+    color: #666;
+    border-radius: 3px;
+    transition: all 0.2s ease;
+    opacity: 0.6;
+}
+
+.drag-handle:hover {
+    background-color: var(--weilin-prompt-ui-hover-bg-color, rgba(0, 0, 0, 0.1));
+    color: var(--fg-color);
+    opacity: 1;
+}
+
+.drag-handle:active {
+    cursor: grabbing;
+    background-color: var(--weilin-prompt-ui-primary-color, #22c55e);
+    color: white;
+    opacity: 1;
+}
+
+.lora-item.dragging .drag-handle {
+    cursor: grabbing;
+    background-color: var(--weilin-prompt-ui-primary-color, #16a34a);
+    border-color: var(--weilin-prompt-ui-primary-color, #16a34a);
+    color: white;
+    transform: translateY(-50%) scale(0.95);
+    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
+}
+
+/* 确保拖拽时的视觉效果 */
+.lora-item.dragging {
+    opacity: 0.7;
+    transform: rotate(2deg) scale(1.02);
+    z-index: 1000;
+    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
+}
+
+/* 拖拽占位符样式优化 */
+.lora-placeholder {
+    height: 100px;
+    border: 2px dashed var(--weilin-prompt-ui-primary-color, #22c55e);
+    border-radius: 6px;
+    background: rgba(34, 197, 94, 0.1);
+    margin-bottom: 8px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: var(--weilin-prompt-ui-primary-color, #22c55e);
+    font-size: 12px;
+    animation: placeholderPulse 1.5s ease-in-out infinite;
+}
+
+@keyframes placeholderPulse {
+    0%, 100% { opacity: 0.6; }
+    50% { opacity: 1; }
 }
\ No newline at end of file
diff --git a/dist/lora_stack.js b/dist/lora_stack.js
index e16c066..aeebebd 100644
--- a/dist/lora_stack.js
+++ b/dist/lora_stack.js
@@ -66,7 +66,8 @@ function getSystemLanguage() {
    return lang.startsWith('zh') ? 'zh' : 'en';
 }
 
-// Render a Lora item
+// 修改renderLoraItem函数中的HTML结构
+// 修改renderLoraItem函数中的HTML结构
 function renderLoraItem(seed, index, lora) {
    const loraListContainer = document.getElementById('loraListContainer_' + seed);
 
@@ -74,8 +75,7 @@ function renderLoraItem(seed, index, lora) {
    loraItem.className = `lora-item ${lora.hidden ? 'hidden-lora' : ''}`;
    loraItem.id = `lora-item-${seed}-${index}`;
    
-   // 添加拖动属性
-   loraItem.setAttribute('draggable', 'true');
+   // 移除整体拖拽属性
    loraItem.setAttribute('data-index', index.toString());
 
    const displayName = lora.display_name || lora.name || lora.lora;
@@ -83,6 +83,19 @@ function renderLoraItem(seed, index, lora) {
    loraItem.innerHTML = `
    <div class="lora-info">
        <div class="lora-header-item">
+           <div class="drag-handle" draggable="true" title="${getSystemLanguage() === 'zh' ? '拖拽排序' : 'Drag to reorder'}">
+               <svg viewBox="0 0 24 24" width="14" height="14">
+                   <circle cx="7" cy="7" r="1.5" fill="currentColor"/>
+                   <circle cx="12" cy="7" r="1.5" fill="currentColor"/>
+                   <circle cx="17" cy="7" r="1.5" fill="currentColor"/>
+                   <circle cx="7" cy="12" r="1.5" fill="currentColor"/>
+                   <circle cx="12" cy="12" r="1.5" fill="currentColor"/>
+                   <circle cx="17" cy="12" r="1.5" fill="currentColor"/>
+                   <circle cx="7" cy="17" r="1.5" fill="currentColor"/>
+                   <circle cx="12" cy="17" r="1.5" fill="currentColor"/>
+                   <circle cx="17" cy="17" r="1.5" fill="currentColor"/>
+               </svg>
+           </div>
            <span class="lora-name" title="${displayName}">${displayName}</span>
            <div class="lora-actions">
                <button class="look-on-btn" title="${getSystemLanguage() === 'zh' ? '查看Lora' : 'Look on Lora'}">
@@ -119,20 +132,22 @@ function renderLoraItem(seed, index, lora) {
    </div>
    `;
 
-   // 添加拖动事件监听器
-   loraItem.addEventListener('dragstart', (e) => handleDragStart(e, seed, index));
-//    loraItem.addEventListener('dragover', handleDragOver);
-//    loraItem.addEventListener('drop', (e) => handleDrop(e, seed));
-   loraItem.addEventListener('dragend', handleDragEnd);
+   // 只在拖拽把手上添加拖拽事件
+   const dragHandle = loraItem.querySelector('.drag-handle');
+   dragHandle.addEventListener('dragstart', (e) => handleDragStart(e, seed, index));
+   dragHandle.addEventListener('dragend', handleDragEnd);
+   
+   // 防止把手事件冒泡
+   dragHandle.addEventListener('mousedown', (e) => {
+       e.stopPropagation();
+   });
 
-   // Add event listeners
+   // 其余事件监听器保持不变
    loraItem.querySelector('.look-on-btn').addEventListener('click', () => lookOnLora(lora.lora));
    loraItem.querySelector('.remove-btn').addEventListener('click', () => removeLora(seed, index));
 
-   // Add input change listeners
    const weightInputs = loraItem.querySelectorAll('.lora-weight');
    weightInputs.forEach(input => {
-
         input.addEventListener('mousedown', (e) => {
             e.stopPropagation();
         });
@@ -157,7 +172,7 @@ function renderLoraItem(seed, index, lora) {
 
    loraListContainer.appendChild(loraItem);
 
-   // If display name is missing, try to fetch it from server and update UI
+   // 其余代码保持不变...
    if (!lora.display_name && lora.lora) {
        try {
            fetch(`/weilin/prompt_ui/api/lorainfo/api/loras/info?file=${encodeURIComponent(lora.lora)}`)
@@ -178,7 +193,6 @@ function renderLoraItem(seed, index, lora) {
        } catch (e) { /* ignore */ }
    }
 
-   // Bind visibility toggle switch
    const visToggle = loraItem.querySelector(`#visible-toggle-${seed}-${index}`);
    if (visToggle) {
        visToggle.addEventListener('change', (e) => {
@@ -190,13 +204,23 @@ function renderLoraItem(seed, index, lora) {
            }
        });
    }
+   
    loraItem.querySelector('.look-on-btn').addEventListener('mousedown', (e) => {
         e.stopPropagation();
-        });
+   });
 
-    loraItem.querySelector('.remove-btn').addEventListener('mousedown', (e) => {
+   loraItem.querySelector('.remove-btn').addEventListener('mousedown', (e) => {
         e.stopPropagation();
-        });
+   });
+}
+
+// 修改handleDragStart函数，从把手获取父元素信息
+function handleDragStart(e, seed, index) {
+    draggedIndex = index;
+    const loraItem = e.target.closest('.lora-item');
+    loraItem.classList.add('dragging');
+    e.dataTransfer.effectAllowed = 'move';
+    e.dataTransfer.setData('text/html', loraItem.outerHTML);
 }
 
 // Get hide button content