feat: 商品列表增加多端展示

xinkeaboard-seller/config/config.js

@@ -73,26 +73,26 @@ export default {
   },
   proxy: {
     "/api/": {
-      target: "http://54.46.9.88:8001/",
-      // target: 'http://192.168.0.158:8001/',
-      changeOrigin: true,
-      pathRewrite: { "^/api": "" },
-    },
-    '/api/v3/system/seller/setting/getSiteSettingList': {
-      target: 'http://192.168.0.158:8001/',
-      changeOrigin: true,
-      pathRewrite: { "^/api": "" },
-    },
-    '/api/v3/statistics/seller/overview/analysis/source/presentData': {
+      // target: "http://54.46.9.88:8001/",
       target: 'http://192.168.0.158:8001/',
       changeOrigin: true,
       pathRewrite: { "^/api": "" },
     },
-    '/api/v3/goods/seller/goods/list': {
-      target: 'http://192.168.0.158:8001/',
-      changeOrigin: true,
-      pathRewrite: { "^/api": "" },
-    }
+    // '/api/v3/system/seller/setting/getSiteSettingList': {
+    //   target: 'http://192.168.0.158:8001/',
+    //   changeOrigin: true,
+    //   pathRewrite: { "^/api": "" },
+    // },
+    // '/api/v3/statistics/seller/overview/analysis/source/presentData': {
+    //   target: 'http://192.168.0.158:8001/',
+    //   changeOrigin: true,
+    //   pathRewrite: { "^/api": "" },
+    // },
+    // '/api/v3/goods/seller/goods/list': {
+    //   target: 'http://192.168.0.158:8001/',
+    //   changeOrigin: true,
+    //   pathRewrite: { "^/api": "" },
+    // }
   },
   ignoreMomentLocale: true,
   lessLoaderOptions: {

xinkeaboard-seller/src/pages/goods/add_goods.js

@@ -93,6 +93,7 @@ export default class AddGoods extends Component {
       screentH: '1000',
       selectedRows: [],
       selectedRowKeys: [],//selectedRows的key
+      currentSite: props.common?.currentSite ?? safeJsonParse(localStorage.getItem('currentSite')),
       columns_spec: [
         {
           title: ' ',
@@ -1133,9 +1134,9 @@ export default class AddGoods extends Component {
   handleAttrGroup = async (val, attaData = {}) => {
     //根据属性分组id获取属性列表
     const { dispatch } = this.props;
-    let { store_attr_data } = this.state;
+    let { store_attr_data, currentSite } = this.state;
     let dis_type = 'product/get_attribute_lists_can_use';
-    let payload = { pageSize: list_com_page_more, groupId: val };
+    let payload = { pageSize: list_com_page_more, groupId: val, distributionChannel: currentSite?.value };
     await dispatch({
       type: dis_type,
       payload: payload,
@@ -1722,9 +1723,9 @@ export default class AddGoods extends Component {
   //获取商品标签列表
   get_goods_label_list = () => {
     const { dispatch } = this.props;
-    let { other_data } = this.state;
+    let { other_data, currentSite } = this.state;
     let dis_type = 'product/get_goods_label_lists';
-    let payload = { pageSize: list_com_page_more };
+    let payload = { pageSize: list_com_page_more, distributionChannel: currentSite?.value };
     dispatch({
       type: dis_type,
       payload: payload,
@@ -2472,9 +2473,9 @@ export default class AddGoods extends Component {
   //获取商户可以使用的所有分类列表 goods:商品分类
   getSystemCat = async (grade, categoryId = '') => {
     const { dispatch } = this.props;
-    let { goods_cat } = this.state;
+    let { goods_cat, currentSite } = this.state;
     let dis_type = 'product/get_system_seller_cate_list';
-    let param = { grade: grade };
+    let param = { grade: grade, distributionChannel: currentSite?.value };
     if (categoryId) param.categoryId = categoryId;
     await dispatch({
       type: dis_type,
@@ -2514,10 +2515,10 @@ export default class AddGoods extends Component {
   //根据类型id获取类型详情：绑定的属性、品牌 ,editData为编辑的数据
   get_brand_attr_detail = async (categoryId, editData = []) => {
     const { dispatch } = this.props;
-    let { search_attr_data, goods_base_data } = this.state;
+    let { search_attr_data, goods_base_data, currentSite } = this.state;
     await dispatch({
       type: 'product/get_brand_attr_detail',
-      payload: { categoryId: categoryId, pageSize: list_com_page_more },
+      payload: { categoryId: categoryId, pageSize: list_com_page_more, distributionChannel: currentSite?.value },
       callback: (res) => {
         if (res.state == 200) {
           //品牌信息
@@ -2669,7 +2670,7 @@ export default class AddGoods extends Component {
   //保存并新增事件
   saveData = (editorCon) => {
     const { dispatch } = this.props;
-    const { query, sele_goods_cat_data, spec_data_table, goods_img_data, goods_video_data, spec_set_data, seo_data, cur_goods_type, other_data,goods_download_data,goods_download_data2,price_test_date,initSummaryEditorContent,goods_min_order_data } = this.state;
+    const { currentSite, query, sele_goods_cat_data, spec_data_table, goods_img_data, goods_video_data, spec_set_data, seo_data, cur_goods_type, other_data,goods_download_data,goods_download_data2,price_test_date,initSummaryEditorContent,goods_min_order_data } = this.state;
     this.props.form.validateFieldsAndScroll((err, values) => {
         if (!err) {
           let params = {};
@@ -2953,7 +2954,10 @@ export default class AddGoods extends Component {
           this.setState({ pageLoading: true });
           dispatch({
             type: dis_type,
-            payload: params,
+            payload: {
+              ...params,
+              distributionChannel: currentSite?.value
+            },
             callback: (res) => {
               sthis.setState({ pageLoading: false });
               if (res.state == 200) {
@@ -3143,13 +3147,8 @@ export default class AddGoods extends Component {
     console.log(val)
   };
 
-
-
-
-
   render() {
-    let currentSite = this.props.common?.currentSite ?? safeJsonParse(localStorage.getItem('currentSite'));
-    const { imgModalList,goods_base_data, spec_data_table, columns_spec, query, preview_img, preview_alt_con, show_preview_modal,modal_width, goods_img_data, spec_set_data,seo_data, goods_cat, sele_goods_cat_data, cur_data, express_show, express_data, other_data, top_nav_step, spu_data_table, columns_spu, pageLoading, step, invoice_data, top_bottom_tpl_data, store_attr_data, search_attr_data, show_radio_flag, goods_video_data, goods_download_data,cur_goods_type, initEditorFlag, getEditorContentFlag, initEditorContent,price_test_date,getSummaryEditorContentFlag,initSummaryEditorContent,goods_min_order_data,imgModalvisible,imgModalVidevisible,imgModalfilevisible,goods_download_data2,goods_video_choose,goods_file_choose } = this.state;
+    const { currentSite, imgModalList,goods_base_data, spec_data_table, columns_spec, query, preview_img, preview_alt_con, show_preview_modal,modal_width, goods_img_data, spec_set_data,seo_data, goods_cat, sele_goods_cat_data, cur_data, express_show, express_data, other_data, top_nav_step, spu_data_table, columns_spu, pageLoading, step, invoice_data, top_bottom_tpl_data, store_attr_data, search_attr_data, show_radio_flag, goods_video_data, goods_download_data,cur_goods_type, initEditorFlag, getEditorContentFlag, initEditorContent,price_test_date,getSummaryEditorContentFlag,initSummaryEditorContent,goods_min_order_data,imgModalvisible,imgModalVidevisible,imgModalfilevisible,goods_download_data2,goods_video_choose,goods_file_choose } = this.state;
     return (
       <div className={`${global.common_page} ${global.com_flex_column}`} style={{ position: 'relative' }}>
         <div className={` ${global.flex_com_row_start_center} ${global.add_goods_title}`}>

xinkeaboard-seller/src/pages/goods/goods_check_lists_title.js

@@ -37,6 +37,7 @@ let pageSize = list_com_page_size_10;
 export default class GoodsCheckLists extends Component {
   constructor(props) {
     super(props);
+    this.searchRef = React.createRef(); // 创建 ref
     this.state = {
       search_height:0,
       modal_width:700,
@@ -152,6 +153,15 @@ export default class GoodsCheckLists extends Component {
           },
         },
         {
+          title: `${sldComLanguage('发布渠道')}`,
+          dataIndex: 'distributionChannel',
+          align: 'center',
+          width: 100,
+          render: (text, record, index) => {
+            return this.state.siteList.find(item => item.value === text)?.title;
+          }
+        },
+        {
           title: `${sldComLanguage('店铺分类')}`,
           dataIndex: 'innerLabelList',
           align: 'center',
@@ -224,6 +234,9 @@ export default class GoodsCheckLists extends Component {
           ),
         },
       ],
+      siteList: [],
+      currentSite: {},
+      siteListLoading: false, // 站点tab列表loading
     };
   }
 
@@ -282,7 +295,7 @@ export default class GoodsCheckLists extends Component {
   ];
 
   componentDidMount() {
-    this.get_list({ pageSize: pageSize });
+    this.getSiteList()
     this.getTemplateList();
     this.getStoreCat();//获取店铺分类
     this.resize();
@@ -293,6 +306,26 @@ export default class GoodsCheckLists extends Component {
     window.removeEventListener('resize', this.resize);
   }
 
+  // 获取站点列表
+  getSiteList = () => {
+    this.setState({ siteListLoading: true });
+    const { dispatch } = this.props;
+    dispatch({
+      type: 'common/get_site_list_data',
+      callback: (res) => {
+        if (res.state == 200) {
+          this.setState({ siteList: res.data, currentSite: res.data[0], siteListLoading: false })
+          // 设置当前站点
+          dispatch({
+            type: 'common/set_current_site',
+            payload: res.data[0]
+          })
+          this.get_list({ pageSize: pageSize, distributionChannel: res.data[0]?.value });
+        }
+      },
+    });
+  }
+
   resize = () =>{
     const {search_height} = this.state;
     if(this.refs.search_part!=undefined){
@@ -336,10 +369,15 @@ export default class GoodsCheckLists extends Component {
 
   //设置关联版式
   setTemplate = () => {
-    let {addData} = this.state;
+    let { addData, currentSite} = this.state;
     this.setState({
       operateData: JSON.parse(JSON.stringify(addData)),
-      title:`${sldComLanguage('设置关联版式')}`,
+      // title:`${sldComLanguage('设置关联版式')}`,
+      title: <span style={{ color: '#fff' }}>
+                <span style={{ fontSize: '16px' }}>{ `${sldComLanguage('设置关联版式')}` } </span>
+                <span style={{ fontSize: '12px' }}>{ `( ${sldComLanguage('商品发布渠道为: ')}` }</span>
+                <span style={{ fontSize: '12px' }} >{ `${currentSite.title} )` }</span>
+              </span>,
       modal_width: 500,
       modalVisible: true,
       type: 'template',
@@ -375,7 +413,7 @@ export default class GoodsCheckLists extends Component {
   //商品操作
   operateGoods = (id, type) => {
     this.setState({submiting:true});
-    const { params } = this.state;
+    const { params, currentSite } = this.state;
     const { dispatch } = this.props;
     let param_data = {};
     let dis_type = '';
@@ -392,6 +430,7 @@ export default class GoodsCheckLists extends Component {
       dis_type = 'product/set_related_template';
       param_data = id
     }
+    param_data.distributionChannel = currentSite.value;
     dispatch({
       type: dis_type,
       payload: param_data,
@@ -414,6 +453,9 @@ export default class GoodsCheckLists extends Component {
 
   //获取数据列表
   get_list = (params) => {
+    if (!params.distributionChannel) {
+      params.distributionChannel = this.state.currentSite.value;
+    }
     this.setState({ initLoading: true });
     const { dispatch } = this.props;
     dispatch({
@@ -483,8 +525,8 @@ export default class GoodsCheckLists extends Component {
     this.setState({ [type]: datas });
   };
 
-  //搜索事件
-  search = (data) => {
+  // 处理筛选数据
+  parseSearchData = (data) => {
     const values = { ...data };
     //时间处理
     if (values.search_create_time) {
@@ -492,11 +534,18 @@ export default class GoodsCheckLists extends Component {
       values.endTime = values.search_create_time[1] ? values.search_create_time[1].format(dateFormat)+' 23:59:59' : '';
       values.search_create_time = '';
     }
-    for(let i in values){
-      if(values[i] == ''){
-        delete values[i]
+    for (let i in values) {
+      if (values[i] == '') {
+        delete values[i];
       }
     }
+  
+    return values;
+  }
+
+  //搜索事件
+  search = (data) => {
+    const values = this.parseSearchData(data);
     this.setState({
       formValues: values,
       params: { pageSize: pageSize }
@@ -527,15 +576,42 @@ export default class GoodsCheckLists extends Component {
     }
   }
 
+  // 切换站点
+  setCurrentSite = (site) => {
+    const { dispatch } = this.props;
+    const data = this.searchRef.current.getFieldsValue(); // 调用子组件方法
+    const values = this.parseSearchData(data)
+    this.setState({ currentSite: site })
+    dispatch({
+      type: 'common/set_current_site',
+      payload: site
+    })
+    this.get_list({ pageSize: pageSize, distributionChannel: site.value, ...values });
+  }
+
   render() {
-    const { selectedRows, selectedRowKeys, search_data, columns, initLoading, data, modalVisible,operateData,title,modal_width,show_foot,submiting, search_height } = this.state;
+    const { siteListLoading, siteList, currentSite, selectedRows, selectedRowKeys, search_data, columns, initLoading, data, modalVisible,operateData,title,modal_width,show_foot,submiting, search_height } = this.state;
     return (
       <div className={global.common_page} style={{ flex: 1,}}>
         {sldLlineRtextAddGoodsAddMargin('#69A2F2', `${sldComLanguage('待审核商品')}`, 0, 0, 10)}
         <div className={global.tableListForm} ref={'search_part'}>
-          <Search search_data={search_data} moreSearchToggle={() => this.moreSearchToggle()}
+          <Search ref={this.searchRef} search_data={search_data} moreSearchToggle={() => this.moreSearchToggle()}
                   seaSubmit={(data) => this.search(data)} seaReset={() => this.seaReset()}/>
         </div>
+        {/* 站点tab列表 */}
+        <Spin spinning={siteListLoading}>
+          <div className={global.site_list}>
+            {siteList.map((site) => (
+              <div
+                key={site.name}
+                onClick={() => this.setCurrentSite(site)}
+                className={`${global.site_item} ${site.name === currentSite.name ? global.site_active : ''}`}
+              >
+                {site.title}
+              </div>
+            ))}
+          </div>
+        </Spin>
         {/*公共功能条-start*/}
         <div className={global.operate_bg}
              style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between' }}>

xinkeaboard-seller/src/pages/goods/goods_online_lists.js

@@ -387,10 +387,15 @@ export default class GoodsOnlineLists extends Component {
 
   //设置关联版式
   setTemplate = () => {
-    let { addData } = this.state;
+    let { addData, currentSite } = this.state;
     this.setState({
       operateData: JSON.parse(JSON.stringify(addData)),
-      title: `${sldComLanguage('设置关联版式')}`,
+      // title: `${sldComLanguage('设置关联版式')}`,
+      title: <span style={{ color: '#fff' }}>
+              <span style={{ fontSize: '16px' }}>{ `${sldComLanguage('设置关联版式')}` } </span>
+              <span style={{ fontSize: '12px' }}>{ `( ${sldComLanguage('商品发布渠道为: ')}` }</span>
+              <span style={{ fontSize: '12px' }} >{ `${currentSite.title} )` }</span>
+             </span>,
       modal_width: 500,
       modalVisible: true,
       type: 'template',
@@ -426,7 +431,7 @@ export default class GoodsOnlineLists extends Component {
   //商品操作
   operateGoods = (id, type) => {
     this.setState({ submiting: true });
-    const { params } = this.state;
+    const { params, currentSite } = this.state;
     const { dispatch } = this.props;
     let param_data = {};
     let dis_type = '';
@@ -442,6 +447,7 @@ export default class GoodsOnlineLists extends Component {
     } else if (type == 'template') {
       dis_type = 'product/set_related_template';
       param_data = id;
+      param_data.distributionChannel = currentSite.value;
     }
     dispatch({
       type: dis_type,

xinkeaboard-seller/src/pages/goods/goods_storage_lists_title.js

@@ -37,6 +37,7 @@ let pageSize = list_com_page_size_10;
 export default class GoodsStorageLists extends Component {
   constructor(props) {
     super(props);
+    this.searchRef = React.createRef(); // 创建 ref
     this.state = {
       search_height:0,
       modal_width:700,
@@ -148,6 +149,15 @@ export default class GoodsStorageLists extends Component {
           },
         },
         {
+          title: `${sldComLanguage('发布渠道')}`,
+          dataIndex: 'distributionChannel',
+          align: 'center',
+          width: 100,
+          render: (text, record, index) => {
+            return this.state.siteList.find(item => item.value === text)?.title;
+          }
+        },
+        {
           title: `${sldComLanguage('店铺分类')}`,
           dataIndex: 'innerLabelList',
           align: 'center',
@@ -220,6 +230,9 @@ export default class GoodsStorageLists extends Component {
           ),
         },
       ],
+      siteList: [],
+      currentSite: {},
+      siteListLoading: false, // 站点tab列表loading
     };
   }
 
@@ -278,7 +291,7 @@ export default class GoodsStorageLists extends Component {
   ];
 
   componentDidMount() {
-    this.get_list({ pageSize: pageSize });
+    this.getSiteList()
     this.getTemplateList();
     this.getStoreCat();//获取店铺分类
     this.resize();
@@ -289,6 +302,26 @@ export default class GoodsStorageLists extends Component {
     window.removeEventListener('resize', this.resize);
   }
 
+  // 获取站点列表
+  getSiteList = () => {
+    this.setState({ siteListLoading: true });
+    const { dispatch } = this.props;
+    dispatch({
+      type: 'common/get_site_list_data',
+      callback: (res) => {
+        if (res.state == 200) {
+          this.setState({ siteList: res.data, currentSite: res.data[0], siteListLoading: false })
+          // 设置当前站点
+          dispatch({
+            type: 'common/set_current_site',
+            payload: res.data[0]
+          })
+          this.get_list({ pageSize: pageSize, distributionChannel: res.data[0]?.value });
+        }
+      },
+    });
+  }
+
   resize = () =>{
     const {search_height} = this.state;
     if(this.refs.search_part!=undefined){
@@ -332,10 +365,15 @@ export default class GoodsStorageLists extends Component {
 
   //设置关联版式
   setTemplate = () => {
-    let {addData} = this.state;
+    let { addData, currentSite} = this.state;
     this.setState({
       operateData: JSON.parse(JSON.stringify(addData)),
-      title:`${sldComLanguage('设置关联版式')}`,
+      // title:`${sldComLanguage('设置关联版式')}`,
+      title: <span style={{ color: '#fff' }}>
+              <span style={{ fontSize: '16px' }}>{ `${sldComLanguage('设置关联版式')}` } </span>
+              <span style={{ fontSize: '12px' }}>{ `( ${sldComLanguage('商品发布渠道为: ')}` }</span>
+              <span style={{ fontSize: '12px' }} >{ `${currentSite.title} )` }</span>
+              </span>,
       modal_width: 500,
       modalVisible: true,
       type: 'template',
@@ -371,7 +409,7 @@ export default class GoodsStorageLists extends Component {
   //商品操作
   operateGoods = (id, type) => {
     this.setState({submiting:true});
-    const { params } = this.state;
+    const { params, currentSite } = this.state;
     const { dispatch } = this.props;
     let param_data = {};
     let dis_type = '';
@@ -386,8 +424,9 @@ export default class GoodsStorageLists extends Component {
       param_data = id
     } else if (type == 'template') {
       dis_type = 'product/set_related_template';
-      param_data = id
+      param_data = id;
     }
+    param_data.distributionChannel = currentSite.value;
     dispatch({
       type: dis_type,
       payload: param_data,
@@ -410,6 +449,9 @@ export default class GoodsStorageLists extends Component {
 
   //获取数据列表
   get_list = (params) => {
+    if (!params.distributionChannel) {
+      params.distributionChannel = this.state.currentSite.value;
+    }
     this.setState({ initLoading: true });
     const { dispatch } = this.props;
     dispatch({
@@ -479,8 +521,8 @@ export default class GoodsStorageLists extends Component {
     this.setState({ [type]: datas });
   };
 
-  //搜索事件
-  search = (data) => {
+  // 处理筛选数据
+  parseSearchData = (data) => {
     const values = { ...data };
     //时间处理
     if (values.search_create_time) {
@@ -488,11 +530,18 @@ export default class GoodsStorageLists extends Component {
       values.endTime = values.search_create_time[1] ? values.search_create_time[1].format(dateFormat)+' 23:59:59' : '';
       values.search_create_time = '';
     }
-    for(let i in values){
-      if(values[i] == ''){
-        delete values[i]
+    for (let i in values) {
+      if (values[i] == '') {
+        delete values[i];
       }
     }
+  
+    return values;
+  }
+
+  //搜索事件
+  search = (data) => {
+    const values = this.parseSearchData(data);
     this.setState({
       formValues: values,
       params: { pageSize: pageSize }
@@ -523,15 +572,42 @@ export default class GoodsStorageLists extends Component {
     }
   }
 
+  // 切换站点
+  setCurrentSite = (site) => {
+    const { dispatch } = this.props;
+    const data = this.searchRef.current.getFieldsValue(); // 调用子组件方法
+    const values = this.parseSearchData(data)
+    this.setState({ currentSite: site })
+    dispatch({
+      type: 'common/set_current_site',
+      payload: site
+    })
+    this.get_list({ pageSize: pageSize, distributionChannel: site.value, ...values });
+  }
+
   render() {
-    const { selectedRows, selectedRowKeys, search_data, columns, initLoading, data, modalVisible,operateData,title,modal_width,show_foot,submiting, search_height } = this.state;
+    const { siteListLoading, siteList, currentSite, selectedRows, selectedRowKeys, search_data, columns, initLoading, data, modalVisible,operateData,title,modal_width,show_foot,submiting, search_height } = this.state;
     return (
       <div className={global.common_page} style={{ flex: 1,}}>
         {sldLlineRtextAddGoodsAddMargin('#69A2F2', `${sldComLanguage('仓库中商品')}`, 0, 0, 10)}
         <div className={global.tableListForm} ref={'search_part'}>
-          <Search search_data={search_data} moreSearchToggle={() => this.moreSearchToggle()}
+          <Search ref={this.searchRef} search_data={search_data} moreSearchToggle={() => this.moreSearchToggle()}
                   seaSubmit={(data) => this.search(data)} seaReset={() => this.seaReset()}/>
         </div>
+        {/* 站点tab列表 */}
+        <Spin spinning={siteListLoading}>
+          <div className={global.site_list}>
+            {siteList.map((site) => (
+              <div
+                key={site.name}
+                onClick={() => this.setCurrentSite(site)}
+                className={`${global.site_item} ${site.name === currentSite.name ? global.site_active : ''}`}
+              >
+                {site.title}
+              </div>
+            ))}
+          </div>
+        </Spin>
         {/*公共功能条-start*/}
         <div className={global.operate_bg}
              style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between' }}>