(global["webpackJsonp"] = global["webpackJsonp"] || []).push([["components/raffle-wheel/raffle-wheel"],{ /***/ 2435: /*!*************************************************************************************************************************************!*\ !*** C:/Users/Administrator/Desktop/uniapp/uniapp前端/weliam-smartcity-smartcity-app-master/components/raffle-wheel/raffle-wheel.vue ***! \*************************************************************************************************************************************/ /*! no static exports found */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony import */ var _raffle_wheel_vue_vue_type_template_id_1d283544_scoped_true___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./raffle-wheel.vue?vue&type=template&id=1d283544&scoped=true& */ 2436); /* harmony import */ var _raffle_wheel_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./raffle-wheel.vue?vue&type=script&lang=js& */ 2438); /* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _raffle_wheel_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _raffle_wheel_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__[key]; }) }(__WEBPACK_IMPORT_KEY__)); /* harmony import */ var _raffle_wheel_vue_vue_type_style_index_0_id_1d283544_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./raffle-wheel.vue?vue&type=style&index=0&id=1d283544&lang=scss&scoped=true& */ 2440); /* harmony import */ var _HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/runtime/componentNormalizer.js */ 40); var renderjs /* normalize component */ var component = Object(_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_3__["default"])( _raffle_wheel_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__["default"], _raffle_wheel_vue_vue_type_template_id_1d283544_scoped_true___WEBPACK_IMPORTED_MODULE_0__["render"], _raffle_wheel_vue_vue_type_template_id_1d283544_scoped_true___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"], false, null, "1d283544", null, false, _raffle_wheel_vue_vue_type_template_id_1d283544_scoped_true___WEBPACK_IMPORTED_MODULE_0__["components"], renderjs ) component.options.__file = "components/raffle-wheel/raffle-wheel.vue" /* harmony default export */ __webpack_exports__["default"] = (component.exports); /***/ }), /***/ 2436: /*!********************************************************************************************************************************************************************************!*\ !*** C:/Users/Administrator/Desktop/uniapp/uniapp前端/weliam-smartcity-smartcity-app-master/components/raffle-wheel/raffle-wheel.vue?vue&type=template&id=1d283544&scoped=true& ***! \********************************************************************************************************************************************************************************/ /*! exports provided: render, staticRenderFns, recyclableRender, components */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony import */ var _HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_16_0_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_template_id_1d283544_scoped_true___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--16-0!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/template.js!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-uni-app-loader/page-meta.js!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./raffle-wheel.vue?vue&type=template&id=1d283544&scoped=true& */ 2437); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "render", function() { return _HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_16_0_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_template_id_1d283544_scoped_true___WEBPACK_IMPORTED_MODULE_0__["render"]; }); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return _HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_16_0_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_template_id_1d283544_scoped_true___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"]; }); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "recyclableRender", function() { return _HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_16_0_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_template_id_1d283544_scoped_true___WEBPACK_IMPORTED_MODULE_0__["recyclableRender"]; }); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "components", function() { return _HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_16_0_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_template_id_1d283544_scoped_true___WEBPACK_IMPORTED_MODULE_0__["components"]; }); /***/ }), /***/ 2437: /*!********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--16-0!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/template.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-uni-app-loader/page-meta.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!C:/Users/Administrator/Desktop/uniapp/uniapp前端/weliam-smartcity-smartcity-app-master/components/raffle-wheel/raffle-wheel.vue?vue&type=template&id=1d283544&scoped=true& ***! \********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ /*! exports provided: render, staticRenderFns, recyclableRender, components */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "render", function() { return render; }); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return staticRenderFns; }); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "recyclableRender", function() { return recyclableRender; }); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "components", function() { return components; }); var components var render = function () { var _vm = this var _h = _vm.$createElement var _c = _vm._self._c || _h } var recyclableRender = false var staticRenderFns = [] render._withStripped = true /***/ }), /***/ 2438: /*!**************************************************************************************************************************************************************!*\ !*** C:/Users/Administrator/Desktop/uniapp/uniapp前端/weliam-smartcity-smartcity-app-master/components/raffle-wheel/raffle-wheel.vue?vue&type=script&lang=js& ***! \**************************************************************************************************************************************************************/ /*! no static exports found */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony import */ var _HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_12_1_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/babel-loader/lib!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--12-1!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./raffle-wheel.vue?vue&type=script&lang=js& */ 2439); /* harmony import */ var _HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_12_1_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_12_1_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__); /* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_12_1_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_12_1_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__)); /* harmony default export */ __webpack_exports__["default"] = (_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_12_1_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default.a); /***/ }), /***/ 2439: /*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** ./node_modules/babel-loader/lib!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--12-1!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!C:/Users/Administrator/Desktop/uniapp/uniapp前端/weliam-smartcity-smartcity-app-master/components/raffle-wheel/raffle-wheel.vue?vue&type=script&lang=js& ***! \*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; /* WEBPACK VAR INJECTION */(function(uni) { var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ 4); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _regenerator = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/regenerator */ 114)); var _asyncToGenerator2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/asyncToGenerator */ 116)); // // // // // // // // // // // // // // // // // // // // // // // // // // // // // var _default2 = { name: 'RaffleWheel', props: { // canvas 宽度 canvasWidth: { type: Number, default: 240 }, // canvas 高度 canvasHeight: { type: Number, default: 240 }, // 奖品列表 prizeList: { type: Array, // 必须是偶数 validator: function validator(value) { return value.length % 2 === 0; }, required: true }, // 奖品区块对应背景颜色 colors: { type: Array, default: function _default() { return ['#E6A53F', '#E6DB74']; }, // 必须是偶数且仅为 2 个颜色相互交替 validator: function validator(value) { return value.length === 2; } }, // 旋转动画时间 单位s duration: { type: Number, default: 8 }, // 旋转的圈数 ringCount: { type: Number, default: 8 }, // 字体颜色 fontColor: { type: String, default: '#ff4444' }, // 文字的大小 fontSize: { type: String, default: '10px' }, // 奖品文字多行情况下的行高 lineHeight: { type: Number, default: 20 }, // 奖品名称所对应的 key 值 strKey: { type: String, required: true }, // 奖品文字总长度限制 strMaxLength: { type: Number, default: 12 }, // 奖品文字多行情况下第一行文字长度 strLineLength: { type: Number, default: 6 }, //开始抽奖 num: { type: Number, default: null } }, watch: { num: function num() { this.handleAction(); } }, data: function data() { return { // 画板className className: 'raffle-wheel__canvas', // 画板标识 canvasId: 'raffleWheelCanvas', // 画板导出的图片 canvasImg: '', // 旋转到奖品目标需要的角度 targetAngle: 0, // 旋转动画时间 单位 s transitionDuration: 0, // 是否正在旋转 isRotate: false, // 当前停留在那个奖品的序号 stayIndex: 0, // 解决 app 不支持 measureText 的问题 measureText: '' }; }, computed: { // 设备像素密度 pixelRatio: function pixelRatio() { return uni.getSystemInfoSync().pixelRatio; }, // 根据奖品列表计算 canvas 旋转角度 // 让 启动按钮指针 在奖品分区中间 position = 45 // 让 启动按钮指针 在奖品分区边界 position = 90 canvasAngle: function canvasAngle() { var prizeCount = this.prizeList.length; var position = 90; if (prizeCount % 4 !== 0) { return 0; } else { var num = prizeCount / 4; return num % 2 === 0 ? position / num : position; } }, // 根据画板的宽度计算奖品文字与中心点的距离 textRadius: function textRadius() { return Math.round(this.canvasWidth / 2.4); } }, methods: { openGame: function openGame() { this.$emit('playdraw'); }, // 开始旋转 handleStartRotate: function handleStartRotate(targetIndex) { var _this = this; // 奖品总数 var prizeCount = this.prizeList.length; var baseAngle = 360 / prizeCount; var angles = 0; if (this.targetAngle === 0) { console.log('第一次旋转'); // 因为第一个奖品是从0°开始的，即水平向右方向 // 第一次旋转角度 = 270度 - (停留的序号-目标序号) * 每个奖品区间角度 - 每个奖品区间角度的一半 - canvas自身旋转的度数 angles = 270 - (targetIndex - this.stayIndex) * baseAngle - baseAngle / 2 - this.canvasAngle; } else { console.log('后续旋转'); // 后续继续旋转 就只需要计算停留的位置与目标位置的角度 angles = -(targetIndex - this.stayIndex) * baseAngle; } // 更新目前序号 this.stayIndex = targetIndex; // 转 8 圈，圈数越多，转的越快 this.targetAngle += angles + 360 * this.ringCount; // 计算转盘结束对时间，预加一些延迟确保转盘停止后触发结束事件 var endTime = this.transitionDuration * 1000 + 100; setTimeout(function () { _this.isRotate = false; _this.$emit('actionEnd'); }, endTime); }, // 点击 开始抽奖 按钮 handleAction: function handleAction() { if (this.isRotate) return; this.isRotate = true; this.$emit('actionStart'); }, // 渲染转盘 drawWheelCanvas: function drawWheelCanvas() { var _this2 = this; return (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() { var canvasId, ctx, canvasW, canvasH, prizeCount, baseAngle, i, angle, outsideRadius, insideRadius, rewardName, translateX, translateY, isLineBreak, rewardNames, j, tempStrSize, textWidth, _tempStrSize, _textWidth; return _regenerator.default.wrap(function _callee$(_context) { while (1) { switch (_context.prev = _context.next) { case 0: // 获取 canvas 画布 canvasId = _this2.canvasId; ctx = uni.createCanvasContext(canvasId, _this2); _this2.ctxr = uni.createCanvasContext(canvasId, _this2); // canvas 的宽高 canvasW = _this2.canvasWidth; canvasH = _this2.canvasHeight; // 根据奖品个数计算 角度 prizeCount = _this2.prizeList.length; baseAngle = Math.PI * 2 / prizeCount; // 设置描边颜色 ctx.setStrokeStyle('#00ff99'); // 设置字体和字号 ctx.setFontSize(10); // 注意，开始画的位置是从0°角的位置开始画的。也就是水平向右的方向。 // 画具体内容 i = 0; case 10: if (!(i < prizeCount)) { _context.next = 66; break; } // 当前角度 angle = i * baseAngle; // 保存当前画布的状态 ctx.save(); // 开始画内容 ctx.beginPath(); // 开始画圆弧 // x => 圆弧对应的圆心横坐标 x // y => 圆弧对应的圆心横坐标 y // radius => 圆弧的半径大小 // startAngle => 圆弧开始的角度，单位是弧度 // endAngle => 圆弧结束的角度，单位是弧度 // anticlockwise(可选) => 绘制方向，true 为逆时针，false 为顺时针 outsideRadius = canvasW / 2; insideRadius = 20; ctx.arc(canvasW * 0.5, canvasH * 0.5, outsideRadius, angle, angle + baseAngle, false); ctx.arc(canvasW * 0.5, canvasH * 0.5, insideRadius, angle + baseAngle, angle, true); // 开始链接线条 ctx.stroke(); // 每个奖品区块背景填充颜色 ctx.setFillStyle(_this2.colors[i % 2]); // 填充颜色 ctx.fill(); // 开始绘制奖品内容 ctx.setFillStyle(_this2.fontColor); rewardName = _this2.strLimit(_this2.prizeList[i][_this2.strKey]); // translate方法重新映射画布上的 (0,0) 位置 translateX = canvasW * 0.5 + Math.cos(angle + baseAngle / 2) * _this2.textRadius; translateY = canvasH * 0.5 + Math.sin(angle + baseAngle / 2) * _this2.textRadius; ctx.translate(translateX, translateY); // rotate方法旋转当前的绘图，因为文字是和当前扇形中心线垂直的 ctx.rotate(angle + baseAngle / 2 + Math.PI / 2); // 设置文本位置并处理换行 // 是否需要换行 isLineBreak = rewardName.length > _this2.strLineLength; if (!isLineBreak) { _context.next = 50; break; } // 获得多行文本数组 rewardName = rewardName.substring(0, _this2.strLineLength) + ',' + rewardName.substring(_this2.strLineLength); rewardNames = rewardName.split(','); // 循环文本数组，计算每一行的文本宽度 j = 0; case 32: if (!(j < rewardNames.length)) { _context.next = 48; break; } if (!(ctx.measureText && ctx.measureText(rewardNames[j]).width)) { _context.next = 38; break; } // 文本的宽度信息 tempStrSize = ctx.measureText(rewardNames[j]); ctx.fillText(rewardNames[j], -tempStrSize.width / 2, j * _this2.lineHeight); _context.next = 45; break; case 38: _this2.measureText = rewardNames[j]; // 等待页面重新渲染 _context.next = 41; return _this2.$nextTick(); case 41: _context.next = 43; return _this2.getTextWidth(); case 43: textWidth = _context.sent; ctx.fillText(rewardNames[j], -textWidth / 2, j * _this2.lineHeight); // console.log(rewardNames[j], textWidth, i) case 45: j++; _context.next = 32; break; case 48: _context.next = 62; break; case 50: if (!(ctx.measureText && ctx.measureText(rewardName).width)) { _context.next = 55; break; } // 文本的宽度信息 _tempStrSize = ctx.measureText(rewardName); ctx.fillText(rewardName, -_tempStrSize.width / 2, 0); _context.next = 62; break; case 55: _this2.measureText = rewardName; // 等待页面重新渲染 _context.next = 58; return _this2.$nextTick(); case 58: _context.next = 60; return _this2.getTextWidth(); case 60: _textWidth = _context.sent; ctx.fillText(rewardName, -_textWidth / 2, 0); case 62: ctx.restore(); case 63: i++; _context.next = 10; break; case 66: // 保存绘图并导出图片 ctx.draw(true, function () { var drawTimer = setTimeout(function () { clearTimeout(drawTimer); drawTimer = null; uni.canvasToTempFilePath({ destWidth: _this2.canvasWidth * _this2.pixelRatio, destHeight: _this2.canvasHeight * _this2.pixelRatio, canvasId: _this2.canvasId, success: function success(res) { // 在 H5 平台下，tempFilePath 为 base64 // console.log(res.tempFilePath) _this2.canvasImg = res.tempFilePath; // 通知父级组件，抽奖转品生成图片完成 _this2.$emit('done'); } }, _this2); }, 20); }); case 67: case "end": return _context.stop(); } } }, _callee); }))(); }, // 兼容 app 端不支持 ctx.measureText // 已知问题：初始绘制时，低端安卓机 平均耗时 2s getTextWidth: function getTextWidth() { var _this3 = this; return new Promise(function (resolve, reject) { uni.createSelectorQuery().in(_this3).select('.raffle-wheel__measureText').fields({ size: true }, function (res) { resolve(res.width); }).exec(); }); }, // 处理文字溢出 strLimit: function strLimit(value) { var maxLength = this.strMaxLength; if (!value || !maxLength) return value; return value.length > maxLength ? value.slice(0, maxLength - 1) + '...' : value; } }, mounted: function mounted() { var _this4 = this; this.$nextTick(function () { var stoTimer = setTimeout(function () { clearTimeout(stoTimer); stoTimer = null; _this4.drawWheelCanvas(); _this4.transitionDuration = _this4.duration; }, 50); }); } }; exports.default = _default2; /* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-weixin/dist/index.js */ 2)["default"])) /***/ }), /***/ 2440: /*!***********************************************************************************************************************************************************************************************!*\ !*** C:/Users/Administrator/Desktop/uniapp/uniapp前端/weliam-smartcity-smartcity-app-master/components/raffle-wheel/raffle-wheel.vue?vue&type=style&index=0&id=1d283544&lang=scss&scoped=true& ***! \***********************************************************************************************************************************************************************************************/ /*! no static exports found */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony import */ var _HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_8_oneOf_1_2_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_8_oneOf_1_5_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_style_index_0_id_1d283544_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--8-oneOf-1-2!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/postcss-loader/src??ref--8-oneOf-1-3!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js??ref--8-oneOf-1-4!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--8-oneOf-1-5!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!../../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./raffle-wheel.vue?vue&type=style&index=0&id=1d283544&lang=scss&scoped=true& */ 2441); /* harmony import */ var _HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_8_oneOf_1_2_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_8_oneOf_1_5_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_style_index_0_id_1d283544_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_8_oneOf_1_2_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_8_oneOf_1_5_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_style_index_0_id_1d283544_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0__); /* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_8_oneOf_1_2_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_8_oneOf_1_5_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_style_index_0_id_1d283544_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_8_oneOf_1_2_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_8_oneOf_1_5_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_style_index_0_id_1d283544_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__)); /* harmony default export */ __webpack_exports__["default"] = (_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_8_oneOf_1_2_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_8_oneOf_1_5_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_raffle_wheel_vue_vue_type_style_index_0_id_1d283544_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0___default.a); /***/ }), /***/ 2441: /*!***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** ./node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!./node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--8-oneOf-1-2!./node_modules/postcss-loader/src??ref--8-oneOf-1-3!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js??ref--8-oneOf-1-4!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--8-oneOf-1-5!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!C:/Users/Administrator/Desktop/uniapp/uniapp前端/weliam-smartcity-smartcity-app-master/components/raffle-wheel/raffle-wheel.vue?vue&type=style&index=0&id=1d283544&lang=scss&scoped=true& ***! \***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { // extracted by mini-css-extract-plugin if(false) { var cssReload; } /***/ }) }]); //# sourceMappingURL=../../../.sourcemap/mp-weixin/components/raffle-wheel/raffle-wheel.js.map ;(global["webpackJsonp"] = global["webpackJsonp"] || []).push([ 'components/raffle-wheel/raffle-wheel-create-component', { 'components/raffle-wheel/raffle-wheel-create-component':(function(module, exports, __webpack_require__){ __webpack_require__('2')['createComponent'](__webpack_require__(2435)) }) }, [['components/raffle-wheel/raffle-wheel-create-component']] ]);