w-web-perm 1.0.0

package/src/components/LayoutContentUsers.vue

@@ -0,0 +1,493 @@
+<template>
+    <div
+        style="height:100%;"
+        v-domresize
+        @domresize="resizePanel"
+        :changeUsers="changeUsers"
+    >
+
+        <div
+            style="border-bottom:1px solid #ddd;"
+            v-domresize
+            @domresize="resizeHead"
+        >
+
+            <!-- 標題區 -->
+            <div style="padding:30px 25px 0px 20px; background:#fff;">
+                <div style="padding:5px 15px 5px 5px; display:inline-block; border-bottom:3px solid #FF9100;">
+                    <div style="display:flex; align-items:center;">
+
+                        <WIcon
+                            :icon="mdiAccountGroupOutline"
+                            :color="'#FF9800'"
+                        ></WIcon>
+
+                        <div style="padding-left:10px; font-size:1.3rem; color:#d3912c;">
+                            使用者權限
+                        </div>
+
+                    </div>
+                </div>
+            </div>
+
+            <!-- 編輯設定區 -->
+            <div style="background:#fff;">
+
+                <div style="padding:20px 20px 15px 20px; background:#fff;">
+
+                    <div style="display:flex;">
+                        <WSwitch
+                            :text="'是否編輯'"
+                            :checkedSwitchCircleColor="'#D81B60'"
+                            :checkedSwitchCircleColorHover="'#f26'"
+                            :checkedSwitchBarColor="'#F8BBD0'"
+                            :checkedSwitchBarColorHover="'#F8BBD0'"
+                            v-model="isOperatable"
+                        ></WSwitch>
+                    </div>
+
+                    <div style="padding-top:5px; font-size:0.8rem; _color:#f26;" v-if="isOperatable">
+                        <div style="padding:3px 0px;">
+                            1. 請依照使用者身份給予適合之權限群組。
+                        </div>
+                        <div style="padding:3px 0px;">
+                            2. 請確認新增使用者為核可之使用者。
+                        </div>
+                    </div>
+
+                </div>
+
+                <div
+                    style="padding:10px 10px 12px 10px; border-top:1px solid #F48FB1; border-bottom:1px solid #F48FB1; background:#FCE4EC; display:flex; align-items:center; justify-content:flex-end;"
+                    v-if="isModified"
+                >
+
+                    <WButtonChip
+                        :paddingStyle="{v:0,h:11}"
+                        :text="'儲存變更'"
+                        :icon="mdiCloudUploadOutline"
+                        :backgroundColor="'rgba(255,0,50,0.7)'"
+                        :backgroundColorHover="'rgba(255,0,50,0.8)'"
+                        :textColor="'#eee'"
+                        :textColorHover="'#fff'"
+                        :iconColor="'#eee'"
+                        :iconColorHover="'#fff'"
+                        @click="saveGroups"
+                    ></WButtonChip>
+
+                </div>
+
+            </div>
+
+        </div>
+
+        <div :style="`padding:${spacePading}px;`" v-if="!firstLoading">
+
+            <div style="background:#fff; box-shadow:0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);">
+
+                <div
+                    style="padding:20px; display:flex; align-items:center; border-bottom:3px solid #ddd;"
+                    v-domresize
+                    @domresize="resizeGroupInfor"
+                >
+
+                    <div style="color:#666; font-size:1.1rem;">
+                        使用者分類清單
+                    </div>
+
+                    <template v-if="isOperatable">
+
+                        <div style="padding-left:10px;"></div>
+
+                        <WButtonChip
+                            :paddingStyle="{v:0,h:11}"
+                            :text="'新增使用者'"
+                            :icon="mdiAccountPlusOutline"
+                            :backgroundColor="'rgba(255,0,50,0.7)'"
+                            :backgroundColorHover="'rgba(255,0,50,0.8)'"
+                            :textColor="'#eee'"
+                            :textColorHover="'#fff'"
+                            :iconColor="'#eee'"
+                            :iconColorHover="'#fff'"
+                            @click="clickAddUser"
+                        ></WButtonChip>
+
+                    </template>
+
+                </div>
+
+                <WPanelScrolly
+                    :style="`height:${usersGroupsHeight}px; _overflow-y:auto;`"
+                >
+                    <div style="padding:10px;">
+
+                        <div
+                            style="padding:10px;"
+                            :key="'kus:'+kus"
+                            v-for="(us,kus) in usersGroups"
+                        >
+
+                            <div style="padding-bottom:5px; display:flex; align-items:center; border-bottom:1px dashed #ddd;">
+                                <div style="padding-right:5px; color:#888; font-size:0.8rem;">
+                                    來源:
+                                </div>
+                                <div style="color:#000; font-size:0.8rem;">
+                                    {{getFrom(kus)}}
+                                </div>
+                            </div>
+
+                            <div style="padding-top:10px;">
+
+                                <div
+                                    style="display:inline-block; margin:0px 10px 10px 0px;"
+                                    :key="'ku:'+ku"
+                                    v-for="(u,ku) in us"
+                                >
+
+                                    <WButtonChip
+                                        :text="u.name"
+                                        :paddingStyle="{
+                                            v: u.isVirtual!=='y' ? 2 : 4,
+                                            h: 12,
+                                        }"
+                                        :icon="getIsAdmin(u)?mdiChessRook:''"
+                                        :backgroundColor="getIsNotActive(u)?'rgba(130,130,130,0.8)':getIsAdmin(u)?'rgba(216, 27, 96, 0.8)':'rgba(50,110,230,0.8)'"
+                                        :backgroundColorHover="getIsNotActive(u)?'rgba(130,130,130,0.9)':getIsAdmin(u)?'rgba(216, 27, 96, 0.9)':'rgba(50,110,230,0.9)'"
+                                        :textColor="'#eee'"
+                                        :textColorHover="'#fff'"
+                                        :iconColor="'#eee'"
+                                        :iconColorHover="'#fff'"
+                                        :close="isOperatable?(u.isVirtual!=='y'):false"
+                                        @click="clickEditUser(u)"
+                                        @click-close="clickRemoveUser(u)"
+                                    ></WButtonChip>
+
+                                </div>
+
+                            </div>
+
+                        </div>
+
+                    </div>
+                </WPanelScrolly>
+
+            </div>
+
+        </div>
+
+        <div style="padding:10px 15px; font-size:0.8rem;" v-else>
+            載入中...
+        </div>
+
+    </div>
+</template>
+
+<script>
+import { mdiAccountGroupOutline, mdiAccountPlusOutline, mdiCheckboxMarkedCircle, mdiChessRook } from '@mdi/js/mdi.js'
+import get from 'lodash/get'
+import each from 'lodash/each'
+import keys from 'lodash/keys'
+import sortBy from 'lodash/sortBy'
+import find from 'lodash/find'
+import size from 'lodash/size'
+import groupBy from 'lodash/groupBy'
+import genID from 'wsemi/src/genID.mjs'
+import isestr from 'wsemi/src/isestr.mjs'
+import iseobj from 'wsemi/src/iseobj.mjs'
+import waitFun from 'wsemi/src/waitFun.mjs'
+import WIcon from 'w-component-vue/src/components/WIcon.vue'
+import WButtonChip from 'w-component-vue/src/components/WButtonChip.vue'
+import WSwitch from 'w-component-vue/src/components/WSwitch.vue'
+import WPanelScrolly from 'w-component-vue/src/components/WPanelScrolly.vue'
+
+
+export default {
+    components: {
+        WIcon,
+        WButtonChip,
+        WSwitch,
+        WPanelScrolly,
+    },
+    props: {
+    },
+    data: function() {
+        return {
+            mdiAccountGroupOutline,
+            mdiAccountPlusOutline,
+            mdiCheckboxMarkedCircle,
+            mdiChessRook,
+
+            panelWidth: 100,
+            panelHeight: 100,
+            headHeight: 100,
+            groupInforHeight: 100,
+
+            firstLoading: true,
+            isOperatable: false,
+            isModified: false,
+
+            pickGroupId: '',
+
+        }
+    },
+    computed: {
+
+        users: function() {
+            return get(this, `$store.state.users`)
+        },
+
+        usersGroups: function() {
+            let gs = groupBy(this.users, 'from')
+            let ks = keys(gs)
+            ks = sortBy(ks)
+            let gsTemp = {}
+            each(ks, (k) => {
+                gsTemp[k] = gs[k]
+            })
+            gs = gsTemp
+            return gs
+        },
+
+        changeUsers: function() {
+            // console.log('computed changeUsers')
+
+            let vo = this
+
+            //check
+            if (size(vo.users) === 0) {
+                return ''
+            }
+
+            //firstLoading
+            vo.firstLoading = false
+
+            return ''
+        },
+
+        spacePading: function() {
+            let vo = this
+            if (vo.panelWidth < 400) {
+                return 0
+            }
+            else if (vo.panelWidth < 800) {
+                return 10
+            }
+            return 20
+        },
+
+        usersGroupsHeight: function() {
+            let vo = this
+
+            //h
+            let h = vo.panelHeight - vo.headHeight - 2 * vo.spacePading - vo.groupInforHeight
+            h = Math.max(h, 0)
+
+            return h
+        },
+
+    },
+    methods: {
+
+        resizePanel: function(msg) {
+            // console.log('methods resizePanel', msg)
+
+            let vo = this
+
+            //panelWidth, panelHeight
+            vo.panelWidth = msg.snew.offsetWidth
+            vo.panelHeight = msg.snew.offsetHeight
+
+        },
+
+        resizeHead: function(msg) {
+            // console.log('methods resizeHead', msg)
+
+            let vo = this
+
+            //headHeight
+            vo.headHeight = msg.snew.offsetHeight
+
+        },
+
+        resizeGroupInfor: function(msg) {
+            // console.log('methods resizeGroupInfor', msg)
+
+            let vo = this
+
+            //groupInforHeight
+            vo.groupInforHeight = msg.snew.offsetHeight
+
+        },
+
+        getFrom: function(kus) {
+            // console.log('methods getFrom', kus)
+            if (!isestr(kus)) {
+                kus = '無'
+            }
+            return kus
+        },
+
+        getIsAdmin: function(u) {
+            return get(u, 'isAdmin') === 'y'
+        },
+
+        getIsNotActive: function(u) {
+            return get(u, 'isActive') === 'n'
+        },
+
+        clickAddUser: function() {
+            // console.log('methods clickAddUser')
+
+            let vo = this
+
+            async function core() {
+                let errTemp = null
+
+                //show loading
+                vo.$ui.updateLoading(true)
+
+                //u
+                let u = {
+                    id: genID(),
+                    name: '新使用者',
+                    from: '',
+                    isVirtual: 'n', //新增使用者代表為權限使用者, 故非虛擬使用者
+                    isAdmin: 'n',
+                    isActive: 'y',
+                }
+
+                //save
+                await vo.$fapi.users.insert(u)
+                    .catch((err) => {
+                        errTemp = err
+                    })
+
+                //check
+                if (errTemp !== null) {
+                    vo.$alert(`新增權限群組失敗: ${errTemp}`, { type: 'error' })
+                }
+
+                //un
+                let un = null
+                await waitFun(() => {
+                    un = find(vo.users, { id: u.id })
+                    return iseobj(un) //確認g.id已存在
+                })
+                // console.log('un', un)
+
+                //showVeUser
+                vo.$dg.showVeUser(un)
+                    .catch(() => {})
+
+                //alert
+                vo.$alert(`新增使用者成功`)
+
+            }
+
+            //core
+            core()
+                // .then((res) => {
+                //     console.log('then', res)
+                // })
+                .catch((err) => {
+                    console.log('catch', err)
+                    vo.$alert(`發生非預期錯誤，請洽管理員`, { type: 'error' })
+                })
+                .finally(() => {
+
+                    //hide loading
+                    vo.$ui.updateLoading(false)
+
+                })
+
+        },
+
+        clickRemoveUser: function(u) {
+            // console.log('methods clickRemoveUser', u)
+
+            let vo = this
+
+            async function core() {
+                let errTemp = null
+
+                //showCheckYesNo
+                let bExit = false
+                await vo.$dg.showCheckYesNo(`確認是否刪除使用者「${u.name}」?`)
+                    .catch(() => {
+                        bExit = true
+                    })
+                if (bExit) {
+                    return
+                }
+
+                //show loading
+                vo.$ui.updateLoading(true)
+
+                //save
+                await vo.$fapi.users.del(u)
+                    .catch((err) => {
+                        errTemp = err
+                    })
+
+                //check
+                if (errTemp !== null) {
+                    vo.$alert(`刪除使用者失敗: ${errTemp}`, { type: 'error' })
+                    return
+                }
+
+                //un
+                let un = null
+                await waitFun(() => {
+                    un = find(vo.users, (v) => {
+                        return v.id === u.id && v.isVirtual !== 'y' //找到id, 且不能為虛擬使用者, 才能代表已刪除
+                    })
+                    return !iseobj(un) //確認g.id已不存在
+                })
+                // console.log('un', un)
+
+                //alert
+                vo.$alert(`刪除使用者成功`)
+
+            }
+
+            //core
+            core()
+                // .then((res) => {
+                //     console.log('then', res)
+                // })
+                .catch((err) => {
+                    console.log('catch', err)
+                    vo.$alert(`發生非預期錯誤，請洽管理員`, { type: 'error' })
+                })
+                .finally(() => {
+
+                    //hide loading
+                    vo.$ui.updateLoading(false)
+
+                })
+
+        },
+
+        clickEditUser: function(u) {
+            // console.log('clickEditGroup', u)
+
+            let vo = this
+
+            //check
+            if (!vo.isOperatable) {
+                vo.$alert(`非編輯模式無法查閱使用者詳細資訊`, { type: 'error' })
+                return
+            }
+
+            //showVeUser
+            vo.$dg.showVeUser(u)
+                .catch(() => {})
+
+        },
+
+    }
+}
+</script>
+
+<style scoped>
+</style>

package/src/components/LayoutState.vue

@@ -0,0 +1,91 @@
+<template>
+    <div
+        :style="`position:absolute; top:0px; left:0px; width:100%; height:100%; transition:all 0.5s linear; display:flex; align-items:center; justify-content:center;`"
+    >
+
+        <template v-if="connState==='已連線' || connState==='連線中...'">
+
+            <img style="width:100px; height:100px;" :src="img_connection">
+
+            <div style="margin-left:10px;">
+                <div style="color:#aaa;">
+                    {{connState}}
+                </div>
+            </div>
+
+        </template>
+
+        <template v-else-if="connState==='已登出'">
+
+            <img style="width:75px; height:75px;" :src="img_logout">
+
+            <div style="margin-left:10px;">
+                <div style="color:#aaa;">
+                    {{connState}}
+                </div>
+            </div>
+
+        </template>
+
+        <template v-else-if="connState==='無法連線'">
+
+            <img style="width:75px; height:75px;" :src="img_dissconnection">
+
+            <div style="margin-left:10px;">
+                <div style="color:#aaa;">
+                    {{connState}}
+                </div>
+            </div>
+
+        </template>
+
+        <template v-else>
+
+            <img style="width:75px; height:75px;" :src="img_deny">
+
+            <div style="margin-left:10px;">
+                <div style="color:#aaa;">
+                    {{connState}}
+                </div>
+            </div>
+
+        </template>
+
+    </div>
+</template>
+
+<script>
+import get from 'lodash/get'
+
+
+export default {
+    components: {
+    },
+    props: {
+    },
+    data: function() {
+        return {
+            img_connection: `data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWlkWU1pZCI+DQo8Y2lyY2xlIGN4PSI1MCIgY3k9IjUwIiByPSIxMy44MTkzIiBmaWxsPSJub25lIiBzdHJva2U9IiM1ZjJhNjIiIHN0cm9rZS13aWR0aD0iMiI+DQogIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InIiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBkdXI9IjEuMjY1ODIyNzg0ODEwMTI2NHMiIHZhbHVlcz0iMDs0NCIga2V5VGltZXM9IjA7MSIga2V5U3BsaW5lcz0iMCAwLjIgMC44IDEiIGNhbGNNb2RlPSJzcGxpbmUiIGJlZ2luPSItMC42MzI5MTEzOTI0MDUwNjMycyI+PC9hbmltYXRlPg0KICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJvcGFjaXR5IiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgZHVyPSIxLjI2NTgyMjc4NDgxMDEyNjRzIiB2YWx1ZXM9IjE7MCIga2V5VGltZXM9IjA7MSIga2V5U3BsaW5lcz0iMC4yIDAgMC44IDEiIGNhbGNNb2RlPSJzcGxpbmUiIGJlZ2luPSItMC42MzI5MTEzOTI0MDUwNjMycyI+PC9hbmltYXRlPg0KPC9jaXJjbGU+DQo8Y2lyY2xlIGN4PSI1MCIgY3k9IjUwIiByPSIzNS44MTY1IiBmaWxsPSJub25lIiBzdHJva2U9IiNhOTc2YzMiIHN0cm9rZS13aWR0aD0iMiI+DQogIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InIiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBkdXI9IjEuMjY1ODIyNzg0ODEwMTI2NHMiIHZhbHVlcz0iMDs0NCIga2V5VGltZXM9IjA7MSIga2V5U3BsaW5lcz0iMCAwLjIgMC44IDEiIGNhbGNNb2RlPSJzcGxpbmUiPjwvYW5pbWF0ZT4NCiAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0ib3BhY2l0eSIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGR1cj0iMS4yNjU4MjI3ODQ4MTAxMjY0cyIgdmFsdWVzPSIxOzAiIGtleVRpbWVzPSIwOzEiIGtleVNwbGluZXM9IjAuMiAwIDAuOCAxIiBjYWxjTW9kZT0ic3BsaW5lIj48L2FuaW1hdGU+DQo8L2NpcmNsZT4NCjwvc3ZnPg==`,
+            img_logout: `data:image/png;base64,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`,
+            img_dissconnection: `data:image/png;base64,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`,
+            img_deny: `data:image/png;base64,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`,
+        }
+    },
+    computed: {
+
+        connState: function() {
+            //console.log('computed loading')
+
+            let vo = this
+
+            return get(vo, `$store.state.connState`)
+        },
+
+    },
+    methods: {
+    }
+}
+</script>
+
+<style scoped>
+</style>