Merge branch 'master' of http://git.ycjcjy.com/zhiyuxing/estateagents-admin-manager

src/pages/news/type/NewsType.jsx

@@ -1,115 +1,128 @@
-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.less';
+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 toEditNews() {
-  router.push({
-    pathname: '/news/type/editNews',
-    query: {
-      a: 'b',
-    },
-  });
-}
+function header(props) {
+  // 获取初始化数据
+  const [ data, setData ] = useState({})
 
-/**
- *
- *
- * @param {*} props
- * @returns
- */
+  useEffect(() => {
+    getList({ pageNum: 1, 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 getList = (params) => {
+    request({
+        url: '/api/admin/taNewsType',
+        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 columns = [
-  {
-    title: '类型图片',
-    dataIndex: 'img',
-    key: 'img',
-    align: 'left',
-    render: (text, record) => <img src={record.img} className={styles.touxiang} />,
-  },
-  {
-    title: '名称',
-    dataIndex: 'name',
-    key: 'name',
-    align: 'center',
+  const changePageNum = (pageNumber) => {
+    getList({ pageNum: pageNumber, pageSize: 10 })
+  }
+
+
+  // 跳转到编辑咨询
+  const toEditNews = (id) => () => {
+    router.push({
+      pathname: '/news/type/editNews',
+      query: {
+        id
+      },
+    });
+  }
+
+  
+  const changeNewsStatus = (row) => () => {
+    Modal.confirm({
+      title: '确认删除该商品？',
+      okText: '确认',
+      cancelText: '取消',
+      onOk() {
+        request({
+          url: '/api/admin/taNewsType',
+          method: 'PUT',
+          data: { ...row },
+        }).then((data) => {
+          message.info('操作成功！')
+          getList({ pageNum: 1, pageSize: 10 });
+        })
+      }
+    });
+  }
+  /**
+   *
+   *
+   * @param {*} props
+   * @returns
+   */
+  const columns = [
+    {
+      title: '类型图',
+      dataIndex: 'newsTypeImg',
+      key: 'newsTypeImg',
+      align: 'center',
+      render: (text, record) => <img src={record.newsTypeImg} className={styles.touxiang} />,
+    },
+    {
+      title: '名称',
+      dataIndex: 'newsTypeName',
+      key: 'newsTypeName',
+      align: 'center',
 
-  },
-  {
-    title: '操作',
-    dataIndex: 'handle',
-    key: 'handle',
-    align: 'center',
-    render: () => <>
-    <span style={{ color: '#1990FF', marginRight: '20px' }} onClick={confirm}>删除<Icon type="shopping-cart" className={styles.shoppingCart} /></span>
-    <span style={{ color: '#FF925C' }} onClick={toEditNews}>编辑<Icon type="form" className={styles.edit} /></span></>,
-  },
-];
-function confirm() {
-  Modal.confirm({
-    title: '确认删除该类型？',
-    okText: '确认',
-    cancelText: '取消',
-    onOk() {
-      console.log('OK');
     },
-    onCancel() {
-      console.log('Cancel');
+    {
+      title: '操作',
+      dataIndex: 'handle',
+      key: 'handle',
+      align: 'center',
+      render: (x, row) => <><span style={{ color: '#EF273A', marginRight: '20px' }} onClick={changeNewsStatus(row)}>{row.status == 1 ? '下架' : '上架'}<Icon type="shopping-cart" className={styles.shoppingCart} />
+                            </span><span style={{ color: '#FF925C' }} onClick={toEditNews(row.newsTypeId)}>编辑<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('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>
-      <Button type="primary" className={styles.addBtn} onClick={toEditNews}>新增</Button>
-      <Table dataSource={dataSource} columns={columns} />
+      <Button type="primary" className={styles.addBtn} onClick={toEditNews()}>新增</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/news/type/editNews.jsx

@@ -2,6 +2,8 @@ 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 router from 'umi/router';
 import request from '../../../utils/request'
 
@@ -9,65 +11,87 @@ const { TextArea } = Input;
 const { Option } = Select;
 
 const header = props => {
+  const newsId = props.location.query.id
+  console.log("newsId" + newsId);
+  const [ newsData, setNewsData ] = useState({})
+  if(newsId){
+    useEffect(() => {
+      getNewsData(newsId);
+    },[])
 
-  const [data, setData] = useState({ channelNmae: [], result: [] })
-
-  function goBack(){
-    router.push({
-      pathname: '/news/type/NewsType',
-    });
-  }
-
-  function addChannel(params) {
+  // 查询列表
+  const getNewsData = (newsId) => {
     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/taNewsType/' + newsId,
+        method: 'GET',
+    }).then((data) => {
+        console.log(data)
+        setNewsData(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: newsData.buildingId,
+      rules: [
+        {required: true, message: '请选择所属项目'},
+      ]
+    },
+    {
+      label: '类型图',
+      name: 'newsTypeImg',
+      type: FieldTypes.ImageUploader,
+      value: newsData.newsTypeImg,
+    },
+    {
+      label: '名称',
+      name: 'newsTypeName',
+      type: FieldTypes.Text,
+      value: newsData.newsTypeName,
+      rules: [
+        {required: true, message: '请输入咨询名称'},
+      ]
+    },
+  ]
+
+   
+  const handleSubmit = (values) => {
+    if(newsId){
+      values.newsTypeId = newsId
+      request({
+        url: '/api/admin/taNewsType/' + newsId,
+        method: 'PUT',
+        data: values,
+      }).then((data) => {
+        cancelPage()
+      }).catch((err) => {
+        message.info(err.msg || err.message)
+      })
+      }else{
+      request({
+        url: '/api/admin/taNewsType',
+        method: 'POST',
+        data: values,
+      }).then((data) => {
+        cancelPage()
+      }).catch((err) => {
+        message.info(err.msg || err.message)
+      })
       }
-    });
   }
 
-  const { getFieldDecorator } = props.form;
+  const cancelPage = () => {
+    router.push({
+      pathname: '/news/type/NewsType',
+    });
+  }
 
   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>
-    </>
+    <XForm onSubmit={handleSubmit} onCancel={cancelPage} fields={fields}></XForm>
   )
 }