fix: 自营商城模板使用商城问题修改

src/locales/en-US/shop.ts

@@ -3,8 +3,8 @@
  */
  export default {
   /** Shop */
-  'shop.form.label.memberShopAreas':'Attribution to the city',
-  'shop.form.memberShopAreas.required':'Please select the attribution city',
+  'shop.form.label.memberShopAreas':'City of business',
+  'shop.form.memberShopAreas.required':'Please select the city where the business is located',
   'shop.form.upload.size.limit':'Upload file size does not exceed 50M!',
   'shop.form.upload.type.required':'Please upload a pdf format file',
   'shop.form.label.name':'Shop name',

src/locales/ko-KR/shop.ts

@@ -3,8 +3,8 @@
  */
 export default {
   /** 店铺 */
-  'shop.form.label.memberShopAreas': '귀속지',
-  'shop.form.memberShopAreas.required': '귀속지를 선택하십시오',
+  'shop.form.label.memberShopAreas': '비즈니스의 도시',
+  'shop.form.memberShopAreas.required': '사업장이 위치한 도시를 선택하세요.',
   'shop.form.upload.size.limit': '업로드 파일 크기가 50M을 넘지 않습니다!',
   'shop.form.upload.type.required': 'pdf 형식 파일을 업로드하십시오',
   'shop.form.label.name': '가게 이름',

src/locales/zh-CN/shop.ts

@@ -3,8 +3,8 @@
  */
 export default {
   /** 店铺 */
-  'shop.form.label.memberShopAreas': '归属地市',
-  'shop.form.memberShopAreas.required': '请选择归属地市',
+  'shop.form.label.memberShopAreas': '业务所在地市',
+  'shop.form.memberShopAreas.required': '请选择业务所在地市',
   'shop.form.upload.size.limit': '上传文件大小不超过 50M!',
   'shop.form.upload.type.required': '请上传pdf格式文件',
   'shop.form.label.name': '店铺名称',

src/pages/ownMall/ownMallManager/components/useModal/index.tsx

-import React from 'react'
-import { Modal } from 'antd'
+import React, { useEffect, useState } from 'react'
+import { Modal, Form, Select } from 'antd'
+import isEmpty from 'lodash/isEmpty'
 import styles from './index.less'
 import { useIntl } from 'umi'
+import { PostManageWebShopWebAllResponse } from '@/services/ManageV2Api'
+
+export interface MallItemType {
+  id: number;
+  name: string;
+  type: number;
+  environment: number;
+  property: number;
+  self: number;
+  memberOperate: number;
+  logoUrl: string;
+  describe: string;
+  state: number;
+  url: string;
+  isDefault: number;
+  createTime: number;
+}
 
 interface UseModalPropsType {
   visible: boolean;
@@ -10,11 +28,41 @@ interface UseModalPropsType {
   title: string;
   dataInfo: any;
   confirmLoading?: boolean;
+  mallList: MallItemType[]
+}
+
+interface SelectItemType {
+  label: string,
+  value: number,
 }
 
 const UseModal: React.FC<UseModalPropsType> = (props) => {
-  const { visible, onOk, onCancel, title, dataInfo = {}, confirmLoading = false } = props
+  const { visible, onOk, onCancel, title, dataInfo = {}, confirmLoading = false, mallList } = props
+  const [selectItem, setSelectItem] = useState<SelectItemType>()
   const intl = useIntl()
+  const [form] = Form.useForm()
+
+  useEffect(() => {
+    if (!isEmpty(dataInfo)) {
+      const item = mallList.filter((item) => item.id === dataInfo.shopId)[0]
+      if (item) {
+        setSelectItem({
+          label: item.name,
+          value: item.id
+        })
+        form.setFieldsValue({ shopId: item.id })
+      }
+    }
+  }, [dataInfo])
+
+  const layout = {
+    labelCol: { span: 24 },
+    wrapperCol: { span: 24 },
+  };
+
+  const handleSelect = (_, option) => {
+    setSelectItem(option)
+  }
 
   return (
     <Modal
@@ -22,10 +70,32 @@ const UseModal: React.FC<UseModalPropsType> = (props) => {
       title={title}
       visible={visible}
       confirmLoading={confirmLoading}
-      onOk={() => onOk()}
+      onOk={() => {
+        form.validateFields()
+        if (selectItem) {
+          onOk(selectItem)
+        }
+      }}
       centered
       onCancel={() => onCancel()}
     >
+      <Form {...layout} form={form}>
+        <Form.Item
+          name="shopId"
+          label={intl.formatMessage({ id: 'detail.purchase.selectMall' })}
+          rules={[{ required: true }]}
+        >
+          <Select className={styles.selectBox} onChange={handleSelect}>
+            {
+              mallList && mallList.map((mallItem) => (
+                <Select.Option value={mallItem.id} label={mallItem.name} key={mallItem.id}>
+                  {mallItem.name}
+                </Select.Option>
+              ))
+            }
+          </Select>
+        </Form.Item>
+      </Form>
       {
         dataInfo.inUseTemplateName ? (
           <>

src/pages/ownMall/ownMallManager/templateDetail/index.tsx

@@ -8,7 +8,7 @@ import UseModal from '../components/useModal'
 import { Environment_Status } from '@/constants'
 import styles from './index.less'
 import { getTemplateWebPageTemplateWebFindSelfTemplateDetails, postTemplateWebPageTemplateWebUseSelfTemplate } from '@/services/TemplateV2Api'
-import { postManageWebShopWebAll } from '@/services/ManageV2Api'
+import { postManageWebShopWebAll, PostManageWebShopWebAllResponse } from '@/services/ManageV2Api'
 import { getAuth } from '@/utils/auth'
 import { GlobalConfig } from '@/global/config'
 
@@ -25,6 +25,7 @@ const TemplateDetail: React.FC<TemplateDetailPropsType> = (props) => {
   const { query: { type, id } } = props.location
   const [detailInfo, setDetailInfo] = useState<any>()
   const [useModalVisible, setUseModalVisible] = useState<boolean>(false)
+  const [mallList, setMallList] = useState<PostManageWebShopWebAllResponse>([])
   const [confirmLoading, setConfirmLoading] = useState(false)
   const intl = useIntl()
   const userInfo = getAuth()
@@ -41,10 +42,12 @@ const TemplateDetail: React.FC<TemplateDetailPropsType> = (props) => {
     const res = await postManageWebShopWebAll(params)
     message.destroy()
     if (res.code === 1000 && res.data && Array.isArray(res.data) && res.data.length > 0) {
-      console.log(res.data.filter((item) => item.self === 1 && item.property === property), 'selfMalllist')
-      const selfMall = res.data.filter((item) => item.self === 1 && item.property === property)[0]
-      if (selfMall) {
-        return selfMall.id
+      const list = res.data.filter((item) => item.self === 1 && item.property === property)
+      setMallList(list)
+      if (list && list.length === 1) {
+        return list[0].id
+      } else {
+        return undefined
       }
     }
   }
@@ -72,10 +75,12 @@ const TemplateDetail: React.FC<TemplateDetailPropsType> = (props) => {
   /**
    * 使用模板
    */
-  const handleConfirmUse = () => {
+  const handleConfirmUse = (selectItem) => {
     setConfirmLoading(true)
     const params: any = {
-      id
+      id,
+      shopId: selectItem.value,
+      shopName: selectItem.label,
     }
     postTemplateWebPageTemplateWebUseSelfTemplate(params).then(res => {
       if (res.code === 1000) {
@@ -167,7 +172,7 @@ const TemplateDetail: React.FC<TemplateDetailPropsType> = (props) => {
             </div>
           )
         }
-        <div className={cx(styles.btn, detailInfo?.use === 1 ? styles.use : '')} onClick={() => detailInfo?.use !== 1 ? setUseModalVisible(true) : {}}>
+        <div className={cx(styles.btn, detailInfo?.use === 1 ? styles.use : '')} onClick={() => setUseModalVisible(true)}>
           <PushpinOutlined />
           <label>{detailInfo?.use === 1 ? intl.formatMessage({ id: 'shop.template.button.state.using' }) : intl.formatMessage({ id: 'shop.template.button.state.use' })}</label>
         </div>
@@ -176,8 +181,9 @@ const TemplateDetail: React.FC<TemplateDetailPropsType> = (props) => {
           title={intl.formatMessage({ id: 'own.template.modal.title.use' })}
           visible={useModalVisible}
           dataInfo={detailInfo}
+          mallList={mallList}
           confirmLoading={confirmLoading}
-          onOk={() => handleConfirmUse()}
+          onOk={(selectItem) => handleConfirmUse(selectItem)}
           onCancel={() => setUseModalVisible(false)}
         />
       </div>