[admin] add setting backup

admin/src/App.vue

@@ -38,9 +38,9 @@
                         <el-menu-item-group>
                             <el-menu-item index="/exam-user"><i class="el-icon-menu" />Exam user</el-menu-item>
                         </el-menu-item-group>
-<!--                        <el-menu-item-group>-->
-<!--                            <el-menu-item index="/setting"><i class="el-icon-menu" />Setting</el-menu-item>-->
-<!--                        </el-menu-item-group>-->
+                        <el-menu-item-group>
+                            <el-menu-item index="/setting"><i class="el-icon-menu" />Setting</el-menu-item>
+                        </el-menu-item-group>
                     </el-submenu>
                 </el-menu>
             </el-aside>

admin/src/styles/common.scss

@@ -5,3 +5,6 @@
 .nexus-help-text {
     color: #aaa;
 }
+.pre-line {
+    white-space: pre-line;
+}

admin/src/utils/api.js

@@ -32,9 +32,24 @@ const api = {
     getUserBase: (params = {}) => {
         return axios.get('user-base', {params: params});
     },
+    getInviteInfo: (params = {}) => {
+        return axios.get('user-invite-info', {params: params});
+    },
+    getUserModComment: (params = {}) => {
+        return axios.get('user-mod-comment', {params: params});
+    },
     storeUser: (params = {}) => {
         return axios.post('users', params);
     },
+    disableUser: (params = {}) => {
+        return axios.post('user-disable', params);
+    },
+    enableUser: (params = {}) => {
+        return axios.post('user-enable', params);
+    },
+    resetPassword: (params = {}) => {
+        return axios.post('user-reset-password', params);
+    },
     listUserMatchExams: (params = {}) => {
         return axios.get('user-match-exams', {params: params});
     },
@@ -69,6 +84,12 @@ const api = {
     storeExamUser: (params) => {
         return axios.post('exam-users', params);
     },
+    storeSetting: (params) => {
+        return axios.post('settings', params);
+    },
+    listSetting: (params) => {
+        return axios.get('settings', {params});
+    },
 }
 
 export default api

admin/src/views/setting/form-backup.vue

@@ -0,0 +1,157 @@
+<template>
+    <el-form :model="formData" :rules="rules" ref="formRef" label-width="250px" class="formData">
+        <el-form-item label="Enabled" prop="backup.enabled">
+            <el-radio v-model="formData.backup.enabled" label="yes">Yes</el-radio>
+            <el-radio v-model="formData.backup.enabled" label="no">No</el-radio>
+            <div class="nexus-help-text">
+                Enable backup or not.
+            </div>
+        </el-form-item>
+
+        <el-form-item label="Frequency" prop="backup.frequency">
+            <el-radio v-model="formData.backup.frequency" label="daily">Daily</el-radio>
+            <el-radio v-model="formData.backup.frequency" label="hourly">Hourly</el-radio>
+            <div class="nexus-help-text">
+                Backup Frequency.
+            </div>
+        </el-form-item>
+
+        <el-form-item label="Hour" prop="backup.hour">
+            <el-select v-model="formData.backup.hour" filterable >
+                <el-option
+                    v-for="item in 24"
+                    :key="item"
+                    :label="item-1"
+                    :value="item-1">
+                </el-option>
+            </el-select>
+            <div class="nexus-help-text">
+                Do backup at this hour, If frequency  = 'hourly', this value will be ignore.
+            </div>
+        </el-form-item>
+
+        <el-form-item label="Minute" prop="backup.minute">
+            <el-select v-model="formData.backup.minute" filterable >
+                <el-option
+                    v-for="item in 60"
+                    :key="item"
+                    :label="item-1"
+                    :value="item-1">
+                </el-option>
+            </el-select>
+            <div class="nexus-help-text">
+                Do backup at this minute.
+            </div>
+        </el-form-item>
+
+        <el-form-item label="Google drive client ID" prop="backup.google_drive_client_id">
+            <el-input v-model="formData.backup.google_drive_client_id" label="Google drive client ID"></el-input>
+            <div class="nexus-help-text">
+                Google drive client ID.
+            </div>
+        </el-form-item>
+
+        <el-form-item label="Google drive client secret" prop="backup.google_drive_client_secret">
+            <el-input v-model="formData.backup.google_drive_client_secret" label="Google drive client secret"></el-input>
+            <div class="nexus-help-text">
+                Google drive client secret.
+            </div>
+        </el-form-item>
+
+        <el-form-item label="Google drive refresh token" prop="backup.google_drive_refresh_token">
+            <el-input v-model="formData.backup.google_drive_refresh_token" label="Google drive refresh token"></el-input>
+            <div class="nexus-help-text">
+                Google drive refresh token.
+            </div>
+        </el-form-item>
+
+        <el-form-item label="Google drive folder ID" prop="backup.google_drive_folder_id">
+            <el-input v-model="formData.backup.google_drive_folder_id" label="Google drive folder ID"></el-input>
+            <div class="nexus-help-text">
+                Google drive folder ID. If not set, will store in root.
+            </div>
+        </el-form-item>
+
+        <el-form-item>
+            <el-button type="primary" @click="submitAdd()">Submit</el-button>
+        </el-form-item>
+    </el-form>
+</template>
+
+<script>
+import { reactive, ref, toRefs, onMounted, onBeforeUnmount, getCurrentInstance } from 'vue'
+import { ElMessage } from 'element-plus'
+import { useRoute, useRouter } from 'vue-router'
+import { localGet } from '../../utils'
+import api from "../../utils/api";
+
+export default {
+    name: 'SettingFormBasic',
+    setup() {
+        const { proxy } = getCurrentInstance()
+        const formRef = ref(null)
+        const route = useRoute()
+        const router = useRouter()
+        const { id } = route.query
+        const state = reactive({
+            token: localGet('token') || '',
+            id: id,
+            allClasses: [],
+            formData: {
+                backup: {
+                    enabled: '',
+                    frequency: '',
+                    hour: '',
+                    minute: '',
+                    google_drive_client_id: '',
+                    google_drive_client_secret: '',
+                    google_drive_refresh_token: '',
+                    google_drive_folder_id: '',
+                }
+            },
+            rules: {
+                'backup.enabled': [{ required: 'true',  }],
+            },
+        })
+        onMounted( () => {
+
+        })
+        onBeforeUnmount(() => {
+
+        })
+        const submitAdd = () => {
+            formRef.value.validate(async (vaild) => {
+                if (vaild) {
+                    let params = state.formData;
+                    console.log(params)
+                    let res = await api.storeSetting(params)
+                    ElMessage.success(res.msg)
+                }
+            })
+        }
+        const handleBeforeUpload = (file) => {
+            const sufix = file.name.split('.')[1] || ''
+            if (!['jpg', 'jpeg', 'png'].includes(sufix)) {
+                ElMessage.error('请上传 jpg、jpeg、png 格式的图片')
+                return false
+            }
+        }
+        const listSetting = async () => {
+            let res = await api.listSetting({prefix: "backup"})
+            console.log("listSetting", res)
+            state.formData = res.data
+        }
+        return {
+            ...toRefs(state),
+            formRef,
+            submitAdd,
+            handleBeforeUpload,
+            listSetting,
+        }
+    }
+}
+</script>
+
+<style scoped>
+
+</style>

admin/src/views/setting/form-basic.vue

@@ -24,7 +24,6 @@ export default {
     name: 'SettingFormBasic',
     setup() {
         const { proxy } = getCurrentInstance()
-        console.log('proxy', proxy)
         const formRef = ref(null)
         const route = useRoute()
         const router = useRouter()
@@ -45,8 +44,6 @@ export default {
             },
         })
         onMounted( () => {
-            listAllClass()
-            listAllIndex()
             if (id) {
                 api.getExam(id).then(res => {
                     state.formData.name = res.data.name

admin/src/views/setting/index.vue

@@ -1,8 +1,7 @@
 <template>
-    <el-tabs type="border-card">
+    <el-tabs type="border-card" @tab-click="handleTabClick">
+        <el-tab-pane label="Backup"><FormBackup ref="backup" /></el-tab-pane>
         <el-tab-pane label="Basic"><FormBasic /></el-tab-pane>
-        <el-tab-pane label="Main"><FormMain /></el-tab-pane>
-        <el-tab-pane label="Smtp">Smtp</el-tab-pane>
     </el-tabs>
 </template>
 
@@ -14,21 +13,22 @@ import api from '../../utils/api'
 import { useTable, renderTableData } from '../../utils/table'
 import FormBasic from './form-basic.vue'
 import FormMain from './form-main.vue'
+import FormBackup from './form-backup.vue'
 
 export default {
     name: 'Setting',
     components: {
-        FormBasic, FormMain,
+        FormBasic, FormMain, FormBackup
     },
     setup() {
         const multipleTable = ref(null)
         const router = useRouter()
-
+        const backup = ref(null)
         const state = useTable()
 
         onMounted(() => {
-            console.log('ExamTable onMounted')
-            fetchTableData()
+            console.log('Setting onMounted')
+            backup.value.listSetting()
         })
         const fetchTableData = async () => {
             state.loading = true
@@ -55,6 +55,9 @@ export default {
             state.query.page = val
             fetchTableData()
         }
+        const handleTabClick = (val) => {
+            console.log('handleTabClick', val)
+        }
         return {
             ...toRefs(state),
             multipleTable,
@@ -62,8 +65,10 @@ export default {
             handleAdd,
             handleEdit,
             handleDelete,
+            handleTabClick,
             fetchTableData,
             changePage,
+            backup,
         }
     }
 }

admin/src/views/user/detail.vue

@@ -19,8 +19,8 @@
                     <td></td>
                     <td colspan="7">
                         <div class="other-actions">
-                            <el-button type="primary" size="mini">Reset password</el-button>
-                            <el-button type="primary" size="mini">PM</el-button>
+                            <el-button type="primary" size="mini" @click="handleGetModComment">Mod comment</el-button>
+                            <el-button type="primary" size="mini" @click="handleResetPassword">Reset password</el-button>
                             <el-button type="primary" size="mini" @click="handleAssignExam">Assign exam</el-button>
                         </div>
                     </td>
@@ -30,6 +30,25 @@
                     <td>{{baseInfo.email}}</td>
                     <td><el-button size="mini">Change</el-button></td>
                 </tr>
+                <tr>
+                    <td>Enabled</td>
+                    <td>{{baseInfo.enabled}}</td>
+                    <td>
+                        <template v-if="baseInfo.enabled && baseInfo.enabled == 'yes'">
+                            <el-button size="mini" @click="handleDisableUser">Disable</el-button>
+                        </template>
+                        <template v-if="baseInfo.enabled && baseInfo.enabled == 'no'">
+                            <el-popconfirm
+                                title="Confirm Enable ?"
+                                @confirm="handleEnableUser"
+                            >
+                                <template #reference>
+                                    <el-button size="mini">Enable</el-button>
+                                </template>
+                            </el-popconfirm>
+                        </template>
+                    </td>
+                </tr>
                 <tr>
                     <td>Added</td>
                     <td>{{baseInfo.added}}</td>
@@ -38,6 +57,11 @@
                     <td>Class</td>
                     <td>{{baseInfo.class_text}}</td>
                 </tr>
+                <tr>
+                    <td>Invite by</td>
+                    <td>{{baseInfo.inviter && baseInfo.inviter.username}}</td>
+                    <td><el-button size="mini" @click="handleViewInviteInfo">View</el-button></td>
+                </tr>
                 <tr>
                     <td>Uploaded</td>
                     <td>{{baseInfo.uploaded_text}}</td>
@@ -113,6 +137,11 @@
         </el-card>
     </div>
     <DialogAssignExam ref="assignExam" :reload="fetchPageData"/>
+    <DialogViewInviteInfo ref="viewInviteInfo" />
+    <DialogDisableUser ref="disableUser" :reload="fetchPageData" />
+    <DialogModComment ref="modComment" />
+    <DialogModComment ref="modComment" />
+    <DialogResetPassword ref="resetPassword" />
 </template>
 
 <script>
@@ -121,17 +150,25 @@ import { ElMessage } from 'element-plus'
 import {useRoute, useRouter} from 'vue-router'
 import api from '../../utils/api'
 import DialogAssignExam from './dialog-assign-exam.vue'
+import DialogViewInviteInfo from './dialog-invite-info.vue'
+import DialogDisableUser from './dialog-disable-user.vue'
+import DialogModComment from './dialog-mod-comment.vue'
+import DialogResetPassword from './dialog-reset-password.vue'
 
 export default {
     name: "UserDetail",
     components: {
-        DialogAssignExam
+        DialogAssignExam, DialogViewInviteInfo, DialogDisableUser, DialogModComment, DialogResetPassword
     },
     setup() {
         const route = useRoute()
         const router = useRouter()
         const { id } = route.query
         const assignExam = ref(null)
+        const viewInviteInfo = ref(null)
+        const disableUser = ref(null)
+        const modComment = ref(null)
+        const resetPassword = ref(null)
         const state = reactive({
             loading: false,
             baseInfo: {},
@@ -152,15 +189,43 @@ export default {
             ElMessage.success(res.msg)
             await fetchPageData()
         }
+
         const handleAssignExam = async () => {
             assignExam.value.open(id)
         }
+        const handleViewInviteInfo = async () => {
+            viewInviteInfo.value.open(id)
+        }
+        const handleDisableUser = async () => {
+            disableUser.value.open(id)
+        }
+        const handleEnableUser = async () => {
+            let res = await api.enableUser({uid: id})
+            ElMessage.success(res.msg)
+            await fetchPageData()
+        }
+        const handleGetModComment = async () => {
+            modComment.value.open(id)
+        }
+        const handleResetPassword = async () => {
+            resetPassword.value.open(id)
+        }
         return {
             ...toRefs(state),
             handleRemoveExam,
             handleAssignExam,
+            handleEnableUser,
+            handleViewInviteInfo,
+            handleDisableUser,
+            handleGetModComment,
+            handleResetPassword,
+            fetchPageData,
             assignExam,
-            fetchPageData
+            viewInviteInfo,
+            disableUser,
+            modComment,
+            resetPassword,
+
         }
     }
 }

admin/src/views/user/dialog-disable-user.vue

@@ -0,0 +1,77 @@
+<template>
+    <el-dialog
+        title="Disable user"
+        v-model="visible"
+        center
+        :close-on-click-modal="false"
+    >
+        <el-form
+            :model="formData"
+            label-width="100px"
+            v-loading="loading"
+            ref="formRef"
+            :rules="rules">
+            <el-form-item label="Reason" prop="reason">
+                <el-input type="textarea" v-model="formData.reason"></el-input>
+            </el-form-item>
+        </el-form>
+        <template #footer>
+                <span class="dialog-footer">
+                  <el-button @click="visible = false">Cancel</el-button>
+                  <el-button type="primary" @click="handleSubmit">Save</el-button>
+                </span>
+        </template>
+    </el-dialog>
+</template>
+
+<script>
+import { onMounted, reactive, ref, toRefs } from 'vue'
+import { ElMessage } from 'element-plus'
+import {useRoute, useRouter} from 'vue-router'
+import api from '../../utils/api'
+
+export default {
+    name: "DialogDisableUser",
+    props: {
+        reload: Function
+    },
+    setup(props, context) {
+        const formRef = ref(null)
+        const state = reactive({
+            loading: false,
+            visible: false,
+            formData: {
+                uid: 0,
+                reason: '',
+            },
+            rules: {
+                reason: [{ required: 'true'}]
+            }
+        })
+        const open = (uid) => {
+            state.formData.uid = uid
+            state.visible = true
+
+        }
+        const handleSubmit = () => {
+            formRef.value.validate(async (valid) => {
+                if (valid) {
+                    let res = await api.disableUser(state.formData)
+                    state.visible = false
+                    ElMessage.success(res.msg)
+                    if (props.reload) {
+                        props.reload()
+                    }
+                }
+            })
+        }
+        return {
+            ...toRefs(state),
+            handleSubmit,
+            formRef,
+            open,
+
+        }
+    }
+}
+</script>

admin/src/views/user/dialog-invite-info.vue

@@ -0,0 +1,63 @@
+<template>
+    <el-dialog
+        title="Invite info"
+        v-model="visible"
+        center
+        width="60%"
+        :close-on-click-modal="false"
+    >
+        <el-table :data="inviteInfo" v-loading="loading">
+            <el-table-column prop="id" label="ID" width="55"></el-table-column>
+            <el-table-column prop="inviter_user.username" label="Inviter"></el-table-column>
+            <el-table-column prop="invitee" label="Receive email"></el-table-column>
+            <el-table-column prop="hash" label="Hash"></el-table-column>
+            <el-table-column prop="valid_text" label="Hash valid" width="100"></el-table-column>
+            <el-table-column prop="invitee_register_email" label="Register email"></el-table-column>
+            <el-table-column prop="time_invited" label="Time invited"></el-table-column>
+        </el-table>
+
+    </el-dialog>
+</template>
+
+<script>
+import { onMounted, reactive, ref, toRefs } from 'vue'
+import { ElMessage } from 'element-plus'
+import {useRoute, useRouter} from 'vue-router'
+import api from '../../utils/api'
+
+export default {
+    name: "DialogInviteInfo",
+    props: {
+        reload: Function
+    },
+    setup(props, context) {
+        const formRef = ref(null)
+        const state = reactive({
+            loading: false,
+            visible: false,
+            uid: 0,
+            inviteInfo: [],
+        })
+        const getInviteInfo = async () => {
+            let res = await api.getInviteInfo({uid: state.uid})
+            state.inviteInfo.push(res.data)
+        }
+        const open = (uid) => {
+            state.uid = uid
+            if (state.inviteInfo.length == 0) {
+                state.loading = true
+                getInviteInfo()
+                state.loading = false
+            }
+            state.visible = true
+
+        }
+        return {
+            ...toRefs(state),
+            formRef,
+            open,
+
+        }
+    }
+}
+</script>

admin/src/views/user/dialog-mod-comment.vue

@@ -0,0 +1,56 @@
+<template>
+    <el-dialog
+        title="Mod comment"
+        v-model="visible"
+        center
+        width="40%"
+        :close-on-click-modal="false"
+    >
+        <el-card v-loading="loading">
+            <div v-html="modComment" class="pre-line"></div>
+        </el-card>
+    </el-dialog>
+</template>
+
+<script>
+import { onMounted, reactive, ref, toRefs } from 'vue'
+import { ElMessage } from 'element-plus'
+import {useRoute, useRouter} from 'vue-router'
+import api from '../../utils/api'
+
+export default {
+    name: "DialogModComment",
+    props: {
+        reload: Function
+    },
+    setup(props, context) {
+        const formRef = ref(null)
+        const state = reactive({
+            loading: false,
+            visible: false,
+            uid: 0,
+            modComment: ''
+        })
+        const getUserModComment = async () => {
+            let res = await api.getUserModComment({uid: state.uid})
+            state.modComment = res.data
+        }
+        const open = (uid) => {
+            state.uid = uid
+            if (!state.modComment) {
+                state.loading = true
+                getUserModComment()
+                state.loading = false
+            }
+            state.visible = true
+
+        }
+        return {
+            ...toRefs(state),
+            formRef,
+            open,
+
+        }
+    }
+}
+</script>

admin/src/views/user/dialog-reset-password.vue

@@ -0,0 +1,83 @@
+<template>
+    <el-dialog
+        title="Reset password"
+        v-model="visible"
+        center
+        :close-on-click-modal="false"
+    >
+        <el-form
+            :model="formData"
+            label-width="200px"
+            v-loading="loading"
+            ref="formRef"
+            :rules="rules">
+            <el-form-item label="Password" prop="password">
+                <el-input v-model="formData.password"></el-input>
+            </el-form-item>
+
+            <el-form-item label="Password confirmation" prop="password_confirmation">
+                <el-input v-model="formData.password_confirmation"></el-input>
+            </el-form-item>
+        </el-form>
+        <template #footer>
+                <span class="dialog-footer">
+                  <el-button @click="visible = false">Cancel</el-button>
+                  <el-button type="primary" @click="handleSubmit">Save</el-button>
+                </span>
+        </template>
+    </el-dialog>
+</template>
+
+<script>
+import { onMounted, reactive, ref, toRefs } from 'vue'
+import { ElMessage } from 'element-plus'
+import {useRoute, useRouter} from 'vue-router'
+import api from '../../utils/api'
+
+export default {
+    name: "DialogResetPassword",
+    props: {
+        reload: Function
+    },
+    setup(props, context) {
+        const formRef = ref(null)
+        const state = reactive({
+            loading: false,
+            visible: false,
+            formData: {
+                uid: 0,
+                password: '',
+                password_confirmation: ''
+            },
+            rules: {
+                password: [{ required: 'true'}],
+                password_confirmation: [{ required: 'true'}],
+            }
+        })
+        const open = (uid) => {
+            state.formData.uid = uid
+            state.visible = true
+
+        }
+        const handleSubmit = () => {
+            formRef.value.validate(async (valid) => {
+                if (valid) {
+                    let res = await api.resetPassword(state.formData)
+                    state.visible = false
+                    ElMessage.success(res.msg)
+                    if (props.reload) {
+                        props.reload()
+                    }
+                }
+            })
+        }
+        return {
+            ...toRefs(state),
+            handleSubmit,
+            formRef,
+            open,
+
+        }
+    }
+}
+</script>