解析块配置页面修改

liudong

2024-08-07 bde3c3ac7e508b8bdca2308c2547449b6bee5b53

 src/views/session/sessionManager/components/addSession.vue

@@ -1,40 +1,98 @@
<script setup lang="ts">
    import { defineProps ,ref,defineEmits} from 'vue';
    import { Message } from '@arco-design/web-vue';
    import { addSessionApi }from '@/api/session';
    const props=defineProps({
        modalObj:Object
    });
    const conversation_name=ref('');
    const emit = defineEmits(['addSession']);
    const handleOk=async ()=>{
        if(conversation_name.value){
            const {code}=await addSessionApi({conversation_name:conversation_name.value});
            if(code===200){
                Message.success('添加成功');
                emit('addSession')
            }
        }else{
            Message.warning('会话名称不能为空');
        }
  import { defineProps, ref, defineEmits, onMounted } from 'vue';
  import { Message } from '@arco-design/web-vue';
  import { addSessionApi, getDialogListApi } from '@/api/session';
  const props = defineProps({
    modalObj: Object,
  });
  const conversation = ref({ dialog_id: '', conversation_desc: '' });
  const dialogList = ref([]);
  const emit = defineEmits(['addSession']);
  const queryDialogList = async () => {
    const { code, data } = await getDialogListApi();
    if (code === 200) {
      dialogList.value = data;
    }
  };

  const rules = {
    dialog_id: [
      {
        required: true,
        message: '智能助手不能为空',
      },
    ],
    conversation_desc: [
      {
        required: true,
        message: '描述不能为空',
      },
    ],
  };
  onMounted(() => {
    queryDialogList();
  });
  const formRef = ref();
  const handleOk = () => {
    formRef.value.validate().then(async (res) => {
      if (!res) {
        const { code } = await addSessionApi({ ...conversation.value });
        if (code === 200) {
          Message.success('添加成功');
          emit('addSession');
          setTimeout(() => {
            props.modalObj.add = false;
          }, 500);
        } else {
          Message.warning('添加失败');
        }
      }
    });

    return false;
  };
  const destroyData = () => {
    formRef.value.resetFields();
  };
</script>

<template>
    <div>
        <a-modal v-model:visible="modalObj.add" @ok="handleOk" @cancel="modalObj.add=false">
            <template #title>
                新增会话
            </template>
            <a-form>
                <a-form-item label="会话名称:">
                    <a-input placeholder="请输入会话名称" v-model="conversation_name" style="width: 80%"></a-input>
                </a-form-item>
            </a-form>
        </a-modal>
    </div>
  <div>
    <a-modal
      v-model:visible="modalObj.add"
      @before-ok="handleOk"
      @cancel="modalObj.add = false"
      @before-close="destroyData"
    >
      <template #title> 新增会话 </template>
      <a-form ref="formRef" :model="conversation" :rules="rules">
        <a-form-item label="助手关联:" field="dialog_id" @submit="handleSubmit">
          <a-select
            style="width: 80%"
            v-model="conversation.dialog_id"
            placeholder="请选择关联助手"
          >
            <a-option
              v-for="dialog in dialogList"
              :key="dialog.id"
              :value="dialog.id"
              >{{ dialog.name }}</a-option
            >
          </a-select>
        </a-form-item>
        <a-form-item label="描述:" field="conversation_desc">
          <a-textarea
            placeholder="请输入描述"
            :max-length="100"
            show-word-limit
            :auto-size="{ minRows: 4, maxRows: 5 }"
            v-model="conversation.conversation_desc"
            style="width: 80%"
          ></a-textarea>
        </a-form-item>
      </a-form>
    </a-modal>
  </div>
</template>

<style scoped lang="scss">

</style>
<style scoped lang="scss"></style>