e-link.vue 6.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322
  1. <template>
  2. <view>
  3. <view class="linksList">
  4. <view class="title" v-if="linksList[0].title">{{linksList[0].title}}</view>
  5. <view v-if="linksList[0].types == 11">
  6. <view class="list_11">
  7. <view class="item" v-for="item in linksList" :key="item.id" @click="go_page(item.linkUrl)">
  8. <view class="left">
  9. <view class="icon">
  10. <view class="img"
  11. v-if="item.imageUrl == '../../static/images/link.png' || item.imageUrl == ''">
  12. <uni-icons type="paperclip" size="30"></uni-icons>
  13. </view>
  14. <view class="img" v-else>
  15. <image :src="item.imageUrl" mode=""></image>
  16. </view>
  17. </view>
  18. <view class="name">{{item.linkName}}</view>
  19. </view>
  20. <view class="right">
  21. <uni-icons type="arrowright" size="20"></uni-icons>
  22. </view>
  23. </view>
  24. </view>
  25. </view>
  26. <view v-if="linksList[0].types == 12">
  27. <view class="list_12">
  28. <view class="item" v-for="item in linksList" :key="item.id" @click="go_page(item.linkUrl)">
  29. <view class="icon">
  30. <view class="img"
  31. v-if="item.imageUrl == '../../static/images/link.png' || item.imageUrl == ''">
  32. <uni-icons type="paperclip" size="30"></uni-icons>
  33. </view>
  34. <view class="img" v-else>
  35. <image :src="item.imageUrl" mode=""></image>
  36. </view>
  37. </view>
  38. <view class="name">{{item.linkName}}</view>
  39. </view>
  40. </view>
  41. </view>
  42. <view v-if="linksList[0].types == 13">
  43. <view class="list_13">
  44. <view class="item" v-for="item in linksList" :key="item.id" @click="go_page(item.linkUrl)">
  45. <view class="icon">
  46. <view class="img"
  47. v-if="item.imageUrl == '../../static/images/link.png' || item.imageUrl == ''">
  48. <uni-icons type="paperclip" size="30"></uni-icons>
  49. </view>
  50. <view class="img" v-else>
  51. <image :src="item.imageUrl" mode=""></image>
  52. </view>
  53. </view>
  54. <view class="name">{{item.linkName}}</view>
  55. </view>
  56. </view>
  57. </view>
  58. <view v-if="linksList[0].types == 14">
  59. <view class="list_14">
  60. <view class="item" v-for="item in linksList" :key="item.id" @click="go_page(item.linkUrl)">
  61. <view class="icon">
  62. <view class="img"
  63. v-if="item.imageUrl == '../../static/images/link.png' || item.imageUrl == ''">
  64. <uni-icons type="paperclip" size="30"></uni-icons>
  65. </view>
  66. <view class="img" v-else>
  67. <image :src="item.imageUrl" mode=""></image>
  68. </view>
  69. </view>
  70. <view class="name">{{item.linkName}}</view>
  71. </view>
  72. </view>
  73. </view>
  74. </view>
  75. </view>
  76. </template>
  77. <script>
  78. export default {
  79. props: [
  80. "linksList",
  81. "mine_code"
  82. ],
  83. data() {
  84. return {
  85. };
  86. },
  87. methods: {
  88. // go_page(link) {
  89. // console.log(link)
  90. // let pageId = ""
  91. // function GetQueryString(name) {
  92. // var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
  93. // var r = link.match(reg);
  94. // if (r != null) return unescape(r[2]);
  95. // return null;
  96. // }
  97. // console.log(GetQueryString("pageId"))
  98. // if (GetQueryString("pageId")) {
  99. // pageId = GetQueryString("pageId")
  100. // } else {
  101. // pageId = link.split('=')[1]
  102. // }
  103. // uni.navigateTo({
  104. // url: "../../index/record/record?pageId=" + pageId + "&mine_code=" + this.mine_code,
  105. // })
  106. // }
  107. go_page(link){
  108. console.log(link)
  109. // 二维码
  110. if(link.indexOf("pageId") != -1 && link.indexOf("app:") == -1){
  111. let pageId = ""
  112. function GetQueryString(name) {
  113. var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
  114. var r = link.match(reg);
  115. if (r != null) return unescape(r[2]);
  116. return null;
  117. }
  118. console.log(GetQueryString("pageId"))
  119. if (GetQueryString("pageId")) {
  120. pageId = GetQueryString("pageId")
  121. } else {
  122. pageId = link.split('=')[1]
  123. }
  124. uni.navigateTo({
  125. url:"../../index/record/record?pageId=" + pageId + "&mine_code=" + this.mine_code,
  126. })
  127. }
  128. // h5
  129. if(link.indexOf("pageId") == -1 && link.indexOf("app:") == -1){
  130. if(link.indexOf("huiyiList") != -1){
  131. uni.navigateTo({
  132. url:"../../workbench/meeting_arrangements/meeting_arrangements"
  133. })
  134. }else{
  135. uni.navigateTo({
  136. url: "../../index/record/h5/h5?url=" + link
  137. })
  138. }
  139. }
  140. // 原生
  141. if(link.indexOf("pageId") == -1 && link.indexOf("app:") != -1){
  142. console.log("原生")
  143. }
  144. }
  145. }
  146. }
  147. </script>
  148. <style lang="scss">
  149. .linksList {
  150. .title {
  151. line-height: 30px;
  152. border-left: 4px solid #009FE8;
  153. border-radius: 4px;
  154. padding-left: 10px;
  155. margin-bottom: 10px;
  156. }
  157. // 一行一项
  158. .list_11 {
  159. .item {
  160. display: flex;
  161. justify-content: space-between;
  162. align-items: center;
  163. padding: 10px 0;
  164. border-bottom: 1px solid #f4f4f4;
  165. .left {
  166. display: flex;
  167. align-items: center;
  168. .icon {
  169. width: 60px;
  170. line-height: 80rpx;
  171. margin-right: 10px;
  172. .img {
  173. width: 60px;
  174. height: 80rpx;
  175. line-height: 80rpx;
  176. text-align: center;
  177. image {
  178. width: 80rpx;
  179. height: 80rpx;
  180. }
  181. }
  182. }
  183. .name {
  184. width: 400rpx;
  185. white-space: nowrap;
  186. overflow: hidden;
  187. text-overflow: ellipsis;
  188. }
  189. }
  190. .right {}
  191. }
  192. }
  193. // 一行两项
  194. .list_12 {
  195. display: flex;
  196. flex-wrap: wrap;
  197. .item {
  198. width: 320rpx;
  199. display: flex;
  200. align-items: center;
  201. margin-left: 10rpx;
  202. // border-right: 1px solid #f4f4f4;
  203. padding-right: 10rpx;
  204. margin-bottom: 10px;
  205. .icon {
  206. margin-right: 30rpx;
  207. .img {
  208. image {
  209. width: 90rpx;
  210. height: 90rpx;
  211. }
  212. }
  213. }
  214. .name {
  215. white-space: nowrap;
  216. overflow: hidden;
  217. text-overflow: ellipsis;
  218. }
  219. }
  220. .item:nth-child(2n) {
  221. border-right: none;
  222. }
  223. }
  224. // 一行三项
  225. .list_13 {
  226. overflow: hidden;
  227. .item {
  228. float: left;
  229. width: 210rpx;
  230. text-align: center;
  231. margin-bottom: 10px;
  232. margin-right: 35rpx;
  233. .icon {
  234. width: 210rpx;
  235. .img {
  236. width: 210rpx;
  237. line-height: 30px;
  238. text-align: center;
  239. image {
  240. width: 90rpx;
  241. height: 90rpx;
  242. }
  243. }
  244. }
  245. .name {
  246. margin-top: 10rpx;
  247. white-space: nowrap;
  248. overflow: hidden;
  249. text-overflow: ellipsis;
  250. }
  251. }
  252. .item:nth-child(3n) {
  253. margin-right: 0;
  254. }
  255. }
  256. // 一行四项
  257. .list_14 {
  258. overflow: hidden;
  259. .item {
  260. float: left;
  261. width: 175rpx;
  262. text-align: center;
  263. margin-bottom: 10px;
  264. .icon {
  265. width: 175rpx;
  266. .img {
  267. width: 175rpx;
  268. line-height: 30px;
  269. text-align: center;
  270. image {
  271. width: 50px;
  272. height: 50px;
  273. }
  274. }
  275. }
  276. .name {
  277. margin-top: 10rpx;
  278. white-space: nowrap;
  279. overflow: hidden;
  280. text-overflow: ellipsis;
  281. }
  282. }
  283. }
  284. }
  285. </style>