{"version":3,"sources":["webpack:///./src/components/DataUnit.vue?fd94","webpack:///src/components/DataUnit.vue","webpack:///./src/components/DataUnit.vue?6ef3","webpack:///./src/components/DataUnit.vue","webpack:///./src/components/DataUnit.vue?db22"],"names":["render","_vm","this","_h","$createElement","_c","_self","class","containerClass","_l","u","i","key","tool","attrs","hidden","$root","customerId","noCustomer","_e","staticClass","hideAvatar","on","$event","menuItems","valueClick","_v","_s","title","noDelete","canDelete","deleteUnit","pos","x","l","connLine","includes","spaceholder","containerPos","lineDir","removeArrow","id","$vuetify","breakpoint","mdAndUp","tile","color","hiliteLine","valueIcon","valueIconClass","iconFa","icon","scopedSlots","_u","fn","ref","_g","_b","model","value","callback","$$v","menuModel","expression","item","index","menuItemClick","text","valueTitle","staticRenderFns","name","components","VArrow","VMenuButton","props","units","Array","arrow","String","Function","Boolean","Number","data","lineIds","defaultColor","lineVer","lineWidth","lineCls","lineTop","half","lineHor","lineLeft","mounted","beforeDestroy","methods","parseInt","from","document","getElementsByClassName","forEach","a","classList","toggle","querySelectorAll","lineVerColor","line","unit","connLineColor","lineColor","to","lineTo","parent","$emit","replace","component","VBtn","VCard","VCol","VIcon","VList","VListItem","VListItemTitle","VMenu","VRow","VSpacer"],"mappings":"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","file":"js/chunk-1b53e54c.a83f2c9d.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{class:_vm.containerClass == 'top'\n      ? 'data-unit-container '\n      : 'data-unit-container move-plan-unit'},_vm._l((_vm.units),function(u,i){return _c('div',{key:i,class:_vm.tool ? '' + ' tool ma-0 pt-0' : '' + u.class + ' unit ma-0 pt-0',attrs:{\"elevation-11\":\"\"}},[(!u.hidden && (!_vm.$root.customerId || !u.noCustomer))?_c('div',[_c('v-row',{staticClass:\"unit-row\",attrs:{\"justify\":\"center\"}},[_c('v-col',{attrs:{\"justify\":\"center\"}},[_c('div',{staticClass:\"subtitle-2 mb-n2 value-label on-top\"},[(!u.hideAvatar)?_c('div',{staticClass:\"justify-center text-center pointer\",on:{\"click\":function($event){!u.menuItems ? _vm.valueClick(u) : ''}}},[_vm._v(\" \"+_vm._s(u.title)+\" \")]):_vm._e(),((i > 0 && !u.noDelete) || u.canDelete)?_c('v-btn',{staticClass:\"close-btn\",attrs:{\"icon\":\"\"},on:{\"click\":function($event){return _vm.deleteUnit(u, i)}}},[_c('v-icon',{attrs:{\"color\":\"red\",\"small\":\"\"}},[_vm._v(\"mdi-close-circle\")])],1):_vm._e()],1),_c('v-row',{staticClass:\"main-row\"},[(u.pos && u.pos.x > 1)?_c('div',_vm._l((u.connLine),function(l,i){return _c('div',{key:i,staticClass:\"connection-container\"},[(!l.connLine.includes('from'))?_c('div',{class:'unit-cell connection connection-' + l.connLine},[_c('v-arrow',{attrs:{\"l\":l}})],1):_vm._e()])}),0):_vm._e(),(!u.spaceholder)?_c('v-col',{class:u.pos && u.pos.x == 2\n                  ? 'arrow-to arrow-container hor left'\n                  : 'arrow-to arrow-container hor '},_vm._l((u.lineTo),function(l,i){return _c('div',{key:i,class:'arrow-subcontainer pos-' + _vm.containerPos},[(l.lineDir == 'horizontal')?_c('v-arrow',{attrs:{\"l\":_vm.removeArrow(l, true)}}):_vm._e()],1)}),0):_vm._e(),_c('v-col',{staticClass:\"main-container\"},[_c('v-card',{attrs:{\"flat\":\"\"}},[(!u.hideAvatar && u.title)?_c('v-btn',{class:u.id + '  data-unit on-top pointer pa-0',attrs:{\"text\":\"\",\"dark\":\"\",\"small\":!_vm.$vuetify.breakpoint.mdAndUp || _vm.tool,\"tile\":u.tile,\"color\":u.color,\"rounded\":_vm.tool},on:{\"click\":function($event){!u.menuItems ? _vm.valueClick(u) : ''},\"mouseenter\":function($event){return _vm.hiliteLine(u)},\"mouseleave\":function($event){return _vm.hiliteLine(u)}}},[(u.valueIcon && !_vm.tool)?_c('v-icon',{class:u.valueIconClass + '  ma-2',attrs:{\"x-large\":\"\",\"right\":_vm.$vuetify.breakpoint.mdAndUp}},[_vm._v(\" mdi-\"+_vm._s(u.valueIcon)+\" \")]):_c('v-icon',{staticClass:\"ma-2\",attrs:{\"x-large\":\"\"}},[_vm._v(_vm._s(u.iconFa ? \"\" : \"mdi-\")+_vm._s(u.icon)+\" \")])],1):_vm._e()],1),(!u.hideAvatar)?_c('div',[(!u.menuItems && !u.spaceholder)?_c('div',{staticClass:\"ma-0 value-container justify-center\"},[_c('v-btn',{class:'ma-0 value-btn ' + u.class,attrs:{\"small\":\"\",\"color\":\"black\",\"text\":\"\"},on:{\"click\":function($event){!u.menuItems ? _vm.valueClick(u) : ''}}},[(!u.spaceholder)?_c('div',{staticClass:\"value mt-1\"},[_vm._v(\" \"+_vm._s(_vm.tool ? u.value : u.value || \"(\" + u.valueTitle + \" TBD)\")+\" \")]):_vm._e()])],1):_c('div',[_c('v-menu',{staticClass:\"top-list\",attrs:{\"top\":\"\"},scopedSlots:_vm._u([{key:\"activator\",fn:function(ref){\n                  var on = ref.on;\n                  var attrs = ref.attrs;\nreturn [(!u.spaceholder)?_c('div',_vm._g(_vm._b({staticClass:\"value\"},'div',attrs,false),on),[_c('div',[_vm._v(\"(Select)\")])]):_vm._e()]}}],null,true),model:{value:(_vm.menuModel),callback:function ($$v) {_vm.menuModel=$$v},expression:\"menuModel\"}},[_c('v-spacer'),_c('v-list',_vm._l((u.menuItems),function(item,index){return _c('v-list-item',{key:index},[_c('v-list-item-title',{on:{\"click\":function($event){return _vm.menuItemClick(u, item, this)}}},[_vm._v(_vm._s(item.text))])],1)}),1)],1)],1)]):_vm._e()],1),(!u.spaceholder)?_c('v-col',{staticClass:\"arrow-container arrow-from hor\"},_vm._l((u.line),function(l,i){return _c('div',{key:i,class:'arrow-subcontainer pos-' + _vm.containerPos},[(l.lineDir == 'horizontal')?_c('v-arrow',{attrs:{\"l\":_vm.removeArrow(l)}}):_vm._e()],1)}),0):_vm._e(),_vm._l((u.connLine),function(l,i){return _c('div',{key:i,staticClass:\"connection-container\"},[(!l.connLine.includes('to'))?_c('div',{class:'unit-cell connection connection-' + l.connLine},[_c('v-arrow',{attrs:{\"l\":l}})],1):_vm._e()])})],2),(!u.spaceholder)?_c('v-row',{staticClass:\"justify-center\"},[_c('v-col',{staticClass:\"arrow-container ver-line\"},_vm._l((u.line),function(l,i){return _c('div',{key:i},[(l.lineDir == 'vertical')?_c('v-arrow',{attrs:{\"l\":l}}):_vm._e()],1)}),0)],1):_vm._e()],1)],1)],1):_vm._e()])}),0)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div\n    :class=\"\n      containerClass == 'top'\n        ? 'data-unit-container '\n        : 'data-unit-container move-plan-unit'\n    \"\n  >\n    <!-- {{ units }} -->\n    <!-- {{ containerPos }} -->\n    <!-- <div class=\"connection-left\">l</div> -->\n\n    <div\n      elevation-11\n      v-for=\"(u, i) in units\"\n      :class=\"tool ? '' + ' tool ma-0 pt-0' : '' + u.class + ' unit ma-0 pt-0'\"\n      :key=\"i\"\n    >\n      <!-- {{ lineIds }} -->\n\n      <div v-if=\"!u.hidden && (!$root.customerId || !u.noCustomer)\">\n        <!-- <div class=\"value-wrapper\"> -->\n\n        <!-- </div> -->\n        <v-row justify=\"center\" class=\"unit-row\">\n          <v-col justify=\"center\">\n            <div class=\"subtitle-2 mb-n2 value-label on-top\">\n              <div\n                v-if=\"!u.hideAvatar\"\n                @click=\"!u.menuItems ? valueClick(u) : ''\"\n                class=\"justify-center text-center pointer\"\n              >\n                {{ u.title }} &nbsp;\n              </div>\n\n              <v-btn\n                @click=\"deleteUnit(u, i)\"\n                v-if=\"(i > 0 && !u.noDelete) || u.canDelete\"\n                class=\"close-btn\"\n                icon\n              >\n                <v-icon color=\"red\" small>mdi-close-circle</v-icon>\n              </v-btn>\n            </div>\n            <v-row class=\"main-row\">\n              <!-- {{u.connLine}} -->\n\n              <div v-if=\"u.pos && u.pos.x > 1\">\n                <div class=\"connection-container\" v-for=\"(l, i) in u.connLine\" :key=\"i\">\n                  <div\n                    v-if=\"!l.connLine.includes('from')\"\n                    :class=\"'unit-cell connection connection-' + l.connLine\"\n                  >\n                    <v-arrow :l=\"l\"></v-arrow>\n                  </div>\n                </div>\n              </div>\n              <!-- <div\n                v-if=\"\n                  u.class &&\n                    (u.class.includes('step-line-to-up') ||\n                      u.class.includes('step-line-to-down'))\n                \"\n                class=\"connection-wrapper\"\n              >\n                <div\n                  v-if=\"u.class.includes('step-line-to-up')\"\n                  class=\"unit-cell connection connection-to-up\"\n                >\n                  <v-arrow\n                    connection=\"down\"\n                    :l=\"lineVerColor(u, true)\"\n                  ></v-arrow>\n                </div>\n                <div\n                  v-if=\"u.class.includes('step-line-to-down')\"\n                  class=\"unit-cell connection connection-to-down\"\n                >\n                  <v-arrow connection=\"up\" :l=\"lineVerColor(u, true)\"></v-arrow>\n                </div>\n              </div> -->\n\n              <v-col\n                v-if=\"!u.spaceholder\"\n                :class=\"\n                  u.pos && u.pos.x == 2\n                    ? 'arrow-to arrow-container hor left'\n                    : 'arrow-to arrow-container hor '\n                \"\n              >\n                <div\n                  :class=\"'arrow-subcontainer pos-' + containerPos\"\n                  v-for=\"(l, i) in u.lineTo\"\n                  :key=\"i\"\n                >\n                  <!-- {{l.from}} {{l.to}} -->\n                  <v-arrow\n                    v-if=\"l.lineDir == 'horizontal'\"\n                    :l=\"removeArrow(l, true)\"\n                  ></v-arrow>\n                </div>\n              </v-col>\n              <v-col class=\"main-container\">\n                <v-card flat>\n                  <v-btn\n                    text\n                    dark\n                    :small=\"!$vuetify.breakpoint.mdAndUp || tool\"\n                    :tile=\"u.tile\"\n                    v-if=\"!u.hideAvatar && u.title\"\n                    @click=\"!u.menuItems ? valueClick(u) : ''\"\n                    :class=\"u.id + '  data-unit on-top pointer pa-0'\"\n                    :color=\"u.color\"\n                    @mouseenter=\"hiliteLine(u)\"\n                    @mouseleave=\"hiliteLine(u)\"\n                    :rounded=\"tool\"\n                  >\n                    <v-icon\n                      x-large\n                      :class=\"u.valueIconClass + '  ma-2'\"\n                      v-if=\"u.valueIcon && !tool\"\n                      :right=\"$vuetify.breakpoint.mdAndUp\"\n                    >\n                      mdi-{{ u.valueIcon }}\n                    </v-icon>\n\n                    <v-icon x-large v-else class=\"ma-2\"\n                      >{{ u.iconFa ? \"\" : \"mdi-\" }}{{ u.icon }} &nbsp;</v-icon\n                    >\n                  </v-btn>\n                </v-card>\n                <div v-if=\"!u.hideAvatar\">\n                  <div\n                    v-if=\"!u.menuItems && !u.spaceholder\"\n                    class=\"ma-0 value-container justify-center\"\n                  >\n                    <v-btn\n                      @click=\"!u.menuItems ? valueClick(u) : ''\"\n                      small\n                      color=\"black\"\n                      :class=\"'ma-0 value-btn ' + u.class\"\n                      text\n                    >\n                      <div class=\"value mt-1\" v-if=\"!u.spaceholder\">\n                        {{ tool ? u.value : u.value || \"(\" + u.valueTitle + \" TBD)\" }}\n                        <!-- <div if-if=\"!tool && u.additionaInfo\"> -->\n\n                        <!-- </div> -->\n                      </div>\n                      <!-- <div class=\"value mt-1\" v-if=\"!u.spaceholder && !tool\">\n                        \n                      </div> -->\n                    </v-btn>\n                  </div>\n                  <div v-else>\n                    <v-menu class=\"top-list\" v-model=\"menuModel\" top>\n                      <v-spacer></v-spacer>\n                      <template v-slot:activator=\"{ on, attrs }\">\n                        <div v-if=\"!u.spaceholder\" class=\"value\" v-bind=\"attrs\" v-on=\"on\">\n                          <div>(Select)</div>\n                        </div>\n                      </template>\n\n                      <v-list>\n                        <v-list-item v-for=\"(item, index) in u.menuItems\" :key=\"index\">\n                          <v-list-item-title @click=\"menuItemClick(u, item, this)\">{{\n                            item.text\n                          }}</v-list-item-title>\n                        </v-list-item>\n                      </v-list>\n                    </v-menu>\n                  </div>\n                </div>\n              </v-col>\n\n              <v-col v-if=\"!u.spaceholder\" class=\"arrow-container arrow-from hor\">\n                <div\n                  :class=\"'arrow-subcontainer pos-' + containerPos\"\n                  v-for=\"(l, i) in u.line\"\n                  :key=\"i\"\n                >\n                  <v-arrow v-if=\"l.lineDir == 'horizontal'\" :l=\"removeArrow(l)\"></v-arrow>\n                </div>\n              </v-col>\n              <!-- {{ u.connLine }} -->\n              <!-- <div v-if=\"u.addTools\">\n                <v-toolbar flat>\n                  <div flat v-for=\"(c, i) in u.addTools\" :key=\"i\">\n                    <v-btn\n                      text\n                      :color=\"c['v-bind'].color\"\n                      class=\"mt-n10 ml-n4 \"\n                      v-if=\"c[`comp`] == 'v-btn' && !c['v-bind'].hidden\"\n                      @click=\"menuItemClick.apply(null, c['v-bind'].args)\"\n                    >\n                      <v-icon\n                        :class=\"$vuetify.breakpoint.smAndDown ? 'ma-0' : 'ma-2'\"\n                        v-if=\"c['v-bind'].icon\"\n                      >\n                        {{ c[\"v-bind\"].icon }}\n                      </v-icon>\n                      {{ c[\"v-bind\"][\"input-value\"] }}\n                    </v-btn>\n                    <component\n                      v-else\n                      :is=\"c[`comp`]\"\n                      :ref=\"c[`id`]\"\n                      :id=\"c[`id`]\"\n                      v-bind=\"c[`v-bind`]\"\n                    />\n                  </div>\n                </v-toolbar>\n              </div> -->\n              <div class=\"connection-container\" v-for=\"(l, i) in u.connLine\" :key=\"i\">\n                <div\n                  v-if=\"!l.connLine.includes('to')\"\n                  :class=\"'unit-cell connection connection-' + l.connLine\"\n                >\n                  <v-arrow :l=\"l\"></v-arrow>\n                  <!-- {{l.connLine }}-right -->\n                </div>\n              </div>\n\n              <!-- <div\n                v-if=\"u.class && u.class.includes('step-line-from-up')\"\n                :class=\"\n                  u.line.filter(l => {\n                    return l.lineDir == 'horizontal';\n                  }).length && u.pos.x > 1\n                    ? 'unit-cell connection connection-from-up left-margin'\n                    : 'unit-cell connection connection-from-up'\n                \"\n              >\n                <v-arrow connection=\"down\" :l=\"lineVerColor(u)\"></v-arrow>\n              </div>\n              <div\n                v-if=\"u.class && u.class.includes('step-line-from-down')\"\n                class=\"unit-cell connection connection-from-down\"\n              >\n                <v-arrow connection=\"up\" :l=\"lineVerColor(u)\"></v-arrow>\n              </div> -->\n            </v-row>\n            <v-row v-if=\"!u.spaceholder\" class=\"justify-center\">\n              <v-col class=\"arrow-container ver-line\">\n                <div v-for=\"(l, i) in u.line\" :key=\"i\">\n                  <v-arrow v-if=\"l.lineDir == 'vertical'\" :l=\"l\"></v-arrow>\n                </div>\n              </v-col>\n            </v-row>\n          </v-col>\n        </v-row>\n      </div>\n    </div>\n    <!-- <div class=\"connection-right\">r</div> -->\n  </div>\n</template>\n\n<script>\nimport * as fun from \"../plugins/common\";\nexport default {\n  name: \"DataUnit\",\n  components: {\n    VArrow: () => import(\"../components/Arrow.vue\"),\n    VMenuButton: () => import(\"../components/MenuButton.vue\"),\n  },\n  props: {\n    units: Array,\n    arrow: Array,\n    containerClass: String,\n    menuItemClick: Function,\n    deleteUnit: Function,\n    tool: Boolean,\n    containerPos: [Number, String],\n  },\n  data() {\n    return {\n      menuModel: 0,\n      lineIds: [],\n      defaultColor: \"#dcdcdc\",\n      lineVer: {\n        lineWidth: 6,\n        lineCls: \"line-vertical\",\n        lineTop: 0,\n        half: true,\n      },\n      lineHor: {\n        lineWidth: 6,\n        lineCls: \"line-horizontal\",\n        lineLeft: 0,\n      },\n    };\n  },\n  mounted() {\n    // console.log(this.deleteUnit);\n    // console.log(this.units);\n    // if (this.units[0].id == \"pickup\") {\n    //   console.log(this.units);\n    // }\n    // this.lineVer.lineCls = \"line-vertical\";\n    // this.lineVer.lineTop = 0;\n    // this.lineHor.lineCls = \"line-horizontal\";\n    // this.lineHor.lineLeft = 0;\n  },\n\n  beforeDestroy() {},\n  methods: {\n    hiliteLine(u) {\n      if (!u.pos) {\n        return;\n      }\n      if (parseInt(u.pos.x) == 2) {\n        Array.from(document.getElementsByClassName(\"line-horizontal\")).forEach((a) => {\n          a.classList.toggle(\"shadow\");\n        });\n        // Array.from(document.getElementsByClassName(\"line-vertical\")).forEach(\n        //   (a) => {\n        //     a.classList.toggle(\"shadow\");\n        //   }\n        // );document.getElementsByClassName(u.serviceId)\n        Array.from(document.querySelectorAll(\".line-vertical, .line-horizontal\")).forEach(\n          (a) => {\n            var yClass = [];\n            for (var i = 0; i <= u.pos.y; i++) {\n              yClass.push(\"y-\" + i);\n            }\n\n            var y = null;\n            Array.from(a.classList).forEach((c) => {\n              if (c.startsWith(\"y-\")) {\n                // console.log(a.classList, yClass);\n                y = c;\n              }\n            });\n            // console.log(u.pos.y, y, yClass);\n            if (\n              (Array.from(a.classList).includes(\"line-vertical\") &&\n                yClass.some((c) => {\n                  return c == y;\n                })) ||\n              Array.from(a.classList).includes(\"line-horizontal\")\n            ) {\n              // console.log(\n              //   y,\n              //   yClass.some((c) => {\n              //     return c == y;\n              //   })\n              // );\n              if (Array.from(a.classList).includes(u.serviceId)) {\n                a.classList.toggle(\"hilite\");\n              }\n            } else {\n              a.classList.toggle(\"shadow\");\n            }\n          }\n        );\n        // console.log(document.getElementsByClassName(u.serviceId));\n      }\n    },\n    lineVerColor(unit, to) {\n      var line = fun.clone(this.lineVer);\n\n      if (unit.connLineColor) {\n        line.lineColor = unit.connLineColor;\n      } else {\n        if (!to) {\n          unit.line.forEach((l) => {\n            if (l.connLineColor) {\n              line.lineColor = l.connLineColor;\n            }\n          });\n        } else {\n          if (unit.lineTo && unit.lineTo[0]) {\n            line.lineColor = unit.lineTo[0].lineColor;\n          }\n        }\n      }\n      if (!line.lineColor) {\n        line.lineColor = this.defaultColor;\n      }\n      return line;\n    },\n    valueClick(u) {\n      u.parent = this;\n      this.$root.$emit(\"dataUnitValueClick\", u);\n    },\n    removeArrow(l, to) {\n      if (to) {\n        l.lineCls = l.lineCls.replace(\"arrow-left\", \"\");\n      } else {\n        l.lineCls = l.lineCls.replace(\"arrow-right\", \"\");\n      }\n\n      return l;\n    },\n  },\n};\n</script>\n\n<style lang=\"css\">\n.flex-row {\n  display: flex;\n  /* flex-flow: column wrap; */\n  /* flex-direction: column */\n}\n\n.unit {\n  height: 145px;\n  justify-content: center;\n\n  /* flex-direction: row */\n}\n.tool {\n  height: 100px;\n}\n\n.main-row {\n  /* min-width:280px; */\n  /* border:solid red; */\n  /* margin:0 !important;\n  padding:0; */\n}\n\n.main-container {\n  width: 120px;\n}\n\n/* .step-line {\n  display: table;\n} */\n/* .unit-cell {\n  display: table-cell;\n} */\n.connection-container {\n  position: relative;\n  /* margin-bottom: 50%; */\n}\n\n.connection {\n  /* position: relative; */\n  height: 150px !important;\n  position: absolute;\n  /* border: 1px dotted red; */\n  /* background-color: red; */\n  /* width: 10px;  */\n}\n\n.connection-from-up {\n  /* display:none; */\n  bottom: 20px;\n  margin-bottom: 73px;\n  /* background-color: red; */\n  /* margin-bottom: -2px;\n  margin-top: -36px; */\n}\n\n.connection-from-down {\n  /* background-color: green; */\n  /* margin-bottom: -14px;\n  margin-top: -36px; */\n  /* margin-right: 12px; */\n}\n\n.connection-wrapper {\n  /* height: 146px; */\n  /* display: block; */\n  /* margin-bottom: 50%; */\n  position: relative;\n  margin-left: 12px;\n}\n\n/* right */\n.connection-to-up-right {\n  top: 37px;\n  /* right: 12px; */\n  /* background-color: black; */\n}\n\n.connection-from-up-right {\n  top: 37px;\n}\n\n.connection-to-down-right {\n  bottom: -43px;\n}\n\n.connection-from-down-right {\n  /* background-color: yellow; */\n  bottom: 65px;\n  /* right: 1px; */\n}\n\n/* left */\n.connection-to-up-left {\n  top: 37px;\n  right: -12px;\n}\n\n.connection-to-down-left {\n  bottom: -37px;\n  right: -12px;\n}\n\n.connection-from-up-left {\n  /* background-color: yellow; */\n  top: 38px;\n  right: 0;\n}\n\n.connection-from-down-left {\n  /* background-color: yellow; */\n  bottom: 70px;\n  right: 0;\n}\n\n.arrow-container {\n  /*  */\n  /*  */\n  position: relative;\n  padding: 0 !important;\n  height: 48px !important;\n  margin-top: -7px !important;\n\n  /* justify-content: center; */\n}\n\n.arrow-to.hor.left {\n  margin-left: 6px !important;\n}\n\n/* .arrow-subcontainer {\n  width: 100%;\n\n} */\n.ver-line {\n  margin-left: 6px !important;\n  /* margin-bottom: 10px !important; */\n}\n\n.hor {\n  height: 100%;\n  /* margin-right: -9px; */\n  /* background-color: green; */\n}\n\n.vertical-line-container {\n}\n\n.arrow-from {\n  /* margin-right: 6px; */\n}\n\n.arrow-to {\n  /* margin-left: -6px; */\n}\n\n/* .arrow-to {\n  background-color: red;\n} */\n\n.unit-wrap,\n.on-top {\n  /* z-index: 101; */\n\n  /* position: relative; */\n}\n\n.top-list {\n  z-index: 1002 !important;\n\n  /* position: relative;\n  background-color: white; */\n}\n\n.v-list-item__title {\n  cursor: pointer !important;\n}\n.add-btn {\n  border: 1px solid;\n  padding: 5px 30px;\n  height: 30px;\n  margin-top: -20px;\n}\n.value-btn {\n  /* background-color: white; */\n\n  width: 50px;\n  height: 20px;\n}\n.theme--dark .value-btn {\n  color: white !important;\n}\n.booked .value {\n  /* color: white !important; */\n  padding: 2px;\n  font-weight: bold;\n  color: green;\n  /* text-decoration: underline; */\n  /* background-color: green; */\n}\n\n.close-btn {\n  position: absolute;\n  left: calc(50% + 40px);\n  top: 15px;\n}\n\n.value-label {\n  /* background-color: transparent; */\n  min-height: 4px;\n  position: relative;\n\n  /* display: table-row;\n  text-align: center; */\n}\n\n.value-wrapper {\n  display: table;\n  width: 100%;\n  text-align: center;\n}\n\n.label-child {\n  display: table-cell;\n  text-align: center;\n}\n\n.label-child-btn {\n  display: table-cell;\n  margin-left: -20px;\n}\n\n.label-placeholder {\n  width: 10px;\n}\n\n.value {\n  text-align: center;\n  margin-top: 0px;\n}\n\n.empty-value {\n  height: 28px;\n}\n\n.transparent {\n  background-color: transparent;\n}\n\n.list-item {\n  /* z-index: 1003; */\n  cursor: pointer !important;\n}\n\n.move-plan-unit .v-btn__content {\n  /* width: 100%; */\n  /* padding-top: 10px !important; */\n  max-width: 240px;\n  /* color: transparent; */\n  /* margin: 6px; */\n\n  white-space: normal !important;\n}\n\n.connection-left,\n.connection-right {\n  width: 6px;\n  height: 100%;\n  display: block;\n  display: table-cell;\n}\n\n.connection-left {\n  background-color: blue;\n}\n\n.connection-right {\n  background-color: yellow;\n}\n/* .value-container {\n  width: 100px;\n  text-align: center;\n  margin: 0 auto;\n} */\n@media only screen and (max-width: 600px) {\n  .close-btn {\n    top: -10px;\n  }\n  .connection {\n    /* position: relative; */\n    height: 50px !important;\n    position: absolute;\n    /* border: 1px dotted red; */\n    /* background-color: red; */\n    /* width: 10px;  */\n  }\n  /* .line-horizontal {\n    max-width: 30px;\n  } */\n  .value-btn {\n    /* width: 100px; */\n  }\n  /* .v-avatar {\n    height: 36px !important;\n    width: 36px !important;\n    min-width: 36px !important;\n    max-width: 36px !important;\n  } */\n  .value {\n    text-align: center;\n  }\n  .move-plan {\n    margin: 5px;\n  }\n  .move-plan-unit .v-btn__content {\n    max-width: 90px;\n    max-height: 40px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    vertical-align: bottom;\n    font-size: xx-small;\n    text-transform: initial !important;\n\n    white-space: normal !important;\n  }\n\n  .on-top {\n    z-index: 2;\n    /* position: relative; */\n  }\n}\n\n@media only screen and (min-width: 900px) {\n  .move-plan-unit .v-btn__content {\n    padding-top: 6px;\n    max-width: 150px;\n    max-height: 130px;\n    overflow: hidden;\n    /* background-color: white; */\n    text-overflow: ellipsis;\n    vertical-align: top;\n    line-height: 12px;\n    font-size: 12px;\n    text-transform: initial !important;\n    z-index: 3;\n    white-space: normal !important;\n  }\n\n  .on-top {\n    z-index: 2;\n    /* position: relative; */\n  }\n}\n@media only screen and (max-width: 450px) {\n  .v-avatar {\n    margin: 5px !important;\n  }\n  .main-container {\n    width: 80px;\n  }\n  .value-container .v-btn__content {\n    width: 80px !important;\n    white-space: normal !important;\n\n    display: flex;\n    flex-wrap: wrap;\n  }\n}\n</style>\n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./DataUnit.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./DataUnit.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./DataUnit.vue?vue&type=template&id=7e470334&\"\nimport script from \"./DataUnit.vue?vue&type=script&lang=js&\"\nexport * from \"./DataUnit.vue?vue&type=script&lang=js&\"\nimport style0 from \"./DataUnit.vue?vue&type=style&index=0&lang=css&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports\n\n/* vuetify-loader */\nimport installComponents from \"!../../node_modules/vuetify-loader/lib/runtime/installComponents.js\"\nimport { VBtn } from 'vuetify/lib/components/VBtn';\nimport { VCard } from 'vuetify/lib/components/VCard';\nimport { VCol } from 'vuetify/lib/components/VGrid';\nimport { VIcon } from 'vuetify/lib/components/VIcon';\nimport { VList } from 'vuetify/lib/components/VList';\nimport { VListItem } from 'vuetify/lib/components/VList';\nimport { VListItemTitle } from 'vuetify/lib/components/VList';\nimport { VMenu } from 'vuetify/lib/components/VMenu';\nimport { VRow } from 'vuetify/lib/components/VGrid';\nimport { VSpacer } from 'vuetify/lib/components/VGrid';\ninstallComponents(component, {VBtn,VCard,VCol,VIcon,VList,VListItem,VListItemTitle,VMenu,VRow,VSpacer})\n","import mod from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./DataUnit.vue?vue&type=style&index=0&lang=css&\"; export default mod; export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./DataUnit.vue?vue&type=style&index=0&lang=css&\""],"sourceRoot":""}