switch.js 8.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389
  1. module.exports =
  2. /******/ (function(modules) { // webpackBootstrap
  3. /******/ // The module cache
  4. /******/ var installedModules = {};
  5. /******/ // The require function
  6. /******/ function __webpack_require__(moduleId) {
  7. /******/ // Check if module is in cache
  8. /******/ if(installedModules[moduleId])
  9. /******/ return installedModules[moduleId].exports;
  10. /******/ // Create a new module (and put it into the cache)
  11. /******/ var module = installedModules[moduleId] = {
  12. /******/ exports: {},
  13. /******/ id: moduleId,
  14. /******/ loaded: false
  15. /******/ };
  16. /******/ // Execute the module function
  17. /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
  18. /******/ // Flag the module as loaded
  19. /******/ module.loaded = true;
  20. /******/ // Return the exports of the module
  21. /******/ return module.exports;
  22. /******/ }
  23. /******/ // expose the modules object (__webpack_modules__)
  24. /******/ __webpack_require__.m = modules;
  25. /******/ // expose the module cache
  26. /******/ __webpack_require__.c = installedModules;
  27. /******/ // __webpack_public_path__
  28. /******/ __webpack_require__.p = "/dist/";
  29. /******/ // Load entry module and return exports
  30. /******/ return __webpack_require__(0);
  31. /******/ })
  32. /************************************************************************/
  33. /******/ ({
  34. /***/ 0:
  35. /***/ function(module, exports, __webpack_require__) {
  36. module.exports = __webpack_require__(293);
  37. /***/ },
  38. /***/ 3:
  39. /***/ function(module, exports) {
  40. module.exports = function normalizeComponent (
  41. rawScriptExports,
  42. compiledTemplate,
  43. scopeId,
  44. cssModules
  45. ) {
  46. var esModule
  47. var scriptExports = rawScriptExports = rawScriptExports || {}
  48. // ES6 modules interop
  49. var type = typeof rawScriptExports.default
  50. if (type === 'object' || type === 'function') {
  51. esModule = rawScriptExports
  52. scriptExports = rawScriptExports.default
  53. }
  54. // Vue.extend constructor export interop
  55. var options = typeof scriptExports === 'function'
  56. ? scriptExports.options
  57. : scriptExports
  58. // render functions
  59. if (compiledTemplate) {
  60. options.render = compiledTemplate.render
  61. options.staticRenderFns = compiledTemplate.staticRenderFns
  62. }
  63. // scopedId
  64. if (scopeId) {
  65. options._scopeId = scopeId
  66. }
  67. // inject cssModules
  68. if (cssModules) {
  69. var computed = options.computed || (options.computed = {})
  70. Object.keys(cssModules).forEach(function (key) {
  71. var module = cssModules[key]
  72. computed[key] = function () { return module }
  73. })
  74. }
  75. return {
  76. esModule: esModule,
  77. exports: scriptExports,
  78. options: options
  79. }
  80. }
  81. /***/ },
  82. /***/ 293:
  83. /***/ function(module, exports, __webpack_require__) {
  84. 'use strict';
  85. exports.__esModule = true;
  86. var _component = __webpack_require__(294);
  87. var _component2 = _interopRequireDefault(_component);
  88. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  89. /* istanbul ignore next */
  90. _component2.default.install = function (Vue) {
  91. Vue.component(_component2.default.name, _component2.default);
  92. };
  93. exports.default = _component2.default;
  94. /***/ },
  95. /***/ 294:
  96. /***/ function(module, exports, __webpack_require__) {
  97. var Component = __webpack_require__(3)(
  98. /* script */
  99. __webpack_require__(295),
  100. /* template */
  101. __webpack_require__(296),
  102. /* scopeId */
  103. null,
  104. /* cssModules */
  105. null
  106. )
  107. module.exports = Component.exports
  108. /***/ },
  109. /***/ 295:
  110. /***/ function(module, exports) {
  111. 'use strict';
  112. exports.__esModule = true;
  113. //
  114. //
  115. //
  116. //
  117. //
  118. //
  119. //
  120. //
  121. //
  122. //
  123. //
  124. //
  125. //
  126. //
  127. //
  128. //
  129. //
  130. //
  131. //
  132. //
  133. //
  134. //
  135. //
  136. //
  137. //
  138. //
  139. //
  140. //
  141. //
  142. //
  143. //
  144. //
  145. //
  146. //
  147. exports.default = {
  148. name: 'ElSwitch',
  149. props: {
  150. value: {
  151. type: Boolean,
  152. default: true
  153. },
  154. disabled: {
  155. type: Boolean,
  156. default: false
  157. },
  158. width: {
  159. type: Number,
  160. default: 0
  161. },
  162. onIconClass: {
  163. type: String,
  164. default: ''
  165. },
  166. offIconClass: {
  167. type: String,
  168. default: ''
  169. },
  170. onText: {
  171. type: String,
  172. default: 'ON'
  173. },
  174. offText: {
  175. type: String,
  176. default: 'OFF'
  177. },
  178. onColor: {
  179. type: String,
  180. default: ''
  181. },
  182. offColor: {
  183. type: String,
  184. default: ''
  185. },
  186. name: {
  187. type: String,
  188. default: ''
  189. }
  190. },
  191. data: function data() {
  192. return {
  193. coreWidth: this.width
  194. };
  195. },
  196. computed: {
  197. hasText: function hasText() {
  198. /* istanbul ignore next */
  199. return this.onText || this.offText;
  200. },
  201. _value: {
  202. get: function get() {
  203. return this.value;
  204. },
  205. set: function set(val) {
  206. this.$emit('input', val);
  207. }
  208. },
  209. transform: function transform() {
  210. return this.value ? 'translate(' + (this.coreWidth - 20) + 'px, 2px)' : 'translate(2px, 2px)';
  211. }
  212. },
  213. watch: {
  214. value: function value() {
  215. if (this.onColor || this.offColor) {
  216. this.setBackgroundColor();
  217. }
  218. }
  219. },
  220. methods: {
  221. handleChange: function handleChange(event) {
  222. this.$emit('change', event.currentTarget.checked);
  223. },
  224. setBackgroundColor: function setBackgroundColor() {
  225. var newColor = this.value ? this.onColor : this.offColor;
  226. this.$refs.core.style.borderColor = newColor;
  227. this.$refs.core.style.backgroundColor = newColor;
  228. }
  229. },
  230. mounted: function mounted() {
  231. /* istanbul ignore if */
  232. if (this.width === 0) {
  233. this.coreWidth = this.hasText ? 58 : 46;
  234. }
  235. if (this.onColor || this.offColor) {
  236. this.setBackgroundColor();
  237. }
  238. }
  239. };
  240. /***/ },
  241. /***/ 296:
  242. /***/ function(module, exports) {
  243. module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;
  244. return _c('label', {
  245. staticClass: "el-switch",
  246. class: {
  247. 'is-disabled': _vm.disabled, 'el-switch--wide': _vm.hasText
  248. }
  249. }, [_c('div', {
  250. directives: [{
  251. name: "show",
  252. rawName: "v-show",
  253. value: (_vm.disabled),
  254. expression: "disabled"
  255. }],
  256. staticClass: "el-switch__mask"
  257. }), _c('input', {
  258. directives: [{
  259. name: "model",
  260. rawName: "v-model",
  261. value: (_vm._value),
  262. expression: "_value"
  263. }],
  264. staticClass: "el-switch__input",
  265. attrs: {
  266. "type": "checkbox",
  267. "name": _vm.name,
  268. "disabled": _vm.disabled
  269. },
  270. domProps: {
  271. "checked": Array.isArray(_vm._value) ? _vm._i(_vm._value, null) > -1 : (_vm._value)
  272. },
  273. on: {
  274. "change": [function($event) {
  275. var $$a = _vm._value,
  276. $$el = $event.target,
  277. $$c = $$el.checked ? (true) : (false);
  278. if (Array.isArray($$a)) {
  279. var $$v = null,
  280. $$i = _vm._i($$a, $$v);
  281. if ($$c) {
  282. $$i < 0 && (_vm._value = $$a.concat($$v))
  283. } else {
  284. $$i > -1 && (_vm._value = $$a.slice(0, $$i).concat($$a.slice($$i + 1)))
  285. }
  286. } else {
  287. _vm._value = $$c
  288. }
  289. }, _vm.handleChange]
  290. }
  291. }), _c('span', {
  292. ref: "core",
  293. staticClass: "el-switch__core",
  294. style: ({
  295. 'width': _vm.coreWidth + 'px'
  296. })
  297. }, [_c('span', {
  298. staticClass: "el-switch__button",
  299. style: ({
  300. transform: _vm.transform
  301. })
  302. })]), _c('transition', {
  303. attrs: {
  304. "name": "label-fade"
  305. }
  306. }, [_c('div', {
  307. directives: [{
  308. name: "show",
  309. rawName: "v-show",
  310. value: (_vm.value),
  311. expression: "value"
  312. }],
  313. staticClass: "el-switch__label el-switch__label--left",
  314. style: ({
  315. 'width': _vm.coreWidth + 'px'
  316. })
  317. }, [(_vm.onIconClass) ? _c('i', {
  318. class: [_vm.onIconClass]
  319. }) : _vm._e(), (!_vm.onIconClass && _vm.onText) ? _c('span', [_vm._v(_vm._s(_vm.onText))]) : _vm._e()])]), _c('transition', {
  320. attrs: {
  321. "name": "label-fade"
  322. }
  323. }, [_c('div', {
  324. directives: [{
  325. name: "show",
  326. rawName: "v-show",
  327. value: (!_vm.value),
  328. expression: "!value"
  329. }],
  330. staticClass: "el-switch__label el-switch__label--right",
  331. style: ({
  332. 'width': _vm.coreWidth + 'px'
  333. })
  334. }, [(_vm.offIconClass) ? _c('i', {
  335. class: [_vm.offIconClass]
  336. }) : _vm._e(), (!_vm.offIconClass && _vm.offText) ? _c('span', [_vm._v(_vm._s(_vm.offText))]) : _vm._e()])])], 1)
  337. },staticRenderFns: []}
  338. /***/ }
  339. /******/ });