-- fix 评估

src/components/project/NameInput.vue

@@ -1,20 +1,18 @@
 <template>
   <a-input
-      v-model:value="modelV"
-      :placeholder="placeholder"
-      :show-count="showCount"
-      :maxlength="maxlength"
-      :validate="validate"
-      @change="validateProName"
+    v-model:value="modelV.value"
+    :placeholder="placeholder"
+    :show-count="showCount"
+    :maxlength="maxlength"
   />
-  <div style="color: red; font-size: 10px" v-if="modelV && !validated">
+  <div style="color: red; font-size: 10px" v-if="modelV.value && validated===0">
     名称重复，请重新输入
   </div>
 </template>
 <script setup>
-import {defineProps, defineEmits, watch, ref, onMounted} from "vue";
+import {defineProps, defineEmits, watch, ref} from "vue";
 import {validateName} from "@/api/index1";
-import {throttle} from "@/api/method";
+import {Form} from "ant-design-vue";
 
 const props = defineProps({
   value: {
@@ -38,70 +36,70 @@ const props = defineProps({
     type: Boolean,
     default: false,
   },
+  validated: {
+    type: Number,
+    default: 0,
+  }
 });
 
-const emit = defineEmits({});
+const emit = defineEmits(["update:value",'update:validated']);
 
-const modelV = ref();
-
-const validating = ref(false)
-const validated = ref(true)
-
-onMounted(() => {
-  modelV.value = props.value;
+const modelV = ref({
+  value: props.value
 });
 
-watch(
-    () => props.value,
-    () => {
-      if (props.value !== modelV.value) {
-        modelV.value = props.value;
+const rulesRef = ref({
+  value: [{
+    required: true,
+    validator: validateValue,
+    trigger: "change",
+    message: "请输入名称",
+  },
+  ],
+});
+
+Form.useForm(modelV, rulesRef, { debounce: { wait: 800 } });
+
+watch(props, () => {
+  modelV.value.value = props.value;
+});
+
+watch(() => modelV.value.value, () => {
+  emit("update:validated", 1);
+  emit("update:value", modelV.value.value);
+});
+
+async function validateValue() {
+  if (!modelV.value.value) {
+    return Promise.reject("请输入名称");
+  }
+  return validateName({ name: modelV.value.value, type: props.type, id: props.id }).then(res => {
+      if (res.data.data === 1) {
+        emit("update:validated", 0);
+        return Promise.reject("名称重复");
       }
+      emit("update:validated", 2);
+      return Promise.resolve();
     }
-);
-
-watch(modelV, () => {
-  emit("update:value", modelV.value);
-});
-
-function validate() {
-  console.log('validate')
-  ;
-}
-
-function validateNameFun() {
-  validateName({name: props.value, type: props.type, id: props.id}).then(res => {
-        validating.value = false
-        validated.value = res.data.data !== 1
-      }
-  )
-}
-
-const throttleValidateName = throttle(validateNameFun, 500)
-
-function validateProName() {
-  validating.value = true
-  validated.value = true
-  props.value && throttleValidateName()
+  );
 }
 </script>
 <style lang="scss">
 
-  .pro {
-    .ant-input-affix-wrapper {
-      padding: 4px 8px;
-      border-radius: 8px;
-    
-    }
+.pro {
+  .ant-input-affix-wrapper {
+    padding: 4px 8px;
+    border-radius: 8px;
+
   }
-  .road {
+}
+
+.road {
   .ant-input-affix-wrapper {
     padding: 0px 8px;
     border-radius: 8px;
   }
-  }
-
-
+}
 
 
 .b_input,