templatelist.js 2.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. import Taro, { Component } from '@tarojs/taro'
  2. import { View, Text, Button } from '@tarojs/components'
  3. import './templatelist.scss'
  4. export default class TemplateList extends Component {
  5. constructor(props) {
  6. super(props)
  7. this.state = {
  8. visible: false,
  9. selected: {},
  10. }
  11. }
  12. toggleVisible = () => {
  13. this.setState({
  14. visible: !this.state.visible,
  15. selected: {}
  16. })
  17. }
  18. // 确认删除
  19. delChap = () => {
  20. this.props.deleteTemplate(this.state.selected)
  21. this.setState({
  22. visible: false
  23. })
  24. }
  25. render() {
  26. const { list = [] } = this.props
  27. const popupStyle = { transform: `translateY(${Taro.pxTransform(-100)})` }
  28. return (
  29. <View className='list'>
  30. {
  31. list.length == 0
  32. ? <View>暂无</View>
  33. : list.map(item =>
  34. <View className='list__item' key={item.id}
  35. onClick={() => {
  36. Taro.navigateTo({
  37. url: "/pages/user/templatedetail?id=" + item.id
  38. })
  39. }}
  40. >
  41. <View className='list__item__left'>
  42. <View className='list__item__left-one'>{item.name}</View>
  43. {/* {
  44. !!item.metadata && item.metadata.length > 0 && item.metadata.map((t, x) =>
  45. <View className='list__item__left-two' key={x}>{t.name}:{t.value}</View>
  46. )
  47. } */}
  48. {/* <View className='list__item__left-two'>标签:{item.tags}
  49. </View> */}
  50. <View className='list__item__left-two'>创建时间:{item.createAt}</View>
  51. <View className='list__item__left-two'>更新时间:{item.updateAt}</View>
  52. <View className='list__item__left-bottom'>
  53. <View className='list__item__left-bottom_g'>使用该模板</View>
  54. <View className='list__item__left-bottom_d'
  55. onClick={e => {
  56. e.stopPropagation()
  57. this.setState({
  58. visible: true,
  59. selected: item
  60. })
  61. }}
  62. >删除</View>
  63. </View>
  64. </View>
  65. </View>
  66. )
  67. }
  68. {/* 二级确认 */}
  69. {this.state.visible &&
  70. <View className='mask'>
  71. <View className='count'>
  72. <View className='title' style={{ margin: "60px 0" }}>确认删除吗?</View>
  73. <View className='count_foot'>
  74. <Button onClick={this.toggleVisible}>取消</Button>
  75. <Button style={{ marginTop: 0 }}
  76. onClick={this.delChap}
  77. >确认</Button>
  78. </View>
  79. </View>
  80. </View>}
  81. </View>
  82. )
  83. }
  84. }