{"version":3,"sources":["webpack:///./src/views/Suggestors.vue?5e69","webpack:///./src/views/Suggestors.vue","webpack:///./src/views/Suggestors.vue?625a"],"names":["suggestors","reactive","referred","filters","order","field","asc","search","dateFrom","dateTo","headers","spinner","spinnerStore","navbar","navbarStore","collapsiblePanelOpened","ref","toggleMasterDetail","email","value","changeOrder","orderBy","filterSearch","target","split","onMounted","title","show","push","name","lastname","suggested","candidated","unlocked","position","company","date","hide","__exports__"],"mappings":"kHAAA,W,mlDCgHA,MAAMA,EAAaC,eAAS,IACtBC,EAAWD,eAAS,IAEpBE,EAAUF,eAAS,CACvBG,MAAO,CACLC,MAAO,OACPC,KAAK,GAEPC,OAAQ,GACRC,SAAU,KACVC,OAAQ,OAEJC,EAAU,CAAC,OAAQ,UAAW,QAAS,YAAa,YAAa,aACjEC,EAAUC,iBACVC,EAASC,iBAETC,EAAyBC,iBAAI,IAC7BC,EAAsBC,IACtBH,EAAuBI,QAAUD,EAAOH,EAAuBI,MAAQ,KACtEJ,EAAuBI,MAAQD,GAOhCE,EAAeC,IACflB,EAAQC,MAAMC,OAASgB,EACzBlB,EAAQC,MAAME,KAAOH,EAAQC,MAAME,KAEnCH,EAAQC,MAAMC,MAAQgB,EACtBlB,EAAQC,MAAME,KAAM,IAQlBgB,EAAe,EAAGC,aACtBpB,EAAQI,OAASgB,EAAOJ,MAAQI,EAAOJ,MAAMK,MAAM,KAAO,I,OAG5DC,gBAAU,KACRZ,EAAOa,MAAQ,cACff,EAAQgB,OACR3B,EAAW4B,KAAK,CACdC,KAAM,QACNC,SAAU,QACVZ,MAAO,wBACPa,UAAW,GACXC,WAAY,EACZC,SAAU,IAEZ/B,EAAS0B,KAAK,CACZC,KAAM,QACNC,SAAU,QACVZ,MAAO,wBACPgB,SAAU,MACVC,QAAS,SACTC,KAAM,qBAERzB,EAAQ0B,S,imMCxKV,MAAMC,EAA2B,IAAgB,EAAQ,CAAC,CAAC,YAAY,qBAExD,gB","file":"js/chunk-17bcc884.451fed1b.js","sourcesContent":["export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--9-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--9-oneOf-1-1!../../node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--9-oneOf-1-2!../../node_modules/sass-loader/dist/cjs.js??ref--9-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/index.js??ref--1-1!./Suggestors.vue?vue&type=style&index=0&id=19f23b8b&lang=scss&scoped=true\"","<template>\n  <div class=\"referrals\">\n    <div class=\"filters\">\n      <div class=\"search\">\n        <label for=\"search\">Cerca</label>\n        <input id=\"search\" type=\"text\" name=\"\" placeholder=\"Nome, Utente CVing\" @input=\"filterSearch($event)\">\n      </div>\n\n      <div class=\"date-box\">\n        <label for=\"date-from\">Data inizio</label>\n        <input id=\"date-from\" type=\"date\" @input=\"dateFromChanged($event)\">\n      </div>\n\n      <div class=\"date-box\">\n        <label for=\"date-to\">Data fine</label>\n        <input id=\"date-to\" type=\"date\" @input=\"dateToChanged($event)\">\n      </div>\n\n      <div class=\"lens\">\n        <font-awesome-icon icon=\"magnifying-glass\" class=\"fa-lg\" />\n      </div>\n    </div>\n    <div class=\"table\">\n      <table cellspacing=\"0\">\n        <thead>\n          <tr>\n            <th v-for=\"header of headers\" :key=\"header\" class=\"orderable\" @click=\"changeOrder(header)\">\n              <div class=\"\">\n                <span>{{ header }}</span>\n                <font-awesome-icon v-if=\"filters.order.field == header\" :icon=\"filters.order.asc ? 'arrow-down-a-z' : 'arrow-down-z-a'\" />\n              </div>\n            </th>\n            <th style=\"width: 50px\" />\n          </tr>\n        </thead>\n        <tbody class=\"table-body\">\n          <slot v-for=\"user in suggestors\" :key=\"user.email\">\n            <tr class=\"cursor-pointer\" @click=\"toggleMasterDetail(user.email)\">\n              <td><span>{{ user.name }}</span></td>\n              <td><span>{{ user.lastname }}</span></td>\n              <td><span>{{ user.email }}</span></td>\n              <td><span>{{ user.suggested }}</span></td>\n              <td><span>{{ user.candidated }}</span></td>\n              <td><span>{{ user.unlocked }}</span></td>\n\n              <td class=\"chevron\" style=\"width: 50px\">\n                <svg :class=\"{ rotate: collapsiblePanelOpened === user.email }\" style=\"width: 24px; height: 24px\" viewBox=\"0 0 24 24\">\n                  <path fill=\"currentColor\" d=\"M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z\" />\n                </svg>\n              </td>\n            </tr>\n\n            <tr v-if=\"collapsiblePanelOpened === user.email\" class=\"collapsible-content\">\n              <td colspan=\"7\" class=\"content-inner\" style=\"padding: 0 !important\">\n                <div class=\"table-container\">\n                  <table class=\"content-table history\">\n                    <tr class=\"history-tr-header\">\n                      <th @click=\"changeOrderInside('')\">\n                        <span>Nome suggerito</span>\n                        <font-awesome-icon v-if=\"filters.order.fieldInside == ''\" :icon=\"filters.order.ascInside ? 'arrow-down-1-9' : 'arrow-down-9-1'\" />\n                      </th>\n                      <th @click=\"changeOrderInside('')\">\n                        <span>Cognome suggerito</span>\n                        <font-awesome-icon v-if=\"filters.order.fieldInside == ''\" :icon=\"filters.order.ascInside ? 'arrow-down-1-9' : 'arrow-down-9-1'\" />\n                      </th>\n                      <th @click=\"changeOrderInside('')\">\n                        <span>Email suggerito</span>\n                        <font-awesome-icon v-if=\"filters.order.fieldInside == ''\" :icon=\"filters.order.ascInside ? 'arrow-down-a-z' : 'arrow-down-a-z'\" />\n                      </th>\n                      <th @click=\"changeOrderInside('')\">\n                        <span>Posizione</span>\n                        <font-awesome-icon v-if=\"filters.order.fieldInside == ''\" :icon=\"filters.order.ascInside ? 'arrow-down-1-9' : 'arrow-down-9-1'\" />\n                      </th>\n                      <th @click=\"changeOrderInside('')\">\n                        <span>Azienda</span>\n                        <font-awesome-icon v-if=\"filters.order.fieldInside == ''\" :icon=\"filters.order.ascInside ? 'arrow-down-a-z' : 'arrow-down-z-a'\" />\n                      </th>\n                      <th @click=\"changeOrderInside('')\">\n                        <span>Data e ora suggerimento</span>\n                        <font-awesome-icon v-if=\"filters.order.fieldInside == ''\" :icon=\"filters.order.ascInside ? 'arrow-down-a-z' : 'arrow-down-z-a'\" />\n                      </th>\n                    </tr>\n                    <tr\n                      v-for=\"r in referred\"\n                      :key=\"r.email\"\n                      class=\"history-tr-content\"\n                    >\n                      <td><span>{{ r.name }}</span></td>\n                      <td><span>{{ r.lastname }}</span></td>\n                      <td><span>{{ r.email }}</span></td>\n                      <td><span>{{ r.position }}</span></td>\n                      <td><span>{{ r.company }}</span></td>\n                      <td><span>{{ r.date }}</span></td>\n                    </tr>\n                  </table>\n                </div>\n              </td>\n            </tr>\n          </slot>\n        </tbody>\n      </table>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { spinnerStore } from '@/stores/spinner'\nimport { navbarStore } from '@/stores/navbar'\nimport { reactive } from '@vue/reactivity'\nimport { onMounted } from '@vue/runtime-core'\nimport { ref } from 'vue'\n\nconst suggestors = reactive([])\nconst referred = reactive([])\n\nconst filters = reactive({\n  order: {\n    field: 'Data',\n    asc: false\n  },\n  search: [],\n  dateFrom: null,\n  dateTo: null\n})\nconst headers = ['Nome', 'Cognome', 'Email', 'Suggeriti', 'Candidati', 'Sbloccati']\nconst spinner = spinnerStore()\nconst navbar = navbarStore()\n\nconst collapsiblePanelOpened = ref('')\nconst toggleMasterDetail = (email) => {\n  if (collapsiblePanelOpened.value === email) collapsiblePanelOpened.value = null\n  else collapsiblePanelOpened.value = email\n}\n\n/**\n * Set the order condition for the table\n * @param {number} orderBy - the column to order by\n */\nconst changeOrder = (orderBy) => {\n  if (filters.order.field == orderBy) {\n    filters.order.asc = !filters.order.asc\n  } else {\n    filters.order.field = orderBy\n    filters.order.asc = true\n  }\n}\n\n/**\n\t\t * manage the search input\n\t\t * @param {Event} event - the oninput input event\n\t\t */\nconst filterSearch = ({ target }) => {\n  filters.search = target.value ? target.value.split(' ') : []\n}\n\nonMounted(() => {\n  navbar.title = 'Suggeritori'\n  spinner.show()\n  suggestors.push({\n    name: 'Mario',\n    lastname: 'Rossi',\n    email: 'mario.rossi@gmail.com',\n    suggested: 12,\n    candidated: 5,\n    unlocked: 3\n  })\n  referred.push({\n    name: 'Marco',\n    lastname: 'Rossi',\n    email: 'marco.rossi@gmail.com',\n    position: 'CEO',\n    company: 'Google',\n    date: '12/12/2020 12:12'\n  })\n  spinner.hide()\n})\n</script>\n\n<style lang=\"scss\" scoped>\n@use '../assets/scss/referrals';\n@use '../assets/scss/table';\n.referrals table thead,\n.referrals table thead tr:first-child,\n.referrals table thead tr:first-child th{\n  border-bottom-left-radius: 0px!important;\n  border-bottom-right-radius: 0px!important;\n}\n.referrals table tr th:first-child,\n.referrals table .table-body tr td:first-child{\n  padding-left:1.5rem!important;\n}\n.text-xs{\n  font-size:13px;\n  margin-top:4px;\n}\n\ntable {\n  th {\n    &:nth-child(1) {\n      width: 100px;\n    }\n  }\n\n  td.chevron svg {\n\ttransform: rotate(0deg);\n\ttransition: all 50ms ease-in;\n\t&.rotate {\n\t\ttransform: rotate(90deg);\n\t\ttransition: all 100ms ease-in;\n\t}\n}\n}\n\n.collapsible-content {\n\tmax-height: 0px;\n\toverflow: hidden;\n\ttransition: max-height 0.25s ease-in-out;\n}\n\n.toggle:checked + .lbl-toggle + .collapsible-content {\n\tmax-height: 100vh;\n}\n\n.table-container {\n\tborder-radius: 5px;\n\tmargin: 10px 50px 55px 50px;\n\tbox-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);\n\toverflow: hidden;\n}\n\n.collapsible-content .content-inner {\n\tborder-bottom: 1px solid #00dbc350;\n\tborder-top: 1px solid #00dbc350;\n\tpadding: 0.5rem 1rem;\n}\n\n.content-table {\n\tborder-radius: 5px;\n\tmargin: 1px;\n\tbackground: #1a73a347;\n\ttr:first-child {\n\t\tbackground: #1a74a3;\n\t}\n\ttr th:first-child,\n\ttr td:first-child {\n\t\ttext-align: left;\n\t\t//width: 20%;\n\t\t// max-width: 20%;\n\t\tpadding-left: 30px;\n\t}\n\ttr th,\n\ttr td {\n\t\ttext-align: center;\n\t\tpadding-left: 30px;\n\t\twidth: calc(100% / 5);\n\t\tmax-width: calc(100% / 5);\n\t\t// border:1px solid #dc3545;\n\t}\n\t.badge-euro {\n\t\tdisplay: inline-block;\n\t\tborder: 1px solid #1f88c1;\n\t\tbackground-color: #0cced2c2;\n\t\t// background: transparent;\n\t\tcolor: white;\n\t\tmin-width: 35px;\n\t\theight: 35px;\n\t\tborder-radius: 35px;\n\t\ttext-align: center;\n\t\tline-height: 35px;\n\t\tmargin: 0 5px;\n\t\tfont-weight: 600;\n\t\tpadding: 0 10px;\n\t}\n\t.badge-payment {\n\t\tdisplay: inline-block;\n\t\tborder: 1px solid #db5832;\n\t\tbackground: transparent;\n\t\t//background-image: linear-gradient(to right, transparent, #db583235, #db583245, #db583248, #db583245, #db583235, transparent);\n\t\tcolor: white;\n\t\tmin-width: 35px;\n\t\theight: 35px;\n\t\tborder-radius: 5px;\n\t\ttext-align: center;\n\t\tline-height: 35px;\n\t\tmargin: 0 5px;\n\t\tfont-weight: 600;\n\t\tpadding: 0 10px;\n\t\ttext-transform: uppercase;\n\t\tline-height: 35px;\n\t\tfont-size: 12px;\n\t\t&.paid {\n\t\t\tborder: 1px solid #1f88c1;\n\t\t\t//background: #8dbc68;\n\t\t\tbackground: transparent;\n\t\t\t//background-image: linear-gradient(to right, transparent, #1f88c135, #1f88c145, #1f88c148, #1f88c145, #1f88c135, transparent);\n\t\t}\n\t}\n}\n</style>\n","import script from \"./Suggestors.vue?vue&type=script&setup=true&lang=js\"\nexport * from \"./Suggestors.vue?vue&type=script&setup=true&lang=js\"\n\nimport \"./Suggestors.vue?vue&type=style&index=0&id=19f23b8b&lang=scss&scoped=true\"\n\nimport exportComponent from \"/usr/src/app/node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['__scopeId',\"data-v-19f23b8b\"]])\n\nexport default __exports__"],"sourceRoot":""}