'完善明细弹框逻辑'

src/pages/transaction/enquiryOffer/toAddSubmit/detail.tsx

@@ -3,7 +3,7 @@
  * @Date: 2020-08-24 11:39:29
  * @LastEditors: LeeJiancong
  * @Copyright: 1549414730@qq.com
- * @LastEditTime: 2020-09-15 17:11:17
+ * @LastEditTime: 2020-09-16 14:25:16
  */
 import React, { Component, useState, useEffect,useRef } from 'react'
 import ReactDOM from 'react-dom'
@@ -39,6 +39,7 @@ import { GlobalConfig } from '@/global/config';
 import styles from './templateForm.less';
 import ReutrnEle from '@/components/ReturnEle'
 import ModalTable from '@/components/ModalTable'
+import EyePreview from '@/components/EyePreview'
 import { PATTERN_MAPS } from '@/constants/regExp'
 import { useRowSelectionTable } from '@/hooks/useRowSelectionTable'
 import { PageStatus, usePageStatus } from '@/hooks/usePageStatus'
@@ -54,8 +55,6 @@ import {
 } from '@/services';
 import { store } from '@/store'
 import colorTag from '@/pages/logistics/colorTag'
-import { Effects } from 'bizcharts'
-import { check } from 'prettier'
 
 const { TabPane } = Tabs
 const { TextArea } = Input
@@ -248,6 +247,8 @@ const Detail: React.FC<{}> = () => {
     quotationDeadline:'',//报价截至时间
     requisitionFormAddress: []//地市
   })
+  const [mode, setmode] = useState(0)
+  const [RroductinitialValues, setRroductinitialValues] = useState({})
   const [SetForm, setSetForm] = useState<any>('')
   const proRef = useRef<any>({})
   const [eqInfo, seteqInfo] = useState({
@@ -544,7 +545,13 @@ const Detail: React.FC<{}> = () => {
       title: '报价商品名称',
       dataIndex: 'productName',
       key: 'productName',
-      align: 'left'
+      align: 'left',
+      render: (text: any,records: any) => <EyePreview type="button" handleClick={() => {
+        console.log(records)
+        setRroductinitialValues(records)
+        setdialogVisible(true)
+        setmode(2)
+      }}>{text}</EyePreview>
     },
     {
       title: '品类',
@@ -597,7 +604,13 @@ const Detail: React.FC<{}> = () => {
       dataIndex: 'option',
       key: 'option',
       align: 'center',
-      render:(text,record,index) => <>
+      render:(text,records,index) => <>
+        <Button type="link" onClick={(index) =>{
+          console.log(records)
+          setRroductinitialValues(records)
+          setdialogVisible(true)
+          setmode(1)     
+        }}>编辑</Button>
         <Button type="link" onClick={(index) =>hanldeDeleteModel(index)}>删除</Button>
       </> 
     },
@@ -653,6 +666,14 @@ const Detail: React.FC<{}> = () => {
   const handleOptionBtn = (type: any) => {
     switch (type) {
       case 1:
+        setmode(0)
+        setRroductinitialValues({
+          ...RroductinitialValues,
+          model:'',
+          productId:'',
+          brand:'',
+          productName: ''//商品名称
+        })
         setdialogVisible(true)
         console.log(proRef,proRef.current)
         // proRef.current.retSetForm()
@@ -665,6 +686,9 @@ const Detail: React.FC<{}> = () => {
       case 2:
         setVisibleChannelMember(true)
         break;
+      case 3:
+        break;
+         
     }
   }
 
@@ -683,41 +707,14 @@ const Detail: React.FC<{}> = () => {
           let data = res.data
           let areaCodeList = []
           setdataInfo(data)//总
-          // setAreaParams(data.requisitionFormAddress)
-          // if (data.requisitionFormAddress) {
-          //   data.requisitionFormAddress.forEach((v) => {
-          //     areaCodeList.push([v.provinceCode, v.cityCode])
-          //   })
-          // }
-          // //品类
-          // if (data.productCategory) {
-          //   setcustomerCategoryId([data.productCategory.key])
-          //   initCreatePro(data.productCategory.key,false)//生产弹窗
-          // }
-
-      
-
           //地区
-          setrequisitionFormAddress(areaCodeList)
           setinitialValues(data)
           tabForm.resetFields()
-
-          console.log('platType',platType)
-          //需求单对接列表
-          // PublicApi.getOrderRequisitionFormDemandDockingList({ id: id }).then(res => {
-          //   if (res.code === 1000) {
-          //     let { data } = res.data
-          //     if(_plattype == 2){//系统匹配
-          //       setdockingList(data)
-          //     }else if(_plattype == 3){//会员
-          //       setmemberList(data)
-          //     }
-          //   }
-          // })
-          
+          getOrderProductAll(data.requisitionFormId) //查询规格 赋值弹窗单位和采购数量
         }
       })
 
+
       PublicApi.getOrderQuotationParticulars({ id: id }).then(res => {
         if(res.code ===  1000){
           let {data} = res.data
@@ -900,14 +897,14 @@ const Detail: React.FC<{}> = () => {
         item.requisitionFormId = requisitionFormId
         item.category = v.category
         item.price = v.price //报价单位
-        item.requisitionFormNo = values.requisitionFormNo
         item.specifications = v.specifications
         item.productName = v.productName
         item.brand = v.brand
         item.model = v.model
         item.purchaseNuit = v.purchaseNuit
         item.purchaseQuantity = v.purchaseQuantity //数量
-
+        item.productId = v.productId //商品ID 选择的
+        item.requisitionFormNo = values.requisitionFormNo
         let _otherList = []
         Object.keys(v).forEach(child => {
           otherList.forEach(j => {
@@ -1075,20 +1072,33 @@ const Detail: React.FC<{}> = () => {
     })
 
     //查询 商品规格
+    getOrderProductAll(id)
+  }
+  
+  /**
+   * @description:  查询 商品规格 赋值单位和数量
+   * @param {type} 
+   * @return {type} 
+   */
+  const getOrderProductAll = (id) => {
     PublicApi.getOrderRequisitionFormProductAll({id:id}).then(res => {
       if(res.code === 1000){
         let {data} = res || {}
         let {purchaseNuit,purchaseQuantity} = data[0]
         let list = data.map(v => v.model) 
-        seteqInfo({...eqInfo,modelList: list,
+        setRroductinitialValues({
+          ...RroductinitialValues,
           purchaseNuit: purchaseNuit,
           purchaseQuantity: purchaseQuantity
+        })
+        seteqInfo({...eqInfo,modelList: list
         
         })
       }
     })
   }
 
+
   return (
     <PageHeaderWrapper
       onBack={() => history.goBack()}
@@ -1117,12 +1127,6 @@ const Detail: React.FC<{}> = () => {
                 <TabPane tab="基本信息" key='1'>
                   <Row>
                     <Col span={12}>
-                      {/* <Form name="base-form"
-                      {...layout}
-                      colon={false}
-                      labelAlign="left"
-                      autoComplete="off"
-                    > */}
                       <Form.Item
                         label="报价单摘要"
                         initialValue={initialValues.quotationSummary}
@@ -1160,7 +1164,6 @@ const Detail: React.FC<{}> = () => {
                         </Form.Item>
                       }
                       <Form.Item
-                        // name='memberName'
                         label='需求会员'
                       >
                         <>{getAuth().name || '未知用户'}</>
@@ -1191,8 +1194,6 @@ const Detail: React.FC<{}> = () => {
                         {
                           initialValues.externalState == 1 ? <span style={statuStyle.default}>待提交需求单</span> :
                             initialValues.externalState == 2 ? <span style={statuStyle.warn}>审核不通过需求单</span> : ''
-
-
                         }
                       </Form.Item>
                       {
@@ -1206,8 +1207,6 @@ const Detail: React.FC<{}> = () => {
                         </Form.Item>
 
                       }
-
-                      {/* </Form> */}
                     </Col>
                   </Row>
                 </TabPane>
@@ -1293,8 +1292,6 @@ const Detail: React.FC<{}> = () => {
                       <Table rowKey={'id'} dataSource={dataInfo.interiorRequisitionForms || []} columns={interiorColumn(formTime, interiorTextState)} />
                     </TabPane>
                   </Tabs>
-
-
                 </TabPane>
 
               </Tabs>
@@ -1307,7 +1304,8 @@ const Detail: React.FC<{}> = () => {
           eqInfo={eqInfo}//需求单相关
           onRef={proRef}
           // onRef={(refs) => setSetForm(refs)}
-          mode={0}
+          mode={mode}
+          initialValues={RroductinitialValues}
           productAttributeJson = {productAttributeJson}
           onOK={(values: any,data) => handleSubmit(values,data)}
           onCancel={() => setdialogVisible(false)}