当前位置:   article > 正文

uniapp 下拉框_uniapp下拉框

uniapp下拉框
  1. <template>
  2. <view style="flex-direction: column;display: flex;justify-items: center;">
  3. <view
  4. style="position: fixed;width: 100%;height: 100%;background-color:#808080;opacity: 0.5;display: flex;justify-content: center;align-items: center;z-index: 999;"
  5. v-if="hastoken==false">
  6. <button @click="getCode" type="default"
  7. style="height: 80rpx;display: flex;align-items: center;justify-content: center;margin-top: 100upx;">
  8. <label style="opacity: 1;font-size: 35rpx;">
  9. {{btnTxt}}
  10. </label>
  11. </button>
  12. </view>
  13. <view style="flex-direction: row;display: flex;margin-top: 20rpx;">
  14. <view style="margin-left: 20rpx;"><text style="font-size: 45rpx;color: #808080;">选择课件:</text></view>
  15. <view>
  16. <picker style="width: 100%" @change="bindPickerChange" :value="index" :range="courseTypeList"
  17. :range-key="'name'">
  18. <view style="background-color: #FFFFFF;height: 60rpx;"><text
  19. style="font-size: 45rpx;color: #808080;">{{index==-1?'--请选择--':courseTypeList[index].name}}</text>
  20. </view>
  21. </picker>
  22. </view>
  23. </view>
  24. <view style="flex-direction:row;display: flex;margin-top: 20rpx;text-align: center;">
  25. <view style="width: 50%;"><image style="width: 300rpx;height:250rpx;" src="../../../static/news-2.jpg"></image></view>
  26. <view style="width: 50%;"><image style="width: 300rpx;height:250rpx;" src="../../../static/news-3.jpg"></image></view>
  27. </view>
  28. <view style="flex-direction: column;display: flex;justify-items: center;text-align: center;font-size: 45rpx;"
  29. v-for="(item, planIndex) in teachingPlanBuildList" :key="planIndex">
  30. <view style="margin-top: 20rpx;" @click="SearchPdf(item.domain+item.webPath)">
  31. <text style="font-size: 45rpx;">{{item.name}}</text>
  32. <text v-if="planIndex < 5" style="font-size: 35rpx;color: #808080;">[点击查看]</text>
  33. <text v-if="planIndex >= 5" style="font-size: 35rpx;color: #808080;">[会员专属]</text>
  34. <!-- <image style="width: 40rpx;height:35rpx;" src="../../../static/shou.jpg"></image> -->
  35. </view>
  36. </view>
  37. </view>
  38. <!-- <navigator url="/pages/user/login/login">
  39. <button type="primary">登录</button>
  40. </navigator>
  41. <navigator url="/pages/user/register/register">
  42. <button type="primary">注册</button>
  43. </navigator>
  44. <navigator url="/pages/user/forgot/forgot">
  45. <button type="primary">忘记密码</button>
  46. </navigator>
  47. <navigator url="/pages/user/modify/modify">
  48. <button type="primary">修改密码</button>
  49. </navigator>
  50. <navigator url="/pages/user/info/info">
  51. <button type="primary">信息设置</button>
  52. </navigator> -->
  53. </view>
  54. </template>
  55. <script>
  56. import config from '@/common/config.js'
  57. export default {
  58. data() {
  59. return {
  60. index: -1,
  61. courseTypeList: [],
  62. teachingPlanBuildList: [],
  63. CourseTypeId: '',
  64. hastoken: false,
  65. btnTxt: '授权登录'
  66. }
  67. },
  68. mounted() {},
  69. created() {
  70. this.initData();
  71. },
  72. onTabItemTap(options) {
  73. this.initData();
  74. },
  75. onLoad(option) {
  76. },
  77. methods: {
  78. SearchPdf(weburl){
  79. // uni.showToast({
  80. // title:weburl,
  81. // duration:2000
  82. // })
  83. uni.redirectTo({
  84. url:'/pages/pdf/pdfview?url='+weburl
  85. // url: '/pages/pdf/pdfview?url=' + JSON.stringify(weburl)
  86. })
  87. },
  88. bindPickerChange(e) {
  89. // console.log('picker发送选择改变,携带值为', this.provinceList[e.detail.value]province_NAME);
  90. this.index = e.target.value;
  91. let course_name = this.courseTypeList[e.detail.value].name;
  92. this.CourseTypeId = this.courseTypeList[e.detail.value].id;
  93. // for (var p in this.provinceList) { //遍历json数组时,这么写p为索引,0,1
  94. // if (course_name == this.courseTypeList[p].name) {
  95. // this.addressData.provinceid = this.provinceList[p].province_ID;
  96. // this.PROVINCE_CODE = this.provinceList[p].province_CODE;
  97. // console.log(this.provinceList[p].province_ID + " :" + this.provinceList[p].province_NAME);
  98. // }
  99. // }
  100. this.GetTeachingPlanBuild()
  101. },
  102. GetCourseType() {
  103. var that = this
  104. uni.request({
  105. url: config.baseurl + "/API/GetCourseType",
  106. method: 'POST',
  107. dataType: 'json',
  108. data: {
  109. },
  110. headers: {
  111. 'Content-Type': "application/json;charset=utf-8"
  112. },
  113. success: (res) => {
  114. try {
  115. that.courseTypeList = res.data.courseTypeList
  116. if(that.courseTypeList.length > 0){
  117. that.index = 0
  118. that.CourseTypeId = that.courseTypeList[that.index].id
  119. that.GetTeachingPlanBuild()
  120. }
  121. } catch (e) {
  122. }
  123. },
  124. })
  125. },
  126. GetTeachingPlanBuild() {
  127. var that = this
  128. if(that.CourseTypeId == '')
  129. {
  130. return
  131. }
  132. uni.showLoading({
  133. title: '加载中......'
  134. });
  135. uni.request({
  136. url: config.baseurl + "/API/GetTeachingPlanBuild",
  137. method: 'POST',
  138. dataType: 'json',
  139. data: {
  140. CourseTypeId: that.CourseTypeId
  141. },
  142. headers: {
  143. 'Content-Type': "application/json;charset=utf-8"
  144. },
  145. success: (res) => {
  146. try {
  147. that.teachingPlanBuildList = res.data.teachingPlanBuildList
  148. } catch (e) {
  149. uni.hideLoading()
  150. }
  151. },
  152. })
  153. uni.hideLoading()
  154. },
  155. getCode() { // 非静默授权,第一次有弹框
  156. var return_url = config.request_code_url // 获取页面url
  157. var appid = config.appid
  158. this.code = this.getUrlCode() // 截取codeurlEncode
  159. var request_url = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + appid + '&redirect_uri=' +
  160. return_url + '&response_type=code&scope=snsapi_userinfo&state=1#wechat_redirect';
  161. //alert(request_url)
  162. if (JSON.stringify(this.code) == "{}") { // 如果没有code,则去请求
  163. window.location.href = request_url
  164. } else {
  165. // alert('跳转登录页面'+JSON.stringify(this.code))
  166. uni.redirectTo({
  167. url: '/pages/user/login?code=' + JSON.stringify(this.code)
  168. })
  169. }
  170. },
  171. getUrlCode() { // 截取url中的code方法
  172. var url = location.search
  173. var theRequest = new Object()
  174. if (url.indexOf("?") != -1) {
  175. var str = url.substr(1)
  176. var strs = str.split("&");
  177. for (var i = 0; i < strs.length; i++) {
  178. theRequest[strs[i].split("=")[0]] = (strs[i].split("=")[1])
  179. }
  180. }
  181. return theRequest
  182. },
  183. initData() {
  184. var that = this
  185. this.GetCourseType()
  186. this.code = this.getUrlCode().code // 截取codeurlEncode
  187. if (typeof this.code != 'undefined') {
  188. uni.redirectTo({
  189. url: '/pages/user/login/login?code=' + JSON.stringify(this.code)
  190. })
  191. }
  192. // alert(this.code)
  193. this.btnTxt = '授权登录'
  194. var openID = uni.getStorageSync('openID');
  195. if (openID != '') {
  196. this.hastoken = true;
  197. } else {
  198. this.hastoken = false
  199. // this.getCode()
  200. }
  201. },
  202. }
  203. }
  204. </script>
  205. <style>
  206. button {
  207. margin-top: 40upx;
  208. }
  209. </style>

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/在线问答5/article/detail/883777
推荐阅读
相关标签
  

闽ICP备14008679号