{"version":3,"sources":["webpack:///./src/views/components/SagLayoutMachinesDemo.vue?836c","webpack:///./src/views/components/SagLayoutMachinesDemo.vue?46e1","webpack:///./src/components/basic/SagLayoutMachines.vue?9f5f","webpack:///src/components/basic/SagLayoutMachines.vue","webpack:///./src/components/basic/SagLayoutMachines.vue?9906","webpack:///./src/components/basic/SagLayoutMachines.vue","webpack:///src/views/components/SagLayoutMachinesDemo.vue","webpack:///./src/views/components/SagLayoutMachinesDemo.vue?d413","webpack:///./src/views/components/SagLayoutMachinesDemo.vue","webpack:///./src/components/basic/SagLayoutMachines.vue?7c38"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","attrs","demoData","layoutPath","machines","staticRenderFns","_l","machine","key","machineCode","style","left","top","class","status","_v","_s","demand","production","runtime","wip","name","props","type","String","required","Array","validator","value","every","component","components","SagLayoutMachines","data","x","y"],"mappings":"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","file":"js/chunk-1c4a29b2.0bd4ccf3.js","sourcesContent":["export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./SagLayoutMachinesDemo.vue?vue&type=style&index=0&id=44c57972&scoped=true&lang=css&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"demo-container\"},[_c('b-card',{attrs:{\"title\":\"機台布局展示\"}},[_c('div',{staticClass:\"layout-demo\"},[_c('sag-layout-machines',{attrs:{\"layout-path\":_vm.demoData.layoutPath,\"machines\":_vm.demoData.machines}})],1)])],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"layout-container\"},[_c('img',{staticClass:\"layout-image\",attrs:{\"src\":_vm.layoutPath,\"alt\":\"Layout Background\"}}),_vm._l((_vm.machines),function(machine){return _c('div',{key:machine.machineCode,staticClass:\"machine-container\",style:({ left: ((machine.x) + \"px\"), top: ((machine.y) + \"px\") })},[_c('div',{staticClass:\"machine-icon\",class:machine.status},[_c('i',{staticClass:\"fas fa-industry\"})]),_c('div',{staticClass:\"machine-info\"},[_c('table',[_c('tr',[_c('td',{staticClass:\"machine-code\",attrs:{\"colspan\":\"2\"}},[_vm._v(_vm._s(machine.machineCode))])]),_c('tr',[_c('td',[_vm._v(\"需求數\")]),_c('td',{staticClass:\"value\"},[_vm._v(_vm._s(machine.demand))])]),_c('tr',[_c('td',[_vm._v(\"生產數\")]),_c('td',{staticClass:\"value\"},[_vm._v(_vm._s(machine.production))])]),_c('tr',[_c('td',[_vm._v(\"運行時間\")]),_c('td',{staticClass:\"value\"},[_vm._v(_vm._s(machine.runtime)+\"分\")])]),_c('tr',[_c('td',[_vm._v(\"WIP\")]),_c('td',{staticClass:\"value\"},[_vm._v(_vm._s(machine.wip))])])])])])})],2)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <div class=\"layout-container\">\r\n    <!-- Layout background image -->\r\n    <img :src=\"layoutPath\" class=\"layout-image\" alt=\"Layout Background\">\r\n    \r\n    <!-- Machine icons and info -->\r\n    <div \r\n      v-for=\"machine in machines\" \r\n      :key=\"machine.machineCode\"\r\n      class=\"machine-container\"\r\n      :style=\"{ left: `${machine.x}px`, top: `${machine.y}px` }\"\r\n    >\r\n      <!-- Machine icon -->\r\n      <div class=\"machine-icon\" :class=\"machine.status\">\r\n        <i class=\"fas fa-industry\"></i>\r\n      </div>\r\n      \r\n      <!-- Machine info table -->\r\n      <div class=\"machine-info\">\r\n        <table>\r\n          <tr>\r\n            <td colspan=\"2\" class=\"machine-code\">{{ machine.machineCode }}</td>\r\n          </tr>\r\n          <tr>\r\n            <td>需求數</td>\r\n            <td class=\"value\">{{ machine.demand }}</td>\r\n          </tr>\r\n          <tr>\r\n            <td>生產數</td>\r\n            <td class=\"value\">{{ machine.production }}</td>\r\n          </tr>\r\n          <tr>\r\n            <td>運行時間</td>\r\n            <td class=\"value\">{{ machine.runtime }}分</td>\r\n          </tr>\r\n          <tr>\r\n            <td>WIP</td>\r\n            <td class=\"value\">{{ machine.wip }}</td>\r\n          </tr>\r\n        </table>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n  name: 'SagLayoutMachines',\r\n  \r\n  props: {\r\n    layoutPath: {\r\n      type: String,\r\n      required: true\r\n    },\r\n    machines: {\r\n      type: Array,\r\n      required: true,\r\n      validator: function(value) {\r\n        return value.every(machine => \r\n          machine.machineCode &&\r\n          typeof machine.x === 'number' &&\r\n          typeof machine.y === 'number' &&\r\n          ['red', 'yellow', 'green'].includes(machine.status) &&\r\n          typeof machine.demand === 'number' &&\r\n          typeof machine.production === 'number' &&\r\n          typeof machine.runtime === 'number' &&\r\n          typeof machine.wip === 'number'\r\n        )\r\n      }\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style scoped>\r\n.layout-container {\r\n  position: relative;\r\n  width: 100%;\r\n  height: 100%;\r\n}\r\n\r\n.layout-image {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: contain;\r\n}\r\n\r\n.machine-container {\r\n  position: absolute;\r\n  transform: translate(-50%, -50%);\r\n  display: flex;\r\n  align-items: flex-start;\r\n  gap: 6px;\r\n  z-index: 1;\r\n}\r\n\r\n.machine-icon {\r\n  width: 32px;\r\n  height: 32px;\r\n  border-radius: 50%;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: white;\r\n  font-size: 16px;\r\n  box-shadow: 0 2px 4px rgba(0,0,0,0.2);\r\n}\r\n\r\n.machine-icon.red {\r\n  background-color: #FF4444;\r\n}\r\n\r\n.machine-icon.yellow {\r\n  background-color: #FFBB33;\r\n}\r\n\r\n.machine-icon.green {\r\n  background-color: #00C851;\r\n}\r\n\r\n.machine-info {\r\n  background: white;\r\n  border: 1px solid #ddd;\r\n  border-radius: 4px;\r\n  padding: 4px;\r\n  box-shadow: 0 2px 4px rgba(0,0,0,0.1);\r\n  font-size: 13px;\r\n}\r\n\r\n.machine-info table {\r\n  border-collapse: collapse;\r\n  width: 100%;\r\n}\r\n\r\n.machine-info td {\r\n  padding: 2px 6px;\r\n  border: 1px solid #eee;\r\n  white-space: nowrap;\r\n}\r\n\r\n.machine-code {\r\n  font-weight: bold;\r\n  text-align: center;\r\n  background-color: #f5f5f5;\r\n  font-size: 14px;\r\n  padding: 4px !important;\r\n}\r\n\r\n.value {\r\n  text-align: right;\r\n  min-width: 50px;\r\n}\r\n</style>\r\n","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./SagLayoutMachines.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./SagLayoutMachines.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./SagLayoutMachines.vue?vue&type=template&id=7ea6a95b&scoped=true&\"\nimport script from \"./SagLayoutMachines.vue?vue&type=script&lang=js&\"\nexport * from \"./SagLayoutMachines.vue?vue&type=script&lang=js&\"\nimport style0 from \"./SagLayoutMachines.vue?vue&type=style&index=0&id=7ea6a95b&scoped=true&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  \"7ea6a95b\",\n  null\n  \n)\n\nexport default component.exports","<template>\r\n  <div class=\"demo-container\">\r\n    <b-card title=\"機台布局展示\">\r\n      <div class=\"layout-demo\">\r\n        <sag-layout-machines\r\n          :layout-path=\"demoData.layoutPath\"\r\n          :machines=\"demoData.machines\"\r\n        />\r\n      </div>\r\n    </b-card>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport SagLayoutMachines from '@/components/basic/SagLayoutMachines.vue'\r\n\r\nexport default {\r\n  name: 'SagLayoutMachinesDemo',\r\n  \r\n  components: {\r\n    SagLayoutMachines,\r\n  },\r\n  \r\n  data: () => ({\r\n    demoData: {\r\n      layoutPath: '/images/demo-layout.svg',\r\n      machines: [\r\n        {\r\n          machineCode: 'M001',\r\n          x: 300,\r\n          y: 250,\r\n          status: 'green',\r\n          demand: 500,\r\n          production: 450,\r\n          runtime: 120,\r\n          wip: 50,\r\n        },\r\n        {\r\n          machineCode: 'M002',\r\n          x: 500,\r\n          y: 250,\r\n          status: 'yellow',\r\n          demand: 300,\r\n          production: 200,\r\n          runtime: 90,\r\n          wip: 100,\r\n        },\r\n        {\r\n          machineCode: 'M003',\r\n          x: 700,\r\n          y: 250,\r\n          status: 'red',\r\n          demand: 800,\r\n          production: 600,\r\n          runtime: 180,\r\n          wip: 200,\r\n        },\r\n        {\r\n          machineCode: 'M004',\r\n          x: 300,\r\n          y: 500,\r\n          status: 'green',\r\n          demand: 400,\r\n          production: 380,\r\n          runtime: 150,\r\n          wip: 20,\r\n        },\r\n        {\r\n          machineCode: 'M005',\r\n          x: 500,\r\n          y: 500,\r\n          status: 'green',\r\n          demand: 600,\r\n          production: 590,\r\n          runtime: 200,\r\n          wip: 10,\r\n        },\r\n        {\r\n          machineCode: 'M006',\r\n          x: 700,\r\n          y: 500,\r\n          status: 'yellow',\r\n          demand: 350,\r\n          production: 200,\r\n          runtime: 60,\r\n          wip: 150,\r\n        },\r\n      ],\r\n    },\r\n  }),\r\n}\r\n</script>\r\n\r\n<style scoped>\r\n.demo-container {\r\n  padding: 20px;\r\n}\r\n\r\n.layout-demo {\r\n  width: 1000px;\r\n  height: 800px;\r\n  border: 1px solid #ddd;\r\n  margin: 0 auto;\r\n  background: white;\r\n}\r\n</style>\r\n","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./SagLayoutMachinesDemo.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./SagLayoutMachinesDemo.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./SagLayoutMachinesDemo.vue?vue&type=template&id=44c57972&scoped=true&\"\nimport script from \"./SagLayoutMachinesDemo.vue?vue&type=script&lang=js&\"\nexport * from \"./SagLayoutMachinesDemo.vue?vue&type=script&lang=js&\"\nimport style0 from \"./SagLayoutMachinesDemo.vue?vue&type=style&index=0&id=44c57972&scoped=true&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  \"44c57972\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./SagLayoutMachines.vue?vue&type=style&index=0&id=7ea6a95b&scoped=true&lang=css&\""],"sourceRoot":""}