Refactoring

src/components/BranchPicker.vue

@@ -1,11 +1,5 @@
 <template>
   <div class="select-branch">
-    <div class="outer-20-b">
-      <a href="#">
-        Cerrar
-        <i class="far fa-times-circle"></i>
-      </a>
-    </div>
     <div class="columns">
       <CompanyList class="column companies is-half"/>
       <StoreList :class="{'is-hidden': showStoreColumn}" class="column branches is-half"/>
@@ -16,7 +10,6 @@
 import { mapGetters } from "vuex";
 import CompanyList from "./CompanyList.vue";
 import StoreList from "./StoreList.vue";
-import LocationList from "./LocationList.vue";
 
 export default {
   name: "BranchPicker",

src/components/CompanyList.vue

@@ -4,13 +4,13 @@
       <div class="icon companies"></div>
       <h4>Empresas</h4>
     </div>
-    <ListItem v-for="company in companiesFromServer" :company="company" :key="company.key"/>
+    <ListCompany v-for="company in companiesFromServer" :company="company" :key="company.emitter.tax_id"/>
   </div>
 </template>
 
 <script>
 import { mapGetters } from "vuex";
-import ListItem from "@/components/ListItem.vue";
+import ListCompany from "@/components/ListCompany.vue";
 
 export default {
   name: "CompanyList",
@@ -21,7 +21,7 @@ export default {
     ...mapGetters(["companiesFromServer"])
   },
   components: {
-    ListItem
+    ListCompany
   }
 };
 </script>

src/components/ListItem.vue → src/components/ListCompany.vue

@@ -2,7 +2,7 @@
   <div class="item company">
     <button
       class="select-item"
-      :class="{ active: company.active }"
+      :class="{ 'active': company.active }"
       @click="handleCompanySelect(company.company_id)"
       v-if="company.status"
     >
@@ -30,13 +30,13 @@
           <div class="d-block">RFC: {{ company.emitter.tax_id }}</div>
         </span>
       </div>
-      <a class="fas fa-question-circle" @click="handleRequest(company.emitter.tax_id)"></a>
+      <a class="fas fa-question-circle" @click="(company.emitter.tax_id)"></a>
     </button>
     <!-- <Request
       :class="{'show': showRequest}"
       v-if="company.emitter.tax_id === requestId"
       :company="company"
-    />-->
+    /> -->
   </div>
 </template>
 <script>

src/components/ListStore.vue

@@ -13,15 +13,11 @@
       <div class="info">
         <span>
           {{company.name}}
-          <div class="popover_wrapper">
-            <i class="fas fa-lock-alt"></i>
-            <div class="push popover_content up">
-              <p class="popover_message">
-                No tienes
-                <strong>permiso</strong> para modificar la información
-              </p>
-            </div>
-          </div>
+             <div class="popover_wrapper"><a class="fg-question-square"></a>
+               <div class="push popover_content up">
+                 <p class="popover_message">No tienes <strong>permiso</strong> para acceder a esta ubicación, solicítalo <a class="requestbranch" href="#">aquí</a>.</p>
+               </div>
+             </div>
           <div class="d-block">RFC: {{ company.branch_id}}</div>
         </span>
       </div>

src/components/__tests__/CompanyList.test.js

@@ -71,7 +71,6 @@ describe("CompanyList", () => {
         }
       }
     ],
-    showRequest: () => false,
     branchList: () => branches,
     showStoreColumn: () => true
   };

src/store.js

@@ -11,15 +11,9 @@ export const mutations = {
   setBranchList: (state, payload) => {
     state.branchList = payload;
   },
-  setLocationList: (state, payload) => {
-    state.locationList = payload;
-  },
   setShowStoreColumn: (state, payload) => {
     state.showStoreColumn = payload;
   },
-  setshowLocationColumn: (state, payload) => {
-    state.showLocationColumn = payload;
-  },
   setRequestId: (state, payload) => {
     state.requestId = payload;
   },
@@ -69,16 +63,11 @@ export const actions = {
       return {
         ...store,
         ...{
-          status: store.branch_id === payload
+          active: store.branch_id === payload
         }
       }
     });
     commit("setBranchList", stores);
-    const locations = state.branchList.filter(location => {
-      return location.branch_id === payload
-    });
-    commit('setLocationList', locations);
-    commit('setshowLocationColumn', !state.showLocationColumn);
   },
   getCompaniesFromServer: ({
     commit
@@ -107,19 +96,15 @@ export const actions = {
 export const state = {
   companiesFromServer: [],
   branchList: [],
-  locationList: [],
   showStoreColumn: true,
-  showLocationColumn: true,
   showRequest: false,
   requestId: "",
 };
 
 export const getters = {
   companiesFromServer: state => state.companiesFromServer,
   branchList: state => state.branchList,
-  locationList: state => state.locationList,
   showStoreColumn: state => state.showStoreColumn,
-  showLocationColumn: state => state.showLocationColumn,
   requestId: state => state.requestId,
   showRequest: state => state.showRequest
 };