部分产品

54d0411d · peii · c0ba2b65 · 54d0411d · 54d0411d · 54d0411d
Commit 54d0411d authored Jul 20, 2021 by peii
Showing with 439 additions and 64 deletions
src/pages/order/productions/category.tsx
src/pages/order/productions/common.tsx
src/pages/order/productions/index.styl
src/pages/order/productions/index.tsx
src/pages/order/productions/production.tsx
src/pages/order/productions/supplier.tsx
src/pages/order/self.tsx
src/services/service.ts
src/stores/production.ts
types/global.ts
--- a/src/pages/order/productions/category.tsx
+++ b/src/pages/order/productions/category.tsx
@@ -2,7 +2,7 @@
 * @FilePath: /BoneHouse_Business_APP/src/pages/order/productions/category.tsx
 * @Author: peii
 * @Date: 2021-07-15 14:56:10
- * @LastEditTime: 2021-07-15 18:09:17
+ * @LastEditTime: 2021-07-16 17:46:00
 * @LastEditors: peii
 * @Vision: 1.0
 * @Description: 产品分类
@@ -21,16 +21,39 @@ import styles from './index.styl'
 type IProps = {
  productionStore: {
    categories: ICategory[]
+    activeCatetory: ICategory
+    setActiveCategory: (category: ICategory) => {}
  }
 }
 class Category extends Component<IProps> {
+  constructor(props) {
+    super(props)
+  }
+  /**
+   * @description: 分类点击操作
+   * @param {ICategory} category
+   * @return {*}
+   */
+  categoryClickHandler(category: ICategory) {
+    if (
+      R.compose(
+        R.equals(category.categoryCode),
+        R.propOr('', 'categoryCode'),
+      )(this.props.productionStore.activeCatetory)
+    ) {
+      return
+    }
+    this.props.productionStore.setActiveCategory(category)
+  }
  render() {
-    const categories = this.props.productionStore.categories
+    const { categories, activeCatetory } = this.props.productionStore
    return (
      <View style={g(styles, 'category')}>
-        <ScrollView style={g(styles, 'category-scroll')}>
+        <ScrollView style={g(styles, 'category-scroll')} showsVerticalScrollIndicator={false}>
          {categories &&
            categories.map(category => {
              const icon = isNotBlank(category.categoryIcon)
@@ -38,11 +61,32 @@ class Category extends Component<IProps> {
                : isNotBlank(category.categoryImage)
                ? { uri: category.categoryImage }
                : ''
+              const active = R.compose(R.equals(category.categoryCode), R.propOr('', 'categoryCode'))(activeCatetory)
              return (
-                <TouchableOpacity style={g(styles, 'category-item')} key={category.categoryCode}>
+                <TouchableOpacity
+                  style={g(styles, {
+                    'category-item': true,
+                    'category-item__no-icon': isBlank(icon),
+                    'category-item__active': active,
+                  })}
+                  key={category.categoryCode}
+                  onPress={() => {
+                    this.categoryClickHandler(category)
+                  }}
+                  activeOpacity={1}
+                >
                  {isNotBlank(icon) && <Image source={icon} style={g(styles, 'category-item__icon')} />}
-                  <Text>{category.categoryName}</Text>
+                  <Text
+                    numberOfLines={3}
+                    style={g(styles, {
+                      'category-item__text': true,
+                      'category-item__text-no-icon': isBlank(icon),
+                      'category-item__text__active': active,
+                    })}
+                  >
+                    {category.categoryName}
+                  </Text>
                </TouchableOpacity>
              )
            })}

--- a/src/pages/order/productions/common.tsx
+++ b/src/pages/order/productions/common.tsx
+/*
+ * @FilePath: /BoneHouse_Business_APP/src/pages/order/productions/common.tsx
+ * @Author: peii
+ * @Date: 2021-07-16 17:04:20
+ * @LastEditTime: 2021-07-16 17:53:15
+ * @LastEditors: peii
+ * @Vision: 1.0
+ * @Description: 一些产品的通用组件
+ */
+// @ts-nocheck
+import React, { Component } from 'react'
+import { View, Text, Image } from 'react-native'
+import { ISupplier } from 'bonehouse'
+import * as R from 'ramda'
+import { g, isBlank, isNotBlank } from '../../../utils/utils'
+import styles from './index.styl'
+import { IMAGE_PREFIX } from './constant'
+import container from '../../../inversify'
+import { TYPES } from '../../../inversify/types'
+const store = container.get(TYPES.Store)
+type ITextImageProps = {
+  size: string
+  image?: string
+  text?: string
+  colorNumber: string
+}
+/**
+ * @description: 文字图片
+ * @return {*}
+ */
+export function TextImage({ size, image, text, colorNumber }: ITextImageProps) {
+  const numClass = isNotBlank(colorNumber) ? `text-icon-${colorNumber}` : ''
+  const style = isNotBlank(size) ? { width: size, height: size } : {}
+  text = R.take(4, text)
+  return (
+    <View style="text-image">
+      {isBlank(image) ? (
+        <View style={[g(styles, 'text-image__text-icon', numClass), style]}>
+          <Text style={g(styles, 'text-image__text-icon-text', `${numClass}__text`)}>{text}</Text>
+        </View>
+      ) : (
+        <Image
+          source={{ uri: store.host + IMAGE_PREFIX + image }}
+          style={[g(styles, 'text-image__icon'), style]}
+          resizeMode="contain"
+        />
+      )}
+    </View>
+  )
+}
--- a/src/pages/order/productions/index.styl
+++ b/src/pages/order/productions/index.styl
@@ -13,40 +13,44 @@ colors = {
  width 100%
  height 64px
  padding 0px 20px
+  padding-left 10px
  background-color foundation_color
  margin-bottom 5px
  &-item
-    width iconWidth
+    width: iconWidth + 20px
    height: iconWidth + 20px
-    margin-right 20px
+    padding 10px
-    padding-top 10px
+    justify-content center
+    align-items center
+    border-bottom-width 2px
+    border-bottom-color transparent
    &__active
-      border-bottom-width 2px
      border-bottom-color primary_color
-    &__icon
+.text-image
-      width iconWidth
+  &__icon
-      height iconWidth
+    width iconWidth
+    height iconWidth
-    &__text-icon
+  &__text-icon
-      width iconWidth
+    width iconWidth
-      height iconWidth
+    height iconWidth
-      borderRadius 22px
+    borderRadius 22px
-      justify-content center
+    justify-content center
-      align-items center
+    align-items center
-      borderWidth 2px
+    borderWidth 2px
-      &-text
+    &-text
-        font-size 16px
+      font-size 14px
-        font-family font_family_semibold
+      font-family font_family_semibold
 for i in 1 .. 50
  .text-icon-{i}
    borderColor hsl(i * 50, 50%, 50%)
-  .text-icon__text-{i}
+  .text-icon-{i}__text
    color hsl(i * 30, 50%, 50%)
 .category
@@ -55,5 +59,34 @@ for i in 1 .. 50
  &-item
    height 60px
-    justify-content center
+    padding-left 5px
-    padding 0 10px
+    border-bottom-width 1px
\ No newline at end of file
+    border-bottom-color rgba(0, 0, 0, 0.1)
+    @extend .row
+    @extend .center
+    &__no-icon
+      padding-left 15px
+      padding-right 10px
+    &__active
+      background-color foundation_color
+    &__icon
+      width 12px
+      height @width
+      margin-right 2px
+    &__text
+      font-size third_text_size
+      padding-right 5px
+      color second_text_color
+      font-family font_family_semibold
+      font-weight 400
+      &-no-icon
+        text-align center
+      &__active
+        color first_text_color
+        font-weight 700
--- a/src/pages/order/productions/index.tsx
+++ b/src/pages/order/productions/index.tsx
@@ -2,7 +2,7 @@
 * @FilePath: /BoneHouse_Business_APP/src/pages/order/productions/index.tsx
 * @Author: peii
 * @Date: 2021-07-14 17:54:04
- * @LastEditTime: 2021-07-15 17:03:56
+ * @LastEditTime: 2021-07-16 16:39:13
 * @LastEditors: peii
 * @Vision: 1.0
 * @Description: 自助下单选择产品页面
@@ -21,11 +21,16 @@ import { g, getFormItem, isBlank, isNotBlank, show, translateSysprofile } from '
 import styles from './index.styl'
 type IProps = {
+  store: {
+    setNavigation: (any) => void
+  }
  productionStore: {
-    getSuppliers: (orgCode: string) => {}
+    getSuppliers: (orgCode: string) => void
-    setOrgCode: (orgCode: string) => {}
+    setOrgCode: (orgCode: string) => void
    suppliers: ISupplier[]
-    getCategory: (manufacturerCode: string) => {}
+    setActiveSupplier: ISupplier
+    getCategory: (manufacturerCode: string) => void
+    setActiveSupplier: (supplier: ISupplier) => void
  }
 }
@@ -39,7 +44,11 @@ class Productions extends Component<IProps, IState> {
  }
  componentDidMount() {
-    this.initDatas()
+    // TODO: 开发时加上延时，不然没token
+    this.props.store.setNavigation(this.props.navigation)
+    setTimeout(() => {
+      this.initDatas()
+    }, 0)
  }
  /**
@@ -47,11 +56,18 @@ class Productions extends Component<IProps, IState> {
   * @param {*}
   * @return {*}
   */
-  async initDatas() {
+  initDatas() {
-    const orgCode = this.props.navigation.getParam('orgCode')
+    // const orgCode = this.props.navigation.getParam('orgCode')
+    const orgCode = 'A01'
+    const { suppliers, activeSupplier } = this.props.productionStore
    this.props.productionStore.setOrgCode(orgCode)
-    // 供应商信息
+    if (isBlank(suppliers)) {
-    this.props.productionStore.getSuppliers(orgCode)
+      // 供应商信息
+      this.props.productionStore.getSuppliers(orgCode)
+    } else if (isBlank(activeSupplier)) {
+      this.props.productionStore.setActiveSupplier(R.head(suppliers))
+    }
  }
  render() {
@@ -62,14 +78,14 @@ class Productions extends Component<IProps, IState> {
        {/* 页面头 */}
        <Header title="选择产品" backCallback={() => navigation.goBack()} />
-        {/* 供应商 */}
+        {/* 头部供应商 */}
        <Supplier />
-        {/* 产品分类 */}
+        {/* 左侧产品分类 */}
        <Category />
      </View>
    )
  }
 }
-export default inject('orgStore', 'orderStore', 'productionStore')(observer(Productions))
+export default inject('store', 'orgStore', 'orderStore', 'productionStore')(observer(Productions))
--- a/src/pages/order/productions/production.tsx
+++ b/src/pages/order/productions/production.tsx
+/*
+ * @FilePath: /BoneHouse_Business_APP/src/pages/order/productions/production.tsx
+ * @Author: peii
+ * @Date: 2021-07-16 15:36:02
+ * @LastEditTime: 2021-07-16 17:43:16
+ * @LastEditors: peii
+ * @Vision: 1.0
+ * @Description: 右侧产品列表
+ */
+// @ts-nocheck
+import React, { Component } from 'react'
+import { View, Text, ScrollView } from 'react-native'
+import { inject, observer } from 'mobx-react'
+import { ISupplier } from 'bonehouse'
+import * as R from 'ramda'
+import { g, getFormItem, isBlank, isNotBlank, show, translateSysprofile } from '../../../utils/utils'
+import styles from './index.styl'
+type IProps = {
+  productionStore: {
+  }
+}
+type IState = {}
+class Production extends Component<IProps, IState> {
+  render() {
+    return <View style={g(styles, 'pro')}>
+    </View>
+  }
+}
+export default inject('productionStore')(observer(Production))
--- a/src/pages/order/productions/supplier.tsx
+++ b/src/pages/order/productions/supplier.tsx
@@ -2,7 +2,7 @@
 * @FilePath: /BoneHouse_Business_APP/src/pages/order/productions/supplier.tsx
 * @Author: peii
 * @Date: 2021-07-15 12:07:24
- * @LastEditTime: 2021-07-15 17:47:20
+ * @LastEditTime: 2021-07-16 17:44:43
 * @LastEditors: peii
 * @Vision: 1.0
 * @Description: 供应商列表
@@ -12,10 +12,11 @@
 import React, { Component } from 'react'
 import { View, Text, ScrollView, Image, TouchableOpacity } from 'react-native'
 import { inject, observer } from 'mobx-react'
-import { ISupplier } from 'bonehouse'
+import { ISupplier, ICategory } from 'bonehouse'
 import * as R from 'ramda'
-import { g, getFormItem, isBlank, isNotBlank, show, translateSysprofile } from '../../../utils/utils'
+import { g, isBlank, isNotBlank } from '../../../utils/utils'
-import { IMAGE_PREFIX } from './constant'
+import { TextImage } from './common'
 import styles from './index.styl'
 type IProps = {
@@ -24,8 +25,10 @@ type IProps = {
  }
  productionStore: {
    suppliers: ISupplier[]
-    setActiveSupplier: (supplier: ISupplier) => {}
+    setActiveSupplier: (supplier: ISupplier) => void
    activeSupplier: ISupplier
+    categories: ICategory[]
+    getCategory: (supplierCode: string) => void
  }
 }
@@ -49,7 +52,20 @@ class Supplier extends Component<IProps> {
    }
  }
-  supplierClickHandler(supplier) {
+  /**
+   * @description: 供应商点击处理
+   * @param {*} supplier
+   * @return {*}
+   */
+  supplierClickHandler(supplier: ISupplier) {
+    if (
+      R.compose(
+        R.equals(supplier.supplierCode),
+        R.propOr('', 'supplierCode'),
+      )(this.props.productionStore.activeSupplier)
+    ) {
+      return
+    }
    this.props.productionStore.setActiveSupplier(supplier)
  }
@@ -72,24 +88,12 @@ class Supplier extends Component<IProps> {
                    )(activeSupplier),
                  })}
                  key={supplier.supplierCode}
-                  touchableOpacity={0.8}
+                  activeOpacity={0.8}
                  onPress={() => {
                    this.supplierClickHandler(supplier)
                  }}
                >
-                  {isBlank(icon) ? (
+                  <TextImage size={42} colorNumber={index + 1} image={icon} text={supplier.supplierShortName} />
-                    <View style={g(styles, 'suppliers-item__text-icon', `text-icon-${index + 1}`)}>
-                      <Text style={g(styles, 'suppliers-item__text-icon-text', `text-icon__text-${index + 1}`)}>
-                        {supplier.supplierShortName}
-                      </Text>
-                    </View>
-                  ) : (
-                    <Image
-                      source={{ uri: this.props.store.host + IMAGE_PREFIX + icon }}
-                      style={g(styles, 'suppliers-item__icon')}
-                      resizeMode="contain"
-                    />
-                  )}
                </TouchableOpacity>
              )
            })}

--- a/src/pages/order/self.tsx
+++ b/src/pages/order/self.tsx
@@ -2,7 +2,7 @@
 * @FilePath: /BoneHouse_Business_APP/src/pages/order/self.tsx
 * @Author: peii
 * @Date: 2021-07-13 22:40:12
- * @LastEditTime: 2021-07-15 10:26:50
+ * @LastEditTime: 2021-07-16 16:59:48
 * @LastEditors: peii
 * @Vision: 1.0
 * @Description: 自助下单
@@ -62,6 +62,10 @@ type IProps = {
    getInventories: Function
    submit: Function
  }
+  productionStore: {
+    resetCategory: () => void
+    resetSupplier: () => void
+  }
 }
 type IState = {
@@ -236,6 +240,11 @@ class SelfOrder extends Component<IProps, IState> {
    this.setOptionsFormItems()
  }
+  componentWillUnmount() {
+    this.props.productionStore.resetSupplier()
+    this.props.productionStore.resetCategory()
+  }
  /**
   * @description: 设置配置性的表单字段(部门，业务经理，跟台员，送货员)
   */
@@ -551,4 +560,4 @@ class SelfOrder extends Component<IProps, IState> {
  }
 }
-export default inject('sysStore', 'userStore', 'orgStore', 'orderStore')(observer(SelfOrder))
+export default inject('sysStore', 'userStore', 'orgStore', 'orderStore', 'productionStore')(observer(SelfOrder))
--- a/src/services/service.ts
+++ b/src/services/service.ts
@@ -8,6 +8,7 @@
 */
 import { request } from './request'
 import { injectable } from 'inversify'
+import { IPackageType } from 'bonehouse'
 const ctx = '/api/latest'
@@ -155,11 +156,38 @@ export default class Service {
  }
  /**
-   * @description:
+   * @description: 请求产品分类
   * @param {object} data
   * @return {*}
   */
  getProductionCategories(data: { manufacturerCode: string }) {
    return request({ url: `${ctx}/order/item/search`, data })
  }
+  /**
+   * @description: 请求容器（工具包或钉盒）
+   * @param {any} data
+   * @return {*}
+   */
+  getItemPackage(data: { manufacturerCode: string; categoryCode: IPackageType }) {
+    return request({ url: `${ctx}/inventory/item_package_header/search`, data })
+  }
+  /**
+   * @description: 请求零散工具
+   * @param {object} data
+   * @return {*}
+   */
+  getTools(data: { manufacturerCode: string }) {
+    return request({ url: `${ctx}/order/tool/search`, data })
+  }
+  /**
+   * @description: 请求产品耗材
+   * @param {any} data
+   * @return {*}
+   */
+  getItemDetail(data: { categoryCode: string; manufacturerCode: string; orgCode: string }) {
+    return request({ url: `${ctx}/order/item_detail/search`, data })
+  }
 }
--- a/src/stores/production.ts
+++ b/src/stores/production.ts
@@ -2,13 +2,13 @@
 * @FilePath: /BoneHouse_Business_APP/src/stores/production.ts
 * @Author: peii
 * @Date: 2021-07-15 10:49:02
- * @LastEditTime: 2021-07-15 18:02:56
+ * @LastEditTime: 2021-07-16 18:12:13
 * @LastEditors: peii
 * @Vision: 1.0
 * @Description: 产品store
- * @ts-nocheck
 */
+// @ts-nocheck
 import { observable, action, runInAction, toJS, flow, computed, ObservableMap } from 'mobx'
 import { persist } from 'mobx-persist'
 import { injectable, inject } from 'inversify'
@@ -46,6 +46,27 @@ export default class Production {
    },
  ]
+  showFields = {
+    // 手术模板显示
+    SURGERY_TEMPLATE: [
+      { field: 'templateName', label: '', type: 'title' },
+      { field: 'customerName', label: '客户', style: 'production-item__text-big' },
+      { field: 'doctorName', label: '手术医生' },
+      { field: 'surgeryTypeName', label: '手术类型' },
+      { field: 'templateDesc', label: '模板说明', style: 'production-item__text-small' },
+    ],
+    package: [
+      { field: 'templateName', label: '', type: 'title' },
+      { field: 'customerName', label: '客户', style: 'production-item__text-big' },
+      { field: 'doctorName', label: '手术医生' },
+      { field: 'surgeryTypeName', label: '手术类型' },
+    ],
+  }
+  imageFields = {
+  }
  @observable orgCode: string = ''
  @observable activeSupplier!: ISupplier
  @observable activeCatetory!: ICategory
@@ -58,6 +79,10 @@ export default class Production {
  @observable
  _categories: ObservableMap<string, ICategory[]> = new ObservableMap()
+  @persist('map')
+  @observable
+  _productions: ObservableMap<string, any[]> = new ObservableMap()
  @computed
  get suppliers() {
    return isNotBlank(this.orgCode) ? this._suppliers.get(this.orgCode) : []
@@ -72,6 +97,11 @@ export default class Production {
    }
  }
+  @computed
+  get productions() {
+    return []
+  }
  @action
  setOrgCode(orgCode: string) {
    this.orgCode = orgCode
@@ -80,6 +110,39 @@ export default class Production {
  @action
  setActiveSupplier(supplier: ISupplier) {
    this.activeSupplier = supplier
+    // 选择完供应商后，看当前有没有产品类别，没有就请求，有且没有已选择的类别，选第一个
+    if (isBlank(this.categories)) {
+      this.getCategory(supplier.supplierCode)
+    } else if (
+      isBlank(this.activeCatetory) ||
+      R.compose(
+        R.complement(R.includes)(this.activeCatetory.categoryCode),
+        R.pluck('categoryCode'),
+      )(this.defaultCategories)
+    ) {
+      this.setActiveCategory(R.head(this.categories as any) as any)
+    }
+  }
+  @action
+  setActiveCategory(category: ICategory) {
+    this.activeCatetory = category
+    if (isBlank(this.productions)) {
+      this.getProductions()
+    }
+  }
+  @action
+  resetSupplier() {
+    this._suppliers = new ObservableMap()
+    this.activeSupplier = null
+  }
+  @action
+  resetCategory() {
+    this._categories = new ObservableMap()
+    this.activeCatetory = null
  }
  /**
@@ -102,7 +165,6 @@ export default class Production {
    if (isNotBlank(suppliers)) {
      this.setActiveSupplier(R.head(suppliers as any) as any)
-      this.getCategory(this.activeSupplier.supplierCode)
    }
  })
@@ -121,5 +183,92 @@ export default class Production {
    const categories = R.concat(R.clone(this.defaultCategories), res.data.item)
    this._categories.set(manufacturerCode, categories)
+    this.setActiveCategory(R.head(categories))
+  })
+  /**
+   * @description: 请求产品总入口方法
+   * @param {*}
+   * @return {*}
+   */
+  getProductions() {
+    if (isBlank(this.orgCode) || isBlank(this.activeSupplier)) return
+    switch (this.activeCatetory.categoryCode) {
+      // 手术模板
+      case 'SURGERY_TEMPLATE':
+        this.getSurgeryTemplates()
+        break
+      // 手术模板
+      case '1301':
+      case '1302':
+        this.getPackages()
+        break
+      // 零散器械
+      case 'SCATTERED_EQUIPMENT':
+        this.getTools()
+        break
+      // 骨科耗材
+      default:
+        this.getItemDetail()
+        break
+    }
+  }
+  /**
+   * @description: 请求手术模板
+   * @param {*} function
+   * @return {*}
+   */
+  getSurgeryTemplates = flow(function* (this: Production) {
+    const params = {
+      orgCode: this.orgCode,
+      manufacturerCode: this.activeSupplier.supplierCode,
+    }
+    const res = yield this.service.getSurgeryTemplates(params)
+    console.log(res)
+  })
+  /**
+   * @description: 请求工具包
+   * @return {*}
+   */
+  getPackages = flow(function* (this: Production) {
+    const params = {
+      manufacturerCode: this.activeSupplier.supplierCode,
+      categoryCode: this.activeCatetory.categoryCode,
+    }
+    const res = yield this.service.getItemPackage(params)
+    console.log(res)
+  })
+  /**
+   * @description: 零散工具
+   * @return {*}
+   */
+  getTools = flow(function* (this: Production) {
+    const params = {
+      manufacturerCode: this.activeSupplier.supplierCode,
+    }
+    const res = yield this.service.getTools(params)
+    console.log(res)
+  })
+  /**
+   * @description: 耗材
+   * @return {*}
+   */
+  getItemDetail = flow(function* (this: Production) {
+    const params = {
+      orgCode: this.orgCode,
+      manufacturerCode: this.activeSupplier.supplierCode,
+      categoryCode: this.activeCatetory.categoryCode,
+    }
+    const res = yield this.service.getItemDetail(params)
+    console.log(res)
  })
 }
--- a/types/global.ts
+++ b/types/global.ts
@@ -14,6 +14,8 @@
 declare module 'bonehouse' {
  export type EnumType = { [s: string]: any }
+  export type IPackageType = '1301' | '1302'
  export type IDepartment = {
    departmentCode: string
    departmentName: string