From faf527dfb76143d37969b3099a4ba8c6cf85bcf1 Mon Sep 17 00:00:00 2001 From: linqiqi077 <865530219@qq.com> Date: Thu, 21 Dec 2023 18:05:14 +0800 Subject: [PATCH 1/2] =?UTF-8?q?feat:=20model-app=20support=20create?= =?UTF-8?q?=E3=80=81edit=E3=80=81delete=20api?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pnpm-lock.yaml | 8 + src/pages/ModelAppList/index.jsx | 444 ++++++++++++++++++++++++------- 2 files changed, 351 insertions(+), 101 deletions(-) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 66b6038..0e4b3ed 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -13028,6 +13028,14 @@ packages: react: 18.2.0 dev: false + /lucide-react@0.299.0(react@18.2.0): + resolution: {integrity: sha512-59MiDzDzFI/efHhb4n0vGdXelMNwou7JlAFvVS4boA1G/7aYU7garPciYo73CODzkhrhz0JOgdtSTPSe5dMrlQ==} + peerDependencies: + react: ^16.5.1 || ^17.0.0 || ^18.0.0 + dependencies: + react: 18.2.0 + dev: false + /lz-string@1.5.0: resolution: {integrity: sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==} hasBin: true diff --git a/src/pages/ModelAppList/index.jsx b/src/pages/ModelAppList/index.jsx index 598bbdb..7182c71 100644 --- a/src/pages/ModelAppList/index.jsx +++ b/src/pages/ModelAppList/index.jsx @@ -4,6 +4,11 @@ import React from 'react'; import { Page, + Modal, + FormilyForm, + FormilyInput, + FormilyUpload, + FormilyTextArea, Row, Col, Typography, @@ -13,24 +18,19 @@ import { Button, Input, List, + Image, Dropdown, Divider, Descriptions, Status, Pagination, - Modal, - FormilyForm, - FormilyInput, - FormilyUpload, - FormilyTextArea, } from '@tenx-ui/materials'; import { + AntdIconCloudUploadOutlined, AntdIconPlusOutlined, AntdIconReloadOutlined, - AntdIconCodeSandboxCircleFilled, AntdIconSettingOutlined, - AntdIconCloudUploadOutlined, } from '@tenx-ui/icon-materials'; import { useLocation, matchPath } from '@umijs/max'; @@ -76,12 +76,14 @@ class ModelAppList$$Page extends React.Component { __$$i18n._inject2(this); this.state = { + createBtnLoading: false, createModalVisible: false, currentRecord: null, data: [], - deleteBtnLoading: false, deleteLoading: false, deleteModalVisible: false, + editBtnLoading: false, + editModalVisible: false, fileList: [], imageUrl: '', keyword: '', @@ -147,7 +149,6 @@ class ModelAppList$$Page extends React.Component { input: params, }) .then(res => { - console.log(res); const { Application } = res; const { listApplicationMetadata } = Application || {}; const { nodes, totalCount } = listApplicationMetadata || {}; @@ -183,6 +184,15 @@ class ModelAppList$$Page extends React.Component { }); } + async handlePreview(file) { + if (!file.url && !file.preview) { + file.preview = await this.getBase64(file.originFileObj); + } + this.setState({ + imageUrl: file.url || file.preview, + }); + } + onChange(page, pageSize) { // 页码或 pageSize 改变的回调 this.setState( @@ -202,11 +212,11 @@ class ModelAppList$$Page extends React.Component { onCloseCreateModel() { this.setState({ createModalVisible: false, + createBtnLoading: false, }); } onCloseDeleteModal(e, isNeedLoad) { - console.log('isNeedLoad', isNeedLoad); this.setState({ deleteModalVisible: false, currentRecord: null, @@ -216,12 +226,18 @@ class ModelAppList$$Page extends React.Component { } } + onCloseEditModel() { + this.setState({ + editModalVisible: false, + editBtnLoading: false, + }); + } + onCreateClick(event) { this.history.push(`/model-app/create`); } onDelete() { - console.log(this.utils.bff); this.setState({ deleteLoading: true, }); @@ -230,37 +246,102 @@ class ModelAppList$$Page extends React.Component { namespace: project, name: this.state.currentRecord.name, }; - /**删除方法 - this.utils.bff.deleteModel({ input: params }).then(res => { - this.setState({ - deleteLoading: false - }) - this.utils.notification.success({ - message: '删除模型成功', - }); - // 'event' 传参无意义，仅仅为了占数 - this.onCloseDeleteModal('event',true) - }).catch(error => { - this.setState({ - deleteLoading: false - }) - this.utils.notification.warn({ - message: '删除模型失败', - }); - }) - */ + //删除方法 + this.utils.bff + .deleteApplication({ + input: params, + }) + .then(res => { + this.setState({ + deleteLoading: false, + }); + this.utils.notification.success({ + message: '删除应用成功', + }); + // 'event' 传参无意义，仅仅为了占数 + this.onCloseDeleteModal('event', true); + }) + .catch(error => { + this.setState({ + deleteLoading: false, + }); + this.utils.notification.warn({ + message: '删除应用失败', + }); + }); } onDetailClick(e, extParams) { // 事件的 handler - this.history.push( - `/chat?appNamespace=${extParams.data.namespace}&appName=${extParams.data.name}` - ); + this.history.push(`/model-app/detail/${extParams.data.name}`); } - onEdit(item) { - // this.history.push(`/model-app/edit/${item.name}`) + onEdit() { + this.setState({ + editBtnLoading: true, + }); + this.form('edit_form') + .validate() + .then(res => { + const values = this.form('edit_form').values; + if (this.state.fileList[0]?.originFileObj) { + this.getBase64(this.state.fileList[0].originFileObj).then(res => { + const project = this.utils.getAuthData()?.project; + const params = { + namespace: project, + name: values.name, + displayName: values.displayName, + description: values.description, + icon: res, + }; + this.utils.bff + .updateApplication({ + input: params, + }) + .then(res => { + this.utils.notification.success({ + message: '编辑成功', + }); + this.setState({ + editBtnLoading: false, + }); + this.onCloseEditModel(); + this.getData(); + }); + }); + } else { + const project = this.utils.getAuthData()?.project; + console.log(this.state.fileList); + const params = { + namespace: project, + name: values.name, + displayName: values.displayName, + description: values.description, + icon: this.state.fileList[0].url, + }; + this.utils.bff + .updateApplication({ + input: params, + }) + .then(res => { + this.utils.notification.success({ + message: '编辑成功', + }); + this.setState({ + editBtnLoading: false, + }); + this.onCloseEditModel(); + this.getData(); + }); + } + }) + .catch(err => { + console.log(err); + this.setState({ + editBtnLoading: false, + }); + }); } onMenuClick(opItem, record) { @@ -269,7 +350,7 @@ class ModelAppList$$Page extends React.Component { if (key === 'delete') { this.openDeleteModal(record.item); } else if (key === 'edit') { - this.onEdit(record.item); + this.openEditModal(record.item); } } @@ -305,29 +386,43 @@ class ModelAppList$$Page extends React.Component { } onSubmitCreate() { + this.setState({ + createBtnLoading: true, + }); this.form('create_form') .validate() .then(res => { const values = this.form('create_form').values; this.getBase64(this.state.fileList[0].originFileObj).then(res => { const project = this.utils.getAuthData()?.project; - console.log(values); const params = { namespace: project, name: values.name, displayName: values.displayName, icon: res, + description: values.description, }; this.utils.bff - .createKnowledgeBaseApplication({ + .createApplication({ input: params, }) .then(res => { - const { KnowledgeBaseApplication } = res; - const { createKnowledgeBaseApplication } = KnowledgeBaseApplication || {}; - console.log(createKnowledgeBaseApplication); + this.utils.notification.success({ + message: '创建成功', + }); + this.setState({ + createBtnLoading: false, + }); + this.onCloseCreateModel(); + this.getData(); }); }); + }) + .catch(err => { + console.log(err); + this.setState({ + createBtnLoading: false, + }); }); } @@ -338,6 +433,41 @@ class ModelAppList$$Page extends React.Component { }); } + openEditModal(item) { + this.setState( + { + editModalVisible: true, + currentRecord: item, + }, + () => { + const pageThis = this; + setTimeout(() => { + pageThis.form('edit_form')?.setValues({ + name: this.state.currentRecord.name, + displayName: this.state.currentRecord.displayName, + icon: { + fileList: [ + { + status: 'done', + url: this.state.currentRecord.icon, + }, + ], + }, + description: this.state.currentRecord.description, + }); + }, 500); + this.setState({ + fileList: [ + { + status: 'done', + url: this.state.currentRecord.icon, + }, + ], + }); + } + ); + } + showTotal(total, range) { // 用于格式化显示表格数据总量 return `共 ${total} 条`; @@ -353,6 +483,121 @@ class ModelAppList$$Page extends React.Component { const { state } = __$$context; return ( + this.state.createBtnLoading)} + destroyOnClose={true} + forceRender={false} + keyboard={true} + mask={true} + maskClosable={false} + onCancel={function () { + return this.onCloseCreateModel.apply( + this, + Array.prototype.slice.call(arguments).concat([]) + ); + }.bind(this)} + onOk={function () { + return this.onSubmitCreate.apply( + this, + Array.prototype.slice.call(arguments).concat([]) + ); + }.bind(this)} + open={__$$eval(() => this.state.createModalVisible)} + title="新增应用" + > + + + + this.state.fileList), + listType: 'picture', + maxCount: 1, + onChange: function () { + return this.handleImageChange.apply( + this, + Array.prototype.slice.call(arguments).concat([]) + ); + }.bind(this), + }, + }} + decoratorProps={{ 'x-decorator-props': { labelEllipsis: true, size: 'default' } }} + fieldProps={{ + name: '_icon', + required: true, + title: '上传', + 'x-component': 'FormilyUpload', + 'x-validator': [], + }} + > + + + + + - item.icon)} + width={56} /> @@ -639,6 +878,12 @@ class ModelAppList$$Page extends React.Component { this.state.pages.currentPage)} + onChange={function () { + return this.onChange.apply( + this, + Array.prototype.slice.call(arguments).concat([]) + ); + }.bind(this)} pageSize={__$$eval(() => this.state.pages.pageSize)} showTotal={function () { return this.showTotal.apply( @@ -655,59 +900,26 @@ class ModelAppList$$Page extends React.Component { - this.state.deleteLoading)} - destroyOnClose={true} - forceRender={false} - keyboard={true} - mask={true} - maskClosable={false} - okButtonProps={{ disabled: false }} - onCancel={function () { - return this.onCloseDeleteModal.apply( - this, - Array.prototype.slice.call(arguments).concat([]) - ); - }.bind(this)} - onOk={function () { - return this.onDelete.apply(this, Array.prototype.slice.call(arguments).concat([])); - }.bind(this)} - open={__$$eval(() => this.state.deleteModalVisible)} - title="删除模型" - > - - this.state.editBtnLoading)} destroyOnClose={true} forceRender={false} keyboard={true} mask={true} maskClosable={false} onCancel={function () { - return this.onCloseCreateModel.apply( + return this.onCloseEditModel.apply( this, Array.prototype.slice.call(arguments).concat([]) ); }.bind(this)} onOk={function () { - return this.onSubmitCreate.apply( - this, - Array.prototype.slice.call(arguments).concat([]) - ); + return this.onEdit.apply(this, Array.prototype.slice.call(arguments).concat([])); }.bind(this)} - open={__$$eval(() => this.state.createModalVisible)} - title="新增应用" + open={__$$eval(() => this.state.editModalVisible)} + title="编辑应用" > @@ -755,7 +968,7 @@ class ModelAppList$$Page extends React.Component { ); }.bind(this), fileList: __$$eval(() => this.state.fileList), - listType: 'picture-circle', + listType: 'picture', maxCount: 1, onChange: function () { return this.handleImageChange.apply( @@ -767,18 +980,17 @@ class ModelAppList$$Page extends React.Component { }} decoratorProps={{ 'x-decorator-props': { labelEllipsis: true, size: 'default' } }} fieldProps={{ - name: '_icon', + name: 'icon', + required: true, title: '上传', 'x-component': 'FormilyUpload', 'x-validator': [], }} > - {!!__$$eval(() => !this.state.fileList.length) && ( - - )} + + this.state.deleteLoading)} + destroyOnClose={true} + forceRender={false} + keyboard={true} + mask={true} + maskClosable={false} + okButtonProps={{ disabled: false }} + onCancel={function () { + return this.onCloseDeleteModal.apply( + this, + Array.prototype.slice.call(arguments).concat([]) + ); + }.bind(this)} + onOk={function () { + return this.onDelete.apply(this, Array.prototype.slice.call(arguments).concat([])); + }.bind(this)} + open={__$$eval(() => this.state.deleteModalVisible)} + title="删除模型" + > + + ); } From f3d6f1d989ad826f83adf1cf45fb3bcd967ee37d Mon Sep 17 00:00:00 2001 From: linqiqi077 <865530219@qq.com> Date: Thu, 21 Dec 2023 18:08:56 +0800 Subject: [PATCH 2/2] feat: create-data-handle qa-split config add high-config --- src/pages/CreateDataHandle/index.jsx | 363 ++++++++++++++++++++++++++- 1 file changed, 359 insertions(+), 4 deletions(-) diff --git a/src/pages/CreateDataHandle/index.jsx b/src/pages/CreateDataHandle/index.jsx index 9fda854..2e18122 100644 --- a/src/pages/CreateDataHandle/index.jsx +++ b/src/pages/CreateDataHandle/index.jsx @@ -4,18 +4,21 @@ import React from 'react'; import { Page, + Modal, Row, Col, + Typography, + Slider, + FormilyForm, + FormilyNumberPicker, + FormilyTextArea, Space, Button, - Typography, Steps, Divider, Card, Switch, Progress, - FormilyForm, - FormilyNumberPicker, FormilySelect, Table, InnerHtmlContainer, @@ -145,6 +148,7 @@ class $$Page extends React.Component { '这个文档中的电话、身份证号、银行卡号等信息将会被去除，如：手机号 ，身份证号，银行卡号', }, ], + cacheqaSplitHighConfig: {}, configEnableMap: {}, configMap: { qa_split: 'QAsplitChecked', @@ -164,6 +168,7 @@ class $$Page extends React.Component { special_character_rate: 'SpecialCharactersRateChecked', pornography_violence_word_rate: 'PornographicViolenceRateChecked', }, + configVisible: false, currentStep: 0, dataSetDataList: [], dataSetFileList: [], @@ -175,7 +180,18 @@ class $$Page extends React.Component { fileSelectCheckErrorFlag: false, fileTableLoading: false, llmList: [], + max_token_marks: { + 10: '10', + 4096: '4096', + }, numberInputStep: 0.1, + qaSplitHighConfig: { + temperature: 40, + max_tokens: 512, + prompt_template: `{text} + +请将上述内容按照问答的方式，提出不超过 25 个问题，并给出每个问题的答案，每个问题必须有 Q 和对应的 A，并严格按照以下方式展示： Q1: 问题。\n A1: 答案。\n Q2: 问题 \n A2: 答案\n 注意，尽可能多的提出问题，但是 Q 不要重复，也不要出现只有 Q 没有 A 的情况。`, + }, selectedFileList: [], showLlmModel: false, step1FormData: {}, @@ -210,6 +226,10 @@ class $$Page extends React.Component { RemoveNumberChecked: false, }, step4Data: [], + temperature_marks: { + 0: '精确', + 100: '随机', + }, }; } @@ -269,6 +289,8 @@ class $$Page extends React.Component { item => item.value === this.state.step3Data.QAsplitForm.type )._models[0] : this.state.step3Data.QAsplitForm.model, + ...this.state.qaSplitHighConfig, + temperature: this.state.qaSplitHighConfig.temperature / 100, }, } : {}; @@ -483,6 +505,15 @@ class $$Page extends React.Component { this.history.push('/data-handle'); } + onCloseConfigModal() { + this.setState({ + configVisible: false, + qaSplitHighConfig: { + ...this.state.cacheqaSplitHighConfig, + }, + }); + } + onDataSetChange(v) { this.setState({ dataSetFileList: [], @@ -652,6 +683,24 @@ class $$Page extends React.Component { ); } + onOpenConfigModal() { + this.setState({ + configVisible: true, + cacheqaSplitHighConfig: { + ...this.state.qaSplitHighConfig, + }, + }); + this.form('temperature_form')?.setValues({ + temperature: this.state.qaSplitHighConfig.temperature / 100, + }); + this.form('max_tokens_form')?.setValues({ + max_tokens: this.state.qaSplitHighConfig.max_tokens, + }); + this.form('prompt_template_form')?.setValues({ + prompt_template: this.state.qaSplitHighConfig.prompt_template, + }); + } + onPageChange(page) { this.setState( { @@ -710,6 +759,15 @@ class $$Page extends React.Component { }); } + onSubmitHighConfig() { + this.setState({ + configVisible: false, + cacheqaSplitHighConfig: { + ...this.state.qaSplitHighConfig, + }, + }); + } + setDataSetVersionsSource(v) { const obj = this.state.dataSetDataList.find(item => item.value === v); const genOptionList = obj.versions; @@ -721,6 +779,42 @@ class $$Page extends React.Component { }); } + setQaSplitHighConfigValue(value, event, extraParams = {}) { + const fieldName = { + ...event, + ...extraParams, + }.fieldName; + const times = { + ...event, + ...extraParams, + }.times; + console.log({ + ...event, + ...extraParams, + }); + const qaSplitHighConfig = { + ...this.state.qaSplitHighConfig, + [fieldName]: times ? value * times : value, + }; + this.setState( + { + qaSplitHighConfig, + }, + () => { + console.log(this.state.qaSplitHighConfig); + } + ); + if (fieldName === 'temperature') { + this.form('temperature_form').setValues({ + temperature: qaSplitHighConfig.temperature / 100, + }); + } else if (fieldName === 'max_tokens') { + this.form('max_tokens_form').setValues({ + max_tokens: value, + }); + } + } + updateStep3State(value, event, extraParams = {}) { const fieldName = { ...event, @@ -768,6 +862,247 @@ class $$Page extends React.Component { const { state } = __$$context; return ( + this.state.configVisible)} + title="模型高级配置" + width="700px" + > + + + + 温度 + + + + + + this.state.temperature_marks)} + max={100} + min={0} + onChange={function () { + return this.setQaSplitHighConfigValue.apply( + this, + Array.prototype.slice.call(arguments).concat([ + { + fieldName: 'temperature', + }, + ]) + ); + }.bind(this)} + value={__$$eval(() => this.state.qaSplitHighConfig.temperature)} + /> + + + + 1 / 100), + }, + }} + decoratorProps={{ 'x-decorator-props': { labelEllipsis: true } }} + fieldProps={{ + _unsafe_MixedSetter_default_select: 'VariableSetter', + default: __$$eval(() => this.state.qaSplitHighConfig.temperature / 100), + name: 'temperature', + title: '', + 'x-validator': [], + }} + /> + + + + + + + + + 最大响应长度 + + + + + + this.state.max_token_marks)} + max={4096} + min={10} + onChange={function () { + return this.setQaSplitHighConfigValue.apply( + this, + Array.prototype.slice.call(arguments).concat([ + { + fieldName: 'max_tokens', + }, + ]) + ); + }.bind(this)} + value={__$$eval(() => this.state.qaSplitHighConfig.max_tokens)} + /> + + + + this.state.qaSplitHighConfig.max_tokens), + name: 'max_tokens', + title: '', + 'x-validator': [], + }} + /> + + + + + + + this.state.qaSplitHighConfig.prompt_template), + name: 'prompt_template', + title: 'QA 拆分 Prompt', + 'x-component': 'Input.TextArea', + 'x-validator': [], + }} + /> + + @@ -3015,6 +3350,26 @@ class $$Page extends React.Component { + + + + + 高级配置 + + + - 根据文件中的文章与图表标题，自动将文件做 QA 拆分处理。 + 根据文件中的文章内容，自动将文件做 QA 拆分处理。