Skip to content

ehr

{

​ title: '保护状态',

​ dataIndex: 'is_sea',

​ enumSchemas: SeaStatus,

referenceKey: 'good'

​ width: 80,

},

update: (id, values) =>updateLead(id, values)

    if ((isFunction(editable) && editable()) || editable) {
      rowActions.unshift({
        label: '编辑',
        click: actions.handleEdit
      })
    }



 if ((isFunction(editable)) || editable) {
      const actionConfig = {
        label: '删除',
        confirm: '确定删除吗?',
        click: actions.handleDel,
      } as IGridTable.RowAction
      if (isFunction(editable)) {
        actionConfig.isShow = record => editable(record)
      }
      rowActions.push(actionConfig)
    }

erp

{

​ title: '保护状态',

​ dataIndex: 'is_sea',

​ enumable: SeaStatus,

referencable: 'good',

​ width: 80,

},

update: (id, values, record) => (record.status == 0 ? updateLead(id, values) : update(id, values)),

ehr

tableActions

isShow: Fn ,不支持boolean

needSelection: true,

​ click: (record, reload) => {

click: (ids, rows) => {

component: 'Picker',

comoment: 'select'

<template>
  <div class="resizable"  :style="containerStyleComputed" ref="root">
    <slot />

    <!-- 拖拽点(可按需注释掉某些方向) -->
    <!-- <div class="handle handle-right"  data-dir="right"></div> -->
    <!-- <div class="handle handle-left"   data-dir="left"></div> -->
    <!-- <div class="handle handle-bottom" data-dir="bottom"></div> -->
    <!-- <div class="handle handle-top"    data-dir="top"></div> -->

    <div class="handle handle-br" data-dir="br"></div>
    <!-- <div class="handle handle-bl" data-dir="bl"></div>
    <div class="handle handle-tr" data-dir="tr"></div>
    <div class="handle handle-tl" data-dir="tl"></div> -->
  </div>
</template>

<script setup>
import { ref, computed, onBeforeUnmount } from "vue";

const props = defineProps({
  width: { type: Number, default: 300 },
  height: { type: Number, default: 180 },
  minW: { type: Number, default: 50 },
  minH: { type: Number, default: 15 },
  maxW: { type: Number, default: 2000 },
  maxH: { type: Number, default: 2000 },
  tempScaleCupt: { type: Number, default: 1 },
});
const emit = defineEmits(["update:width", "update:height", "resize"]);

const root = ref(null);
const w = ref(props.width);
const h = ref(props.height);

let startX = 0,
  startY = 0,
  startW = 0,
  startH = 0,
  dir = "",
  dragging = false;

const containerStyleComputed = computed(() => ({
  // width: w.value + "px",
  // height: h.value + "px"
}));

function startDrag(e) {
  const t = e.target;
  dir = t.dataset.dir;
  if (!dir) return;

  dragging = true;

  const p = e.touches ? e.touches[0] : e;
  startX = p.clientX;
  startY = p.clientY;
  startW = w.value;
  startH = h.value;

  document.addEventListener("mousemove", onMove);
  document.addEventListener("mouseup", stopDrag);
  document.addEventListener("touchmove", onMove, { passive: false });
  document.addEventListener("touchend", stopDrag);
}

function onMove(e) {
  if (!dragging) return;

  e.preventDefault();
  const p = e.touches ? e.touches[0] : e;

  let dx = p.clientX - startX;
  let dy = p.clientY - startY;

  let newW = startW;
  let newH = startH;

  console.log(dir,dx,dy,'move')
  
  // 横向
  if (dir.includes("right")) newW = startW + dx;
  // if (dir.includes("left")) newW = startW - dx;

  // 纵向
  if (dir.includes("bottom")) newH = startH + dy;
  // if (dir.includes("top")) newH = startH - dy;

  if (dir.includes("br")) {
    newW = startW + dx;
    newH = startH + dy;
  }

  // 限制范围
  newW = Math.max(props.minW, Math.min(props.maxW, newW));
  newH = Math.max(props.minH, Math.min(props.maxH, newH));

  console.log(newW,newH,'kkkk')
  

  // 更新
  w.value = newW;
  h.value = newH;

  emit("update:width", newW);
  emit("update:height", newH);
  emit("resize", { width: newW, height: newH });
}

function stopDrag() {
  dragging = false;
  document.removeEventListener("mousemove", onMove);
  document.removeEventListener("mouseup", stopDrag);
  document.removeEventListener("touchmove", onMove);
  document.removeEventListener("touchend", stopDrag);
}

// 注册拖拽事件
onMounted(() => {
  root.value.querySelectorAll(".handle").forEach((el) => {
    el.addEventListener("mousedown", (e) => {
      e.stopPropagation();   // 阻止冒泡到父级
      startDrag(e);
    });
    el.addEventListener("touchstart", (e) => {
      e.stopPropagation();   // 阻止冒泡
      startDrag(e);
    }, { passive: false });
  });
});

onBeforeUnmount(() => stopDrag());
</script>

<style scoped>
.resizable {
  position: relative;
  user-select: none;
  /* background-color: #fff; */
  width: 100%;
  height: 100%;
}

/* 公用拖拽点样式 */
.handle {
  position: absolute;
  background: transparent;
}

/* 边 */
.handle-right {
  right: 0;
  top: 0;
  width: 6px;
  height: 100%;
  cursor: ew-resize;
}
.handle-left {
  left: 0;
  top: 0;
  width: 6px;
  height: 100%;
  cursor: ew-resize;
}
.handle-bottom {
  bottom: 0;
  left: 0;
  width: 100%;
  height: 6px;
  cursor: ns-resize;
}
.handle-top {
  top: 0;
  left: 0;
  width: 100%;
  height: 6px;
  cursor: ns-resize;
}

/* 角 */
.handle-br {
  right: 0;
  bottom: 0;
  width: 12px;
  height: 12px;
  cursor: nwse-resize;
}
.handle-bl {
  left: 0;
  bottom: 0;
  width: 12px;
  height: 12px;
  cursor: nesw-resize;
}
.handle-tr {
  right: 0;
  top: 0;
  width: 12px;
  height: 12px;
  cursor: nesw-resize;
}
.handle-tl {
  left: 0;
  top: 0;
  width: 12px;
  height: 12px;
  cursor: nwse-resize;
}
</style>

Lucking