tree.vue 2.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. <template>
  2. <view>
  3. <view class="header">
  4. <search v-if="searchIf" ref="sea" @confirm="confirmSearch" />
  5. <view class="title">
  6. <scroll-view scroll-x style="width: 100%;white-space: nowrap;" :scroll-left="scrollLeft">
  7. <view v-for="(item,index) in tree_stack" class="inline-item" :key="index">
  8. <view class="inline-item" v-if="index==0" @click="backTree(item,-1)">
  9. <text :class="[(index==tree_stack.length-1&&!isre)?'none':'active']">全部</text>
  10. </view>
  11. <view v-if="index==0&&isre" @click="backTree(item,-2)" :class="[index==tree_stack.length-1&&isre]?'none inline-item':'active inline-item'">
  12. <i class="iconfont icon-z043 iconclass" />
  13. 搜索结果
  14. </view>
  15. <view class="inline-item" @click="backTree(item,index)" v-if="index!=0">
  16. <i class="iconfont icon-z043 iconclass" />
  17. <text :class="index==tree_stack.length-1?'none inline-ite':'active'">
  18. {{item[props.label]}}
  19. </text>
  20. </view>
  21. </view>
  22. </scroll-view>
  23. </view>
  24. </view>
  25. <view>
  26. <view class="container-list">
  27. <view class="common" v-for="(item, index) in tree" @click="handleClick(item,index)" :key="index">
  28. <label class="content">
  29. <view class="list-item" v-show="isCheck">
  30. <!-- 多选 -->
  31. <view class="checkbox" v-if="props.multiple" @click.stop="handleClick(item,-1)">
  32. <span v-if="isSelect(item)">
  33. <i v-if="item.bx&&newCheckList.length!=0" class="iconfont icon-banxuanzhongshousuo1-shi icons" />
  34. <i v-else class="iconfont icon-xuanzhong txt icon-selected" />
  35. </span>
  36. <i v-else-if="item.qx" class="iconfont icon-xuanzhong txt icon-selected" />
  37. <i v-else-if="item.bx" class="iconfont icon-banxuanzhongshousuo1-shi icons" />
  38. <i style="color: #b8b8b8;" v-else class="iconfont icon-weixuanzhong txt" />
  39. </view>
  40. <!-- 单选 -->
  41. <view class="checkbox" v-else-if="(props.nodes?item.user?true:false:true)" @click.stop="handleClick(item,-1)">
  42. <i v-if="radioSelect(item)" class="txt iconfont icon-selected" />
  43. <i style="color: #b8b8b8;" v-else class="txt iconfont icon-weixuanzhong1" />
  44. </view>
  45. </view>
  46. <view class="lable-text">{{item[props.label]}}</view>
  47. <view class="right"><i v-if="!item.user&&item.children.length>0" class="iconfont icon-z043 iconclass"></i></view>
  48. </label>
  49. </view>
  50. </view>
  51. </view>
  52. <view class="btn box_sizing">
  53. <button class="sureBtn" type="primary" @click="backConfirm">确认</button>
  54. </view>
  55. </view>
  56. </template>
  57. <script src="./code.js" type="text/javascript"></script>
  58. <style lang="scss" scoped>
  59. @import './css/style.scss';
  60. @import url("./css/icon.css");
  61. </style>