copy_tips.vue 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139
  1. <template>
  2. <view class="page">
  3. <view class="page-header">
  4. <image :src="photo" :lazy-load="true" />
  5. <text class="page-header-title">{{info.name}}</text>
  6. <text>{{info.num}}人</text>
  7. </view>
  8. <view class="page-content">
  9. <view>温馨提示</view>
  10. <view>1.一键复杂新群后,将生成一个新成员相同的群</view>
  11. <view>2.新群的群成员详情设置,群管理等将保留老群设置</view>
  12. </view>
  13. <view class="page-footer">
  14. <view class="page-footer-info" @tap="change">
  15. <checkbox :checked="info.checked"></checkbox>
  16. <text>解散原本的群</text>
  17. </view>
  18. <view>
  19. <button class="sub-but" style="background-color: #496cb1" @tap="copyQun">确定复制</button>
  20. </view>
  21. </view>
  22. </view>
  23. </template>
  24. <script>
  25. import _get from '../../common/_get';
  26. import _hook from '../../common/_hook';
  27. import _data from '../../common/_data';
  28. export default {
  29. data() {
  30. return {
  31. info: {
  32. photo: 'https://im.smiaoshen.com/static/photo//group_photo/8E5BCBD1B1AF0322DAB197A54FF9EA6E/90.jpg?_=0.6412025411589806',
  33. num: 1,
  34. name: '',
  35. checked: '1'
  36. },
  37. list_id: '',
  38. main_id: 0
  39. }
  40. },
  41. onShow() {
  42. let _this = this;
  43. _hook.routeSonHook();
  44. _get.getGroupDetail({list_id:this.list_id,jiesan:this.info.checked,main_id:this.main_id},function (res) {
  45. _this.info.num = res.num;
  46. _this.info.name = res.group.name;
  47. _this.info.photo = res.group.photo_path;
  48. });
  49. },
  50. onLoad(options) {
  51. if ('list_id' in options) {
  52. this.list_id = options.list_id
  53. }
  54. if ('main_id' in options) {
  55. this.main_id = options.main_id
  56. }
  57. },
  58. computed:{
  59. photo(){
  60. return this.staticPhoto + this.info.photo + '?_=' + Math.random();
  61. },
  62. staticPhoto(){
  63. return _data.staticPhoto();
  64. },
  65. },
  66. methods: {
  67. change() {
  68. if (this.info.checked) {
  69. this.info.checked = '0';
  70. } else {
  71. this.info.checked = '1';
  72. }
  73. },
  74. copyQun(){
  75. _get.copyNewQun({list_id:this.list_id,jiesan:this.info.checked,main_id:this.main_id},function () {
  76. })
  77. }
  78. }
  79. }
  80. </script>
  81. <style>
  82. .sub-but {
  83. background-color: #496cb1;
  84. color: #ffffff;
  85. width: 200px;
  86. }
  87. page {
  88. background-color: #ffffff;
  89. }
  90. .page {
  91. display: flex;
  92. justify-content: center;
  93. flex-direction: column;
  94. align-items: center;
  95. padding: 20px;
  96. height: 100%;
  97. }
  98. .page-header {
  99. display: flex;
  100. justify-content: center;
  101. align-items: center;
  102. flex-direction: column;
  103. }
  104. .page-header image {
  105. width: 130rpx;
  106. height: 130rpx;
  107. }
  108. .page-header-title {
  109. padding: 25rpx;
  110. }
  111. .page-content {
  112. padding-top: 40px;
  113. }
  114. .page-content view {
  115. padding: 5px;
  116. }
  117. .page-footer-info {
  118. padding: 40px;
  119. }
  120. .page-footer {
  121. display: flex;
  122. justify-content: center;
  123. align-items: center;
  124. flex-direction: column;
  125. }
  126. </style>