优化：后台管理店铺页面非飞手团队添加企业案例说明以及企业案例视频

src/api/interface/customManageType.ts

@@ -340,3 +340,30 @@ export type deleteSuggestionType = InterFunction<
   },
   NonNullable<unknown>
 >;
+// 后台--添加(修改)后台企业案例
+export type updateBusinessCaseType = InterFunction<
+  {
+    id?: number;
+    businessDescription?: string;
+    businessVideo?: string;
+  },
+  NonNullable<unknown>
+>;
+// 后台--获取后台企业案例
+export type getBusinessCaseType = InterFunction<
+  {
+    backUserId: number;
+  },
+  {
+    id?: number;
+    businessDescription?: string;
+    businessVideo: string;
+  }[]
+>;
+// 后台--删除后台企业案例
+export type deleteBusinessCaseType = InterFunction<
+  {
+    id?: number;
+  },
+  NonNullable<unknown>
+>;

src/api/interface/systemManageType.ts

@@ -213,6 +213,7 @@ export type getCompanyInfoByIdType = InterFunction<
     content: string;
     profileUrl: string;
     backUserId: number;
+    cooperationTagId: number;
   }
 >;
 //单位-成员列表

src/api/modules/customManage.ts

@@ -9,9 +9,11 @@ import {
   CompanyListTag,
   cooperationListTag,
   deleteApplyTag,
+  deleteBusinessCaseType,
   deleteSuggestionType,
   editUserApplyTag,
   editUserApplyTagDetails,
+  getBusinessCaseType,
   getListPartnerType,
   getSuggestionType,
   listAppUserCountType,
@@ -19,6 +21,7 @@ import {
   listAuthPageType,
   listUserApplyTag,
   listUserRcdType,
+  updateBusinessCaseType,
   updateSuggestionType,
   userAccountUpdateType,
 } from '~/api/interface/customManageType';
@@ -89,4 +92,13 @@ export class CustomManageAPI {
   // 后台--删除后台用户建议
   static deleteSuggestion: deleteSuggestionType = (params) =>
     axios.get('/userapp/back-user/deleteSuggestion', { params });
+  // 后台--获取企业解决方案列表
+  static getBusinessCase: getBusinessCaseType = (params) =>
+    axios.get('/userapp/back-user/getBusinessCase', { params });
+  // 后台--修改企业解决方案列表
+  static updateBusinessCase: updateBusinessCaseType = (params) =>
+    axios.post('/userapp/back-user/insertBusinessCase', params);
+  // 后台--删除企业解决方案列表
+  static deleteBusinessCase: deleteBusinessCaseType = (params) =>
+    axios.get('/userapp/back-user/deleteBusinessCase', { params });
 }

src/components/video/index.tsx

@@ -12,19 +12,19 @@ interface propsType {
   controls?: boolean;
 }
 
-const Video: React.FC<propsType> = (props) => {
-  // 组件的默认值
-  Video.defaultProps = {
-    src: 'http://share-fly.oss-cn-hangzhou.aliyuncs.com/file/3505c402-cbf9-41a5-9d6f-bdb350625bea.jpg',
+const Video: React.FC<propsType> = (
+  props = {
+    src: 'https://file.iuav.com/file/sharefly-logo-2024.png',
     width: 40,
     height: 40,
-  };
+  },
+) => {
   // 视频是否预览
   const [isPreview, setIsPreview] = React.useState<boolean>(false);
   return (
     <>
       <Image
-        src={`${props?.src}?x-oss-process=video/snapshot,t_3618&x-oss-process=image/quality,q_25`}
+        src={`${props?.src}?x-oss-process=video/snapshot,t_1000,f_jpg`}
         width={props?.width}
         height={props?.height}
         preview={false}

src/pages/resourceManage/storeDecorate/comp/addBusinessCase/index.tsx

+import React, { useEffect } from 'react';
+import { Form, Input, message, Modal, ModalProps } from 'antd';
+import { InterDataType, InterReqType } from '~/api/interface';
+import { getCompanyInfoByIdType } from '~/api/interface/systemManageType';
+import { UploadOutlined } from '@ant-design/icons';
+import { Uploader } from '~/components/uploader';
+import { getBusinessCaseType, updateBusinessCaseType } from '~/api/interface/customManageType';
+import { CustomManageAPI } from '~/api';
+
+// 店铺类型
+type DetailType = InterDataType<getCompanyInfoByIdType>;
+// 请求类型
+type ReqType = InterReqType<updateBusinessCaseType>;
+// 列表类型
+type DataType = InterDataType<getBusinessCaseType>[0];
+
+const AddSolutionModal: React.FC<
+  ModalProps & { detail: DetailType; onCancel?: () => void; data?: DataType }
+> = ({ open, title, onCancel, data }) => {
+  // 表单数据
+  const [form] = Form.useForm<ReqType & { businessVideo: { url: string }[] }>();
+  // 取消事件
+  const handleCancel = () => {
+    form.resetFields();
+    onCancel?.();
+  };
+  // 确定事件
+  const handleOk = () => {
+    form
+      .validateFields()
+      .then(async (values) => {
+        await handleSubmit(values);
+      })
+      .catch((err) => {
+        // console.log('确定事件 --->', err);
+        message
+          .warning({
+            content: err.errorFields[0].errors[0],
+          })
+          .then();
+      });
+  };
+  // 提交事件
+  const handleSubmit = async (values: ReqType & { businessVideo: { url: string }[] }) => {
+    const res = await CustomManageAPI.updateBusinessCase({
+      businessDescription: values?.businessDescription,
+      businessVideo: values?.businessVideo?.[0]?.url,
+      id: data?.id,
+    });
+    if (res && res.code === '200') {
+      message.success({ content: '操作成功' });
+      handleCancel();
+      // console.log('提交事件 --->', values);
+    }
+  };
+  // 组件挂载
+  useEffect(() => {
+    if (!data?.id) return;
+    form.setFieldsValue({
+      ...data,
+      businessVideo: [{ url: data?.businessVideo }],
+    });
+  }, [data]);
+  return (
+    <Modal open={open} title={title} width={450} onCancel={handleCancel} onOk={handleOk}>
+      <Form form={form} labelCol={{ span: 4 }} wrapperCol={{ span: 16 }}>
+        <Form.Item
+          label='案例说明'
+          name='businessDescription'
+          rules={[{ required: true, message: '请输入案例说明' }]}
+        >
+          <Input.TextArea placeholder={'请输入案例说明'} maxLength={100} allowClear showCount />
+        </Form.Item>
+        <Form.Item
+          label='案例视频'
+          name='businessVideo'
+          rules={[{ required: true, message: '请输入案例视频' }]}
+        >
+          <Uploader
+            fileUpload
+            listType='picture-card'
+            fileLength={1}
+            fileType={['video/mp4', 'video/avi', 'video/wmv', 'video/rmvb']}
+            fileSize={100}
+          >
+            <UploadOutlined />
+          </Uploader>
+        </Form.Item>
+      </Form>
+    </Modal>
+  );
+};
+
+export default AddSolutionModal;

src/pages/resourceManage/storeDecorate/comp/storeBusinessCase/index.tsx

+import React, { useEffect, useState } from 'react';
+import { InterDataType } from '~/api/interface';
+import { getCompanyInfoByIdType } from '~/api/interface/systemManageType';
+import { CustomManageAPI } from '~/api';
+import { Button, Table, Modal, message } from 'antd';
+import { PlusOutlined } from '@ant-design/icons';
+import { getBusinessCaseType } from '~/api/interface/customManageType';
+import { ColumnsType } from 'antd/es/table';
+import AddBusinessCase from '~/pages/resourceManage/storeDecorate/comp/addBusinessCase';
+import Video from '~/components/video';
+
+// 店铺类型
+type DetailType = InterDataType<getCompanyInfoByIdType>;
+// 列表类型
+type ListType = InterDataType<getBusinessCaseType>;
+
+const StoreBusinessCase: React.FC<{
+  detail: DetailType;
+}> = ({ detail }) => {
+  // 添加解决方案是否显示
+  const [isAddSolution, setIsAddSolution] = useState<boolean>(false);
+  // 当前编辑的数据
+  const [editData, setEditData] = useState<ListType[0]>();
+  // 解决方案列表
+  const [businessList, setBusinessList] = useState<ListType>([]);
+  // 获取解决方案列表
+  const getSolutionList = async () => {
+    const res = await CustomManageAPI.getBusinessCase({
+      backUserId: detail?.backUserId,
+    });
+    if (res && res.code === '200') {
+      setBusinessList(res.result);
+      // console.log('获取解决方案列表 --->', res.result);
+    }
+  };
+  // 删除事件
+  const handleDelete = (record: ListType[0]) => {
+    Modal.confirm({
+      title: '提示',
+      content: '删除后将无法恢复，是否确认删除？',
+      onOk: async () => {
+        const res = await CustomManageAPI.deleteBusinessCase({
+          id: record?.id,
+        });
+        if (res && res.code === '200') {
+          await getSolutionList();
+          message.success('删除成功');
+        }
+      },
+    });
+  };
+  // 组件挂载
+  useEffect(() => {
+    if (detail?.backUserId) getSolutionList().then();
+    // console.log('storeSolutionView --->', detail);
+  }, []);
+  const columns: ColumnsType<ListType[0]> = [
+    {
+      title: '序号',
+      dataIndex: 'accountNo',
+      align: 'center',
+      width: '50px',
+      render: (_text, _record, index) => index + 1,
+    },
+    {
+      title: '案例说明',
+      dataIndex: 'businessDescription',
+      align: 'center',
+    },
+    {
+      title: '案例视频',
+      dataIndex: 'businessVideo',
+      align: 'center',
+      render: (text) => <Video src={text} width={40} height={40} />,
+    },
+    {
+      title: '操作',
+      dataIndex: 'action',
+      align: 'center',
+      render: (_text, record) => (
+        <>
+          <Button
+            type={'link'}
+            onClick={() => {
+              setEditData(record);
+              setIsAddSolution(true);
+            }}
+          >
+            编辑
+          </Button>
+          <Button type={'link'} onClick={() => handleDelete(record)} danger>
+            删除
+          </Button>
+        </>
+      ),
+    },
+  ];
+  return (
+    <>
+      <div className={'store-title flex-between'}>
+        <div className='title'>企业业务案例</div>
+        <div className='action'>
+          <Button icon={<PlusOutlined />} type={'primary'} onClick={() => setIsAddSolution(true)}>
+            添加企业案例
+          </Button>
+        </div>
+      </div>
+      <Table
+        dataSource={businessList}
+        rowKey={'id'}
+        columns={columns}
+        size={'small'}
+        bordered={true}
+      ></Table>
+      <AddBusinessCase
+        open={isAddSolution}
+        detail={detail}
+        data={editData}
+        title={editData?.id ? '编辑企业案例' : '添加企业案例'}
+        onCancel={() => {
+          setIsAddSolution(false);
+          setEditData(undefined);
+          getSolutionList().then();
+        }}
+      />
+    </>
+  );
+};
+
+export default StoreBusinessCase;

src/pages/resourceManage/storeDecorate/comp/storeFormView/index.tsx

@@ -150,9 +150,9 @@ const StoreFormView: React.FC<{
           <Input placeholder={'请输入企业名称'} maxLength={25} allowClear />
         </Form.Item>
         <Form.Item
-          label='网点地址'
+          label='公司地址'
           name='address'
-          rules={[{ required: true, message: '请选择网点地址' }]}
+          rules={[{ required: true, message: '请选择公司地址' }]}
         >
           <Input
             value={detail?.address}
@@ -182,7 +182,7 @@ const StoreFormView: React.FC<{
             <UploadOutlined />
           </Uploader>
         </Form.Item>
-        <Form.Item label='店铺视频' name='videoList'>
+        <Form.Item label='公司宣传片' name='videoList'>
           <Uploader
             fileUpload
             listType='picture-card'
@@ -196,9 +196,9 @@ const StoreFormView: React.FC<{
           </Uploader>
         </Form.Item>
         <Form.Item
-          label='服务资质'
+          label='公司简介'
           name='content'
-          rules={[{ required: true, message: '请输入服务资质' }]}
+          rules={[{ required: true, message: '请输入公司简介' }]}
         >
           <Input.TextArea
             placeholder={'请输入服务资质（“；”号换行）'}

src/pages/resourceManage/storeDecorate/index.tsx

@@ -5,6 +5,7 @@ import { SystemManageAPI } from '~/api';
 import { getCompanyInfoByIdType } from '~/api/interface/systemManageType';
 import './index.scss';
 import StoreFormView from '~/pages/resourceManage/storeDecorate/comp/storeFormView';
+import StoreBusinessCase from '~/pages/resourceManage/storeDecorate/comp/storeBusinessCase';
 import StoreSolutionView from '~/pages/resourceManage/storeDecorate/comp/storeSolutionView';
 
 // 店铺类型
@@ -34,9 +35,15 @@ const StoreDecoratePage: React.FC = () => {
           <div className={'store-form'}>
             <StoreFormView detail={storeDetail} onRefresh={getStoreApplyDetail} />
           </div>
-          <div className={'store-solution'}>
-            <StoreSolutionView detail={storeDetail} />
-          </div>
+          {storeDetail?.cooperationTagId === 5 ? (
+            <div className={'store-solution'}>
+              <StoreSolutionView detail={storeDetail} />
+            </div>
+          ) : (
+            <div className={'store-solution'}>
+              <StoreBusinessCase detail={storeDetail} />
+            </div>
+          )}
         </>
       )}
     </div>