bill vor 8 Monaten
Ursprung
Commit
ebfd4f60e9

+ 23 - 32
src/components/bill-ui/components/input/textarea.vue

@@ -1,10 +1,10 @@
 <template>
   <div
-    class="input textarea" 
-    :class="{suffix: $slots.icon || maxlength, disabled, right}"
-    ref="textRef">
-      {{modelValue}}
-    <textarea 
+    class="input textarea"
+    :class="{ suffix: $slots.icon || maxlength, disabled, right }"
+    ref="textRef"
+  >
+    <textarea
       class="ui-text"
       :value="modelValue"
       @input="inputHandler"
@@ -18,50 +18,41 @@
       v-bind="other"
     />
     <span class="replace"></span>
-    <span v-if="$slots.icon || props.maxlength"  class="retouch">
+    <span v-if="$slots.icon || props.maxlength" class="retouch">
       <slot name="icon" />
       <span v-if="props.maxlength" class="len">
-        <span>{{modelValue.length}}</span> / {{maxlength}}
+        <span>{{ modelValue.length }}</span> / {{ maxlength }}
       </span>
     </span>
   </div>
 </template>
 
 <script setup>
-import { textareaPropsDesc } from './state'
-import { 
-  nextTick,
-  ref
-} from 'vue'
+import { textareaPropsDesc } from "./state";
+import { nextTick, ref } from "vue";
 const props = defineProps({
   type: {
     type: String,
-    default: 'text'
+    default: "text",
   },
-  ...textareaPropsDesc
-})
+  ...textareaPropsDesc,
+});
 
-const emit = defineEmits([
-  'update:modelValue',
-  'focus',
-  'blur',
-  'click'
-])
-const textRef = ref(null)
-const inputRef = ref(null)
+const emit = defineEmits(["update:modelValue", "focus", "blur", "click"]);
+const textRef = ref(null);
+const inputRef = ref(null);
 
-
-const inputHandler = ev => {
-  emit('update:modelValue', ev.target.value)
+const inputHandler = (ev) => {
+  emit("update:modelValue", ev.target.value);
   nextTick(() => {
     if (ev.target.value !== props.modelValue.toString()) {
-      ev.target.value = props.modelValue.toString()
+      ev.target.value = props.modelValue.toString();
     }
-  })
-}
+  });
+};
 
 defineExpose({
   root: textRef,
-  input: inputRef
-})
-</script>
+  input: inputRef,
+});
+</script>

+ 1 - 1
src/components/path/sign.vue

@@ -44,7 +44,7 @@ const path = sdk.createPath({
   line: getLineProps(),
   points: props.path.points,
 });
-path.changeCanEdit(false);
+// path.changeCanEdit(false);
 
 watchEffect(() => path.visibilityName(props.path.showName));
 watchEffect(() => path.changeFontSize(props.path.fontSize));

+ 2 - 0
src/sdk/sdk.ts

@@ -241,6 +241,7 @@ export type Path = {
     }
     // 路径点位置变更
     changePoints: PathProps['points']
+    drawed: void
   }>;
   changeFontSize: (fontSize: number) => void
   changeVisibilityRange: (range: number) => void
@@ -255,6 +256,7 @@ export type Path = {
   pause: () => void
   // 是否可编辑
   changeCanEdit: (canMove: boolean) => void
+  changeEditMode: (editMode: boolean) => void
   // 可见性
   visibility: (visibility: boolean) => void
   // 气泡是否可见

+ 23 - 9
src/views/guide/path/edit-path.vue

@@ -1,7 +1,7 @@
 <template>
   <Teleport to="#layout-app">
     <RightFillPano class="edit-path-point">
-      <div v-show="!~activePointNdx">
+      <div v-show="!~activePointNdx" :class="{ disable: !complete }">
         <ui-group
           :title="`${isTemploraryID(data.id) ? '创建' : '编辑'}路线`"
           borderBottom
@@ -117,7 +117,7 @@
           {{ isScenePathPlayIng ? "停止" : "" }} 预览路径
         </Button>
       </div>
-      <div v-if="~activePointNdx">
+      <div v-if="~activePointNdx" :class="{ disable: !complete }">
         <ui-group title="编辑点" borderBottom>
           <ui-group-option>描述:</ui-group-option>
           <ui-group-option>
@@ -127,7 +127,7 @@
               height="158px"
               v-model="data.points[activePointNdx].name"
               placeholder="特征描述:"
-              type="richtext"
+              type="textarea"
               :maxlength="200"
             />
           </ui-group-option>
@@ -141,7 +141,7 @@
     <span
       @click="unKeepAdding ? unKeepAdding() : keepAdding()"
       class="pin-position strengthen fun-ctrl"
-      v-if="node"
+      v-if="node && complete"
     >
       <ui-icon
         :style="{ color: unKeepAdding ? 'var(--color-main-normal)' : 'currentColor' }"
@@ -173,6 +173,7 @@ import {
   pauseScenePath,
   playScenePath,
 } from "@/sdk/association/path";
+import { nextTick } from "process";
 
 const props = defineProps<{ data: Path }>();
 
@@ -187,6 +188,8 @@ watch(node, () => {
   }
 });
 
+const currentComplete = !!props.data.points.length;
+const complete = ref(currentComplete);
 const activePointNdx = ref(-1);
 watchEffect((onCleanup) => {
   if (!node.value) return;
@@ -194,8 +197,19 @@ watchEffect((onCleanup) => {
   const handler = (ndx: number) => {
     activePointNdx.value = ndx;
   };
+  $node.changeEditMode(true);
   $node.bus.on("activePoint", handler);
-  onCleanup(() => $node.bus.off("activePoint", handler));
+  if (!currentComplete) {
+    $node.bus.on("drawed", () => (complete.value = true));
+  }
+
+  onCleanup(() => {
+    $node.bus.off("activePoint", handler);
+    $node.changeEditMode(false);
+    if (!currentComplete) {
+      $node.bus.off("drawed");
+    }
+  });
 });
 
 const deletePoint = () => {
@@ -217,14 +231,14 @@ const keepAdding = () => {
 };
 onUnmounted(() => unKeepAdding.value && unKeepAdding.value());
 
-useViewStack(() =>
-  togetherCallback([
+useViewStack(() => {
+  return togetherCallback([
     showRightPanoStack.push(ref(false)),
     showLeftCtrlPanoStack.push(ref(false)),
     showLeftPanoStack.push(ref(false)),
     showRightCtrlPanoStack.push(ref(false)),
-  ])
-);
+  ]);
+});
 
 const switchPlay = () => {
   if (isScenePathPlayIng.value) {