{"remainingRequest":"D:\\jenkins\\workspace\\artfess-ui\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\jenkins\\workspace\\artfess-ui\\src\\components\\zl-step.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\jenkins\\workspace\\artfess-ui\\src\\components\\zl-step.vue","mtime":1675233415769},{"path":"D:\\jenkins\\workspace\\artfess-ui\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\artfess-ui\\node_modules\\thread-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\artfess-ui\\node_modules\\babel-loader\\lib\\index.js","mtime":315532800000},{"path":"D:\\jenkins\\workspace\\artfess-ui\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\artfess-ui\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:Ly8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KCmV4cG9ydCBkZWZhdWx0IHsKCW5hbWU6ICdabFN0ZXAnLAoJcHJvcHM6IHsKCQlhY3RpdmU6IHsKCQkJdHlwZTogTnVtYmVyLAoJCQlkZWZhdWx0OiAwCgkJfSwKCQlzdGVwQXJyOiB7CgkJCXR5cGU6IEFycmF5LAoJCQlkZWZhdWx0OiAoKSA9PiBbXQoJCX0sCgkJd2lkdGg6IHsKCQkJdHlwZTogU3RyaW5nLAoJCQlkZWZhdWx0OiAnMTAwJScKCQl9LAoJCWJhY2tncm91bmQ6IHsKCQkJdHlwZTogU3RyaW5nLAoJCQlkZWZhdWx0OiAnIzAxNDdlYicKCQl9LAoJCWNvbG9yOiB7CgkJCXR5cGU6IFN0cmluZywKCQkJZGVmYXVsdDogJyNmZmYnCgkJfSwKCQloZWlnaHQ6IHsKCQkJdHlwZTogU3RyaW5nLAoJCQlkZWZhdWx0OiAnNDBweCcKCQl9Cgl9LAoJd2F0Y2g6IHsKCQlhY3RpdmUoYSkgewoJCQlpZiAoYSA8PSAwKSB7CgkJCQl0aGlzLiRlbWl0KCd1cGRhdGU6YWN0aXZlJywgMCk7CgkJCQljb25zb2xlLmxvZygn5bey57uP5piv5pyA5bCP5YC85LqGJyArIGEpOwoJCQl9CgkJCWlmIChhID4gdGhpcy5zdGVwQXJyLmxlbmd0aCAtIDEpIHsKCQkJCXRoaXMuJGVtaXQoJ3VwZGF0ZTphY3RpdmUnLCB0aGlzLnN0ZXBBcnIubGVuZ3RoIC0gMSk7CgkJCQljb25zb2xlLmxvZygn5bey57uP5piv5pyA5aSn5YC85LqGJyArIGEpOwoJCQl9CgkJfQoJfSwKCWRhdGEoKSB7CgkJcmV0dXJuIHsKCgkJfTsKCX0KfTsK"},{"version":3,"sources":["zl-step.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAmBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA","file":"zl-step.vue","sourceRoot":"src/components","sourcesContent":["<template>\r\n\t<ul class=\"zl-step\">\r\n\t\t<li :class=\"{cur:active>=index}\" v-for=\"(item,index) in stepArr\" :style=\"{\r\n            width:width,\r\n            color:active>=index?color||'#fff':'#000',\r\n            'background':active>=index?background||'#0147eb':'#f5f6fa'\r\n        }\" :key=\"index\"><span>{{index +1}}</span>\r\n\t\t\t<span>{{item.title}}</span>\r\n\t\t\t<div v-if=\"index<stepArr.length-1\" :class=\"active>=index?'jiaoActive':'jiao'\" :style=\"{\r\n                color:active>=index?color||'#fff':'#000',\r\n                'border-left-color':active>=index?background||'#0147eb':'#f5f6fa'\r\n            }\"></div>\r\n\t\t\t<div class=\"interval\"></div>\r\n\t\t</li>\r\n\t</ul>\r\n\r\n</template>\r\n\r\n<script>\r\n\texport default {\r\n\t\tname: 'ZlStep',\r\n\t\tprops: {\r\n\t\t\tactive: {\r\n\t\t\t\ttype: Number,\r\n\t\t\t\tdefault: 0\r\n\t\t\t},\r\n\t\t\tstepArr: {\r\n\t\t\t\ttype: Array,\r\n\t\t\t\tdefault: () => []\r\n\t\t\t},\r\n\t\t\twidth: {\r\n\t\t\t\ttype: String,\r\n\t\t\t\tdefault: '100%'\r\n\t\t\t},\r\n\t\t\tbackground: {\r\n\t\t\t\ttype: String,\r\n\t\t\t\tdefault: '#0147eb'\r\n\t\t\t},\r\n\t\t\tcolor: {\r\n\t\t\t\ttype: String,\r\n\t\t\t\tdefault: '#fff'\r\n\t\t\t},\r\n\t\t\theight: {\r\n\t\t\t\ttype: String,\r\n\t\t\t\tdefault: '40px'\r\n\t\t\t}\r\n\t\t},\r\n\t\twatch: {\r\n\t\t\tactive(a) {\r\n\t\t\t\tif (a <= 0) {\r\n\t\t\t\t\tthis.$emit('update:active', 0);\r\n\t\t\t\t\tconsole.log('已经是最小值了' + a);\r\n\t\t\t\t}\r\n\t\t\t\tif (a > this.stepArr.length - 1) {\r\n\t\t\t\t\tthis.$emit('update:active', this.stepArr.length - 1);\r\n\t\t\t\t\tconsole.log('已经是最大值了' + a);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t},\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\r\n\t\t\t};\r\n\t\t}\r\n\t};\r\n</script>\r\n\r\n<style lang=\"less\" scoped>\r\n\t.zl-step {\r\n\t\tlist-style: none;\r\n\t\tfont-size: 14px;\r\n\t\theight: 40px;\r\n\t\tdisplay: flex;\r\n\t\tjustify-content: center;\r\n\t\talign-items: center;\r\n\t\toverflow: hidden;\r\n\t}\r\n\r\n\tli {\r\n\t\theight: 40px;\r\n\t\tbackground: #d7d8da;\r\n\t\tcolor: #666;\r\n\t\ttext-align: center;\r\n\r\n\t\tline-height: 40px;\r\n\t\tfont-weight: 500;\r\n\t\t/*width: 20%;*/\r\n\t\t/*flex-basis: 100%;*/\r\n\t\tposition: relative;\r\n\r\n\t\tspan:nth-child(1) {\r\n\t\t\tfont-size: 16px;\r\n\t\t\tfont-weight: bold;\r\n\t\t\tline-height: 17px;\r\n\t\t\tmargin-right: 10px;\r\n\t\t}\r\n\t}\r\n\r\n\t/*三角形绘制*/\r\n\t.jiao {\r\n\t\twidth: 0;\r\n\t\theight: 0;\r\n\t\tborder-top: 20px solid transparent;\r\n\t\t/*高度一半*/\r\n\t\tborder-left: 20px solid #d7d8da;\r\n\t\t/*调整宽度*/\r\n\t\tborder-bottom: 20px solid transparent;\r\n\t\t/*高度一半*/\r\n\t\tposition: absolute;\r\n\t\tright: -20px;\r\n\t\t/*跟宽度保持一致*/\r\n\t\ttop: 0;\r\n\t\tz-index: 9999;\r\n\t}\r\n\r\n\t.jiaoActive {\r\n\t\twidth: 0;\r\n\t\theight: 0;\r\n\t\tborder-top: 20px solid transparent;\r\n\t\t/*高度一半*/\r\n\t\tborder-left: 20px solid #E8514A;\r\n\t\t/*调整宽度*/\r\n\t\tborder-bottom: 20px solid transparent;\r\n\t\t/*高度一半*/\r\n\t\tposition: absolute;\r\n\t\tright: -20px;\r\n\t\t/*跟宽度保持一致*/\r\n\t\ttop: 0;\r\n\t\tz-index: 2;\r\n\t}\r\n\r\n\t/*大3个px的边 26-20/2*/\r\n\t.interval {\r\n\r\n\t\twidth: 0;\r\n\t\theight: 0;\r\n\t\tborder-top: 26px solid transparent;\r\n\t\t/*高度一半*/\r\n\t\tborder-left: 26px solid #ffffff;\r\n\t\t/*调整宽度*/\r\n\t\tborder-bottom: 26px solid transparent;\r\n\t\t/*高度一半*/\r\n\t\tposition: absolute;\r\n\t\tright: -26px;\r\n\t\t/*跟宽度保持一致*/\r\n\t\ttop: -6px;\r\n\t\tz-index: 1;\r\n\t}\r\n</style>\r\n"]}]}