template.js 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. import Taro, { Component } from '@tarojs/taro'
  2. import { View, Input, Picker, ScrollView, Button } from '@tarojs/components'
  3. import { Loading } from '@components'
  4. import { connect } from '@tarojs/redux'
  5. import * as actions from '@actions/template'
  6. import TemplateList from './templatelist'
  7. import { getWindowHeight } from '@utils/style'
  8. import './template.scss'
  9. @connect(state => state.home, { ...actions, })
  10. class Template extends Component {
  11. config = {
  12. navigationBarTitleText: '模板管理'
  13. }
  14. state = {
  15. loaded: false,
  16. loading: false,
  17. lastItemId: 0,
  18. hasMore: true,
  19. selectorChecked: { id: 0, key: "按模板名称", value: 'title' },
  20. selector: [
  21. { id: 0, key: "按模板名称", value: 'title' },
  22. { id: 1, key: "按标签", value: 'tags' },],
  23. keyword: "",
  24. dataList: [],
  25. }
  26. componentDidMount() {
  27. this.getData()
  28. }
  29. // 列表数据
  30. getData = () => {
  31. this.setState({ loading: true })
  32. let payload = {
  33. field: this.state.selectorChecked.value,
  34. keyword: this.state.keyword,
  35. }
  36. this.props.getList(payload).then((data) => {
  37. this.setState({
  38. loading: false,
  39. dataList: data.items,
  40. })
  41. }).catch(() => {
  42. this.setState({ loading: false })
  43. })
  44. }
  45. // 删除模板
  46. deleteTemplate = (value) => {
  47. let payload = {
  48. id: value.id,
  49. }
  50. this.props.deleteTemplate(payload).then((data) => {
  51. this.setState({
  52. loading: false,
  53. })
  54. Taro.showToast({
  55. title: "操作成功",
  56. icon: 'none'
  57. })
  58. this.getData()
  59. }).catch(() => {
  60. this.setState({ loading: false })
  61. })
  62. }
  63. onChange = e => {
  64. this.setState({
  65. selectorChecked: this.state.selector[e.detail.value],
  66. })
  67. }
  68. onInput = e => {
  69. this.setState({
  70. keyword: e.detail.value
  71. })
  72. }
  73. render() {
  74. // if (!this.state.loaded) {
  75. // return <Loading />
  76. // }
  77. const { } = this.props
  78. return (
  79. <View className='home'>
  80. <View className='home_head'>
  81. <Picker
  82. mode='selector'
  83. range={this.state.selector}
  84. rangeKey="key"
  85. value={this.state.selectorChecked.id}
  86. onChange={this.onChange}>
  87. <View className='picker'>
  88. {this.state.selectorChecked.key} ▼
  89. </View>
  90. </Picker>
  91. <Input className='input' type='text' placeholder='请输入关键词进行查询' onInput={this.onInput} />
  92. <View className='button'
  93. onClick={() => {
  94. this.page = 1
  95. this.getData()
  96. }}
  97. >搜索</View>
  98. </View>
  99. <ScrollView
  100. scrollY
  101. className='home__wrap'
  102. onScrollToLower={this.getData}
  103. style={{ height: (getWindowHeight().substring(0, getWindowHeight().length - 2) - 55) + "px" }}
  104. >
  105. <TemplateList list={this.state.dataList} deleteTemplate={(e) => { this.deleteTemplate(e) }} />
  106. </ScrollView>
  107. </View>
  108. )
  109. }
  110. }
  111. export default Template