完善交易能力模块

config/routes/tranactionRoute.ts

@@ -17,18 +17,39 @@ const TranactionRoute = {
           component: '@/pages/transaction/stockSellStorage/warehouse/index',
         },
         {
+          path: '/memberCenter/tranactionAbility/stockSellStorage/addWarehouse',
+          name: 'addWarehouse',
+          key: 'addWarehouse',
+          hideInMenu: true,
+          component: '@/pages/transaction/stockSellStorage/warehouse/addWarehouse',
+        },
+        {
           path: '/memberCenter/tranactionAbility/stockSellStorage/billsType',
           name: 'billsType',
           key: 'billsType',
           component: '@/pages/transaction/stockSellStorage/billsType/index',
         },
         {
+          path: '/memberCenter/tranactionAbility/stockSellStorage/addBillsType',
+          name: 'addBillsType',
+          key: 'addBillsType',
+          hideInMenu: true,
+          component: '@/pages/transaction/stockSellStorage/billsType/addBillsType',
+        },
+        {
           path: '/memberCenter/tranactionAbility/stockSellStorage/bills',
           name: 'bills',
           key: 'bills',
           component: '@/pages/transaction/stockSellStorage/bills/index',
         },
         {
+          path: '/memberCenter/tranactionAbility/stockSellStorage/addBills',
+          name: 'addBills',
+          key: 'addBills',
+          hideInMenu: true,
+          component: '@/pages/transaction/stockSellStorage/bills/addBills',
+        },
+        {
           path: '/memberCenter/tranactionAbility/stockSellStorage/inventory',
           name: 'inventory',
           key: 'inventory',

src/components/NiceForm/components/CustomRegistryPhone.tsx

+import React from 'react';
+import { Row, Col, Select, Input } from 'antd';
+import styled from 'styled-components';
+import { findItemAndDelete } from '@/utils';
+import cx from 'classnames';
+
+const { Option } = Select;
+
+const RowStyleLayout = styled(props => <div {...props} />)``;
+
+const registryPhone = (props: any) => {
+  const { dataSource = [], selectPh, inputPh } = props.props[
+    'x-component-props'
+  ];
+  const defaultValue: any = props.props.default || {};
+  const value: any = props.value || {};
+
+  const handleChange = (type, e) => {
+    if (type === 'select') {
+      props.mutators.change({ ...value, phone: e });
+    } else {
+      e.persist();
+      props.mutators.change({ ...value, countryCode: e.target.value });
+    }
+  };
+
+  return (
+    <Row>
+      <Col span={8}>
+        <Select
+          value={defaultValue.countryCode}
+          onChange={val => handleChange('select', val)}
+          placeholder={selectPh}
+        >
+          {dataSource.map((v, i) => {
+            return (
+              <Option key={v.text} value={v.id}>
+                <div style={{ display: 'flex', alignItems: 'center' }}>
+                  <img
+                    style={{
+                      width: '24px',
+                      height: '17px',
+                      marginRight: '8px',
+                    }}
+                    src={v.url}
+                  />
+                  {v.text}
+                </div>
+              </Option>
+            );
+          })}
+        </Select>
+      </Col>
+      <Col span={15} offset={1}>
+        <Input
+          defaultValue={defaultValue.phone}
+          placeholder={inputPh}
+          maxLength={11}
+          onChange={e => handleChange('input', e)}
+        />
+      </Col>
+    </Row>
+  );
+};
+
+registryPhone.defaultProps = {};
+
+registryPhone.isFieldComponent = true;
+
+export default registryPhone;

src/components/NiceForm/index.tsx

-import React from 'react'
-import SchemaForm, { IAntdSchemaFormProps, createFormActions, FormPath, SchemaField } from '@formily/antd'
+import React from 'react';
+import SchemaForm, {
+  IAntdSchemaFormProps,
+  createFormActions,
+  FormPath,
+  SchemaField,
+} from '@formily/antd';
 import { Button, Space } from 'antd';
 import CustomUpload from './components/CustomUpload';
 import CustomStatus from './components/CustomStatus';
@@ -10,12 +15,12 @@ import Submit from './components/Submit';
 import Text from './components/Text';
 import CardCheckBox from './components/CardCheckBox';
 import MultTable from './components/MultTable';
+import CustomRegistryPhone from './components/CustomRegistryPhone';
 
-export interface NiceFormProps extends IAntdSchemaFormProps {
-}
+export interface NiceFormProps extends IAntdSchemaFormProps {}
 
-const NiceForm:React.FC<NiceFormProps> = (props) => {
-  const { children, components, ...reset } = props
+const NiceForm: React.FC<NiceFormProps> = props => {
+  const { children, components, ...reset } = props;
   const customComponents = {
     CustomUpload,
     CustomStatus,
@@ -25,23 +30,19 @@ const NiceForm:React.FC<NiceFormProps> = (props) => {
     Submit,
     Text,
     CardCheckBox,
-    MultTable
-  }
+    MultTable,
+    CustomRegistryPhone,
+  };
 
-  const defineComponents = Object.assign(customComponents, components)
+  const defineComponents = Object.assign(customComponents, components);
 
   return (
-    <SchemaForm
-      colon={false}
-      components={defineComponents}
-      {...reset}
-    >
+    <SchemaForm colon={false} components={defineComponents} {...reset}>
       {children}
     </SchemaForm>
-  )
-}
+  );
+};
 
+NiceForm.defaultProps = {};
 
-NiceForm.defaultProps = {}
-
-export default NiceForm
\ No newline at end of file
+export default NiceForm;

src/locales/zh-CN/menu.ts

@@ -69,8 +69,11 @@ export default {
   'menu.tranactionAbility': '交易',
   'menu.tranactionAbility.stockSellStorage': '进销存',
   'menu.tranactionAbility.stockSellStorage.warehouse': '仓库',
+  'menu.tranactionAbility.stockSellStorage.addWarehouse': '新增仓库',
   'menu.tranactionAbility.stockSellStorage.billsType': '单据类型',
+  'menu.tranactionAbility.stockSellStorage.addBillsType': '新增单据类型',
   'menu.tranactionAbility.stockSellStorage.bills': '单据',
+  'menu.tranactionAbility.stockSellStorage.addBills': '新增单据',
   'menu.tranactionAbility.stockSellStorage.inventory': '库存',
 
   //物流能力

src/pages/member/memberImport/addMember.tsx

 import React, { useState, useEffect, useRef, ReactNode } from 'react';
 import { history } from 'umi';
-import { Tabs, Badge, Button, Card, Row, Col, message } from 'antd';
+import { Tabs, Badge, Button, Card, Row, Col, message, Upload } from 'antd';
 import { PageHeaderWrapper } from '@ant-design/pro-layout';
-import { ContainerOutlined } from '@ant-design/icons';
-import { Form, FormItem, createFormActions } from '@formily/antd';
-import { Select, Input, Upload } from '@formily/antd-components';
+import {
+  ContainerOutlined,
+  PlusOutlined,
+  SaveOutlined,
+} from '@ant-design/icons';
+import { createFormActions } from '@formily/antd';
 import { StandardTable } from 'god';
 import { ColumnType } from 'antd/lib/table/interface';
+import {
+  IFormFilter,
+  IButtonFilter,
+} from 'god/dist/src/standard-table/TableController';
+import ReutrnEle from '@/components/ReturnEle';
+import styles from './index.less';
+import NiceForm from '@/components/NiceForm';
+import { initDetailSchema } from './schema';
+
 import style from './index.less';
 import { PublicApi } from '@/services/api';
 
 const { TabPane } = Tabs;
 
-const actions = createFormActions();
+const addSchemaAction = createFormActions();
 
 const addMember: React.FC<any> = props => {
   const ref = useRef({});
-  const [actived, setActived] = useState('-1');
-  const [editable, setEditable] = useState(
-    props.location.query.type != 'check',
-  );
   const selectList: any = [
     {
       label: '',
@@ -30,15 +38,10 @@ const addMember: React.FC<any> = props => {
       // )
       value: '1',
     },
-    { label: '', value: '2' },
-    { label: '', value: '3' },
-    { label: '', value: '4' },
-    { label: '', value: '5' },
   ];
 
   /* 会员类型、会员角色、会员等级、注册手机号选项 */
   const [memberItems, setMemberItems] = useState<any>({});
-  const [loading, setLoading] = useState(false);
 
   const data = [
     {
@@ -146,181 +149,34 @@ const addMember: React.FC<any> = props => {
     return isJpgOrPng && isLt2M;
   };
 
-  const handleChange = (items: any, file: any) => {
-    for (let elem of file) {
-      elem.url = elem.data;
-    }
-  };
-
   return (
     <PageHeaderWrapper
       onBack={() => history.goBack()}
+      backIcon={<ReutrnEle description="返回" />}
       title={
-        <>
-          <div className={style.headerTop}>
-            <span>返回</span>
-            <span>
-              {props.location.query.type === 'add'
+        props.location.query.type === 'add'
           ? '新建会员'
           : props.location.query.type === 'change'
           ? '编辑会员'
-                : '查看会员'}
-            </span>
-          </div>
-        </>
+          : '查看会员'
       }
-      extra={
-        <>
+      extra={[
         <Button
-            className={style.saveBtn}
-            icon={<ContainerOutlined />}
-            onClick={() => actions.submit()}
+          key="1"
+          type="primary"
+          icon={<SaveOutlined />}
+          onClick={() => addSchemaAction.submit()}
         >
           保存
-          </Button>
-        </>
-      }
+        </Button>,
+      ]}
     >
       <Card>
-        <Form
-          editable={editable}
-          labelCol={3}
-          wrapperCol={10}
-          labelAlign="left"
-          actions={actions}
-        >
-          <Tabs
-            tabBarGutter={30}
-            activeKey={actived}
-            onChange={activeKey => setActived(activeKey)}
-          >
-            <TabPane
-              tab={
-                // <Badge count={tabCount['1']} offset={[10, 0]}>
-                '基本信息'
-                // </Badge>
-              }
-              key="-1"
-            >
-              <FormItem
-                label="会员类型"
-                name="memberTypes"
-                dataSource={memberItems.memberTypes}
-                rules={[{ required: true, message: '请选择会员类型!' }]}
-                component={Select}
-              />
-              <FormItem
-                label="会员角色"
-                name="memberRoles"
-                dataSource={memberItems.memberRoles}
-                rules={[{ required: true, message: '请选择会员角色!' }]}
-                component={Select}
-              />
-              <FormItem
-                label="会员等级"
-                name="memberLevels"
-                dataSource={memberItems.memberLevels}
-                rules={[{ required: true, message: '请选择会员等级!' }]}
-                component={Select}
-              />
-              <FormItem
-                label={
-                  <>
-                    <span className={style.required}>*</span>
-                    注册手机号
-                  </>
-                }
-                name="registry"
-              >
-                <Row gutter={10}>
-                  <Col span={6}>
-                    <FormItem
-                      itemStyle={{ marginBottom: 0 }}
-                      name="country"
-                      dataSource={memberItems.countryCodes}
-                      rules={[{ required: true, message: '请选择会员角色!' }]}
-                      component={Select}
-                    />
-                  </Col>
-                  <Col span={18}>
-                    <FormItem
-                      name="phoneMobile"
-                      itemStyle={{ marginBottom: 0 }}
-                      rules={[{ required: true, message: '请选择会员角色!' }]}
-                      component={Input}
-                    />
-                  </Col>
-                </Row>
-              </FormItem>
-              <FormItem
-                label="注册邮箱"
-                name="memberEmail"
-                itemStyle={{ marginBottom: 0 }}
-                component={Input}
-              />
-            </TabPane>
-            {memberItems.groups &&
-              memberItems.groups.map((item: any, index: number) => {
-                return (
-                  <TabPane
-                    tab={
-                      // <Badge count={tabCount['1']} offset={[10, 0]}>
-                      item.groupName
-                      // </Badge>
-                    }
-                    key={index}
-                  >
-                    {item.elements.map((items: any, indexs: number) => {
-                      return (
-                        <div key={indexs}>
-                          {items.fieldType === 'String' ? (
-                            <FormItem
-                              itemStyle={
-                                item.elements.length - 1 === indexs
-                                  ? { marginBottom: 0 }
-                                  : {}
-                              }
-                              label={items.fieldCNName}
-                              name={items.fieldName}
-                              required={items.fieldEmpty === 0}
-                              // rules={items.checkRules}
-                              component={Input}
-                              key={indexs}
+        <NiceForm
+          onSubmit={handleSubmit}
+          actions={addSchemaAction}
+          schema={initDetailSchema(memberItems)}
         />
-                          ) : (
-                            <FormItem
-                              itemStyle={
-                                item.elements.length - 1 === indexs
-                                  ? { marginBottom: 0 }
-                                  : {}
-                              }
-                              label={items.fieldCNName}
-                              name={items.fieldName}
-                              action="/api/file/file/upload"
-                              listType="picture-card"
-                              required={items.fieldEmpty === 0}
-                              // rules={items.checkRules}
-                              data={{ fileType: 2 }}
-                              beforeUpload={beforeUpload}
-                              onChange={(file: any) =>
-                                handleChange(items, file)
-                              }
-                              showUploadList={{
-                                showRemoveIcon:
-                                  items.value && items.value.length > 0,
-                              }}
-                              key={indexs}
-                              component={Upload}
-                            />
-                          )}
-                        </div>
-                      );
-                    })}
-                  </TabPane>
-                );
-              })}
-          </Tabs>
-        </Form>
       </Card>
     </PageHeaderWrapper>
   );

src/pages/transaction/stockSellStorage/warehouse/schema/index.tsx → src/pages/member/memberImport/schema/index.tsx

 import React from 'react';
 import { ISchema } from '@formily/antd';
 import { FORM_FILTER_PATH } from '@/formSchema/const';
-import EyePreview from '@/components/EyePreview';
-import { Button } from 'antd';
 
-export const repositSchema: ISchema = {
+export const maintianSchema: ISchema = {
   type: 'object',
   properties: {
     megaLayout: {
@@ -16,23 +14,83 @@ export const repositSchema: ISchema = {
           'x-component': 'Search',
           'x-mega-props': {},
           'x-component-props': {
-            placeholder: '搜索',
+            placeholder: '请输入仓位名称',
           },
         },
+        [FORM_FILTER_PATH]: {
+          type: 'object',
+          'x-component': 'mega-layout',
+          visible: false,
+          'x-component-props': {
+            inline: true,
           },
+          properties: {
+            productName: {
+              type: 'string',
+              'x-component-props': {
+                placeholder: '商品名称',
               },
             },
-};
-
-export const repositDetailSchema: ISchema = {
-  type: 'object',
-  properties: {
-    REPOSIT_TABS: {
-      type: 'object',
-      'x-component': 'tab',
+            productId: {
+              type: 'string',
+              'x-component-props': {
+                placeholder: '商品ID',
+              },
+            },
+            category: {
+              type: 'string',
+              'x-component-props': {
+                placeholder: '请选择品类',
+              },
+              enum: [],
+            },
+            brand: {
+              type: 'string',
+              'x-component-props': {
+                placeholder: '请选择品牌',
+              },
+              enum: [],
+            },
+            submit: {
+              'x-component': 'Submit',
               'x-component-props': {
-        type: 'card',
+                children: '查询',
+              },
+            },
+          },
+        },
+      },
     },
+  },
+};
+
+const registryPhone = <></>;
+
+const getCompnentValue = (elements: any) => {
+  let components = {};
+  for (let item of elements) {
+    let xComponentProps =
+      item.fieldType === 'string'
+        ? {
+            placeholder: item.fieldRemark,
+          }
+        : {
+            listType: 'card',
+            action: '/api/file/file/upload',
+            data: { fileType: 2 },
+          };
+    components[item.fieldName] = {
+      type: item.fieldType,
+      required: item.fieldEmpty === 0,
+      title: item.fieldCNName,
+      'x-component-props': xComponentProps,
+    };
+  }
+  return components;
+};
+
+export const initDetailSchema = (props: any) => {
+  let tabSchema = {
     properties: {
       'tab-1': {
         type: 'object',
@@ -50,135 +108,103 @@ export const repositDetailSchema: ISchema = {
               labelAlign: 'left',
             },
             properties: {
-                name: {
+              memberTypes: {
                 type: 'string',
                 required: true,
-                  title: '仓位名称',
+                title: '会员类型',
+                enum: props.memberTypes,
                 'x-component-props': {
-                    placeholder: '建议名称：商品名称+商城名称+渠道描述',
+                  placeholder: '请选择',
                 },
               },
-                productName: {
+              memberRoles: {
                 type: 'string',
-                  title: '商品名称',
                 required: true,
+                title: '会员角色',
+                enum: props.memberRoles,
+                'x-component-props': {
+                  placeholder: '请选择',
                 },
-                warehouseId: {
-                  type: 'string',
-                  title: '仓库名称',
-                  enum: [],
               },
-                itemNo: {
+              memberLevels: {
                 type: 'string',
-                  'x-component': 'Text',
-                  title: '对应货品',
-                  default: '暂无',
-                },
-                inventory: {
-                  type: 'number',
-                  'x-component': 'CustomSlider',
                 required: true,
+                title: '会员等级',
+                enum: [{ label: '1', value: 1 }],
+                // enum: props.memberLevels,
                 'x-component-props': {
-                    min: 0,
-                    max: 200,
+                  placeholder: '请选择',
                 },
-                  title: '分配仓位库存',
               },
-                inventoryDeductWay: {
-                  type: 'radio',
-                  title: '库存扣减方式',
+              memberPhone: {
+                type: 'object',
                 required: true,
-                  enum: [
+                title: '注册手机',
+                'x-component': 'CustomRegistryPhone',
+                'x-component-props': {
+                  dataSource: [
                     {
-                      label: '按仓位随机扣减',
-                      value: 1,
+                      text: '+86',
+                      id: 1,
+                      url: require('../../../../../public/static/imgs/level1@2x.png'),
                     },
                     {
-                      label: '按仓库位置远近扣除',
-                      value: 2,
+                      text: '+126',
+                      id: 2,
+                      url: require('../../../../../public/static/imgs/level2@2x.png'),
                     },
                   ],
-                  default: 1,
-                },
-              },
-            },
-          },
-        },
-        'tab-2': {
-          type: 'object',
-          'x-component': 'tabpane',
-          'x-component-props': {
-            tab: '适用商城',
+                  selectPh: '请选择',
+                  inputPh: '请输入你的手机号码',
                 },
-
-          properties: {
-            MEGA_LAYOUT2: {
-              type: 'object',
-              'x-component': 'mega-layout',
-              'x-component-props': {
-                labelCol: 4,
-                labelAlign: 'left',
               },
-              properties: {
-                shopIds: {
-                  type: 'array:number',
-                  'x-component': 'CardCheckBox',
-                  'x-component-props': {
-                    dataSource: [
-                      { logo: '', title: '会员', id: 1 },
-                      { logo: '', title: '小程序', id: 2 },
-                      { logo: '', title: 'H5', id: 3 },
-                      { logo: '', title: '渠道', id: 4 },
-                    ],
+              memberEmail: {
+                type: 'string',
+                title: '邮箱',
+                'x-component-props': {},
               },
-                  title: '适用商城',
-                  required: true,
             },
           },
         },
       },
     },
-        'tab-3': {
+  };
+
+  if (Object.keys(props).length > 0) {
+    for (let [index, item] of props.groups.entries()) {
+      tabSchema.properties[`tab-${index + 2}`] = {
         type: 'object',
         'x-component': 'tabpane',
         'x-component-props': {
-            tab: '适用会员',
+          tab: item.groupName,
         },
         properties: {
-            MEGA_LAYOUT3: {
+          [`MEGA_LAYOUT${index + 2}`]: {
             type: 'object',
             'x-component': 'mega-layout',
             'x-component-props': {
               labelCol: 4,
+              wrapperCol: 8,
               labelAlign: 'left',
             },
-              properties: {
-                isAllMemberShare: {
-                  type: 'radio',
-                  enum: [
-                    { label: '所有会员共享(默认)', value: 1 },
-                    { label: '指定会员', value: 0 },
-                  ],
-                  title: '选择渠道会员',
-                  default: 1,
-                  required: true,
-                },
-                applyMember: {
-                  type: 'array:number',
-                  'x-component': 'MultTable',
-                  'x-component-props': {
-                    columns: '{{tableColumns}}',
-                  },
-                  default: [
-                    { id: 1, name: '名称', type: '类型' },
-                    { id: 2, name: '名称1', type: '类型1' },
-                  ],
-                },
-              },
-            },
-          },
+            properties: getCompnentValue(item.elements),
           },
         },
+      };
+    }
+  }
+
+  let detailSchema = {
+    type: 'object',
+    properties: {
+      REPOSIT_TABS: {
+        type: 'object',
+        'x-component': 'tab',
+        'x-component-props': {},
+        ...tabSchema,
       },
     },
+  };
+  const maintianDetailSchema: ISchema = detailSchema;
+  return maintianDetailSchema;
 };

src/pages/transaction/stockSellStorage/bills/addBills.tsx

+import React, { useState, useEffect, useRef } from 'react';
+import { usePageStatus } from '@/hooks/usePageStatus';
+import { history } from 'umi';
+import { PageHeaderWrapper } from '@ant-design/pro-layout';
+import { SaveOutlined } from '@ant-design/icons';
+import { createFormActions } from '@formily/antd';
+import { Button, Card } from 'antd';
+import ReutrnEle from '@/components/ReturnEle';
+import {
+  SchemaForm,
+  SchemaMarkupField as Field,
+  FormMegaLayout,
+} from '@formily/antd';
+import { Input, Select } from '@formily/antd-components';
+import { PublicApi } from '@/services/api';
+
+const addSchemaAction = createFormActions();
+
+const AddBills: React.FC<{}> = (props: any) => {
+  const ref = useRef({});
+
+  const handleSubmit = value => {
+    console.log(value);
+  };
+  return (
+    <PageHeaderWrapper
+      onBack={() => history.goBack()}
+      backIcon={<ReutrnEle description="返回" />}
+      title={
+        usePageStatus().pageStatus === 0
+          ? '新建单据'
+          : usePageStatus().pageStatus === 1
+          ? '编辑单据'
+          : '查看单据'
+      }
+      extra={
+        usePageStatus().preview != '1'
+          ? [
+              <Button
+                key="1"
+                type="primary"
+                icon={<SaveOutlined />}
+                onClick={() => addSchemaAction.submit()}
+              >
+                保存
+              </Button>,
+            ]
+          : []
+      }
+    >
+      <Card>
+        <SchemaForm
+          editable={usePageStatus().preview != '1'}
+          actions={addSchemaAction}
+          components={{ Input, Select }}
+          onSubmit={value => handleSubmit(value)}
+        >
+          <FormMegaLayout labelCol={4} labelAlign="left" wrapperCol={12}>
+            <Field
+              name="name"
+              title="单据编号"
+              x-component="Input"
+              x-component-props={{
+                placeholder: '最长10个字符',
+                maxLength: 10,
+              }}
+              required
+            />
+            <Field
+              name="name1"
+              title="单据名称"
+              x-component="Input"
+              x-component-props={{
+                placeholder: '最长20个字符，10个汉字',
+                maxLength: 10,
+              }}
+              required
+            />
+            <Field
+              name="countryCode"
+              title="仓库负责人"
+              enum={['1', '2', '3', '4']}
+              x-component="Select"
+              x-component-props={{ placeholder: '请选择' }}
+            />
+          </FormMegaLayout>
+        </SchemaForm>
+      </Card>
+    </PageHeaderWrapper>
+  );
+};
+
+export default AddBills;

src/pages/transaction/stockSellStorage/bills/index.tsx

@@ -81,7 +81,14 @@ const Bills: React.FC<{}> = () => {
 
   const handleBatchDel = (e: any) => {};
 
-  const handleMoreMenu = (e: any) => {};
+  const handleMoreMenu = (e: any) => {
+    if (e.key === '1') {
+      history.push(
+        `/memberCenter/tranactionAbility/stockSellStorage/addBills?id=${''}`,
+      );
+    }
+    // console.log(e);
+  };
 
   const columns: ColumnType<any>[] = [
     {
@@ -91,7 +98,7 @@ const Bills: React.FC<{}> = () => {
       key: 'no',
       render: (text: any, record: any) => (
         <EyePreview
-          url={`/repositories/viewRepository?id=${record.key}&preview=1`}
+          url={`/memberCenter/tranactionAbility/stockSellStorage/addBills?id=${record.key}&preview=1`}
         >
           {text}
         </EyePreview>
@@ -192,8 +199,12 @@ const Bills: React.FC<{}> = () => {
                 <Space>
                   <Button
                     type="primary"
-                    onClick={handleAdd}
                     icon={<PlusOutlined />}
+                    onClick={() =>
+                      history.push(
+                        '/memberCenter/tranactionAbility/stockSellStorage/addBills',
+                      )
+                    }
                   >
                     新建
                   </Button>

src/pages/transaction/stockSellStorage/billsType/addBillsType.tsx

+import React, { useState, useEffect, useRef } from 'react';
+import { usePageStatus } from '@/hooks/usePageStatus';
+import { history } from 'umi';
+import { PageHeaderWrapper } from '@ant-design/pro-layout';
+import { SaveOutlined } from '@ant-design/icons';
+import { createFormActions } from '@formily/antd';
+import { Button, Card } from 'antd';
+import ReutrnEle from '@/components/ReturnEle';
+import {
+  SchemaForm,
+  SchemaMarkupField as Field,
+  FormMegaLayout,
+} from '@formily/antd';
+import { Input, Select } from '@formily/antd-components';
+import { PublicApi } from '@/services/api';
+
+const addSchemaAction = createFormActions();
+
+const AddWarehouse: React.FC<{}> = (props: any) => {
+  const ref = useRef({});
+
+  const handleSubmit = value => {
+    console.log(value);
+  };
+  return (
+    <PageHeaderWrapper
+      onBack={() => history.goBack()}
+      backIcon={<ReutrnEle description="返回" />}
+      title={
+        usePageStatus().pageStatus === 0
+          ? '新建单据类型'
+          : usePageStatus().pageStatus === 1
+          ? '编辑单据类型'
+          : '查看单据类型'
+      }
+      extra={
+        usePageStatus().preview != '1'
+          ? [
+              <Button
+                key="1"
+                type="primary"
+                icon={<SaveOutlined />}
+                onClick={() => addSchemaAction.submit()}
+              >
+                保存
+              </Button>,
+            ]
+          : []
+      }
+    >
+      <Card>
+        <SchemaForm
+          editable={usePageStatus().preview != '1'}
+          actions={addSchemaAction}
+          components={{ Input, Select }}
+          onSubmit={value => handleSubmit(value)}
+        >
+          <FormMegaLayout labelCol={4} labelAlign="left" wrapperCol={12}>
+            <Field
+              name="name"
+              title="单据类型编号"
+              x-component="Input"
+              x-component-props={{
+                placeholder: '最长10个字符',
+                maxLength: 10,
+              }}
+              required
+            />
+            <Field
+              name="name1"
+              title="单据类型名称"
+              x-component="Input"
+              x-component-props={{
+                placeholder: '最长20个字符，10个汉字',
+                maxLength: 10,
+              }}
+              required
+            />
+            <Field
+              name="countryCode"
+              title="仓库负责人"
+              enum={['1', '2', '3', '4']}
+              x-component="Select"
+              x-component-props={{ placeholder: '请选择' }}
+            />
+          </FormMegaLayout>
+        </SchemaForm>
+      </Card>
+    </PageHeaderWrapper>
+  );
+};
+
+export default AddWarehouse;

src/pages/transaction/stockSellStorage/billsType/index.tsx

@@ -13,10 +13,11 @@ import {
 } from 'antd';
 import {
   PlusOutlined,
-  EyeOutlined,
   PlayCircleOutlined,
   PauseCircleOutlined,
 } from '@ant-design/icons';
+import EyePreview from '@/components/EyePreview';
+import StatusSwitch from '@/components/StatusSwitch';
 import { StandardTable } from 'god';
 import { ColumnType } from 'antd/lib/table/interface';
 import style from './index.less';
@@ -28,7 +29,7 @@ const data = [
     no: 'DJ001',
     name: '进货入库单',
     direction: 1,
-    status: 1,
+    state: 1,
   },
   {
     key: '2',
@@ -36,7 +37,7 @@ const data = [
     no: 'DJ002',
     name: '退货入库单',
     direction: 2,
-    status: 2,
+    state: 2,
   },
 ];
 
@@ -64,10 +65,11 @@ const billsType: React.FC<{}> = () => {
       key: 'name',
       render: (text: any, record: any) => {
         return (
-          <span className="commonPickColor" onClick={() => history.push('')}>
-            {text}&nbsp;
-            <EyeOutlined />
-          </span>
+          <EyePreview
+            url={`/memberCenter/tranactionAbility/stockSellStorage/addBillsType?id=${record.id}&preview=1`}
+          >
+            {text}
+          </EyePreview>
         );
       },
     },
@@ -93,31 +95,10 @@ const billsType: React.FC<{}> = () => {
       sorter: true,
       render: (text: any, record: any) => {
         return (
-          <Popconfirm
-            title="确定要执行这个操作?"
-            onConfirm={() => console.log('...')}
-            onCancel={() => console.log('...')}
-            okText="是"
-            cancelText="否"
-          >
-            <Button
-              type="link"
-              onClick={() => console.log('???')}
-              style={
-                record.status === 1 ? { color: '#00B37A' } : { color: 'red' }
-              }
-            >
-              {record.status === 1 ? (
-                <>
-                  有效 <PlayCircleOutlined />
-                </>
-              ) : (
-                <>
-                  无效 <PauseCircleOutlined />
-                </>
-              )}
-            </Button>
-          </Popconfirm>
+          <StatusSwitch
+            handleConfirm={() => handleModify(record)}
+            record={record}
+          />
         );
       },
     },
@@ -125,9 +106,16 @@ const billsType: React.FC<{}> = () => {
       title: '操作',
       dataIndex: 'option',
       align: 'center',
-      render: (record: any) => (
+      render: (text: any, record: any) => (
         <>
-          <Button type="link" onClick={record => history.push('')}>
+          <Button
+            type="link"
+            onClick={() =>
+              history.push(
+                `/memberCenter/tranactionAbility/stockSellStorage/addBillsType?id=${record.id}`,
+              )
+            }
+          >
             编辑
           </Button>
           <Popconfirm
@@ -160,6 +148,11 @@ const billsType: React.FC<{}> = () => {
 
   const handleReset = () => {};
 
+  const handleModify = (record: object) => {
+    // 通过传入的params字符串判断是修改那种类型的数据
+    console.log('执行状态修改', record);
+  };
+
   return (
     <PageHeaderWrapper>
       <Card>
@@ -176,7 +169,7 @@ const billsType: React.FC<{}> = () => {
                     type="primary"
                     onClick={() =>
                       history.push(
-                        '/memberCenter/memberAbility/manage/addMember?type=add',
+                        '/memberCenter/tranactionAbility/stockSellStorage/addBillsType',
                       )
                     }
                   >

src/pages/transaction/stockSellStorage/warehouse/addWarehouse.tsx

+import React, { useState, useEffect, useRef } from 'react';
+import { usePageStatus } from '@/hooks/usePageStatus';
+import { history } from 'umi';
+import { PageHeaderWrapper } from '@ant-design/pro-layout';
+import { SaveOutlined } from '@ant-design/icons';
+import { createFormActions } from '@formily/antd';
+import { Button, Card } from 'antd';
+import ReutrnEle from '@/components/ReturnEle';
+import {
+  SchemaForm,
+  SchemaMarkupField as Field,
+  FormMegaLayout,
+} from '@formily/antd';
+import { Input, Select } from '@formily/antd-components';
+import { PublicApi } from '@/services/api';
+
+const addSchemaAction = createFormActions();
+
+const AddWarehouse: React.FC<{}> = (props: any) => {
+  const ref = useRef({});
+
+  const handleSubmit = value => {
+    console.log(value);
+  };
+  return (
+    <PageHeaderWrapper
+      onBack={() => history.goBack()}
+      backIcon={<ReutrnEle description="返回" />}
+      title={
+        usePageStatus().pageStatus === 0
+          ? '新建仓库'
+          : usePageStatus().pageStatus === 1
+          ? '编辑仓库'
+          : '查看仓库'
+      }
+      extra={
+        usePageStatus().preview != '1'
+          ? [
+              <Button
+                key="1"
+                type="primary"
+                icon={<SaveOutlined />}
+                onClick={() => addSchemaAction.submit()}
+              >
+                保存
+              </Button>,
+            ]
+          : []
+      }
+    >
+      <Card>
+        <SchemaForm
+          editable={usePageStatus().preview != '1'}
+          actions={addSchemaAction}
+          components={{ Input, Select, Textarea: Input.TextArea }}
+          onSubmit={value => handleSubmit(value)}
+        >
+          <FormMegaLayout labelCol={4} labelAlign="left" wrapperCol={12}>
+            <Field name="name" title="仓库名称" x-component="Input" required />
+            <FormMegaLayout label="仓库地址" wrapperCol={24} required>
+              <FormMegaLayout grid full autoRow columns={3}>
+                <Field
+                  name="province"
+                  enum={['1', '2', '3', '4']}
+                  x-component="Select"
+                  x-component-props={{
+                    placeholder: '- 省 -',
+                  }}
+                  required
+                />
+                <Field
+                  name="city"
+                  enum={['1', '2', '3', '4']}
+                  x-component="Select"
+                  x-component-props={{
+                    placeholder: '- 市 -',
+                  }}
+                  required
+                />
+                <Field
+                  name="county"
+                  enum={['1', '2', '3', '4']}
+                  x-component="Select"
+                  x-component-props={{
+                    placeholder: '- 县/区 -',
+                  }}
+                  required
+                />
+              </FormMegaLayout>
+              <Field
+                name="address"
+                x-component="Textarea"
+                x-component-props={{
+                  placeholder: '请输入详细地址（最长50个字符，25个汉字）',
+                  rules: [{ message: '请输入详细地址' }],
+                }}
+                required
+              />
+            </FormMegaLayout>
+            <Field name="person" title="仓库负责人" x-component="Input" />
+            <FormMegaLayout label="联系电话" grid full wrapperCol={24}>
+              <Field
+                name="countryCode"
+                enum={['1', '2', '3', '4']}
+                x-component="Select"
+                x-component-props={{ placeholder: '请选择' }}
+              />
+              <Field
+                x-mega-props={{ span: 3 }}
+                name="phoneMobile"
+                x-component="Input"
+                x-component-props={{ placeholder: '请输入你的手机号码' }}
+              />
+            </FormMegaLayout>
+          </FormMegaLayout>
+        </SchemaForm>
+      </Card>
+    </PageHeaderWrapper>
+  );
+};
+
+export default AddWarehouse;

src/pages/transaction/stockSellStorage/warehouse/index.tsx

@@ -11,12 +11,9 @@ import {
   Space,
   Popconfirm,
 } from 'antd';
-import {
-  PlusOutlined,
-  EyeOutlined,
-  PlayCircleOutlined,
-  PauseCircleOutlined,
-} from '@ant-design/icons';
+import { PlusOutlined } from '@ant-design/icons';
+import EyePreview from '@/components/EyePreview';
+import StatusSwitch from '@/components/StatusSwitch';
 import { StandardTable } from 'god';
 import { ColumnType } from 'antd/lib/table/interface';
 import style from './index.less';
@@ -29,7 +26,7 @@ const data = [
     address: '广东省广州市海珠区新港东路1068号中洲中心北塔6楼',
     person: '蒯美政',
     phoneMobile: '185 2929 5432',
-    status: 1,
+    state: 1,
   },
   {
     key: '2',
@@ -38,7 +35,7 @@ const data = [
     address: '广东省广州市海珠区新港东路1068号中洲中心北塔6楼',
     person: '蒯美政',
     phoneMobile: '185 2929 5432',
-    status: 2,
+    state: 2,
   },
 ];
 
@@ -74,10 +71,11 @@ const WareHouse: React.FC<{}> = () => {
       key: 'name',
       render: (text: any, record: any) => {
         return (
-          <span className="commonPickColor" onClick={() => history.push('')}>
-            {text}&nbsp;
-            <EyeOutlined />
-          </span>
+          <EyePreview
+            url={`/memberCenter/tranactionAbility/stockSellStorage/addWarehouse?id=${record.id}&preview=1`}
+          >
+            {text}
+          </EyePreview>
         );
       },
     },
@@ -107,31 +105,10 @@ const WareHouse: React.FC<{}> = () => {
       sorter: true,
       render: (text: any, record: any) => {
         return (
-          <Popconfirm
-            title="确定要执行这个操作?"
-            onConfirm={() => console.log('...')}
-            onCancel={() => console.log('...')}
-            okText="是"
-            cancelText="否"
-          >
-            <Button
-              type="link"
-              onClick={() => console.log('???')}
-              style={
-                record.status === 1 ? { color: '#00B37A' } : { color: 'red' }
-              }
-            >
-              {record.status === 1 ? (
-                <>
-                  有效 <PlayCircleOutlined />
-                </>
-              ) : (
-                <>
-                  无效 <PauseCircleOutlined />
-                </>
-              )}
-            </Button>
-          </Popconfirm>
+          <StatusSwitch
+            handleConfirm={() => handleModify(record)}
+            record={record}
+          />
         );
       },
     },
@@ -139,9 +116,16 @@ const WareHouse: React.FC<{}> = () => {
       title: '操作',
       dataIndex: 'option',
       align: 'center',
-      render: (record: any) => (
+      render: (text: any, record: any) => (
         <>
-          <Button type="link" onClick={record => history.push('')}>
+          <Button
+            type="link"
+            onClick={() =>
+              history.push(
+                `/memberCenter/tranactionAbility/stockSellStorage/addWarehouse?id=${record.id}`,
+              )
+            }
+          >
             编辑
           </Button>
           <Popconfirm
@@ -160,6 +144,11 @@ const WareHouse: React.FC<{}> = () => {
 
   const handleReset = () => {};
 
+  const handleModify = (record: object) => {
+    // 通过传入的params字符串判断是修改那种类型的数据
+    console.log('执行状态修改', record);
+  };
+
   return (
     <PageHeaderWrapper>
       <Card>
@@ -175,9 +164,13 @@ const WareHouse: React.FC<{}> = () => {
                   <Button
                     type="primary"
                     onClick={() =>
-                      history.push(
-                        '/memberCenter/memberAbility/manage/addMember?type=add',
-                      )
+                      history.push({
+                        pathname:
+                          '/memberCenter/tranactionAbility/stockSellStorage/addWarehouse',
+                        query: {
+                          type: 'add',
+                        },
+                      })
                     }
                   >
                     <PlusOutlined />