king
2021-08-31 4c9caf3828b22bf1d940b0f3a012a7d2f6f5b67a
src/menu/picturecontroller/index.jsx
@@ -26,6 +26,7 @@
    pageSize: 12,
    filpictures: [],
    filvideos: [],
    colorlist: [],
    piclist: [],
    vidlist: [],
    picIndex: 1,
@@ -35,13 +36,16 @@
  trigger = () => {
    let pictures = sessionStorage.getItem('app_pictures')
    let videos = sessionStorage.getItem('app_videos')
    let colorlist = sessionStorage.getItem('app_colors')
    try {
      pictures = JSON.parse(pictures)
      videos = JSON.parse(videos)
      colorlist = JSON.parse(colorlist)
    } catch {
      pictures = []
      videos = []
      colorlist = []
    }
    let filpictures = pictures
@@ -61,6 +65,7 @@
      videoKey: '',
      piclist,
      vidlist,
      colorlist,
      videos
    })
  }
@@ -95,9 +100,12 @@
          if (card.typecharone === 'image') {
            sessionStorage.setItem('app_pictures', JSON.stringify(result.data || []))
            this.resetPicture(result.data || [])
          } else {
          } else if (card.typecharone === 'video') {
            sessionStorage.setItem('app_videos', JSON.stringify(result.data || []))
            this.resetVideo(result.data || [])
          } else if (card.typecharone === 'color') {
            sessionStorage.setItem('app_colors', JSON.stringify(result.data || []))
            this.resetColor(result.data || [])
          }
          this.setState({editvisible: false})
        } else {
@@ -146,9 +154,12 @@
              if (item.typecharone === 'image') {
                sessionStorage.setItem('app_pictures', JSON.stringify(res.data || []))
                _this.resetPicture(res.data || [])
              } else {
              } else if (item.typecharone === 'video') {
                sessionStorage.setItem('app_videos', JSON.stringify(res.data || []))
                _this.resetVideo(res.data || [])
              } else if (item.typecharone === 'color') {
                sessionStorage.setItem('app_colors', JSON.stringify(res.data || []))
                _this.resetColor(res.data || [])
              }
            } else {
              notification.warning({
@@ -181,6 +192,10 @@
    let vidlist = filvideos.filter((item, index) => index < pageSize)
    this.setState({vidIndex: 1, filvideos, vidlist, videos: data})
  }
  resetColor = (data) => {
    this.setState({colorlist: data})
  }
  filterPicture = () => {
@@ -216,7 +231,7 @@
  }
  
  render() {
    const { visible, editvisible, card, filpictures, filvideos, piclist, vidlist, imageKey, videoKey, pageSize, picIndex, vidIndex } = this.state
    const { visible, editvisible, card, filpictures, filvideos, piclist, vidlist, imageKey, videoKey, pageSize, picIndex, vidIndex, colorlist } = this.state
    return (
      <div style={{display: 'inline-block'}}>
@@ -298,6 +313,32 @@
              </Row>
              {filvideos.length > pageSize ? <Pagination size="small" current={vidIndex} pageSize={pageSize} onChange={this.changeVidSize} total={filvideos.length} /> : null}
            </TabPane>
            <TabPane tab="颜色管理" key="color">
              <Row style={{marginBottom: '15px'}}>
                <Col span={24}>
                  可添加应用中常用的颜色,可以是英文代码、HEX格式、RGB格式,最多可添加25种。
                  {colorlist.length < 25 ? <Button className="picture-plus mk-green" icon="plus" onClick={() => this.handleSource({typecharone: 'color'})}>
                    添加
                  </Button> : null}
                </Col>
              </Row>
              <Row gutter={16} style={{height: '340px'}}>
                {colorlist.length > 0 && colorlist.map(item => (
                  <Col span={4} key={item.id}>
                    <div className="image-video-box">
                      <div className="image-video-box-body" style={{background: item.linkurl}}>
                      </div>
                      <div className="image-video-control">
                        <Icon type="copy" onClick={() => this.copySource(item)}/>
                        <Icon type="delete" onClick={() => this.deleteSource(item)}/>
                      </div>
                    </div>
                    <p className="image-video-remark">{item.remark}</p>
                  </Col>
                ))}
                {!colorlist.length ? <Empty description={null}/> : null}
              </Row>
            </TabPane>
          </Tabs>
        </Modal>
        <Modal