您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

selectGroup.vue 2.9 KiB

3 年前
3 年前
3 年前
3 年前
3 年前
3 年前
3 年前
3 年前
3 年前
3 年前
3 年前
3 年前
3 年前
3 年前
3 年前
3 年前
3 年前
3 年前
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151
  1. <template>
  2. <view class="box">
  3. <!-- 顾问选择 -->
  4. <view class="nextcon">
  5. 最多选择五项
  6. </view>
  7. <view class="content">
  8. <scroll-view style="height: 1170rpx;" scroll-y="true" >
  9. <checkbox-group v-model="value" @change="checkboxChange">
  10. <view v-for="(item,index) in items" :key="index">
  11. <view class="content-tips">
  12. <view class="left">
  13. {{item.propertyName}}
  14. </view>
  15. <view class="right">
  16. <radio :value="item.id" style="transform:scale(0.8)" color="#2671E2" :checked="item.checked" @click="addclick(index)"></radio>
  17. </view>
  18. </view>
  19. </view>
  20. </checkbox-group>
  21. </scroll-view>
  22. <view class="zhedang"></view>
  23. <view class="btn" @click="goback">
  24. 确定
  25. </view>
  26. </view>
  27. </view>
  28. </template>
  29. <script>
  30. export default {
  31. data(){
  32. return{
  33. value:[],
  34. items:[],
  35. ids:''
  36. }
  37. },
  38. onLoad(e) {
  39. // 获取项目id
  40. // console.log(e)
  41. this.ids=e.ids
  42. // this.houseId = uni.getStorageSync('buildingID').id;
  43. this.getSectionList()
  44. },
  45. methods:{
  46. checkboxChange (e) {
  47. // console.log(e)
  48. },
  49. // 获取部门列表
  50. getSectionList(){
  51. this.$u.post('/user/getHouseByToken',)
  52. .then(res=>{
  53. // console.log(res)
  54. res.map((item,index)=>{
  55. if(index<5){
  56. item.checked=true
  57. }else{
  58. item.checked=false
  59. }
  60. })
  61. this.items=res
  62. // console.log(this.items)
  63. if(this.ids){
  64. let arr=this.ids.split(',')
  65. this.items.map((item,index)=>{
  66. let idx=arr.findIndex(item1=>item1==item.id)
  67. if(idx!=-1){
  68. item.checked=true
  69. }else{
  70. item.checked=false
  71. }
  72. })
  73. }
  74. })
  75. },
  76. addclick(index){
  77. this.items[index].checked=!this.items[index].checked
  78. },
  79. goback(){
  80. // 循环遍历所有选定的内容
  81. let arr=[]
  82. this.items.map(item=>{
  83. if(item.checked){
  84. arr.push(item.id)
  85. }
  86. })
  87. uni.$emit('updateGroup',{arr})
  88. uni.navigateBack()
  89. },
  90. }
  91. }
  92. </script>
  93. <style lang="scss" scoped>
  94. .box{
  95. background: #F8F8F8;
  96. width: 100%;
  97. height: 100%;
  98. font-size: 30rpx;
  99. font-weight: 400;
  100. // line-height: 30px;
  101. .nextcon{
  102. height: 78rpx;
  103. background: #F4F8FD;
  104. color: #2671E2;
  105. text-align: center;
  106. line-height: 78rpx;
  107. }
  108. .content-tips{
  109. display: flex;
  110. justify-content: space-between;
  111. background: #fff;
  112. padding: 0 30rpx;
  113. height: 92rpx;
  114. margin-bottom: 20rpx;
  115. .left{
  116. display: flex;
  117. // margin-top: 30rpx;
  118. font-weight: 500;
  119. color: #303030;
  120. line-height: 92rpx;
  121. font-size: 30rpx;
  122. }
  123. .right{
  124. margin: 24rpx 0;
  125. }
  126. }
  127. .btn{
  128. width: 690rpx;
  129. height: 88rpx;
  130. background: #2671E2;
  131. border-radius: 8rpx;
  132. font-size: 32rpx;
  133. font-weight: 400;
  134. color: #FFFFFF;
  135. line-height: 88rpx;
  136. text-align: center;
  137. position: fixed;
  138. left: 30rpx;
  139. bottom: 80rpx;
  140. }
  141. .zhedang{
  142. height: 168rpx;
  143. opacity: 0;
  144. }
  145. }
  146. </style>