lf

config/routes.js

@@ -419,6 +419,17 @@ export default [
                 hideInMenu: true,
                 component: './carouselFigure/editAdvertising',
               },
+              {
+                path: '/carouselFigure/propagandaList',
+                name: '宣传位',
+                component: './carouselFigure/propagandaList',
+              },
+              {
+                path: '/carouselFigure/propaganda',
+                name: '宣传位编辑',
+                hideInMenu: true,
+                component: './carouselFigure/propaganda',
+              },
               {
                 path: '/carouselFigure/customImg/list',
                 name: '其他',

src/pages/carouselFigure/propaganda.jsx

@@ -0,0 +1,291 @@
+import React, { useState, useEffect } from 'react';
+import { Modal, message } from 'antd';
+import { FormattedMessage } from 'umi-plugin-react/locale';
+import styles from '../style/GoodsList.less';
+import moment from 'moment';
+import router from 'umi/router';
+import BuildSelect from '../../components/SelectButton/BuildSelect'
+import CitySelect from '../../components/SelectButton/CitySelect2'
+import { FieldTypes, createForm } from '../../components/XForm';
+import Wangedit from '../../components/Wangedit/Wangedit';
+import SelectActivity from './SelectActivity';
+import SelectNews from './SelectNews';
+import apis from '../../services/apis';
+import request from '../../utils/request'
+import SelectHelp from './SelectHelp';
+import SelectGroup from './SelectGroup';
+import SelectH5 from './SelectH5';
+/**
+ *
+ *
+ * @param {*} props
+ * @returns
+ */
+ const createEditor = () => {
+  let contentVisible = false
+  let activityVisible = false
+  let newsVisible = false
+  let helpVisible = false
+  let groupVisible = false
+  let buildingId = ''
+  let cityId = ''
+  let isHaveActive=false
+  let isCanChoose=true
+
+  const setExtraData = (data) => {
+    if(data.isHaveActive!=undefined){
+      isHaveActive=data.isHaveActive
+      if(!isHaveActive) {
+        data.contentType=null
+        data.buildingId=null
+      }
+    }
+
+    contentVisible = data.contentType === 'other';
+    activityVisible = data.contentType === 'activity';
+    newsVisible = data.contentType === 'news';
+    helpVisible = data.contentType === 'help';
+    groupVisible = data.contentType === 'group';
+    cityId=data.cityId
+    buildingId = data.buildingId
+  }
+
+  const setExtraData1 = (data) => {
+    if(data.contentType=='h5'||data.contentType==''||data.contentType=='nothing'){
+       isHaveActive=false
+    }else{
+       isHaveActive=true
+    }
+
+    contentVisible = data.contentType === 'other';
+    activityVisible = data.contentType === 'activity';
+    newsVisible = data.contentType === 'news';
+    helpVisible = data.contentType === 'help';
+    groupVisible = data.contentType === 'group';
+    buildingId = data.buildingId
+  }
+
+  const handleFormValueChange = (props, changedValues, allValues) => {
+      setExtraData(allValues)
+  }
+
+  const XForm = createForm({ onValuesChange: handleFormValueChange })
+
+  return (props) => {
+    const [ tab, changeTab ] = useState('basic')
+    const contentId = props.location.query.contentId
+    const [ data, setData ] = useState({})
+
+    if(contentId){
+      isCanChoose=false
+      useEffect(() => {
+        getDetail(contentId);
+      },[])
+
+      // 查询列表
+      const getDetail = (contentId) => {
+        request({ ...apis.carsuseFigure.getExtendContent,urlData:{id: contentId}}).then((data) => {
+          setExtraData1(data)
+          setData(data)
+        })
+      }
+    }else{
+      isCanChoose=true
+    }
+
+    const cancelPage = () =>{
+      router.push({
+        pathname: '/carouselFigure/propagandaList',
+      });
+    }
+
+    const fields = [
+      {
+        label: '是否关联项目',
+        name: 'isHaveActive',
+        type: FieldTypes.Switch,
+        value:isHaveActive,
+        hidden: () => !isCanChoose,
+        rules: [
+          { required: true,message: '是否城市活动' },
+        ],
+      },
+      {
+        label: '所属项目',
+        name: 'buildingId',
+        render: <BuildSelect />,
+        value: data.buildingId,
+        hidden: () => !isHaveActive,
+        rules: [
+          { required: true, message: '请选择所属项目' },
+        ],
+      },
+      {
+        label: '展示城市',
+        name: 'cityId',
+        render: <CitySelect />,
+        hidden: () => isHaveActive,
+        value: data.cityId,
+        rules: [
+          { required: true, message: '请选择展示城市' },
+        ],
+      },
+      {
+        label: '开屏广告',
+        name: 'image',
+        type: FieldTypes.ImageUploader,
+        value: data.image,
+        help: '建议图片尺寸：640*960px，比例2:3,格式：jpg，用于开屏广告',
+        rules: [
+          { required: true, message: '请上传图片' },
+        ],
+      },
+      {
+        label: '是否发布H5',
+        name: 'targetId',
+        render: <SelectH5/>,
+        hidden: () => isHaveActive,
+        value: data.targetId,
+        rules: [
+          { required: false, message: '请选择发布H5' },
+        ],
+      },
+      {
+        label: '标题',
+        name: 'title',
+        type: FieldTypes.Text,
+        hidden: true,
+        value: data.title,
+        rules: [
+          { required: true, message: '请输入标题' },
+        ],
+      },
+      {
+        label: '类型',
+        name: 'contentType',
+        hidden: () => !isHaveActive,
+        type: FieldTypes.Select,
+        dict: [{
+          label: '常规活动',
+          value: 'activity'
+        },
+        {
+          label: '项目',
+          value: 'project'
+        },
+        {
+          label: '资讯',
+          value: 'news'
+        },
+        {
+          label: '拼团',
+          value: 'group'
+        },
+        {
+          label: '助力',
+          value: 'help'
+        }],
+        value: data.contentType,
+        rules: [
+          { required: true, message: '请选择类型' },
+        ],
+      },
+      {
+        label: '发布活动',
+        name: 'targetId',
+        render: <SelectActivity buildingId={() => buildingId} />,
+        hidden: () => !activityVisible,
+        value: data.targetId,
+        rules: [
+          { required: true, message: '请选择发布活动' },
+        ],
+      },
+      {
+        label: '发布资讯',
+        name: 'targetId',
+        render: <SelectNews buildingId={() => buildingId} />,
+        hidden: () => !newsVisible,
+        value: data.targetId,
+        rules: [
+          { required: true, message: '请选择发布资讯' },
+        ],
+      },
+      {
+        label: '发布内容',
+        name: 'content',
+        render: <Wangedit />,
+        value: data.content,
+        hidden: () => !contentVisible,
+        rules: [
+          { required: true, message: '请选择发布内容' },
+        ],
+      },
+      {
+        label: '发布助力',
+        name: 'targetId',
+        render: <SelectHelp buildingId={() => buildingId} />,
+        hidden: () => !helpVisible,
+        value: data.targetId,
+        rules: [
+          { required: true, message: '请选择发布助力' },
+        ],
+      },
+      {
+        label: '发布拼团',
+        name: 'targetId',
+        render: <SelectGroup buildingId={() => buildingId} />,
+        hidden: () => !groupVisible,
+        value: data.targetId,
+        rules: [
+          { required: true, message: '请选择发布拼团' },
+        ],
+      },
+      {
+        label: '状态',
+        name: 'status',
+        type: FieldTypes.Select,
+        dict: [{
+          label: "上架",
+          value: 1
+        },
+        {
+          label: "下架",
+          value: 0
+        },],
+        value: data.status != null ? data.status : 1,
+      },
+    ]
+
+    const handleSubmit = val => {
+      val.showType = 'propaganda'
+      if(!val.isHaveActive&&val.targetId) {
+          if(!val.contentType){
+            val.contentType='h5'
+          }
+      }
+      if(!val.isHaveActive&&!val.targetId){
+        val.contentType=''
+      }
+      if(contentId){
+        request({ ...apis.carsuseFigure.updataExtendContent,urlData:{id: contentId}, data: val,}).then((data) => {
+          cancelPage()
+        }).catch((err) => {
+          message.info(err.msg || err.message)
+        })
+      }else{
+        request({ ...apis.carsuseFigure.addExtendContent, data: val,}).then((data) => {
+          cancelPage()
+        }).catch((err) => {
+          message.info(err.msg || err.message)
+        })
+      }
+    }
+
+
+    return (
+      <XForm onSubmit={handleSubmit} onCancel={cancelPage} onValuesChange={handleFormValueChange} fields={fields}></XForm>
+    );
+   }
+ }
+
+export default createEditor()

src/pages/carouselFigure/propagandaList.jsx

@@ -0,0 +1,282 @@
+import React, { useState, useEffect } from 'react';
+import { Form, Input, Button, Icon, Select, message, Table, Divider, Tag, Pagination, Modal, DatePicker } from 'antd';
+import { FormattedMessage } from 'umi-plugin-react/locale';
+import styles from '../style/GoodsList.less';
+import router from 'umi/router';
+import moment from 'moment';
+import SelectCity from '../../components/SelectButton/CitySelect'
+import BuildSelect from '../../components/SelectButton/BuildSelect'
+import apis from '../../services/apis';
+import request from '../../utils/request';
+import AuthButton from '@/components/AuthButton';
+
+const { Option } = Select;
+const { MonthPicker, RangePicker, WeekPicker } = DatePicker;
+
+const header = (props) => {
+  const [ data, setData ] = useState({})
+//   const [page, changePage] = useState({})
+
+  useEffect(() => {
+    getList({ pageNum: 1, pageSize: 10, showType: 'propaganda' });
+  },[])
+
+  // 查询列表
+  const getList = (params) => {
+    request({ ...apis.carsuseFigure.extendContent, params: { ...params },}).then((data) => {
+        console.log(data)
+        setData(data)
+    })
+  }
+
+  
+// 跳转到编辑商品
+const toEdit = (contentId) => () => {
+    router.push({
+      pathname: '/carouselFigure/propaganda',
+      query: {
+        contentId
+      },
+    });
+  }
+  
+  const columns = [
+    {
+      title: '主图',
+      dataIndex: 'image',
+      key: 'image',
+      align: 'center',
+      render: (image) => <img src={image} className={styles.imgSmall} />,
+    },
+    {
+      title: '发布城市',
+      dataIndex: 'cityName',
+      key: 'cityName',
+      align: 'center',
+    },
+    {
+      title: '关联项目',
+      dataIndex: 'buildingName',
+      key: 'buildingName',
+      align: 'center',
+      render: (buildingName) => <span>{ buildingName === null ? '无' : buildingName }</span>
+    },
+    {
+      title: '关联内容类型',
+      dataIndex: 'contentType',
+      key: 'contentType',
+      align: 'center',
+      render: (contentType) => <span>{ contentType === 'project' ? '项目' : contentType === 'activity' ? '活动' : contentType === 'news' ? '资讯' : contentType === 'other' ? '其他' : contentType === 'help' ? '助力' : contentType === 'group' ? '拼团' : contentType === 'h5' ? 'H5活动' : '无' }</span>
+    },
+    // {
+    //   title: '发布位置',
+    //   dataIndex: 'showPosition',
+    //   key: 'showPosition',
+    //   align: 'center',
+    //   render: (showPosition) => <span>{ showPosition === 'index' ? '首页' : showPosition === 'mall' ? '商城' : '' }</span>
+    // },
+    {
+      title: '发布时间',
+      dataIndex: 'createDate',
+      key: 'createDate',
+      align: 'center',
+      render: (x, row) => <><span>{moment(row.createDate).format('YYYY-MM-DD')}</span></>
+    },
+    {
+      title: '状态',
+      dataIndex: 'status',
+      key: 'status',
+      align: 'center',
+      render: (status)=> <><span>{status == 1 ? '上架' : '下架'}</span></>
+    },
+    {
+      title: '操作',
+      dataIndex: 'handle',
+      key: 'handle',
+      align: 'center',
+      render: (x,row) => (
+        <>
+          <AuthButton name="admin.advert.publish" noRight={null}>
+            <span style={{ color: '#1990FF', marginRight: '20px',cursor: 'pointer' }} onClick={changeStatus(row)}>{ row.status === 1 ? '下架' : '上架' }<Icon type="vertical-align-top" className={styles.edit} /></span>
+          </AuthButton>
+          <AuthButton name="admin.advert.put" noRight={null}>
+            <span style={{ color: '#FF925C', marginRight: '20px', cursor: 'pointer' }} onClick={toEdit(row.contentId)}>编辑<Icon type="form" className={styles.edit} /></span>
+          </AuthButton>
+          <AuthButton name="admin.advert.delete" noRight={null}>
+            <span style={{ color: '#1990FF', cursor: 'pointer' }} onClick={deleteCarouse(row.contentId)}>删除<Icon type="vertical-align-top" className={styles.edit} /></span>
+          </AuthButton>
+        </>
+      )
+    },
+  ];
+  
+  const finishDynamic = (row) => {
+      Modal.confirm({
+          title: '结束以后将无法编辑, 是否继续?',
+          okText: '确定',
+          cancelText: '取消',
+          onOk() {
+              request({ ...apis.carsuseFigure.finish, data: {dynamicId: row.dynamicId, top: ""},}).then((data) => {
+                  console.log(data)
+                  message.info('操作成功！')
+                  getList({ pageNum: 1, pageSize: 10, showType: 'propaganda' })
+              }).catch((err) => {
+                  console.log(err)
+                  message.info(err.msg || err.message)
+              })
+          },
+        });
+  }
+  
+  //删除
+const deleteCarouse = (contentId) => () =>{
+  Modal.confirm({
+    title: '确认删除此数据?',
+    okText: '确定',
+    cancelText: '取消',
+    onOk() {
+      request({ ...apis.carsuseFigure.deleteExtendContent,urlData:{id: contentId}}).then((data) => {
+            message.info('操作成功！')
+            getList({ pageNum: 1, pageSize: 10, showType: 'propaganda' })
+        }).catch((err) => {
+            console.log(err)
+            message.info(err.msg || err.message)
+        })
+    },
+  });
+}
+
+//   停用启用
+  const changeStatus = (row) => () => {
+      console.log(row)
+      if(row.status === 0) {
+        
+        Modal.confirm({
+          title: '确认发布此数据?',
+          okText: '确定',
+          cancelText: '取消',
+          onOk() {
+            row.status = 1
+              request({ ...apis.carsuseFigure.updataExtendContent,urlData:{id: row.contentId}, data: row,}).then((data) => {
+                  message.info('操作成功！')
+                  getList({ pageNum: 1, pageSize: 10, showType: 'propaganda' })
+              }).catch((err) => {
+                  console.log(err)
+                  message.info(err.msg || err.message)
+              })
+          },
+        });
+      }else if(row.status === 1){
+        
+        Modal.confirm({
+          title: '停用后不会再显示在小程序端',
+          okText: '确定',
+          cancelText: '取消',
+          onOk() {
+            row.status = 0
+              request({ ...apis.carsuseFigure.updataExtendContent,urlData:{id: row.contentId}, data: row,}).then((data) => {
+                  message.info('操作成功！')
+                  getList({ pageNum: 1, pageSize: 10, showType: 'propaganda' })
+              }).catch((err) => {
+                  console.log(err)
+                  message.info(err.msg || err.message)
+              })
+          },
+        });
+      }
+
+  }
+  
+  const changePageNum = (pageNumber, props) => {
+    props.form.validateFields((err, values) => {
+      if (!err) {
+        getList({ pageNum: pageNumber, pageSize: 10, ...values, showType: 'propaganda' })
+      }
+    });
+  }
+
+  // 提交事件
+const handleSubmit = (e, props) => {
+    e.preventDefault();
+    props.form.validateFields((err, values) => {
+      if (!err) {
+        console.log('提交数据: ', values)
+        getList({ pageNum: 1, pageSize: 10, ...values, showType: 'propaganda' })
+      }
+    });
+  }
+
+   //重置搜索
+   function handleReset() {
+    props.form.resetFields();
+  }
+
+
+  const { getFieldDecorator } = props.form
+  return (
+
+    <>
+      <Form layout="inline" onSubmit={e => handleSubmit(e, props)}>
+      <Form.Item>
+          {getFieldDecorator('cityId')(
+             <SelectCity />,
+          )}
+        </Form.Item>
+        <Form.Item>
+          {getFieldDecorator('buildingId')(
+            <BuildSelect />,
+          )}
+        </Form.Item>
+        <Form.Item>
+          {getFieldDecorator('contentType')(
+            <Select style={{ width: '180px' }} placeholder="类型">
+              <Option value="activity">活动</Option>
+              <Option value="project">项目</Option>
+              <Option value="news">资讯</Option>
+              <Option value="help">助力</Option>
+              <Option value="group">拼团</Option>
+              <Option value="h5">H5</Option>
+              <Option value="nothing">无</Option>
+            </Select>,
+          )}
+        </Form.Item>
+        {/* <Form.Item>
+          {getFieldDecorator('showPosition')(
+            <Select style={{ width: '180px' }} placeholder="发布位置">
+              <Option value="mall">商城</Option>
+              <Option value="index">首页</Option>
+            </Select>,
+          )}
+        </Form.Item> */}
+        <Form.Item>
+          {getFieldDecorator('status')(
+            <Select style={{ width: '180px' }} placeholder="状态">
+              <Option value="1">已上架</Option>
+              <Option value="0">已下架</Option>
+            </Select>,
+          )}
+        </Form.Item>
+        <Form.Item>
+        <AuthButton name="admin.advert.search" noRight={null}>
+          <Button type="primary" htmlType="submit" className={styles.searchBtn}>
+            搜索
+          </Button>
+          </AuthButton>
+          <Button style={{ marginLeft: 8 }} onClick={handleReset}>
+              重置
+            </Button>
+        </Form.Item>
+      </Form>
+      <AuthButton name="admin.advert.post" noRight={null}>
+        <Button type="danger" className={styles.addBtn} onClick={toEdit()}>新增</Button>
+      </AuthButton>
+      <Table dataSource={data.records} columns={columns} pagination={false} rowKey="advertisingList"/>
+      <div style={{ display: 'flex', justifyContent: 'flex-end', marginTop: '30px' }}>
+        <Pagination showQuickJumper defaultCurrent={1} total={data.total} onChange={e => changePageNum(e,props)} current={data.current}/>
+      </div>
+    </>
+  )
+}
+const WrappedHeader = Form.create({ name: 'header' })(header);
+
+export default WrappedHeader