"Fossies" - the Fresh Open Source Software Archive

Member "nocodb-0.83.5/packages/nc-gui/components/project/tableTabs/aclJs.vue" (27 Nov 2021, 12634 Bytes) of package /linux/misc/nocodb-0.83.5.tar.gz:


As a special service "Fossies" has tried to format the requested source page into HTML format using (guessed) vue.js (beta) source code syntax highlighting (style: standard) with prefixed line numbers. Alternatively you can here view or download the uninterpreted source code file.

    1 <!-- eslint-disable -->
    2 <template>
    3   <div>
    4     <v-card style="">
    5       <v-toolbar flat height="42" class="toolbar-border-bottom">
    6         <v-toolbar-title>
    7           <v-breadcrumbs
    8             :items="[{
    9                        text: nodes.env,
   10                        disabled: true,
   11                        href: '#'
   12                      },{
   13                        text: nodes.dbAlias,
   14                        disabled: true,
   15                        href: '#'
   16                      },
   17                      {
   18                        text: nodes.tn + ' (ACL)',
   19                        disabled: true,
   20                        href: '#'
   21                      }]"
   22             divider=">"
   23             small
   24           >
   25             <template #divider>
   26               <v-icon small color="grey lighten-2">
   27                 forward
   28               </v-icon>
   29             </template>
   30           </v-breadcrumbs>
   31         </v-toolbar-title>
   32         <v-spacer />
   33         <x-btn
   34           v-ge="['acl','reload']"
   35           outlined
   36           tooltip="Reload ACL"
   37           color="primary"
   38           small
   39           @click="aclInit"
   40         >
   41           <v-icon small left>
   42             refresh
   43           </v-icon>
   44           Reload
   45         </x-btn>
   46         <x-btn
   47           v-ge="['acl','open-folder']"
   48           tooltip="Open ACL Folder"
   49           icon="mdi-folder-open"
   50           outlined
   51           small
   52           color="primary"
   53           @click="openFolder"
   54         >
   55           Open Folder
   56         </x-btn>
   57         <x-btn
   58           v-ge="['acl','save']"
   59           outlined
   60           tooltip="Save Changes"
   61           color="primary"
   62           class="primary"
   63           small
   64           :disabled="disableSaveButton"
   65           @click="save"
   66         >
   67           <v-icon small left>
   68             save
   69           </v-icon>
   70           Save
   71         </x-btn>
   72       </v-toolbar>
   73 
   74       <v-text-field
   75         v-model="search"
   76         dense
   77         hide-details
   78         class="ma-2"
   79         :placeholder="`Search ${nodes.tn} routes`"
   80         prepend-inner-icon="search"
   81         outlined
   82       />
   83 
   84       <v-simple-table v-if="data1" dense>
   85         <thead>
   86           <tr>
   87             <th colspan="2" class="text-center" rowspan="3">
   88               <div class="d-flex justify-center">
   89                 <v-tooltip bottom>
   90                   <template #activator="{ on }">
   91                     <v-checkbox
   92                       v-model="allToggle"
   93                       v-ge="['acl','toggle-checkbox']"
   94                       class="mt-1 flex-shrink-1"
   95                       dense
   96                       v-on="on"
   97                     />
   98                   </template>
   99                   <span>{{ allToggle ? 'Disable' : 'Enable' }} all {{ nodes.tn }} routes for all roles</span>
  100                 </v-tooltip>
  101                 <span class="title">{{ nodes.tn }} Routes</span>
  102               </div>
  103             </th>
  104             <th
  105               v-for="role in roles"
  106               :key="role"
  107               :colspan="methods.length"
  108               style="border-left: 1px solid grey;border-bottom: 1px solid grey"
  109             >
  110               <div class="d-flex align-center justify-center">
  111                 <span>{{ role }}</span>
  112               </div>
  113             </th>
  114           </tr>
  115           <tr>
  116             <!--          <th colspan="2"></th>-->
  117             <template v-for="role in roles">
  118               <template v-for="(method,i) in methods">
  119                 <th
  120                   :key="`${method}_${role}`"
  121                   width="25"
  122                   class="caption px-1"
  123                   :style="i ? '' : 'border-left: 1px solid grey'"
  124                 >
  125                   {{ method }}
  126                 </th>
  127               </template>
  128             </template>
  129           </tr>
  130           <tr>
  131             <template v-for="role in roles">
  132               <template v-for="(method,i) in methods">
  133                 <th
  134                   :key="`${method}_${role}`"
  135                   width="25"
  136                   class="caption px-1"
  137                   :style="i ? '' : 'border-left: 1px solid grey'"
  138                 >
  139                   <v-tooltip bottom>
  140                     <template #activator="{ on }">
  141                       <v-checkbox
  142                         v-model="columnToggle[`${method}_${role}`]"
  143                         v-ge="['acl','toggle-checkbox']"
  144                         class="mt-0"
  145                         dense
  146                         v-on="on"
  147                         @change="toggleColumn(role,method,columnToggle[`${method}_${role}`])"
  148                       />
  149                     </template>
  150 
  151                     <span>{{ columnToggle[`${method}_${role}`] ? 'Disable' : 'Enable' }} all {{ method }} routes for {{ role }}</span>
  152                   </v-tooltip>
  153                 </th>
  154               </template>
  155             </template>
  156           </tr>
  157         </thead>
  158         <tbody>
  159           <tr v-for="(route,path) in data1" v-show="!search || path.toLowerCase().indexOf(search.toLowerCase()) > -1" :key="path">
  160             <td width="20" class="px-0">
  161               <v-tooltip bottom>
  162                 <template #activator="{ on }">
  163                   <v-checkbox
  164                     v-model="rowToggle[path]"
  165                     v-ge="['acl','toggle-checkbox']"
  166                     class="mt-0 ml-3"
  167                     dense
  168                     v-on="on"
  169                     @change="toggleRow(path,rowToggle[path])"
  170                   />
  171                 </template>
  172 
  173                 <span>{{ rowToggle[path] ? 'Disable' : 'Enable' }} this route for all roles</span>
  174               </v-tooltip>
  175             </td>
  176             <td class="pl-0">
  177               <v-tooltip bottom>
  178                 <template #activator="{ on }">
  179                   <span v-on="on">{{ path }}</span>
  180                 </template>
  181                 <span>{{ path }}</span>
  182               </v-tooltip>
  183             </td>
  184             <template v-for="role in roles">
  185               <template v-for="(method,i) in methods">
  186                 <td :key="`${path}_${method}_${role}`" :style="i ? '' : 'border-left: 1px solid grey'" class="pa-1">
  187                   <v-checkbox
  188                     v-if="data1[path][method]"
  189                     v-model="data1[path][method][role]"
  190                     v-ge="['acl','toggle-checkbox']"
  191                     class="mt-0"
  192                     dense
  193                     :color="methodColor[method]"
  194                     :input-value="data1[path][method][role]"
  195                     @change="toggleCell(path,method,role,data1[path][method][role])"
  196                   />
  197                   <span
  198                     v-else
  199                     @dblclick="$set(data1[path],method , {})"
  200                   >
  201                     <v-checkbox
  202                       v-ge="['acl','toggle-checkbox']"
  203                       class="mt-0"
  204                       dense
  205                       :disabled="true"
  206                     /></span>
  207                 </td>
  208               </template>
  209             </template>
  210           </tr>
  211         </tbody>
  212       </v-simple-table>
  213 
  214       <v-alert v-else outlined type="info">
  215         Permission file not found
  216       </v-alert>
  217     </v-card>
  218   </div>
  219 </template>
  220 
  221 <script>
  222 import { mapGetters } from 'vuex'
  223 
  224 // const {fs, importFresh,shell,path} = require("electron").remote.require('./libs');
  225 
  226 export default {
  227   name: 'AclJs',
  228 
  229   props: ['nodes'],
  230   data() {
  231     return {
  232       disableSaveButton: true,
  233       search: '',
  234       policyPath: '',
  235       columnToggle: {},
  236       rowToggle: {},
  237       // allToggle: false,
  238       methodColor: {
  239         get: 'green',
  240         post: 'orange',
  241         put: 'deep-orange',
  242         patch: 'pink lighten-1',
  243         delete: 'red darken-3'
  244       },
  245       roles: [
  246         'creator',
  247         'editor',
  248         'guest'
  249       ],
  250       methods: [
  251         'get', 'post', 'put', 'patch', 'delete'
  252       ],
  253       data1: null
  254     }
  255   },
  256   methods: {
  257 
  258     openFolder() {
  259       // shell.openItem(path.dirname(this.policyPath))
  260     },
  261     toggleColumn(role, method, checked) {
  262       for (const [path, methods] of Object.entries(this.data1)) {
  263         if (methods[method]) {
  264           this.$set(methods[method], role, checked)
  265           this.toggleCell(path, method, role, checked)
  266         }
  267       }
  268     },
  269     toggleRow(path, checked) {
  270       for (const [method, roles] of Object.entries(this.data1[path])) {
  271         for (const role in roles) {
  272           this.$set(roles, role, checked)
  273           this.toggleCell(path, method, role, checked)
  274         }
  275       }
  276     },
  277     toggleAll(checked) {
  278       this.disableSaveButton = false
  279       for (const path in this.data1) {
  280         this.rowToggle[path] = checked
  281       }
  282       for (const role of this.roles) {
  283         for (const method of this.methods) {
  284           this.columnToggle[`${method}_${role}`] = checked
  285         }
  286       }
  287 
  288       for (const methods of Object.values(this.data1)) {
  289         for (const method of Object.values(methods)) {
  290           for (const role of this.roles) {
  291             this.$set(method, role, checked)
  292           }
  293         }
  294       }
  295     },
  296     toggleCell(path, method, role, checked) {
  297       this.disableSaveButton = false
  298       this.$set(this.columnToggle, `${method}_${role}`, Object.values(this.data1).some(methods => methods[method] && methods[method][role]))
  299       this.$set(this.rowToggle, path, Object.values(this.data1[path]).some(roles => Object.values(roles).some(v => v)))
  300     },
  301     initColumnCheckBox() {
  302       for (const role of this.roles) {
  303         for (const method of this.methods) {
  304           this.columnToggle[`${method}_${role}`] = Object.values(this.data1).some(methods => methods[method] && methods[method][role])
  305         }
  306       }
  307     },
  308     initRowCheckBox() {
  309       for (const path in this.data1) {
  310         this.rowToggle[path] = Object.values(this.data1[path]).filter(roles => Object.entries(roles).filter(([role, v]) => {
  311           if (!this.roles.includes(role)) { this.roles = [...this.roles, role] }
  312           return v
  313         }).length).length
  314       }
  315     },
  316     async aclInit() {
  317       this.disableSaveButton = true
  318       this.policyPath = await this.sqlMgr.projectGetPolicyPath({
  319         env: this.nodes.env,
  320         dbAlias: this.nodes.dbAlias,
  321         tn: this.nodes.tn
  322       })
  323       try {
  324         console.log(this.policyPath, this.data1)
  325         // this.data1 = JSON.parse(JSON.stringify((await this.sqlMgr.importFresh({path: this.policyPath})).permissions));
  326         this.data1 = JSON.parse(JSON.stringify((await this.$store.dispatch('sqlMgr/ActSqlOp', [null, 'importFresh', { path: this.policyPath }])).permissions))
  327         this.initColumnCheckBox()
  328         this.initRowCheckBox()
  329       } catch (e) {
  330         console.log(e)
  331       }
  332     },
  333     async save() {
  334       try {
  335         // await this.sqlMgr.writeFile({
  336         //   path: this.policyPath,
  337         //   data: `module.exports.permissions = ${JSON.stringify(this.data1, 0, 2)}`
  338         // });
  339 
  340         await this.$store.dispatch('sqlMgr/ActSqlOp', [null, 'writeFile', {
  341           path: this.policyPath,
  342           data: `module.exports.permissions = ${JSON.stringify(this.data1, 0, 2)}`
  343         }])
  344 
  345         this.disableSaveButton = true
  346         this.$toast.success(`${this.policyPath} updated successfully`).goAway(3000)
  347       } catch (e) {
  348         console.log(e)
  349         this.$toast.error(`${this.policyPath} updating failed`).goAway(3000)
  350       }
  351     }
  352   },
  353   computed: {
  354     ...mapGetters({ sqlMgr: 'sqlMgr/sqlMgr' }),
  355     allToggle: {
  356       get() {
  357         return this.data1 && Object.values(this.data1).some(methods => Object.values(methods).some(roles => Object.values(roles).some(v => v)))
  358       },
  359       set(checked) {
  360         this.toggleAll(checked)
  361       }
  362     }
  363   },
  364   watch: {},
  365   async created() {
  366     this.aclInit()
  367   }
  368 }
  369 </script>
  370 
  371 <style scoped>
  372 
  373 </style>
  374 <!--
  375 /**
  376  * @copyright Copyright (c) 2021, Xgene Cloud Ltd
  377  *
  378  * @author Naveen MR <oof1lab@gmail.com>
  379  * @author Pranav C Balan <pranavxc@gmail.com>
  380  *
  381  * @license GNU AGPL version 3 or any later version
  382  *
  383  * This program is free software: you can redistribute it and/or modify
  384  * it under the terms of the GNU Affero General Public License as
  385  * published by the Free Software Foundation, either version 3 of the
  386  * License, or (at your option) any later version.
  387  *
  388  * This program is distributed in the hope that it will be useful,
  389  * but WITHOUT ANY WARRANTY; without even the implied warranty of
  390  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  391  * GNU Affero General Public License for more details.
  392  *
  393  * You should have received a copy of the GNU Affero General Public License
  394  * along with this program. If not, see <http://www.gnu.org/licenses/>.
  395  *
  396  */
  397 -->