cfel-base-components 2.5.13 → 2.5.14

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cfel-base-components",
-  "version": "2.5.13",
+  "version": "2.5.14",
   "description": "cfel-base-components",
   "main": "/src/index.tsx",
   "types": "src/index.d.ts",

package/src/apiRequest/config.ts

@@ -47,7 +47,7 @@ instance.interceptors.response.use(
     enum CodeMessage {
       "发出的请求有错误，服务器没有进行新建或修改数据的操作。" = 400,
       "用户未登录。" = 401,
-      "用户未得到授权，访问是被禁止的。" = 403,
+      "用户得到授权，但是访问是被禁止的。" = 403,
       "发出的请求针对的是不存在的记录，服务器没有进行操作。" = 404,
       "请求的格式不可得。" = 406,
       "请求的资源被永久删除，且不会再得到的。" = 410,
@@ -60,7 +60,7 @@ instance.interceptors.response.use(
 
     notification.error({
       message:
-        response?.data?.errorMsg ||
+        response?.data?.message ||
         CodeMessage[status] ||
         "服务暂不可用，请检查网络",
     });

package/src/components/universal-pages/cpcAccount/AddModal/index.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from 'react'
-import { Button, Modal, Form, Input, Radio, Space, message } from 'antd'
+import { Button, Modal, Form, Input, Radio, Space, message, Alert } from 'antd'
 let timeChange: any
 
 export default function Index({
@@ -16,8 +16,15 @@ export default function Index({
   const [secondNum, setSecondNum]: any = useState(null) //秒数
   const [showText, setShowText] = useState('')
   const formDom = [
-    { title: '名称', key: 'name', type: 'string', required: true },
-    { title: '账号', key: 'account', type: 'account', required: true },
+    { title: '名称', key: 'name', type: 'string', required: true, maxLength: 15, showCount: true },
+    {
+      title: '账号',
+      key: 'account',
+      type: 'account',
+      required: true,
+      maxLength: 12,
+      showCount: true
+    },
     { title: '密码', key: 'passwordType', type: 'psw', required: true },
     { title: ' ', key: 'password', type: 'pswDiy', required: true },
     { title: '手机号', key: 'mobile', type: 'mobileint', required: false },
@@ -25,7 +32,7 @@ export default function Index({
   ]
   const editFormDom = [
     { title: '名称', key: 'name', type: 'rString', required: false },
-    { title: '账号', key: 'account', type: 'rString', required: false },
+    { title: '账号', key: 'account', type: 'rAccountString', required: false },
     { title: '密码', key: 'passwordType', type: 'rPswString', required: false },
     { title: '手机号', key: 'mobile', type: 'rString', required: false },
     { title: '邮箱', key: 'email', type: 'rString', required: false }
@@ -66,12 +73,28 @@ export default function Index({
     }
   }, [secondNum])
 
-  const showCom = ({ title, key, type, required }: any) => {
+  const showCom = ({ title, key, type, required, maxLength, showCount }: any) => {
     let dom: any = null
     switch (type) {
       case 'rString':
         dom = <Form.Item label={title}>{editingData[key]}</Form.Item>
         break
+      case 'rAccountString':
+        dom = (
+          <Form.Item label={title}>
+            {editingData[key]}{' '}
+            <a
+              onClick={() => {
+                message.success('复制成功')
+                navigator.clipboard.writeText(editingData[key])
+              }}
+            >
+              复制
+            </a>
+          </Form.Item>
+        )
+        break
+
       case 'rPswString':
         dom = (
           <Form.Item label={title}>
@@ -84,15 +107,28 @@ export default function Index({
       case 'string':
         dom = (
           <Form.Item label={title} name={key} rules={[{ required: required, message: '请输入' }]}>
-            <Input placeholder='请输入' />
+            <Input placeholder='请输入' maxLength={maxLength} showCount={showCount} />
           </Form.Item>
         )
         break
 
       case 'account':
         dom = (
-          <Form.Item label={title} name={key} rules={[{ required: required, message: '请输入' }]}>
-            <Input placeholder='请输入' addonAfter={`@${(window as any).g_config?.tenant?.id}.oncfel.com`} />
+          <Form.Item
+            label={title}
+            name={key}
+            rules={[
+              { required: required, message: '请输入' },
+              { pattern: /^[a-zA-Z0-9]+$/, message: '只能输入英文、数字' }
+            ]}
+            extra=''
+          >
+            <Input
+              placeholder='请输入英文字符或数字'
+              addonAfter={`@${(window as any)?.g_config?.tenant?.id}.oncfel.com`}
+              maxLength={maxLength}
+              showCount={showCount}
+            />
           </Form.Item>
         )
         break
@@ -193,7 +229,7 @@ export default function Index({
   const modelSubmit = () => {
     form.validateFields().then(value => {
       setLoading(true)
-      value.account = `${value.account}@${(window as any).g_config?.tenant?.id}.oncfel.com`
+      value.account = `${value.account}@${(window as any)?.g_config?.tenant?.id}.oncfel.com`
       if (value.passwordType === 'server') {
         value.password = generateRandomString()
       }
@@ -243,6 +279,15 @@ export default function Index({
             ]
       }
     >
+      {editingData && (
+        <Alert
+          description='新账号初始密码仅可在创建时可复制，请及时保存'
+          type='info'
+          showIcon
+          style={{ marginBottom: '20px' }}
+        />
+      )}
+
       <Form
         form={form}
         layout={editingData ? 'horizontal' : 'vertical'}

package/src/components/universal-pages/cpcAccount/EditNameModal/index.tsx

@@ -0,0 +1,97 @@
+import React, { useEffect, useState } from 'react'
+import { Button, Modal, Form, Input, Radio, Space, message } from 'antd'
+
+export default function Index({
+  ModalOpen, //弹框状态
+  editOpenStatus, //关闭弹框
+  editingData, //编辑数据
+  actionFunc //新增事件
+}: any) {
+  const [form] = Form.useForm()
+  const formDom = [
+    { title: '名称', key: 'name', type: 'string', required: true, maxLength: 15, showCount: true }
+  ]
+
+  useEffect(() => {
+    if (!ModalOpen) return
+    if (editingData) {
+      console.log(editingData, 'editingData')
+      form.setFieldsValue({
+        ...editingData
+      })
+    }
+  }, [ModalOpen])
+
+  const showCom = ({ title, key, type, required, maxLength, showCount }: any) => {
+    let dom: any = null
+    switch (type) {
+      case 'string':
+        dom = (
+          <Form.Item label={title} name={key} rules={[{ required: required, message: '请输入' }]}>
+            <Input placeholder='请输入' maxLength={maxLength} showCount={showCount} />
+          </Form.Item>
+        )
+        break
+    }
+    return dom
+  }
+
+  const closeModel = () => {
+    form.resetFields()
+    editOpenStatus(false)
+  }
+
+  const modelSubmit = () => {
+    form.validateFields().then(value => {
+      actionFunc({
+        id: editingData?.id,
+        name: value?.name,
+        account: editingData?.account
+      }).then(() => {
+        form.resetFields()
+      })
+    })
+  }
+  return (
+    <Modal
+      title={'修改名称'}
+      destroyOnClose={true}
+      open={ModalOpen}
+      onCancel={() => {
+        closeModel()
+      }}
+      footer={[
+        <Button
+          key='refresh'
+          onClick={() => {
+            closeModel()
+          }}
+        >
+          取消
+        </Button>,
+        <Button
+          key='submit'
+          type='primary'
+          onClick={() => {
+            modelSubmit()
+          }}
+        >
+          确定
+        </Button>
+      ]}
+    >
+      <Form
+        form={form}
+        layout={'vertical'}
+        initialValues={{
+          remember: true
+        }}
+        autoComplete='off'
+      >
+        {formDom.map((item: any, index: number) => {
+          return <div key={index}>{showCom(item)}</div>
+        })}
+      </Form>
+    </Modal>
+  )
+}

package/src/components/universal-pages/cpcAccount/ResetModal/index.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from 'react'
-import { Button, Modal, Form, Input, Radio, Space, message } from 'antd'
+import { Button, Modal, Form, Input, Radio, Space, message, Alert } from 'antd'
 let timeChange: any
 
 export default function Index({
@@ -214,6 +214,14 @@ export default function Index({
             ]
       }
     >
+      {stepNext && (
+        <Alert
+          description='新的重置密码仅可本弹窗时复制，关闭后不可再复制，请及时保存'
+          type='info'
+          showIcon
+          style={{ marginBottom: '20px' }}
+        />
+      )}
       <Form
         form={form}
         layout={'vertical'}

package/src/components/universal-pages/cpcAccount/api.ts

@@ -31,4 +31,8 @@ export const accountPage = (data?: any) => {
   export const accountResetPw = (data?: any) => {
     return request.post('/sdk/permission/rbac/console/account/resetPw.json', { ...data })
   }
+  //更新账号
+  export const updateAccount = (data?: any) => {
+    return request.post('/sdk/permission/rbac/console/account/updateAccount.json', { ...data })
+  }
   

package/src/components/universal-pages/cpcAccount/index.tsx

@@ -19,10 +19,12 @@ import {
   accountDeleteAccount,
   accountGetAccount,
   accountGetAccountPassword,
-  accountResetPw
+  accountResetPw,
+  updateAccount
 } from './api'
 import AddModal from './AddModal'
 import ResetModal from './ResetModal'
+import EditNameModal from './EditNameModal'
 
 import './index.scss'
 
@@ -34,12 +36,14 @@ export default function Account({ historyAction }: AccountProps) {
   const searchFormRef: any = useRef()
 
   const [ModalOpen, setModalOpen] = useState(false)
-  const [id, setId] = useState(null)
   const [editingData, setEditingData]: any = useState(null) //编辑数据
 
   const [resetModalOpen, setResetModalOpen] = useState(false)
   const [resetEditingData, setResetEditingData]: any = useState(null) //编辑数据
 
+  const [editNameModalOpen, setEditNameModalOpen] = useState(false)
+  const [editNameData, setEditNameData]: any = useState(null) //编辑数据
+
   useEffect(() => {
     execute()
   }, [])
@@ -51,20 +55,13 @@ export default function Account({ historyAction }: AccountProps) {
       key: 'name',
       render: (text: any, data: any) => {
         return (
-          <>
-            <span
+          <Space>
+            <span>{data?.name}</span>
+            <FormOutlined
               style={{ cursor: 'pointer', color: '#1677ff' }}
-              onClick={() => {
-                historyAction?.push({
-                  pathname: `/account-info`,
-                  search: `?id=${data.id}`
-                })
-              }}
-            >
-              {data?.name}
-              <FormOutlined />
-            </span>
-          </>
+              onClick={() => openEditName(data)}
+            />
+          </Space>
         )
       }
     },
@@ -184,12 +181,10 @@ export default function Account({ historyAction }: AccountProps) {
   const setModalOpenFunc = (type: boolean) => {
     setModalOpen(type)
     setEditingData(null)
-    setId(null)
   }
   const actionFunc = (data: any, type: string) => {
     return accountCreateAccount({ ...data }).then((res: any) => {
       message.success(`新增成功`)
-      setId(res)
       accountGetAccountFunc(res)
       execute()
     })
@@ -222,6 +217,22 @@ export default function Account({ historyAction }: AccountProps) {
     setResetModalOpen(type)
     setResetEditingData(null)
   }
+
+  const openEditName = (data: any) => {
+    setEditNameModalOpen(true)
+    setEditNameData(data)
+  }
+  const setEditModalOpenFunc = (type: boolean) => {
+    setEditNameModalOpen(type)
+    setEditNameData(null)
+  }
+  const actionEditFunc = (data: any) => {
+    return updateAccount({ ...data }).then((res: any) => {
+      message.success(`更新名称成功`)
+      setEditModalOpenFunc(false)
+      execute()
+    })
+  }
   return (
     <PageContainer>
       <QueryFilter onReset={handleOnReset} onFinish={handleOnFinish}>
@@ -271,6 +282,12 @@ export default function Account({ historyAction }: AccountProps) {
         actionFunc={actionFunc} //事件
         accountGetAccountPasswordFunc={accountGetAccountPasswordFunc}
       />
+      <EditNameModal
+        ModalOpen={editNameModalOpen} //弹框状态
+        editOpenStatus={setEditModalOpenFunc} //关闭弹框
+        editingData={editNameData} //编辑数据
+        actionFunc={actionEditFunc} //新增事件
+      />
     </PageContainer>
   )
 }