xiaodou-ai-admin/src/pages/cvs/operator/version.vue

<template>
<a-card title="算子版本" >
  <table-pro
    :service="OperatorController.versionPage"
    :serviceParams="{aiId}"
    ref="tableProDom"
    :columns="columns"
    @add="openModal"
  >
    <template #render="{column, record}" >
      <template v-if="column.key === 'action'" >
        <a @click="del(record)">删除</a>
      </template>
    </template>
  </table-pro>
</a-card>

<modal-pro
  label='新增算子版本'
  :open="state.visible"
  @cancel="closeModal"
  @ok="submmit"
>
<a-form  style="width: 100%;" :labelCol="{span: 3}" :wrapperCol="{span: 14}" >
      <a-form-item label="算子ID"  v-bind="validateInfos.aiId" extra="仅支持小写字母、数字、中划线，64字符以内，小写字母开头"  >
        <InputTsx allowClear placeholder="请输入算子ID" v-model:value="versionState.aiId" />
      </a-form-item>
      <a-form-item label="CPU架构"   >
        <a-radio-group v-model:value="versionState.architecture" button-style="solid">
        <a-radio-button value="x86">x86</a-radio-button>
        <a-radio-button value="arm">arm</a-radio-button>
      </a-radio-group>
      </a-form-item>
      <a-form-item label="芯片品牌"   >
        <a-radio-group v-model:value="versionState.brand" button-style="solid">
        <a-radio-button value="英伟达">英伟达</a-radio-button>
        <a-radio-button value="昆仑">昆仑</a-radio-button>
      </a-radio-group>
      </a-form-item>
      <a-form-item label="芯片型号"    >
        <InputTsx allowClear placeholder="请输入芯片型号" v-model:value="versionState.chipModel" />
      </a-form-item>
      <a-form-item label="版本地址"    >
        <InputTsx allowClear placeholder="请输入版本地址" v-model:value="versionState.aiVersionPkgUrl" />
      </a-form-item>
    </a-form>
</modal-pro>
</template>
<script lang='ts' setup >
import { OperatorController } from '@/controller'
import { reactive, ref } from 'vue'
import { useRoute } from 'vue-router'
import { Form } from 'ant-design-vue'
import { InputTsx } from '@/components/MicroComponents'

const route = useRoute()

const aiId = route.query.aiId

const tableProDom = ref()

const columns = [
  {
    title: '算子版本',
    dataIndex: 'aiVersion',
    key: 'aiVersion'
  },
  {
    title: 'CPU架构',
    dataIndex: 'architecture',
    key: 'architecture'
  },
  {
    title: '芯片品牌',
    dataIndex: 'brand',
    key: 'brand'
  },
  {
    title: '芯片型号',
    dataIndex: 'chipModel',
    key: 'chipModel'
  },
  {
    title: '版本地址',
    dataIndex: 'aiVersionPkgUrl',
    key: 'aiVersionPkgUrl'
  },
  {
    title: '版本说明',
    dataIndex: 'aiVersionComment',
    key: 'aiVersionComment'
  },
  {
    title: '操作',
    dataIndex: 'action',
    key: 'action'
  }
]

const useForm = Form.useForm

const state = reactive({
  visible: false
})

const versionState = reactive<CVS.OperatorVersion>({
  aiVersionPkgUrl: '',
  architecture: 'x86',
  brand: '英伟达',
  chipModel: '',
  aiVersion: '',
  aiVersionComment: ''
})

const { resetFields, validate, validateInfos } = useForm(versionState, {

})

const openModal = () => {
  state.visible = true
}

const closeModal = () => {
  state.visible = false
}

const submmit = () => {
  validate().then(async () => {
    await OperatorController.addVersion(versionState)
    closeModal()
    resetFields({})
    tableProDom.value.reload()
  }).catch(() => {})
}

const del = async (record: CVS.OperatorVersion) => {
  await OperatorController.delVersion(record.id!)
  tableProDom.value.reload()
}

</script>
<style lang='less' scoped >
</style>