合并

config/config.js

@@ -246,13 +246,18 @@ export default {
               component: '../layouts/BlankLayout',
               routes: [
                 {
-                  path: '/news/NewsType',
+                  path: '/news/type/NewsType',
                   name: '资讯类型',
                   component: './news/type/NewsType',
                 },
                 {
-                  path: '/news/NewsList',
-                  name: '咨询列表',
+                  path: '/news/type/editNews',
+                  name: '',
+                  component: './news/type/editNews',
+                },
+                {
+                  path: '/news/list/NewsList',
+                  name: '资讯列表',
                   component: './news/list/NewsList',
                 },
               ],
@@ -342,7 +347,7 @@ export default {
 
   proxy: {
     '/api/': {
-      target: 'http://localhost:8080/',
+      target: 'http://192.168.0.84:8080/',
       changeOrigin: true,
       // pathRewrite: { '^/server': '' },
     },

src/components/Wangedit/Wangedit.jsx

@@ -8,7 +8,10 @@ import E from 'wangeditor'
 class Wangedit extends React.Component {
   constructor(props, context) {
     super(props, context);
-    this.state = {}
+    this.state = {
+      html: undefined,
+    }
+    this.editor = undefined;
   }
 
   render() {
@@ -20,11 +23,25 @@ class Wangedit extends React.Component {
 
   componentDidMount() {
     const elem = this.refs.editorElem
-    const editor = new E(elem)
+    this.editor = new E(elem)
     // 使用 onchange 函数监听内容的变化
-    editor.customConfig.onchange = this.props.onChange
-    editor.create()
-    editor.txt.html(this.props.value)
+    this.editor.customConfig.onchange = html => {
+      this.setState({ html })
+
+      if (typeof this.props.onChange === 'function') {
+        this.props.onChange(html)
+      }
+    }
+    this.editor.create()
+    this.editor.txt.html(this.props.value)
+  }
+
+  componentDidUpdate(props, state) {
+    if (this.props.value && !state.html) {
+      if (this.editor) {
+        this.editor.txt.html(this.props.value)
+      }
+    }
   }
 }
 

src/components/XForm/WrapperItem.jsx

@@ -84,7 +84,7 @@ const WrapperItem = (props) => {
     return <></>;
   }
 
-  const SelectOpts = (dict || []).map((item, index) => (<Option value={item.value}>{item.name}</Option>))
+  const SelectOpts = (dict || []).map((item, index) => (<Option value={item.value}>{item.label}</Option>))
 
   let Field = <></>;
   if (render) {

src/layouts/BasicLayout.jsx

@@ -100,7 +100,7 @@ const BasicLayout = props => {
       }}
       footerRender={footerRender}
       menuDataRender={menuDataRender}
-      formatMessage={formatMessage}
+      // formatMessage={formatMessage}
       rightContentRender={rightProps => <RightContent {...rightProps} />}
       {...props}
       {...settings}

src/pages/activity/editActivity.jsx

@@ -155,6 +155,7 @@ const { MonthPicker, RangePicker, WeekPicker } = DatePicker;
         })
       }
     }
+    
     return <XForm onSubmit={handleSubmit} onCancel={cancelPage} fields={fields}></XForm>
   }
   

src/pages/integralMall/GoodsList.jsx

@@ -1,133 +1,148 @@
-import React from 'react';
+import React, { useState, useEffect } from 'react';
 import { Form, Input, Button, Icon, Select, message, Table, Divider, Tag, Pagination, Modal,Breadcrumb } from 'antd';
 import { FormattedMessage } from 'umi-plugin-react/locale';
 import styles from '../style/GoodsList.less';
 import router from 'umi/router';
+import BuildSelect from '../../components/SelectButton/BuildSelect'
+
+import request from '../../utils/request'
 
 const { Option } = Select;
-// 提交事件
-function handleSubmit(e, props) {
-  e.preventDefault();
-  props.form.validateFields((err, values) => {
-    if (!err) {
-      console.log('提交数据: ', values)
-    }
-  });
-}
-// Change 事件
-function handleSelectChange(props) {
-  console.log(props)
-}
 
-// 分页
-function onChange(pageNumber) {
-  console.log('Page: ', pageNumber);
-}
-// 跳转到编辑商品
-function toEditGoods() {
-  router.push({
-    pathname: '/integralMall/editGoods',
-    query: {
-      a: 'b',
-    },
-  });
-}
 
-/**
- *
- *
- * @param {*} props
- * @returns
- */
+function header(props) {
+  // 获取初始化数据
+  const [ data, setData ] = useState({})
+
+  useEffect(() => {
+    getList({ pageNum: 1, pageSize: 10 });
+  },[])
+
+  // 查询列表
+  const getList = (params) => {
+    request({
+        url: '/api/admin/taGoods',
+        method: 'GET',
+        params: { ...params },
+    }).then((data) => {
+        console.log(data)
+        setData(data)
+    })
+  }
+  
+  // 提交事件
+  const handleSubmit = (e, props) => {
+    e.preventDefault();
+    props.form.validateFields((err, values) => {
+      if (!err) {
+        getList({ pageNum: 1, pageSize: 10, ...values })
+      }
+    });
+  }
+
+  const changePageNum = (pageNumber) => {
+    getList({ pageNum: pageNumber, pageSize: 10 })
+  }
 
-const dataSource = [
-  {
-    key: '1',
-    img: 'http://img0.imgtn.bdimg.com/it/u=4246326797,2657995307&fm=26&gp=0.jpg',
-    name: '华为P30 Pro',
-  },
-  {
-    key: '2',
-    img: '',
-    name: '大米',
-  },
-];
 
-const columns = [
-  {
-    title: '商品图片',
-    dataIndex: 'img',
-    key: 'img',
-    align: 'center',
-    render: (text, record) => <img src={record.img} className={styles.touxiang} />,
-  },
-  {
-    title: '商品名称',
-    dataIndex: 'name',
-    key: 'name',
-    align: 'center',
+  // 跳转到编辑商品
+  const toEditGoods = (goodsId) => () => {
+    router.push({
+      pathname: '/integralMall/editGoods',
+      query: {
+        goodsId
+      },
+    });
+  }
 
-  },
-  {
-    title: '所属积分',
-    dataIndex: 'integral',
-    key: 'integral',
-    align: 'center',
-  },
-  {
-    title: '总数量',
-    dataIndex: 'total',
-    key: 'total',
-    align: 'center',
-  },
-  {
-    title: '已兑换数量',
-    dataIndex: 'exchanged',
-    key: 'exchanged',
-    align: 'center',
-  },
-  {
-    title: '剩余数量',
-    dataIndex: 'rest',
-    key: 'rest',
-    align: 'center',
-  },
-  {
-    title: '状态',
-    dataIndex: 'state',
-    key: 'state',
-    align: 'center',
-  },
-  {
-    title: '操作',
-    dataIndex: 'handle',
-    key: 'handle',
-    align: 'center',
-    render: () => <><span style={{ color: '#EF273A', marginRight: '20px' }} onClick={confirm}>下架<Icon type="shopping-cart" className={styles.shoppingCart} /></span><span style={{ color: '#FF925C' }} onClick={toEditGoods}>编辑<Icon type="form" className={styles.edit} /></span></>,
-  },
-];
-function confirm() {
-  Modal.confirm({
-    title: '确认下架该商品？',
-    okText: '确认',
-    cancelText: '取消',
-    onOk() {
-      console.log('OK');
+  
+  const changeGoodsStatus = (row) => () => {
+    Modal.confirm({
+      title: '确认下架该商品？',
+      okText: '确认',
+      cancelText: '取消',
+      onOk() {
+        request({
+          url: '/api/admin/taGoods/change',
+          method: 'PUT',
+          data: { ...row },
+        }).then((data) => {
+          message.info('操作成功！')
+          getList({ pageNum: 1, pageSize: 10 });
+        })
+      }
+    });
+  }
+  /**
+   *
+   *
+   * @param {*} props
+   * @returns
+   */
+  const columns = [
+    {
+      title: '商品图片',
+      dataIndex: 'imgUrl',
+      key: 'imgUrl',
+      align: 'center',
+      render: (text, record) => <img src={record.imgUrl} className={styles.touxiang} />,
     },
-    onCancel() {
-      console.log('Cancel');
+    {
+      title: '商品名称',
+      dataIndex: 'goodsName',
+      key: 'goodsName',
+      align: 'center',
+
+    },
+    {
+      title: '所属积分',
+      dataIndex: 'pointPrice',
+      key: 'pointPrice',
+      align: 'center',
+    },
+    {
+      title: '总数量',
+      dataIndex: 'totalNum',
+      key: 'totalNum',
+      align: 'center',
+    },
+    {
+      title: '已兑换数量',
+      dataIndex: 'exchanged',
+      key: 'exchanged',
+      align: 'center',
+      render: (x,row) => <><span>{row.totalNum - row.inventory}</span></>
+    },
+    {
+      title: '剩余数量',
+      dataIndex: 'inventory',
+      key: 'inventory',
+      align: 'center',
     },
-  });
+    {
+      title: '状态',
+      dataIndex: 'status',
+      key: 'status',
+      align: 'center',
+      render: (status)=> <><span>{status == 1 ? '已上架' : '未上架'}</span></>
+    },
+    {
+      title: '操作',
+      dataIndex: 'handle',
+      key: 'handle',
+      align: 'center',
+      render: (x, row) => <><span style={{ color: '#EF273A', marginRight: '20px' }} onClick={changeGoodsStatus(row)}>{row.status == 1 ? '下架' : '上架'}<Icon type="shopping-cart" className={styles.shoppingCart} />
+                            </span><span style={{ color: '#FF925C' }} onClick={toEditGoods(row.goodsId)}>编辑<Icon type="form" className={styles.edit} /></span></>,
+    },
+  ];
 
-}
-function header(props) {
   const { getFieldDecorator } = props.form
   return (
 
     <>
       <Form layout="inline" onSubmit={e => handleSubmit(e, props)}>
         <Form.Item>
-          {getFieldDecorator('name')(
+          {getFieldDecorator('goodsName')(
             <Input
               prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
               placeholder="商品名称"
@@ -135,49 +150,45 @@ function header(props) {
           )}
         </Form.Item>
         <Form.Item>
-          {getFieldDecorator('goodState')(
-            <Select style={{ width: '180px' }} placeholder="状态" onChange={handleSelectChange}>
-              <Option value="1">上架</Option>
-              <Option value="0">下架</Option>
+          {getFieldDecorator('status')(
+            <Select style={{ width: '180px' }} placeholder="状态">
+              <Option value="1">已上架</Option>
+              <Option value="0">已下架</Option>
             </Select>,
           )}
         </Form.Item>
         <Form.Item>
-          {getFieldDecorator('isMain')(
-            <Select style={{ width: '180px' }} placeholder="所属项目" onChange={handleSelectChange}>
-              <Option value="1">首页推荐</Option>
-              <Option value="0">首页未推荐</Option>
-            </Select>,
+          {getFieldDecorator('buildingId')(
+            <BuildSelect />,
           )}
         </Form.Item>
         <Form.Item>
-          {getFieldDecorator('min')(
+          {getFieldDecorator('priceLesser')(
             <Input
               prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
-              placeholder="最小积分"
+              placeholder="价格小"
             />,
           )}
         </Form.Item>
         <Form.Item>
-          {getFieldDecorator('max')(
+          {getFieldDecorator('priceGreater')(
             <Input
               prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
-              placeholder="最大积分"
+              placeholder="价格大"
             />,
           )}
         </Form.Item>
         <Form.Item>
-          <Button type="primary" htmlType="submit" >
+          <Button type="primary" htmlType="submit" className={styles.searchBtn}>
             搜索
           </Button>
         </Form.Item>
       </Form>
-      <Button type="danger" className={styles.addBtn} onClick={toEditGoods}>新增</Button>
-      <Table dataSource={dataSource} columns={columns} />
-      {/* 分页 */
-      /* <div style={{ display: 'flex', justifyContent: 'flex-end', marginTop: '30px' }}>
-        <Pagination showQuickJumper defaultCurrent={1} total={500} onChange={onChange} />
-      </div> */}
+      <Button type="primary" className={styles.addBtn} onClick={toEditGoods()}>新增</Button>
+      <Table dataSource={data.records} columns={columns} pagination={false} />
+      <div style={{ display: 'flex', justifyContent: 'flex-end', marginTop: '30px' }}>
+        <Pagination showQuickJumper defaultCurrent={1} total={data.total} onChange={changePageNum} />
+      </div>
     </>
   )
 }

src/pages/integralMall/editGoods.jsx

@@ -2,6 +2,9 @@ import React, { useState, useEffect } from 'react';
 import { Input, Menu, Dropdown, Button, Icon, message, Table, Divider, Tag, Select, Form, Alert } from 'antd';
 import { FormattedMessage } from 'umi-plugin-react/locale';
 import channels from '../channel/channelList.less';
+import BuildSelect from '../../components/SelectButton/BuildSelect'
+import XForm, { FieldTypes } from '../../components/XForm';
+import Wangedit from '../../components/Wangedit/Wangedit'
 import router from 'umi/router';
 import request from '../../utils/request'
 
@@ -9,78 +12,135 @@ const { TextArea } = Input;
 const { Option } = Select;
 
 const header = props => {
+  const goodsId = props.location.query.goodsId
+  const [ goodsData, setGoodsData ] = useState({})
+  if(goodsId){
+    useEffect(() => {
+      getGoodsData(goodsId);
+    },[])
 
-  const [data, setData] = useState({ channelNmae: [], result: [] })
-
-  function goBack(){
-    router.push({
-      pathname: '/integralMall/GoodsList',
-    });
-  }
-
-  function addChannel(params) {
+  // 查询列表
+  const getGoodsData = (goodsId) => {
     request({
-      url: '/api/admin/channel',
-      method: 'POST',
-      data: { ...params },
-      // eslint-disable-next-line no-shadow
-    }).then(data => {
-      console.log(data)
-      setData(data)
-      // eslint-disable-next-line no-unused-expressions
-      router.go(-1)
+        url: '/api/admin/taGoods/' + goodsId,
+        method: 'GET',
+    }).then((data) => {
+        console.log(data)
+        setGoodsData(data)
     })
   }
+  }
 
-  function handleSubmit(e) {
-    e.preventDefault();
-    props.form.validateFields((err, values) => {
-      if (!err) {
-        console.log('Received values of form: ', values);
-        // eslint-disable-next-line max-len
-        addChannel({ channelName: values.channelName, channelContact: values.channelContact, contactTel: values.contactTel })
+  const fields = [
+    {
+      label: '所属项目',
+      name: 'buildingId',
+      render: <BuildSelect />,
+      value: goodsData.buildingId,
+      rules: [
+        {required: true, message: '请选择所属项目'},
+      ]
+    },
+    {
+      label: '商品图片',
+      name: 'imgUrl',
+      type: FieldTypes.ImageUploader,
+      value: goodsData.imgUrl,
+    },
+    {
+      label: '商品名称',
+      name: 'goodsName',
+      type: FieldTypes.Text,
+      value: goodsData.goodsName,
+      rules: [
+        {required: true, message: '请输入商品名称'},
+      ]
+    },
+    {
+      label: '所需积分',
+      name: 'pointPrice',
+      type: FieldTypes.Text,
+      value: goodsData.pointPrice,
+      rules: [
+        {required: true, message: '请输入所需积分'},
+      ]
+    },
+    {
+      label: '商品数量',
+      name: 'totalNum',
+      type: FieldTypes.Text,
+      value: goodsData.totalNum,
+      rules: [
+        {required: true, message: '请输入商品数量'},
+      ]
+    },
+    {
+      label: '剩余数量',
+      name: 'inventory',
+      type: FieldTypes.Text,
+      value: goodsData.inventory,
+      rules: [
+        {required: true, message: '请输入剩余数量'},
+      ]
+    },
+    {
+      label: '商品详情',
+      name: 'goodsDescription',
+      render: <Wangedit />,
+      value: goodsData.goodsDescription,
+    },
+    {
+      label: '状态',
+      name: 'status',
+      type: FieldTypes.Select,
+      dict: [{label:"已上架",value:1},{label:"已下架",value:0}],
+      value: goodsData.status != null ? goodsData.status : 1,
+    },
+    {
+      label: '领取地址',
+      name: 'address',
+      type: FieldTypes.Text,
+      value: goodsData.address,
+      rules: [
+        {required: true, message: '请输入领取地址'},
+      ]
+    },
+  ]
+
+   
+  const handleSubmit = (values) => {
+    if(goodsId){
+      values.goodsId = goodsId
+      request({
+        url: '/api/admin/taGoods',
+        method: 'PUT',
+        data: values,
+      }).then((data) => {
+        cancelPage()
+      }).catch((err) => {
+        message.info(err.msg || err.message)
+      })
+      }else{
+      request({
+        url: '/api/admin/taGoods/add',
+        method: 'POST',
+        data: values,
+      }).then((data) => {
+        cancelPage()
+      }).catch((err) => {
+        message.info(err.msg || err.message)
+      })
       }
-    });
   }
 
-  const { getFieldDecorator } = props.form;
+  const cancelPage = () => {
+    router.push({
+      pathname: '/integralMall/GoodsList',
+    });
+  }
 
   return (
-    <>
-      <Form labelCol={{ span: 7 }} wrapperCol={{ span: 12 }} onSubmit={handleSubmit}>
-        <Form.Item label="商品名称">
-          {getFieldDecorator('channelName', {
-            rules: [{ message: '请输入商品名称' }],
-          })(<Input className={channels.inpuit} />)}
-        </Form.Item>
-        <Form.Item label="所需积分">
-          {getFieldDecorator('channelContact', {
-            rules: [{ message: ' 请输入所需积分' }],
-          })(<Input className={channels.inpuit} />)}
-        </Form.Item>
-        <Form.Item label="商品数量">
-          {getFieldDecorator('contactTel', {
-            rules: [{ message: '请输入商品数量' }],
-          })(<Input className={channels.inpuit} />)}
-        </Form.Item>
-        <Form.Item label="剩余数量">
-          {getFieldDecorator('contactTel', {
-            rules: [{ message: '请输入剩余数量' }],
-          })(<Input className={channels.inpuit} />)}
-        </Form.Item>
-        <Form.Item label="商品详情">
-          <TextArea className={channels.inpuitTxt} rows={8} />
-        </Form.Item>
-        <Form.Item wrapperCol={{ span: 15, offset: 7 }}>
-          <Button type="primary" htmlType="submit">
-            保存
-          </Button>
-          <Button className={channels.formButton} onClick={goBack} type="primary" htmlType="submit">
-            取消
-          </Button>
-        </Form.Item>
-      </Form>
-    </>
+    <XForm onSubmit={handleSubmit} onCancel={cancelPage} fields={fields}></XForm>
   )
 }
 

src/pages/news/list/NewsList.jsx

@@ -37,7 +37,7 @@ function CartBody(props) {
             </p>
             <p className={Styles.cardText}>
               <span className={Styles.title}>状态</span>
-              <span >：{ data.status == '0' ? "已发布" : "未发布" }</span>
+              <span >：{ data.status == 0 ? "已发布" : "未发布" }</span>
             </p>
             <p className={Styles.cardItem}>
               <span className={Styles.title}>阅读数量</span>
@@ -173,8 +173,8 @@ function body(props) {
         <Form.Item>
           {getFieldDecorator('newsStatus')(
             <Select style={{ width: '180px' }} placeholder="状态" onChange={handleSelectChange}>
-              <Option value="1">已发布</Option>
-              <Option value="0">未发布</Option>
+              <Option value="0">已发布</Option>
+              <Option value="1">未发布</Option>
             </Select>,
           )}
         </Form.Item>

src/pages/news/type/NewsType.jsx

@@ -24,10 +24,10 @@ function onChange(pageNumber) {
   console.log('Page: ', pageNumber);
 }
 
-// 跳转到编辑商品
-function toEditGoods() {
+// 跳转到编辑资讯
+function toEditNews() {
   router.push({
-    pathname: '/integralMall/editGoods',
+    pathname: '/news/type/editNews',
     query: {
       a: 'b',
     },
@@ -76,7 +76,7 @@ const columns = [
     align: 'center',
     render: () => <>
     <span style={{ color: '#1990FF', marginRight: '20px' }} onClick={confirm}>删除<Icon type="shopping-cart" className={styles.shoppingCart} /></span>
-    <span style={{ color: '#FF925C' }} onClick={toEditGoods}>编辑<Icon type="form" className={styles.edit} /></span></>,
+    <span style={{ color: '#FF925C' }} onClick={toEditNews}>编辑<Icon type="form" className={styles.edit} /></span></>,
   },
 ];
 function confirm() {
@@ -108,7 +108,7 @@ function header(props) {
           )}
         </Form.Item>
       </Form>
-      <Button type="primary" className={styles.addBtn} onClick={toEditGoods}>新增</Button>
+      <Button type="primary" className={styles.addBtn} onClick={toEditNews}>新增</Button>
       <Table dataSource={dataSource} columns={columns} />
     </>
   )

src/pages/news/type/editNews.jsx

@@ -0,0 +1,75 @@
+import React, { useState, useEffect } from 'react';
+import { Input, Menu, Dropdown, Button, Icon, message, Table, Divider, Tag, Select, Form, Alert } from 'antd';
+import { FormattedMessage } from 'umi-plugin-react/locale';
+import channels from '../../channel/channelList.less';
+import router from 'umi/router';
+import request from '../../../utils/request'
+
+const { TextArea } = Input;
+const { Option } = Select;
+
+const header = props => {
+
+  const [data, setData] = useState({ channelNmae: [], result: [] })
+
+  function goBack(){
+    router.push({
+      pathname: '/news/type/NewsType',
+    });
+  }
+
+  function addChannel(params) {
+    request({
+      url: '/api/admin/channel',
+      method: 'POST',
+      data: { ...params },
+      // eslint-disable-next-line no-shadow
+    }).then(data => {
+      console.log(data)
+      setData(data)
+      // eslint-disable-next-line no-unused-expressions
+      router.go(-1)
+    })
+  }
+
+  function handleSubmit(e) {
+    e.preventDefault();
+    props.form.validateFields((err, values) => {
+      if (!err) {
+        console.log('Received values of form: ', values);
+        // eslint-disable-next-line max-len
+        addChannel({ channelName: values.channelName, channelContact: values.channelContact, contactTel: values.contactTel })
+      }
+    });
+  }
+
+  const { getFieldDecorator } = props.form;
+
+  return (
+    <>
+      <Form labelCol={{ span: 7 }} wrapperCol={{ span: 12 }} onSubmit={handleSubmit}>
+      <Form.Item label="类型图片">
+          {getFieldDecorator('newsName', {
+            rules: [{ message: '' }],
+          })(<Input className={channels.inpuit} />)}
+        </Form.Item>
+        <Form.Item label="名称">
+          {getFieldDecorator('newsName', {
+            rules: [{ message: '请输入资讯名称' }],
+          })(<Input className={channels.inpuit} />)}
+        </Form.Item>
+        <Form.Item wrapperCol={{ span: 15, offset: 7 }}>
+          <Button type="primary" htmlType="submit">
+            保存
+          </Button>
+          <Button className={channels.formButton} onClick={goBack} type="primary" htmlType="submit">
+            取消
+          </Button>
+        </Form.Item>
+      </Form>
+    </>
+  )
+}
+
+const WrappedNormalLoginForm = Form.create({ name: 'header' })(header);
+export default WrappedNormalLoginForm