应用中心

src/components/czr-ui/czr-form-link/upload.vue

@@ -5,8 +5,8 @@
       'czr-form-column-upload-com_view': isValue($attrs.disabled)
         ? $attrs.disabled
         : isLimitCpt || isViewCpt,
-      'czr-form-column-upload-com_list': layout === 'list',
-      'czr-form-column-upload-com_card': layout === 'card',
+      'czr-form-column-upload-com_list': uploadLayout === 'list',
+      'czr-form-column-upload-com_card': uploadLayout === 'card',
       'czr-form-column-upload-com_limit-no-upload':
         isLimitCpt && limitNoUpload !== false,
     }"
@@ -19,7 +19,7 @@
       v-bind="$attrs"
       :file-list="state.paramVal"
       action="#"
-      :list-type="layout === 'card' ? 'picture-card' : 'text'"
+      :list-type="uploadLayout === 'card' ? 'picture-card' : 'text'"
       :http-request="handleRequest"
       :before-upload="handleBeforeUpload"
       :accept="acceptTypeCpt"
@@ -34,7 +34,7 @@
         placement="top"
         popper-class="upload-tooltip-popper"
       >
-        <template v-if="layout === 'card'">
+        <template v-if="uploadLayout === 'card'">
           <div
             class="upload-layout-card __hover"
             :class="{
@@ -72,7 +72,7 @@
         </template>
       </el-tooltip>
       <template #file="{ file }">
-        <template v-if="layout === 'card'">
+        <template v-if="uploadLayout === 'card'">
           <el-tooltip
             placement="top"
             :content="file[nameKey] ?? file[urlKey]"
@@ -192,7 +192,7 @@ const props = defineProps({
       return ['all', 'img', 'file'].includes(val)
     },
   },
-  layout: {
+  uploadLayout: {
     default: 'list',
     validator(val: string) {
       return ['list', 'card'].includes(val)
@@ -422,6 +422,14 @@ const handleRequest = async (options) => {
   ) {
     const formData = new FormData()
     formData.append('file', options.file)
+    state.paramVal = [
+      {
+        [props.urlKey]:
+          'https://fastly.picsum.photos/id/1005/200/200.jpg?hmac=TlSxs8p2lqA8VkV-Kpg7DKnp8BkwK9UDBHrU2UegLzI',
+        [props.nameKey]: 'https://picsum.photos/id/1005/200/200',
+      },
+    ]
+    state.loading = false
     // frontUploadFile(formData).then(res => {
     //   state.paramVal = [...state.paramVal, {
     //     [props.urlKey]: res.data.path,
@@ -500,10 +508,11 @@ const imageClose = () => {
     align-items: flex-start;
     :deep(.el-upload) {
       .upload-layout-list_button {
+        height: 32px;
         display: flex;
         align-items: center;
         justify-content: center;
-        padding: 0 6px;
+        padding: 0 12px;
         background-color: var(--czr-main-color);
         border-radius: 4px;
         font-size: 14px;

src/views/manage/app/detail.vue

@@ -10,55 +10,65 @@
     :loading="state.loading"
   >
     <div class="bm-form">
-      <CzrForm ref="ref_form" label-width="100px" :form-view="isViewCpt">
-        <div class="__czr-title_1">基本信息</div>
+      <CzrForm ref="ref_form" :form-view="isViewCpt" layout="y">
         <CzrFormColumn
           required
-          :span="12"
-          label="模型类型"
-          v-model:param="state.form.type"
-          link="select"
-          :options="DictionaryStore.modelTypes.list"
-          @change="state.form.pluginClass = ''"
+          :span="24"
+          label="应用名称"
+          v-model:param="state.form.name"
         />
-        <template v-if="state.form.type">
-          <CzrFormColumn
-            required
-            :span="12"
-            label="模型供应商"
-            v-model:param="state.form.pluginClass"
-            link="select"
-            :options="
-              DictionaryStore.modelProvides.list.filter(
-                (v) => v.type === state.form.type,
-              )
-            "
-            @getObject="getModelProvide"
-          />
-        </template>
-        <template v-if="state.form.pluginClass">
-          <CzrFormColumn
-            required
-            :span="24"
-            label="模型名称"
-            v-model:param="state.form.name"
-          />
-          <CzrFormColumn
-            :span="24"
-            label="模型简介"
-            v-model:param="state.form.description"
-            type="textarea"
-            :rows="4"
-          />
-        </template>
         <CzrFormColumn
           required
           :span="24"
-          label="共享条件"
           v-model:param="state.form.openStrategy"
           link="radio"
-          :options="DictionaryStore.shareConditions"
+          :options="[
+            { label: '简洁', value: 1 },
+            { label: '高级', value: 2 },
+          ]"
+          :disabled="transfer.mode !== 'add'"
+        >
+          <template #label>
+            应用类型
+            <el-tooltip
+              content="简介：选择模型即可使用<br/>高级：需配置应用工作流才可使用"
+              :raw-content="true"
+              placement="top"
+            >
+              <SvgIcon name="czr_tip" size="14" class="ml-2" /> </el-tooltip
+          ></template>
+        </CzrFormColumn>
+        <CzrFormColumn
+          :span="24"
+          label="应用介绍"
+          v-model:param="state.form.name"
+          type="textarea"
+          :rows="4"
         />
+        <CzrFormColumn
+          required
+          :span="24"
+          label="图标"
+          v-model:param="state.icon"
+          link="upload"
+          type="img"
+          uploadLayout="card"
+          :limit="1"
+          :delRule="(file) => true"
+        />
+        <!--        <template>-->
+        <CzrFormColumn
+          required
+          :span="24"
+          label="公开访问URL"
+          v-model:param="state.form.name"
+          :disabled="true"
+        >
+          <template #suffix>
+            <CopyDocument class="w-4 cursor-pointer" />
+          </template>
+        </CzrFormColumn>
+        <!--        </template>-->
       </CzrForm>
     </div>
   </CzrDialog>
@@ -76,11 +86,8 @@ import {
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { useAppStore, useDialogStore, useDictionaryStore } from '@/stores'
 import { useRouter } from 'vue-router'
-import {
-  pluginAddInstance,
-  pluginDetail,
-  pluginUpdateInstance,
-} from '@/api/modules/model'
+import { CopyDocument } from '@element-plus/icons-vue'
+import CzrDialog from '@/components/czr-ui/CzrDialog.vue'
 
 const router = useRouter()
 const AppStore = useAppStore()
@@ -94,21 +101,15 @@ const props = defineProps({
 })
 const state: any = reactive({
   loading: false,
-  form: {
-    basicConfigs: {},
-    paramConfigs: {},
-    bizConfigs: {},
-  },
-  baseForms: [],
-  paramForms: [],
-  bizForms: [],
+  form: {},
+  icon: [],
 })
 const ref_form = ref()
 const titleCpt = computed(() => {
-  let t = '模型'
+  let t = '应用'
   switch (props.transfer.mode) {
     case 'add':
-      t = '创建' + t
+      t = '创建' + t + '副本'
       break
     case 'edit':
       t = '编辑' + t
@@ -125,15 +126,8 @@ watch(
   (n) => {
     if (n) {
       initDictionary()
-      state.form = {
-        tenantId: AppStore.tenantInfo?.id,
-        basicConfigs: {},
-        paramConfigs: {},
-        bizConfigs: {},
-      }
-      state.baseForms = []
-      state.paramForms = []
-      state.bizForms = []
+      state.form = {}
+      state.icon = []
       if (props.transfer.mode !== 'add') {
         initData()
       }
@@ -143,19 +137,16 @@ watch(
     }
   },
 )
-const initDictionary = () => {
-  DictionaryStore.initModelProvides()
-}
 const initData = () => {
-  state.loading = true
-  pluginDetail(props.transfer.id)
-    .then(({ data }: any) => {
-      state.form = data
-    })
-    .catch(() => {})
-    .finally(() => {
-      state.loading = false
-    })
+  // state.loading = true
+  // pluginDetail(props.transfer.id)
+  //   .then(({ data }: any) => {
+  //     state.form = data
+  //   })
+  //   .catch(() => {})
+  //   .finally(() => {
+  //     state.loading = false
+  //   })
 }
 const onSubmit = () => {
   ref_form.value
@@ -165,28 +156,28 @@ const onSubmit = () => {
         content: `请确认是否提交？`,
         onSubmit: () => {
           state.loading = true
-          if (props.transfer.mode === 'add') {
-            pluginAddInstance(state.form)
-              .then(() => {
-                ElMessage.success(`${titleCpt.value}成功！`)
-                emit('update:show', false)
-                emit('refresh')
-              })
-              .catch(() => {})
-              .finally(() => {
-                state.loading = false
-              })
-          } else {
-            pluginUpdateInstance(state.form)
-              .then(() => {
-                ElMessage.success(`${titleCpt.value}成功！`)
-                emit('refresh')
-              })
-              .catch(() => {})
-              .finally(() => {
-                state.loading = false
-              })
-          }
+          // if (props.transfer.mode === 'add') {
+          //   pluginAddInstance(state.form)
+          //     .then(() => {
+          //       ElMessage.success(`${titleCpt.value}成功！`)
+          //       emit('update:show', false)
+          //       emit('refresh')
+          //     })
+          //     .catch(() => {})
+          //     .finally(() => {
+          //       state.loading = false
+          //     })
+          // } else {
+          //   pluginUpdateInstance(state.form)
+          //     .then(() => {
+          //       ElMessage.success(`${titleCpt.value}成功！`)
+          //       emit('refresh')
+          //     })
+          //     .catch(() => {})
+          //     .finally(() => {
+          //       state.loading = false
+          //     })
+          // }
         },
       })
     })
@@ -198,18 +189,7 @@ const onSubmit = () => {
       })
     })
 }
-const getModelProvide = (obj) => {
-  console.log(obj)
-  state.form.name = obj.name
-  state.form.description = obj.description
-  state.baseForms = obj.basicConfigAttr
-    ? Object.values(obj.basicConfigAttr)
-    : []
-  state.paramForms = obj.paramConfigAttr
-    ? Object.values(obj.paramConfigAttr)
-    : []
-  state.bizForms = obj.bizConfigAttr ? Object.values(obj.bizConfigAttr) : []
-}
+const initDictionary = () => {}
 </script>
 
 <style lang="scss" scoped></style>

src/views/manage/app/index.vue

@@ -65,9 +65,23 @@
                     >
                       已发布
                     </div>
+                    <div
+                      class="ml-auto rounded-2xl bg-gradient-to-r from-[#C3E3FC] to-[#86C4FF] px-3 py-1 text-xs text-[#0876FF]"
+                    >
+                      简洁
+                    </div>
                   </template>
                   <template v-else>
-                    <div>简介</div>
+                    <div
+                      class="rounded-xs bg-[#A7ADB9] px-2.5 py-1 text-xs text-white"
+                    >
+                      草稿
+                    </div>
+                    <div
+                      class="ml-auto rounded-2xl bg-gradient-to-r from-[#E0DAFF] to-[#BABCFF] px-3 py-1 text-xs text-[#1E3F92]"
+                    >
+                      高级
+                    </div>
                   </template>
                 </div>
                 <div class="text-[1.25rem] font-bold text-[#2E3238]" v-title>
@@ -75,6 +89,34 @@
                 </div>
               </div>
             </div>
+            <div
+              class="mt-3 flex items-center gap-[var(--czr-gap)] text-[0.75rem] text-[#6F7889]"
+            >
+              <div>(用户名称)</div>
+              <div>|</div>
+              <div>(时间)</div>
+              <div class="ml-auto">
+                <el-dropdown :teleported="true">
+                  <SvgIcon name="omit" />
+                  <template #dropdown>
+                    <el-dropdown-menu>
+                      <el-dropdown-item @click="onCopy(row)"
+                        >创建副本</el-dropdown-item
+                      >
+                      <el-dropdown-item @click="onEdit(row)"
+                        >设置</el-dropdown-item
+                      >
+                      <el-dropdown-item @click="onDel(row)"
+                        >删除</el-dropdown-item
+                      >
+                      <el-dropdown-item @click="onMonitor(row)"
+                        >监测(发布的才有)</el-dropdown-item
+                      >
+                    </el-dropdown-menu>
+                  </template>
+                </el-dropdown>
+              </div>
+            </div>
           </div>
         </template>
       </CzrTableCard>
@@ -100,6 +142,7 @@ import {
   pluginUpdateStatus,
 } from '@/api/modules/model'
 import { YMDHms } from '@/utils/czr-util'
+import SvgIcon from '@/components/SvgIcon/index.vue'
 
 const AppStore = useAppStore()
 const DialogStore = useDialogStore()
@@ -193,6 +236,13 @@ const onAdd = () => {
   }
   state.detail.show = true
 }
+const onCopy = (row) => {
+  state.detail.transfer = {
+    mode: 'copy',
+    id: row.id,
+  }
+  state.detail.show = true
+}
 const onEdit = (row) => {
   state.detail.transfer = {
     mode: 'edit',
@@ -203,55 +253,25 @@ const onEdit = (row) => {
 const onDel = (row: any) => {
   DialogStore.confirm({
     title: '删除确认',
-    content: `${row.p6}个应用正在使用该大模型，删除将导致不可用，请确认是否删除`,
+    content: `请确认是否删除`,
     onSubmit: () => {
-      pluginDel(row.id)
-        .then(() => {
-          ElMessage.success('删除成功！')
-        })
-        .catch(() => {})
-        .finally(() => {
-          onSearch()
-        })
+      // pluginDel(row.id)
+      //   .then(() => {
+      //     ElMessage.success('删除成功！')
+      //   })
+      //   .catch(() => {})
+      //   .finally(() => {
+      //     onSearch()
+      //   })
     },
   })
 }
-const onSwitch = (row) => {
-  if (row.status == 1) {
-    DialogStore.confirm({
-      title: '停用确认',
-      content: `${row.p6}个应用正在使用该大模型，停用将导致不可用，请确认是否停用`,
-      onSubmit: () => {
-        pluginUpdateStatus({ ids: [row.id], status: 0 })
-          .then(() => {
-            ElMessage.success('停用成功！')
-          })
-          .catch(() => {})
-          .finally(() => {
-            onSearch()
-          })
-      },
-      onCancel: () => {},
-    })
-  } else {
-    pluginUpdateStatus({ ids: [row.id], status: 1 })
-      .then(() => {
-        ElMessage.success('启用成功！')
-      })
-      .catch(() => {})
-      .finally(() => {
-        onSearch()
-      })
-  }
-}
+const onMonitor = (row) => {}
 onMounted(() => {
   initDictionary()
   onReset()
 })
-const initDictionary = () => {
-  DictionaryStore.initModelTypes()
-  DictionaryStore.initModelProvides()
-}
+const initDictionary = () => {}
 </script>
 
 <style lang="scss" scoped>