fix: 编辑接口对接

zhangxiao

2024-08-06 e751c02c93e2f2eb59a479788c174672a41d5918

fix: 编辑接口对接

 src/api/model.ts

@@ -49,6 +49,10 @@
  return axios.post('/api/v1/llm/add_llm', params);
}

export function editLlm(params) {
  return axios.post('/api/v1/llm/edit_llm', params);
}

// 删除子模型
export function deleteLlm(params) {
  return axios.post('/api/v1/llm/delete_llm', params);

 src/components/upload/index.vue

@@ -10,17 +10,57 @@
</template>

<script setup>
  import { ref } from 'vue';
  import { computed, ref, watch, watchEffect } from 'vue';
  const props = defineProps({
    limit: {
      type: Number,
      default: 1,
    },
    action: String, // 上传的服务器地址
    url: String, //回显的文件地址
  });

  const emit = defineEmits(['update:fileList', 'success']);

  const fileList = ref([]);
  // const urls = computed(() => {
  //   debugger;
  //   console.log(props.url, 999999);
  //   // if (props.urlS) {
  //   //   console.log(props.urlS, 999999);
  //   //   return props.urlS.split(',');
  //   // }

  //   // return props.urlS ? [props.urlS] : [];
  // });
  // watchEffect(() => {
  //   fileList.value = urls.value.map((item) => ({
  //     uid: item,
  //     name: item,
  //     status: 'done',
  //     url: item,
  //   }));
  // });
  watch(
    () => props.url,
    (newVal) => {
      debugger;
      console.log(newVal, 8888);
      // if (newVal) {
      //   fileList.value = newVal.split(',').map((item) => ({
      //     uid: item,
      //     name: item,
      //     status: 'done',
      //     url: item,
      //   }));
      // }
    },
    {
      deep: true, // 开启深度监听
    }
  );

  // console.log(urls.value, 8988);

  const handleChange = (fileList) => {
    emit('update:fileList', fileList);

 src/views/dmx/model/components/addPageModel.vue

@@ -46,7 +46,6 @@
        <a-form-item field="api_base" label="基础URL">
          <a-input v-model="form.api_base" placeholder="请输入基础URL" />
        </a-form-item>

        <a-form-item
          field="raptor"
          label="是否支持 Vision"
@@ -111,6 +110,7 @@
            <Upload
              :action="uploadAction"
              :limit="1"
              :url="form.urlS"
              @update:fileList="updateFileList"
              @success="handleSuccess"
            ></Upload>
@@ -131,8 +131,8 @@
</template>

<script lang="ts" setup>
  import { reactive, ref, computed, watch } from 'vue';
  import { addLlm, getLlmDetail } from '@/api/model';
  import { reactive, ref, computed, watch, watchEffect, onMounted } from 'vue';
  import { addLlm, getLlmDetail, editLlm } from '@/api/model';
  import { Modal, Message } from '@arco-design/web-vue';
  import message from '@arco-design/web-vue/es/message';
  import { resolveUnref } from '@vueuse/core';
@@ -160,13 +160,21 @@

  const isType = computed(() => props.type);
  const editList = computed(() => props.editList);

  watch(
    () => editList.value.name,
    (newValue) => {
      getDetail();
  watchEffect(() => {
    if (props.editList) {
      console.log(props.editList, 9999);
      // form.name = props.editList.name;
      // form.llm_factory = props.editList.llm_factory;
      // form.model_type = props.editList.model_type;
      // form.province = props.editList.province;
      // form.options = props.editList.options;
      // form.llm_name = props.editList.llm_name;
      // form.api_base = props.editList.api_base;
      // form.volc_ak = props.editList.volc_ak;
      // form.volc_sk = props.editList.volc_sk;
      // form.logo = props.editList.logo;
    }
  );
  });

  const form = reactive({
    size: 'medium',
@@ -181,6 +189,7 @@
    volc_sk: '',
    logo: '',
    radio: 'radio one',
    urlS: '',
    slider: 5,
    score: 5,
    switch: false,
@@ -246,22 +255,46 @@
      ?.validate()
      .then(async (res) => {
        if (!res) {
          const data = await addLlm({
            llm_factory: editList.value.llm_factory,
            llm_name: form.llm_name,
            model_type: form.model_type,
            volc_ak: form.volc_ak,
            volc_sk: form.volc_sk,
            api_base: form.api_base,
            raptor: form.raptor,
            all_params: all_params,
            logo: imageUrls.value[0],
          });
          if ((data as any).retmsg == 'success') {
            message.success('添加成功');
            emit('refresh-parent');
          if (props.title == '编辑') {
            const data = await editLlm({
              llm_factory: editList.value.llm_factory,
              llm_name: form.llm_name,
              model_type: form.model_type,
              volc_ak: form.volc_ak,
              volc_sk: form.volc_sk,
              api_base: form.api_base,
              raptor: form.raptor,
              all_params: all_params,
              logo: imageUrls.value[0],
            });

            if ((data as any).code == 200) {
              message.success('添加成功');
              addPageModelVisible.value = false;
              emit('refresh-parent');
            } else {
              message.error('添加失败');
            }
          } else {
            message.error('添加失败');
            const data = await addLlm({
              llm_factory: editList.value.llm_factory,
              llm_name: form.llm_name,
              model_type: form.model_type,
              volc_ak: form.volc_ak,
              volc_sk: form.volc_sk,
              api_base: form.api_base,
              raptor: form.raptor,
              all_params: all_params,
              logo: imageUrls.value[0],
            });

            if ((data as any).code == 200) {
              message.success('添加成功');
              addPageModelVisible.value = false;
              emit('refresh-parent');
            } else {
              message.error('添加失败');
            }
          }
        }
      })
@@ -323,6 +356,12 @@
  const onProgress = (currentFile) => {
    file.value = currentFile;
  };
  // onMounted(() => {
  //   if (editList.value) {
  //     getDetail();
  //     form.urlS = editList.value.logo;
  //   }
  // });

  //获取详情
  const getDetail = async () => {
@@ -330,16 +369,20 @@
      editList.value.llm_factory,
      editList.value.name
    );
    console.log(data.data, 8888);

    form.llm_name = data.data.llm_name;
    form.model_type = data.data.model_type;
    form.volc_ak = data.data.volc_ak;
    form.volc_sk = data.data.volc_sk;
    form.api_base = data.data.api_base;
    form.raptor = data.data.raptor;
    form.addFomList = data.data.all_params.map((item) => {
      return { name: item.split(':')[0], value: item.split(':')[1] };
    });
    // form.urlS = data.data.logo;
    if (JSON.parse(data.data.all_params).length > 0) {
      form.addFomList = JSON.parse(data.data.all_params).map((item) => {
        return { name: item.split(':')[0], value: item.split(':')[1] };
      });
    }

    imageUrls.value = data.data.logo;
  };
</script>

 src/views/dmx/model/components/addTableName.vue

@@ -58,7 +58,7 @@

<script lang="ts" setup>
  import { onMounted, onBeforeMount, reactive, ref, computed } from 'vue';
  import { addLlmFactory } from '@/api/model';
  import { addLlmFactory, getLlmDetail } from '@/api/model';
  import { Message } from '@arco-design/web-vue';

  const addTabVisible = defineModel('tabShow');
@@ -154,6 +154,22 @@
    });
    formRef.value?.resetFields();
  };

  onMounted(() => {
    if (editList.value) {
      getDetail();
    }
  });

  const getDetail = async () => {
    const data = await getLlmDetail(
      editList.value.llm_factory,
      editList.value.name
    );
    console.log(data.data, 8888);

    imageUrls.value = data.data.logo;
  };
</script>

<script lang="ts">

 src/views/dmx/model/index.vue

@@ -38,7 +38,7 @@
                            :style="{
                              width: '100%',
                            }"
                            alt="dessert"
                            alt="暂无图片"
                            :src="item.logo"
                          />
                        </div>
@@ -54,15 +54,18 @@
                            list.type
                          }}</div> -->
                          </div>
                          <div class="arco-btn-group">
                            <a-space class="btn-group">
                              <!-- <editModel></editModel> -->
                              <a-button type="primary" @click="handleEditModel">
                                编辑
                              </a-button>
                            </a-space>
                          </div>
                        </a-card>
                        <div class="arco-btn-group">
                          <a-space class="btn-group">
                            <!-- <editModel></editModel> -->
                            <a-button
                              type="primary"
                              @click="handleEditModel(item, 1)"
                            >
                              编辑
                            </a-button>
                          </a-space>
                        </div>
                      </div>
                    </div>
                    <div
@@ -71,13 +74,12 @@
                      :key="index"
                    >
                      <div class="card_wrap_box">
                        <div>
                        <div class="card_wrap_box_img">
                          <img
                            :style="{
                              width: '100%',
                              transform: 'translateY(-20px)',
                            }"
                            alt="dessert"
                            alt="暂无图片"
                            :src="list.logo"
                          />
                          <!--   src="https://p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/a20012a2d4d5b9db43dfc6a01fe508c0.png~tplv-uwbnlip3yd-webp.webp" -->
@@ -91,22 +93,22 @@
                              list.type
                            }}</div>
                          </div>
                          <div class="arco-btn-group">
                            <a-space class="btn-group">
                              <a-button @click="handleDeleteModel(list)">
                                删除
                              </a-button>
                              <a-button
                                type="primary"
                                @click="handleEditModel(list)"
                              >
                                编辑
                              </a-button>

                              <!-- <editModel></editModel> -->
                            </a-space>
                          </div>
                        </a-card>
                        <div class="arco-btn-group">
                          <a-space class="btn-group">
                            <a-button @click="handleDeleteModel(list)">
                              删除
                            </a-button>
                            <a-button
                              type="primary"
                              @click="handleEditModel(list)"
                            >
                              编辑
                            </a-button>

                            <!-- <editModel></editModel> -->
                          </a-space>
                        </div>
                      </div>
                    </div>
                  </div>
@@ -115,12 +117,12 @@
            </a-col>
            <div> </div>
            <div class="box_right">
              <div class="search_input">
              <!-- <div class="search_input">
                <a-input-search
                  :placeholder="$t('cardList.searchInput.placeholder')"
                  style="width: 240px"
                />
              </div>
              </div> -->
              <div>
                <!-- <addModel></addModel> -->
                <a-button
@@ -139,24 +141,24 @@
        </a-card>
      </a-col>
    </a-row>
    <!-- 添加模型 -->
    <addPageModel
      v-model:show="show"
      :task_id="task_id"
      :type="modelType"
      :title="title"
      :editList="editList"
      @refresh-parent="refreshParentMethod"
      v-if="show"
    ></addPageModel>
    <!-- 添加tab模式 -->
    <addTableName
      v-model:tabShow="tabShow"
      :nameList="editList"
      @refresh-parent="refreshParentMethod"
      v-if="tabShow"
    ></addTableName>
  </div>
  <!-- 添加模型 -->
  <addPageModel
    v-model:show="show"
    :task_id="task_id"
    :type="modelType"
    :title="title"
    :editList="editList"
    @refresh-parent="refreshParentMethod"
    v-if="show"
  ></addPageModel>
  <!-- 添加tab模式 -->
  <addTableName
    v-model:tabShow="tabShow"
    :nameList="editList"
    @refresh-parent="refreshParentMethod"
    v-if="tabShow"
  ></addTableName>
</template>

<script lang="ts" setup>
@@ -219,23 +221,19 @@
  const editList = ref({ llm_factory: '' });
  //增加模型子类
  const handleAddModel = () => {
    // if (tabKey.value == 'key') {
    //   tabShow.value = true;
    // } else {
    //   modelType.value = 2;
    //   editList.value.llm_factory = tabKey.value;
    //   show.value = true;
    //   title.value = '添加模式';
    // }
    modelType.value = 2;
    editList.value = [{ llm_factory: '' }];
    editList.value.llm_factory = tabKey.value;
    show.value = true;
    title.value = '添加模式';
  };
  //编辑模型子类
  const handleEditModel = (val) => {
    if (tabKey.value == 'key') {
  const handleEditModel = (val, type) => {
    console.log(val, 6766);
    if (type == 1) {
      tabShow.value = true;
      editList.value = val;
      editList.value.llm_factory = tabKey.value;
    } else {
      modelType.value = 2;
      task_id.value = val.id;
@@ -383,6 +381,10 @@
      }
    }
  }
  :deep(.arco-tabs-nav-tab) {
    flex: none;
    width: 60%;
  }
  .table_add_clore {
    :deep(.arco-tabs-nav-add-btn .arco-icon-hover::before) {
      top: 50%;
@@ -397,9 +399,9 @@
    :deep(.arco-tabs-nav-add-btn .arco-icon-hover .arco-icon) {
      color: #fff;
    }
    :deep(.arco-tabs-nav) {
      max-width: 60%;
    }
    // :deep(.arco-tabs-nav) {
    //   max-width: 60%;
    // }

    :deep(.arco-icon-hover::before) {
      top: 50%;
@@ -434,7 +436,18 @@
  .card_content {
    .card_wrap_box_img {
      min-height: 200px;
      max-height: 240px;
      height: 200px;
      img {
        max-height: 190px;
      }
    }
    .card_wrap_box {
      // position: relative;
      .arco-btn-group {
        position: absolute;
        right: 10px;
        top: 87%;
      }
    }
  }

@@ -445,12 +458,6 @@
    transition: all 0.3s;
    border: 1px solid var(--color-neutral-3);
    border-radius: 4px;
    position: relative;
    .arco-btn-group {
      position: absolute;
      right: 10px;
      top: 90px;
    }
    &:hover {
      transform: translateY(-4px);
      // box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.1);