{"version":3,"sources":["webpack:///D:/Code2024/sulibao-mini/tuniao-ui/components/tn-steps/tn-steps.vue?0549","webpack:///D:/Code2024/sulibao-mini/tuniao-ui/components/tn-steps/tn-steps.vue?cb41","webpack:///D:/Code2024/sulibao-mini/tuniao-ui/components/tn-steps/tn-steps.vue?5fbc","webpack:///D:/Code2024/sulibao-mini/tuniao-ui/components/tn-steps/tn-steps.vue?baf7","uni-app:///tuniao-ui/components/tn-steps/tn-steps.vue","webpack:///D:/Code2024/sulibao-mini/tuniao-ui/components/tn-steps/tn-steps.vue?97d7"],"names":["renderjs","component","options","__file","components","render","_vm","this","_h","$createElement","g0","_self","_c","list","length","l0","__map","item","index","$orig","__get_orig","m0","mode","iconModeClass","m1","currentIndex","$mp","data","Object","assign","$root","recyclableRender","staticRenderFns","_withStripped","name","props","type","default","direction","current","activeColor","inActiveColor","icon","showTitle","fontSize","computed","watch","handler","immediate","methods","clickStepItem"],"mappings":"uIAAA,oIACIA,EADJ,QASIC,EAAY,qBACd,aACA,YACA,sBACA,EACA,KACA,WACA,MACA,EACA,gBACAD,GAGFC,EAAUC,QAAQC,OAAS,6CACZ,aAAAF,E,0CCvBf,uQ,iCCAA,IAAIG,EAAJ,0LACA,IAAIC,EAAS,WACX,IAAIC,EAAMC,KACNC,EAAKF,EAAIG,eAETC,GADKJ,EAAIK,MAAMC,GACVN,EAAIO,KAAKC,QACdC,EAAKT,EAAIU,MAAMV,EAAIO,MAAM,SAAUI,EAAMC,GAC3C,IAAIC,EAAQb,EAAIc,WAAWH,GACvBI,EAAkB,SAAbf,EAAIgB,KAAkBhB,EAAIiB,cAAcL,GAAS,KACtDM,EACW,YAAblB,EAAIgB,MAAwBhB,EAAImB,cAAgBP,EAE5C,KADAZ,EAAIiB,cAAcL,GAExB,MAAO,CACLC,MAAOA,EACPE,GAAIA,EACJG,GAAIA,MAGRlB,EAAIoB,IAAIC,KAAOC,OAAOC,OACpB,GACA,CACEC,MAAO,CACLpB,GAAIA,EACJK,GAAIA,MAKRgB,GAAmB,EACnBC,EAAkB,GACtB3B,EAAO4B,eAAgB,G,iCC/BvB,yHAA40B,eAAG,G,yGCyF/0B,CACAC,gBACAC,OAGAb,MACAc,YACAC,eAIAC,WACAF,YACAC,eAGAxB,MACAuB,WACAC,mBACA,WAIAE,SACAH,YACAC,WAGAG,aACAJ,YACAC,mBAGAI,eACAL,YACAC,mBAGAK,MACAN,YACAC,mBAGAM,WACAP,aACAC,YAEAO,UACAR,YACAC,iBAGAQ,UAEAtB,yBAAA,WACA,mBACA,gBAEA,wDACA,gCAGA,qCAKAI,gBACA,OACAF,iBAGAqB,OACAP,SACAQ,oBACA,qBAEAC,eAGAC,SAEAC,0BACA,UACA,oBACA,oBAAAhC,aAGA,a,iCCjLA,yHAA2jD,eAAG,G","file":"tuniao-ui/components/tn-steps/tn-steps.js","sourcesContent":["import { render, staticRenderFns, recyclableRender, components } from \"./tn-steps.vue?vue&type=template&id=e96e5408&scoped=true&\"\nvar renderjs\nimport script from \"./tn-steps.vue?vue&type=script&lang=js&\"\nexport * from \"./tn-steps.vue?vue&type=script&lang=js&\"\nimport style0 from \"./tn-steps.vue?vue&type=style&index=0&id=e96e5408&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"e96e5408\",\n  null,\n  false,\n  components,\n  renderjs\n)\n\ncomponent.options.__file = \"tuniao-ui/components/tn-steps/tn-steps.vue\"\nexport default component.exports","export * from \"-!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--17-0!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/template.js!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-uni-app-loader/page-meta.js!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./tn-steps.vue?vue&type=template&id=e96e5408&scoped=true&\"","var components\nvar render = function () {\n  var _vm = this\n  var _h = _vm.$createElement\n  var _c = _vm._self._c || _h\n  var g0 = _vm.list.length\n  var l0 = _vm.__map(_vm.list, function (item, index) {\n    var $orig = _vm.__get_orig(item)\n    var m0 = _vm.mode === \"icon\" ? _vm.iconModeClass(index) : null\n    var m1 =\n      _vm.mode === \"dotIcon\" && !(_vm.currentIndex <= index)\n        ? _vm.iconModeClass(index)\n        : null\n    return {\n      $orig: $orig,\n      m0: m0,\n      m1: m1,\n    }\n  })\n  _vm.$mp.data = Object.assign(\n    {},\n    {\n      $root: {\n        g0: g0,\n        l0: l0,\n      },\n    }\n  )\n}\nvar recyclableRender = false\nvar staticRenderFns = []\nrender._withStripped = true\n\nexport { render, staticRenderFns, recyclableRender, components }","import mod from \"-!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/babel-loader/lib/index.js!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--13-1!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./tn-steps.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/babel-loader/lib/index.js!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--13-1!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./tn-steps.vue?vue&type=script&lang=js&\"","<template>\r\n  <view\r\n    class=\"tn-steps-class tn-steps\"\r\n    :style=\"{\r\n      flexDirection: direction\r\n    }\"\r\n  >\r\n    <view\r\n      v-for=\"(item, index) in list\"\r\n      :key=\"index\"\r\n      class=\"tn-steps__item\"\r\n      :class=\"[`tn-steps__item--${direction}`]\"\r\n      @tap=\"clickStepItem(index)\"\r\n    >\r\n      <!-- 数值模式 -->\r\n      <view\r\n        v-if=\"mode === 'number'\"\r\n        class=\"tn-steps__item__number\"\r\n        :style=\"{\r\n          backgroundColor: currentIndex <= index ? 'transparent' : activeColor,\r\n          borderColor: currentIndex <= index ? inActiveColor : activeColor\r\n        }\"\r\n      >\r\n        <text\r\n          class=\"tn-steps__item__number__text\"\r\n          :class=\"[{'tn-steps__item__number__text--visible': currentIndex <= index}]\"\r\n          :style=\"{\r\n            color: currentIndex <= index ? inActiveColor : activeColor\r\n          }\"\r\n        >\r\n          {{ index + 1}}\r\n        </text>\r\n        <view class=\"tn-steps__item__number__icon\" :class=\"[`tn-icon-${item.icon || icon}`,{'tn-steps__item__number__icon--visible': currentIndex > index}]\"></view>\r\n      </view>\r\n      \r\n      <!-- 点模式 -->\r\n      <view\r\n        v-if=\"mode === 'dot'\"\r\n        class=\"tn-steps__item__dot\"\r\n        :style=\"{\r\n          backgroundColor: currentIndex <= index ? inActiveColor : activeColor,\r\n\t\t  fontSize:fontSize\r\n        }\"\r\n      ></view>\r\n      \r\n      <!-- 图标模式 -->\r\n      <view\r\n        v-if=\"mode === 'icon'\"\r\n        class=\"tn-steps__item__icon\"\r\n        :class=\"[iconModeClass(index)]\"\r\n        :style=\"{\r\n          color: currentIndex <= index ? inActiveColor : activeColor,\r\n\t\t  fontSize:fontSize\r\n        }\"\r\n      ></view>\r\n      \r\n      <!-- 点图标模式 -->\r\n      <view v-if=\"mode === 'dotIcon'\" class=\"tn-steps__item__dot-icon\">\r\n        <view v-if=\"currentIndex <= index\" class=\"tn-steps__item__dot-icon--dot\" :style=\"{backgroundColor: inActiveColor}\"></view>\r\n        <view v-else class=\"tn-steps__item__dot-icon--icon\" :class=\"[iconModeClass(index)]\" :style=\"{color: activeColor}\"></view>\r\n      </view>\r\n      \r\n      <!-- 步骤下的文字 -->\r\n      <text\r\n        v-if=\"showTitle\"\r\n        class=\"tn-steps__item__text tn-text-ellipsis\"\r\n        :class=\"[`tn-steps__item__text--${direction}`]\"\r\n        :style=\"{\r\n          color: currentIndex <= index ? inActiveColor : activeColor,\r\n\t\t  fontSize:fontSize\r\n        }\"\r\n      >\r\n        {{ item.name }}\r\n      </text>\r\n      \r\n      <!-- 连接的横线 -->\r\n      <view\r\n        v-if=\"index < list.length - 1\"\r\n        class=\"tn-steps__item__line\"\r\n        :class=\"[`tn-steps__item__line--${mode}`]\"\r\n        :style=\"{\r\n          borderColor: currentIndex <= index + 1 ? inActiveColor : activeColor\r\n        }\"\r\n      ></view>\r\n    </view>\r\n  </view>\n</template>\n\n<script>\r\n  export default {\r\n    name: 'tn-steps',\r\n    props: {\r\n      // 模式类型\r\n      // dot -> 点 number -> 数字 icon -> 图标 dotIcon -> 点图标\r\n      mode: {\r\n        type: String,\r\n        default: 'dot'\r\n      },\r\n      // 步骤条的方向\r\n      // row -> 横向 column -> 竖向\r\n      direction: {\r\n        type: String,\r\n        default: 'row'\r\n      },\r\n      // 步骤条数据\r\n      list: {\r\n        type: Array,\r\n        default() {\r\n          return []\r\n        }\r\n      },\r\n      // 当前激活的步数\r\n      current: {\r\n        type: Number,\r\n        default: 0\r\n      },\r\n      // 激活步骤的颜色\r\n      activeColor: {\r\n        type: String,\r\n        default: '#01BEFF'\r\n      },\r\n      // 未激活步骤的颜色\r\n      inActiveColor: {\r\n        type: String,\r\n        default: '#AAAAAA'\r\n      },\r\n      // 激活后显示的图标，在数字模式下有效\r\n      icon: {\r\n        type: String,\r\n        default: 'success'\r\n      },\r\n      // 是否显示标题\r\n      showTitle: {\r\n        type: Boolean,\r\n        default: true\r\n      },\r\n\t  fontSize:{\r\n\t\t  type: String,\r\n\t\t  default: '14px'\r\n\t  }\r\n    },\r\n    computed: {\r\n      // icon模式下图标的值\r\n      iconModeClass() {\r\n        return (index) => {\r\n          const item = this.list[index]\r\n          // 状态被选中并且对应数据下存在selectIcon属性\r\n          if (this.currentIndex > index && item.hasOwnProperty('selectIcon')) {\r\n            return `tn-icon-${item.selectIcon}`\r\n          } else {\r\n            // 未选中\r\n            return `tn-icon-${item.icon || this.icon}`\r\n          }\r\n        }\r\n      }\r\n    },\r\n    data() {\r\n      return {\r\n        currentIndex: 0\r\n      }\r\n    },\r\n    watch: {\r\n      current: {\r\n        handler(val) {\r\n          this.currentIndex = val\r\n        },\r\n        immediate: true\r\n      }\r\n    },\r\n    methods: {\r\n      // 点击了某一个选项\r\n      clickStepItem(index) {\r\n        const chooseIndex = index + 1\r\n        this.currentIndex = chooseIndex\r\n        this.$emit('click', { index: chooseIndex })\r\n      }\r\n    }\r\n  }\n</script>\n\n<style lang=\"scss\" scoped>\r\n  \r\n  $tn-steps-item-number-width: 44rpx;\r\n  $tn-steps-item-dot-width: 20rpx;\r\n  \r\n  .tn-steps {\r\n    display: flex;\r\n    flex-direction: row;\r\n    \r\n    &__item {\r\n      flex: 1;\r\n      position: relative;\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n      flex-direction: column;\r\n      min-width: 100rpx;\r\n      font-size: 28rpx;\r\n      text-align: center;\r\n      \r\n      &__number {\r\n        // display: flex;\r\n        // flex-wrap: wrap;\r\n        // align-items: center;\r\n        // justify-content: center;\r\n        position: relative;\r\n        width: $tn-steps-item-number-width;\r\n        height: $tn-steps-item-number-width;\r\n        line-height: calc(#{$tn-steps-item-number-width} - 2rpx);\r\n        border: 1px solid #AAAAAA;\r\n        border-radius: 50%;\r\n        overflow: hidden;\r\n        transition: all 0.3s linear;\r\n        \r\n        &__text {\r\n          position: absolute;\r\n          top: 0;\r\n          right: 0;\r\n          bottom: 0;\r\n          left: 0;\r\n          margin: auto;\r\n          transition: inherit;\r\n          transform: translateY(-#{$tn-steps-item-number-width});\r\n          \r\n          &--visible {\r\n            transform: translateY(0);\r\n          }\r\n        }\r\n        \r\n        &__icon {\r\n          position: absolute;\r\n          top: 0;\r\n          right: 0;\r\n          bottom: 0;\r\n          left: 0;\r\n          margin: auto;\r\n          color: #FFFFFF;\r\n          transition: all 0.3s linear;\r\n          transform: translateY(#{$tn-steps-item-number-width});\r\n          \r\n          &--visible {\r\n            transform: translateY(0);\r\n          }\r\n        }\r\n      }\r\n      \r\n      &__dot {\r\n        width: $tn-steps-item-dot-width;\r\n        height: $tn-steps-item-dot-width;\r\n        display: flex;\r\n        flex-direction: row;\r\n        border-radius: 50%;\r\n        transition: all 0.3s linear;\r\n        \r\n        &--icon {\r\n          width: $tn-steps-item-number-width;\r\n          height: $tn-steps-item-number-width;\r\n        }\r\n      }\r\n      \r\n      &__icon {\r\n        width: $tn-steps-item-number-width;\r\n        height: $tn-steps-item-number-width;\r\n        font-size: $tn-steps-item-number-width;\r\n        transition: all 0.3s linear;\r\n      }\r\n      \r\n      &__dot-icon {\r\n        width: $tn-steps-item-number-width;\r\n        height: $tn-steps-item-number-width;\r\n        display: flex;\r\n        flex-direction: row;\r\n        align-items: center;\r\n        justify-content: center;\r\n        transition: all 0.3s linear;\r\n        \r\n        &--dot {\r\n          width: $tn-steps-item-dot-width;\r\n          height: $tn-steps-item-dot-width;\r\n          border-radius: 50%;\r\n          transition: inherit;\r\n        }\r\n        \r\n        &--icon {\r\n          width: $tn-steps-item-number-width;\r\n          height: $tn-steps-item-number-width;\r\n          font-size: $tn-steps-item-number-width;\r\n          transition: inherit;\r\n        }\r\n      }\r\n      \r\n      &__text {\r\n        transition: all 0.3s linear;\r\n        &--row {\r\n          margin-top: 14rpx;\r\n        }\r\n        \r\n        &--column {\r\n          margin-left: 14rpx;\r\n        }\r\n      }\r\n      \r\n      &__line {\r\n        position: absolute;\r\n        z-index: 0;\r\n        vertical-align: middle;\r\n        transition: all 0.3s linear;\r\n      }\r\n      \r\n      &--row {\r\n        display: flex;\r\n        flex-direction: column;\r\n        \r\n        .tn-steps__item__line {\r\n          border-bottom-width: 1px;\r\n          border-bottom-style: solid;\r\n          width: 50%;\r\n          left: 75%;\r\n          \r\n          &--dot {\r\n            top: calc(#{$tn-steps-item-dot-width} / 2);\r\n          }\r\n          \r\n          &--number, &--icon, &--dotIcon {\r\n            top: calc(#{$tn-steps-item-number-width} / 2);\r\n          }\r\n        }\r\n      }\r\n      \r\n      &--column {\r\n        display: flex;\r\n        flex-direction: row;\r\n        justify-content: flex-start;\r\n        min-height: 120rpx;\r\n        \r\n        .tn-steps__item__line {\r\n          border-left-width: 1px;\r\n          border-left-style: solid;\r\n          height: 50%;\r\n          top: 75%;\r\n          \r\n          &--dot {\r\n            left: calc(#{$tn-steps-item-dot-width} / 2);\r\n          }\r\n          \r\n          &--number, &--icon, &--dotIcon {\r\n            left: calc(#{$tn-steps-item-number-width} / 2);\r\n          }\r\n        }\r\n      }\r\n    }\r\n  }\n</style>\n","import mod from \"-!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--8-oneOf-1-2!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-3!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js??ref--8-oneOf-1-4!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--8-oneOf-1-5!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./tn-steps.vue?vue&type=style&index=0&id=e96e5408&lang=scss&scoped=true&\"; export default mod; export * from \"-!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--8-oneOf-1-2!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-3!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js??ref--8-oneOf-1-4!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--8-oneOf-1-5!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../../self software/HBuilderX.3.99.2023122611/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./tn-steps.vue?vue&type=style&index=0&id=e96e5408&lang=scss&scoped=true&\""],"sourceRoot":""}