{"remainingRequest":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\front\\item\\zyAdmin\\src\\components\\steps\\index.vue?vue&type=style&index=0&id=3185edec&lang=scss&scoped=true","dependencies":[{"path":"D:\\front\\item\\zyAdmin\\src\\components\\steps\\index.vue","mtime":1761614938986},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\css-loader\\index.js","mtime":1761614929364},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":1761614937403},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\postcss-loader\\src\\index.js","mtime":1761614935133},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\sass-loader\\dist\\cjs.js","mtime":1761614936391},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\cache-loader\\dist\\cjs.js","mtime":1761614927801},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\index.js","mtime":1761614937402}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:DQouZGYtY2Mgew0KICBkaXNwbGF5OiBmbGV4Ow0KICBhbGlnbi1pdGVtczogY2VudGVyOw0KICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsNCn0NCi5zdGVwcyB7DQogICYtaXRlbSB7DQogICAgZGlzcGxheTogZmxleDsNCiAgICBhbGlnbi1pdGVtczogY2VudGVyOw0KICAgIHdpZHRoOiBtYXgtY29udGVudDsNCiAgICAuZG90IHsNCiAgICAgIHdpZHRoOiAyOHB4Ow0KICAgICAgaGVpZ2h0OiAyOHB4Ow0KICAgICAgY29sb3I6ICNjMGM0Y2M7DQogICAgICBib3JkZXI6IDFweCBzb2xpZCAjYzBjNGNjOw0KICAgICAgYm9yZGVyLXJhZGl1czogNTAlOw0KICAgICAgZGlzcGxheTogZmxleDsNCiAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7DQogICAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsNCiAgICAgIG1hcmdpbi1yaWdodDogOHB4Ow0KICAgIH0NCiAgICAudGl0bGUgew0KICAgICAgZm9udC1zaXplOiAxNnB4Ow0KICAgICAgZm9udC13ZWlnaHQ6IDQwMDsNCiAgICAgIGNvbG9yOiAjOTA5Mzk5Ow0KICAgICAgbGluZS1oZWlnaHQ6IDE2cHg7DQogICAgICB3aGl0ZS1zcGFjZTogbm93cmFwOw0KICAgIH0NCiAgICAubGluZSB7DQogICAgICBoZWlnaHQ6IDFweDsNCiAgICAgIG1hcmdpbjogMCAyMHB4Ow0KICAgICAgYmFja2dyb3VuZDogI2RkZGRkZDsNCiAgICB9DQogICAgLndkMTYwIHsNCiAgICAgIHdpZHRoOiAxNjBweDsNCiAgICB9DQogICAgLndkMTIwIHsNCiAgICAgIHdpZHRoOiAxMjBweDsNCiAgICB9DQogICAgLndkMTAwIHsNCiAgICAgIHdpZHRoOiAxMDBweDsNCiAgICB9DQogIH0NCiAgJi1pdGVtLmFjdGl2ZSB7DQogICAgLnRpdGxlIHsNCiAgICAgIGZvbnQtc2l6ZTogMTZweDsNCiAgICAgIGZvbnQtd2VpZ2h0OiA1MDA7DQogICAgICBjb2xvcjogIzMwMzEzMzsNCiAgICAgIGxpbmUtaGVpZ2h0OiAxNnB4Ow0KICAgIH0NCiAgICAuZG90IHsNCiAgICAgIHdpZHRoOiAyOHB4Ow0KICAgICAgaGVpZ2h0OiAyOHB4Ow0KICAgICAgYmFja2dyb3VuZDogdmFyKC0tcHJldi1jb2xvci1wcmltYXJ5KTsNCiAgICAgIGJvcmRlcjogMXB4IHNvbGlkIHZhcigtLXByZXYtY29sb3ItcHJpbWFyeSk7DQogICAgICBjb2xvcjogI2ZmZjsNCiAgICB9DQogIH0NCn0NCg=="},{"version":3,"sources":["index.vue"],"names":[],"mappings":";AA2DA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/components/steps","sourcesContent":["<template>\r\n  <div class=\"steps df-cc\">\r\n    <div\r\n      class=\"steps-item\"\r\n      :class=\"index <= isActive ? 'active' : ''\"\r\n      v-for=\"(step, index) in stepList\"\r\n      :key=\"index\"\r\n      v-db-click\r\n      @click=\"stepActive(index)\"\r\n    >\r\n      <div class=\"dot df-cc\">{{ index + 1 }}</div>\r\n      <span class=\"title\">{{ step }}</span>\r\n      <div class=\"line\" :class=\"lineWidth()\" v-if=\"index < stepList.length - 1\"></div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n  name: '',\r\n\r\n  props: {\r\n    stepList: {\r\n      type: Array,\r\n      default: () => {\r\n        return [];\r\n      },\r\n    },\r\n    isActive: {\r\n      type: Number,\r\n      default: 0,\r\n    },\r\n  },\r\n  data() {\r\n    return {};\r\n  },\r\n  created() {},\r\n  mounted() {},\r\n  methods: {\r\n    lineWidth() {\r\n      let i = this.stepList.length;\r\n      let width;\r\n      switch (i) {\r\n        case 3:\r\n          width = 'wd160';\r\n        case 4:\r\n          width = 'wd120';\r\n        default:\r\n          width = 'wd100';\r\n      }\r\n      return width;\r\n    },\r\n    stepActive(index) {\r\n      this.$emit('stepActive', index);\r\n    },\r\n  },\r\n};\r\n</script>\r\n<style lang=\"scss\" scoped>\r\n.df-cc {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n.steps {\r\n  &-item {\r\n    display: flex;\r\n    align-items: center;\r\n    width: max-content;\r\n    .dot {\r\n      width: 28px;\r\n      height: 28px;\r\n      color: #c0c4cc;\r\n      border: 1px solid #c0c4cc;\r\n      border-radius: 50%;\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n      margin-right: 8px;\r\n    }\r\n    .title {\r\n      font-size: 16px;\r\n      font-weight: 400;\r\n      color: #909399;\r\n      line-height: 16px;\r\n      white-space: nowrap;\r\n    }\r\n    .line {\r\n      height: 1px;\r\n      margin: 0 20px;\r\n      background: #dddddd;\r\n    }\r\n    .wd160 {\r\n      width: 160px;\r\n    }\r\n    .wd120 {\r\n      width: 120px;\r\n    }\r\n    .wd100 {\r\n      width: 100px;\r\n    }\r\n  }\r\n  &-item.active {\r\n    .title {\r\n      font-size: 16px;\r\n      font-weight: 500;\r\n      color: #303133;\r\n      line-height: 16px;\r\n    }\r\n    .dot {\r\n      width: 28px;\r\n      height: 28px;\r\n      background: var(--prev-color-primary);\r\n      border: 1px solid var(--prev-color-primary);\r\n      color: #fff;\r\n    }\r\n  }\r\n}\r\n</style>\r\n"]}]}