From ecc5cf8887fcee426d88b65252ae1bc403891947 Mon Sep 17 00:00:00 2001
From: YunaiV <>
Date: Sun, 17 Mar 2019 22:50:04 +0800
Subject: [PATCH] =?UTF-8?q?=E5=89=8D=E7=AB=AF=EF=BC=9A=E5=95=86=E5=93=81?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E3=80=82=E6=8F=90=E4=BA=A4=E9=83=A8=E5=88=86?=
 =?UTF-8?q?=EF=BC=8C=E8=AE=A9=E5=B0=8F=E8=8C=83=E5=B8=AE=E5=BF=99=E7=9C=8B?=
 =?UTF-8?q?=E7=9C=8B~?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../models/product/productSpuAddOrUpdate.js   | 23 +++++++--
 .../pages/Product/ProductSpuAddOrUpdate.js    | 50 ++++++++++++++-----
 2 files changed, 57 insertions(+), 16 deletions(-)

diff --git a/admin-web/src/models/product/productSpuAddOrUpdate.js b/admin-web/src/models/product/productSpuAddOrUpdate.js
index af7409534..f457e333c 100644
--- a/admin-web/src/models/product/productSpuAddOrUpdate.js
+++ b/admin-web/src/models/product/productSpuAddOrUpdate.js
@@ -6,9 +6,7 @@ export default {
 
   state: {
     list: [],
-    attrTree: [{
-
-    }
+    attrTree: [
       // {
       //   id: //
       //   name: //
@@ -73,17 +71,34 @@ export default {
         },
       });
     },
+    *selectAttr({ payload }, { call, put }) {
+      // const { queryParams } = payload;
+      // const response = yield call(productCategoryTree, queryParams);
+      message.info('调试：添加规格成功!');
+      yield put({
+        type: 'selectAttrSuccess',
+        payload: payload,
+      });
+    },
   },
 
   reducers: {
     addAttrSuccess(state, {payload}) {
       // debugger;
-      console.log(state.attrTree);
+      // console.log(state.attrTree);
       state.attrTree.push(payload.attrAdd);
       return {
         ...state
       }
     },
+    selectAttrSuccess(state, {payload}) {
+      // debugger;
+      // console.log(state.attrTree);
+      state.attrTree[payload.attrIndex] = payload.attr;
+      return {
+        ...state
+      }
+    },
     treeSuccess(state, { payload }) {
       return {
         ...state,
diff --git a/admin-web/src/pages/Product/ProductSpuAddOrUpdate.js b/admin-web/src/pages/Product/ProductSpuAddOrUpdate.js
index 77bf53911..7308e0474 100644
--- a/admin-web/src/pages/Product/ProductSpuAddOrUpdate.js
+++ b/admin-web/src/pages/Product/ProductSpuAddOrUpdate.js
@@ -1,6 +1,6 @@
 /* eslint-disable */
 
-import React, { PureComponent, Fragment } from 'react';
+import React, {PureComponent, Fragment, Component} from 'react';
 import { connect } from 'dva';
 import moment from 'moment';
 import {Card, Form, Input, Radio, Button, Table, Select} from 'antd';
@@ -16,12 +16,14 @@ const Option = Select.Option;
 @connect(({ productSpuList, productAttrList, productSpuAddOrUpdate, loading }) => ({
   // list: productSpuList.list.spus,
   // loading: loading.models.productSpuList,
+  productAttrList,
+  productSpuAddOrUpdate,
   allAttrTree: productAttrList.tree,
   attrTree: productSpuAddOrUpdate.attrTree
 }))
 
 @Form.create()
-class ProductSpuAddOrUpdate extends PureComponent {
+class ProductSpuAddOrUpdate extends Component {
   state = {
     modalVisible: false,
     modalType: 'add', //add update
@@ -65,9 +67,30 @@ class ProductSpuAddOrUpdate extends PureComponent {
     });
   }
 
+  handleSelectAttr = (value, option) => {
+    console.log(value);
+    console.log(option);
+    debugger;
+    const { dispatch } = this.props;
+    let attrIndex = option.key.substring(option.key.indexOf('option-attr-') + 'option-attr-'.length, option.key.lastIndexOf('-'));
+    console.log('attrIndex: ' + attrIndex);
+    debugger;
+    dispatch({
+      type: 'productSpuAddOrUpdate/selectAttr',
+      payload: {
+        attrIndex: attrIndex,
+        attr: {
+          id: option.props.value,
+          name: option.props.children,
+        }
+      },
+    });
+  }
+
   render() {
     // debugger;
-    const { form, data, attrTree } = this.props;
+    const { form, data, attrTree, allAttrTree } = this.props;
+    const that = this;
 
     // 规格明细
     const columns = [
@@ -94,19 +117,22 @@ class ProductSpuAddOrUpdate extends PureComponent {
     if (attrTree && attrTree.length > 0) {
       for (let i in attrTree) {
         let attr = attrTree[i];
-        attr = <div>
-          <Select defaultValue="lucy" style={{ width: 120 }}>
-            {
+        // console.log('i: ' + i);
+        // 1. 规格
+        let options = [];
+        for (let j in allAttrTree) {
+          let attr = allAttrTree[j];
+          options.push(<Option key={`option-attr-${i}-${attr.id}`} value={attr.id}>{attr.name}</Option>);
+        }
+        // 2. 规格值
 
-            }
-            <Option value="jack">Jack</Option>
-            <Option value="lucy">Lucy</Option>
-            <Option value="disabled" disabled>Disabled</Option>
-            <Option value="Yiminghe">yiminghe</Option>
+        // 3. 拼装最终，添加到 attrTreeHTML 中
+        attr = <div key={`div-attr-${i}`}>
+          <Select key={`select-attr-${i}`} style={{ width: 120 }} placeholder='请选择规格' onChange={that.handleSelectAttr}>
+            {options}
           </Select>
         </div>;
         attrTreeHTML.push(attr);
-        // debugger;
       }
     }