{"version":3,"sources":["webpack:///./src/assets/simulation.png","webpack:///./src/assets/product1.jpg","webpack:///./src/assets/energiespeicher.png","webpack:///./src/assets/ITSolution.png","webpack:///./src/views/Products/index.vue","webpack:///./src/views/Products/index.vue?78b7","webpack:///./src/assets/product2.jpg","webpack:///./src/assets/automationsanlage.png","webpack:///./src/assets/konstruktion.png","webpack:///./src/views/Products/index.vue?cdc4"],"names":["module","exports","class","src","alt","style","handlerLeftOnHover","state","isLeftShowDiv","isRightShowDiv","handlerRightOnHover","setup","render","__scopeId"],"mappings":"qGAAAA,EAAOC,QAAU,IAA0B,+B,uBCA3CD,EAAOC,QAAU,IAA0B,6B,uBCA3CD,EAAOC,QAAU,IAA0B,oC,qBCA3CD,EAAOC,QAAU,IAA0B,+B,2RCCpCC,MAAM,2B,GACJA,MAAM,qB,GACJA,MAAM,kB,EACT,eAA+C,OAA1CA,MAAM,SAAQ,0BAAsB,G,GASpCA,MAAM,e,EACT,eAYM,OAZDA,MAAM,YAAU,CACnB,eAGM,OAHDA,MAAM,YAAU,CACnB,eAAyB,YAAnB,gBACN,eAA8D,OAAzDC,IAAA,IAAoCC,IAAI,mBAE/C,eAMM,OANDF,MAAM,YAAU,CACnB,eAA8B,YAAxB,qBACN,eAGE,OAFAC,IAAA,IACAC,IAAI,0B,KAIV,eAaM,OAbDF,MAAM,YAAU,CACnB,eAGM,OAHDA,MAAM,WAAWG,MAAA,gB,CACpB,eAAuB,YAAjB,cACN,eAAuF,OAAlFF,IAAA,IAAkCE,MAAA,yBAA6BD,IAAI,iBAEzE,eAGK,OAHAF,MAAM,gBAAgBG,MAAA,2B,CAC1B,eAA4B,YAAtB,mBACN,eAAoE,OAA/DF,IAAA,IAAuCC,IAAI,sBAElD,eAGM,OAHDF,MAAM,WAAWG,MAAA,iB,CACpB,eAAwB,YAAlB,eACN,eAA2D,OAAtDF,IAAA,IAAkCC,IAAI,oB,MAMhDF,MAAM,sB,GACJA,MAAM,kB,GACJA,MAAM,e,EACT,eAAmD,QAA7CA,MAAM,cAAa,uBAAmB,G,EAC5C,eAA8D,QAAxDA,MAAM,cAAa,kCAA8B,G,EACvD,eAA+C,QAAzCA,MAAM,cAAa,mBAAe,G,EAS1C,eAAwC,OAAnCA,MAAM,SAAQ,mBAAe,G,wEAzDxC,eA4DM,MA5DN,EA4DM,CA3DJ,eAyCM,MAzCN,EAyCM,CAxCJ,eAuCM,MAvCN,EAuCM,CAtCJ,EACA,eAME,OALAA,MAAM,YACNC,IAAA,IACAC,IAAI,yBACH,YAAS,8BAAE,EAAAE,oBAAA,EAAAA,mBAAA,qBACX,WAAQ,8BAAE,EAAAA,oBAAA,EAAAA,mBAAA,sB,wBAGb,eA4BM,MA5BN,EA4BM,CA3BJ,EAaA,G,cAd+B,EAAAC,MAAMC,qBA+B3C,eAgBM,MAhBN,EAgBM,CAfJ,eAcM,MAdN,EAcM,C,eAbJ,eAIM,MAJN,EAIM,CAHJ,EACA,EACA,G,cAH+B,EAAAD,MAAME,kBAKvC,eAME,OALAP,MAAM,YACNC,IAAA,IACAC,IAAI,kBACH,YAAS,8BAAE,EAAAM,qBAAA,EAAAA,oBAAA,qBACX,WAAQ,8BAAE,EAAAA,qBAAA,EAAAA,oBAAA,sB,SAEb,WAQO,GACbC,MADa,WAEX,IAAIJ,EAAQ,eAAS,CACnBC,eAAe,EACfC,gBAAgB,IAGlB,SAASH,IACPC,EAAMC,eAAiBD,EAAMC,cAE/B,SAASE,IACPH,EAAME,gBAAkBF,EAAME,eAGhC,MAAO,CAAEF,QAAOD,qBAAoBI,yB,UC3ExC,EAAOE,OAASA,EAChB,EAAOC,UAAY,kBAEJ,gB,uBCRfb,EAAOC,QAAU,IAA0B,6B,qBCA3CD,EAAOC,QAAU,IAA0B,sC,uBCA3CD,EAAOC,QAAU,IAA0B,iC,2DCA3C","file":"js/chunk-10275393.032312e3.js","sourcesContent":["module.exports = __webpack_public_path__ + \"img/simulation.9f6bc357.png\";","module.exports = __webpack_public_path__ + \"img/product1.5558bd18.jpg\";","module.exports = __webpack_public_path__ + \"img/energiespeicher.92c872ba.png\";","module.exports = __webpack_public_path__ + \"img/ITSolution.797241cf.png\";","<template>\n  <div class=\"products main-container\">\n    <div class=\"product-item left\">\n      <div class=\"item-container\">\n        <div class=\"title\">Engineering Consulting</div>\n        <img\n          class=\"products1\"\n          src=\"../../assets/product1.jpg\"\n          alt=\"Engineering Consulting\"\n          @mouseover=\"handlerLeftOnHover\"\n          @mouseout=\"handlerLeftOnHover\"\n        />\n\n        <div class=\"detail-info\" v-show=\"state.isLeftShowDiv\">\n          <div class=\"info-div\">\n            <div class=\"img-item\">\n              <span>Konstruktion</span>\n              <img src=\"../../assets/konstruktion.png\" alt=\"Konstruktion\" />\n            </div>\n            <div class=\"img-item\">\n              <span>Automationsanlage</span>\n              <img\n                src=\"../../assets/automationsanlage.png\"\n                alt=\"Automationsanlage\"\n              />\n            </div>\n          </div>\n          <div class=\"info-div\">\n            <div class=\"img-item\" style=\"left: 100px;\">\n              <span>Simulation</span>\n              <img src=\"../../assets/simulation.png\" style=\"border-radius: 13px;\" alt=\"Simulation\" />\n            </div>\n             <div class=\"img-item-last\" style=\"top: 35px;left: -17px;\">\n              <span>Energiespeicher</span>\n              <img src=\"../../assets/energiespeicher.png\" alt=\"Energiespeicher\" />\n            </div>\n            <div class=\"img-item\" style=\"right: 150px;\">\n              <span>IT Solution</span>\n              <img src=\"../../assets/ITSolution.png\" alt=\"IT Solution\" />\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div class=\"product-item right\">\n      <div class=\"item-container\">\n        <div class=\"detail-info\" v-show=\"state.isRightShowDiv\">\n          <span class=\"info-title\">Für den Außenhandel</span>\n          <span class=\"info-title\">zwischen Deutschland und China</span>\n          <span class=\"info-title\">sind wir dabei.</span>\n        </div>\n        <img\n          class=\"products2\"\n          src=\"../../assets/product2.jpg\"\n          alt=\"Import & Export\"\n          @mouseover=\"handlerRightOnHover\"\n          @mouseout=\"handlerRightOnHover\"\n        />\n        <div class=\"title\">Import & Export</div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script>\nimport { reactive } from \"vue\";\nexport default {\n  setup() {\n    let state = reactive({\n      isLeftShowDiv: false,\n      isRightShowDiv: false,\n    });\n\n    function handlerLeftOnHover() {\n      state.isLeftShowDiv = !state.isLeftShowDiv;\n    }\n    function handlerRightOnHover() {\n      state.isRightShowDiv = !state.isRightShowDiv;\n    }\n\n    return { state, handlerLeftOnHover, handlerRightOnHover };\n  },\n};\n</script>\n\n<style scoped  lang=\"scss\">\n.page-body {\n    background-image: linear-gradient(to right, #0e0e0e, #5b5757);\n}\n.products {\n  .left {\n    .detail-info {\n      width: 820px;\n      height: 460px;\n      position: absolute;\n      top: 85px;\n      left: -110px;\n      text-align: center;\n      font-size: 14px;\n      font-weight: bold;\n      .info-div {\n        display: flex;\n        align-items: center;\n        justify-content: space-around;\n      }\n    }\n    .img-item,\n    .img-item-last {\n      display: flex;\n      align-items: center;\n      flex-direction: column;\n      position: relative;\n\n      span {\n        color: #fff;\n        margin-bottom: 10px;\n      }\n      img {\n        width: 90px;\n        height: 91px;\n      }\n    }\n    .title {\n      margin-bottom: 30px;\n    }\n  }\n  .right {\n    justify-content: flex-end;\n\n    .detail-info {\n      width: 400px;\n      height: 130px;\n      position: absolute;\n      top: -90px;\n      text-align: center;\n      color: #f4b183;\n      font-size: 20px;\n      font-weight: bold;\n\n      .info-title {\n        display: block;\n      }\n    }\n\n    .title {\n      margin-top: 30px;\n    }\n  }\n  .product-item {\n    height: 200px;\n    display: flex;\n    align-items: center;\n    .item-container {\n      width: 50%;\n      display: flex;\n      align-items: center;\n      flex-direction: column;\n      position: relative;\n\n      .title {\n        font-size: 30px;\n        display: inline-block;\n        width: 60%;\n        text-align: center;\n      }\n\n      .products1,\n      .products2 {\n        display: inline-block;\n        position: relative;\n        width: 200px;\n        border-radius: 50%;\n        cursor: pointer;\n        /* box-shadow: 5px 120px 85px rgba(0, 0, 0, 0.7); */\n        /*考虑浏览器兼容性*/\n        /* -moz-box-shadow: 5px 120px 85px rgba(0, 0, 0, 0.7);\n                    -webkit-box-shadow: 5px 120px 85px rgba(0, 0, 0, 0.7); */\n      }\n    }\n  }\n}\n</style>","import { render } from \"./index.vue?vue&type=template&id=062b6fda&scoped=true\"\nimport script from \"./index.vue?vue&type=script&lang=js\"\nexport * from \"./index.vue?vue&type=script&lang=js\"\n\nimport \"./index.vue?vue&type=style&index=0&id=062b6fda&scoped=true&lang=scss\"\nscript.render = render\nscript.__scopeId = \"data-v-062b6fda\"\n\nexport default script","module.exports = __webpack_public_path__ + \"img/product2.2df42152.jpg\";","module.exports = __webpack_public_path__ + \"img/automationsanlage.5c6fcafa.png\";","module.exports = __webpack_public_path__ + \"img/konstruktion.ad4cf6cf.png\";","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../node_modules/vue-loader-v16/dist/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader-v16/dist/index.js??ref--0-1!./index.vue?vue&type=style&index=0&id=062b6fda&scoped=true&lang=scss\""],"sourceRoot":""}