完成教师功能

src/App.vue

@@ -12,7 +12,7 @@ export default {
 
 <style>
 @import url('~assets/css/font.css');
-@import url('//at.alicdn.com/t/font_2077629_wkoyran264.css');
+@import url('//at.alicdn.com/t/font_2077629_n35k4sfl4mi.css');
 
 html,
 body,
@@ -55,4 +55,23 @@ body,
     background: #EDEDED;
 
 }
+
+.micfont {
+    font-family: perfectFont !important;
+}
+
+.dialog-out-close {
+    background: var(--q-color-primary);
+    position: absolute !important;
+    top: 30% !important;
+    left: -40px !important;
+    width: 40px !important;
+    height: 40px !important;
+    line-height: 40px;
+    text-align: center;
+    color: #FFF;
+    border-top-left-radius: 4px !important;
+    border-bottom-left-radius: 4px !important;
+    cursor: pointer;
+}
 </style>

src/api/school/index.js

@@ -56,4 +56,14 @@ export function saveTeacher(data) {
         method: 'post',
         data
     })
+}
+/**
+ * 教师审核
+ */
+export function auditTeacher(data) {
+    return request({
+        url: '/user/AuditTeacher',
+        method: 'post',
+        data
+    })
 }
\ No newline at end of file

src/components/school/teacher-form.vue → src/components/school/teacher/teacher-form.vue

@@ -19,14 +19,29 @@
                 </div>
 
                 <q-editor :toolbar="toolbar" :fonts="fonts" v-model="objOption.TeacherIntro" class="col-12" :definitions="{bold: {label: 'Bold', icon: null, tip: 'My bold tooltip'}}" />
-                <div class="col-6 q-pr-lg q-pb-lg">
+                <div class="col-6 q-pr-lg q-pb-lg q-pt-lg">
                     <q-toggle size="md" label="是否显示" color="primary" :false-value="0" :true-value="1" v-model="objOption.IsShow" />
                     <div class="text-grey-6 text-caption">注意：隐藏后，教师将在其他任何地方无法显示</div>
                 </div>
-                <div class="col-6">
+                <div class="col-6 q-pb-lg q-pt-lg">
                     <q-toggle size="md" label="是否推荐" color="primary" :false-value="1" :true-value="0" v-model="objOption.IsRecommend" />
                     <div class="text-grey-6 text-caption">注意：推荐后教师将在营销端呈现</div>
                 </div>
+                <div class="col-12 q-pb-lg">
+
+                    <q-field filled label="教师标签" bg-color="white" stack-label>
+                        <template v-slot:control>
+                            <div class="q-pt-md row" tabindex="0">
+                                <div v-if="tags.length<5" class="q-mr-md">
+                                    <input type="text" placeholder="输入标签后回车确认" v-model="tagText" class="tag-input" @keyup.enter="createTag">
+                                </div>
+                                <div class="col">
+                                    <q-chip v-for="(x, i) in tags" @remove="removeTag(i)" :key="i" square color="red" class="q-ma-none q-mr-md" icon="bookmark" text-color="white" :label="x" removable />
+                                </div>
+                            </div>
+                        </template>
+                    </q-field>
+                </div>
             </div>
         </q-card-section>
         <q-separator />
@@ -42,7 +57,7 @@
 import {
     getSchoolDropdown,
     saveTeacher
-} from '../../api/school/index'
+} from '../../../api/school/index'
 export default {
     props: {
         saveObj: {
@@ -61,6 +76,8 @@ export default {
             action: "http://upload.oytour.com/Upload?filePath=" + encodeURIComponent('/edu/teacher/'),
             actionIcon: "http://upload.oytour.com/Upload?filePath=" + encodeURIComponent('/edu/teacherIcon/'),
             toolbar: [],
+            tagText: "",
+            tags: [],
             fonts: {
                 arial: 'Arial',
                 arial_black: 'Arial Black',
@@ -149,6 +166,9 @@ export default {
             if (this.saveObj) {
                 this.optionTitle = "修改教师信息"
                 this.objOption = this.saveObj
+                if (this.objOption.TeachTag && this.objOption.TeachTag.length > 0) {
+                    this.tags = JSON.parse(this.objOption.TeachTag)
+                }
             } else {
                 this.optionTitle = "新增教师"
                 this.objOption = {
@@ -166,9 +186,21 @@ export default {
                 }
             }
         },
+        removeTag(i) {
+            this.tags.splice(i, 1)
+        },
         getSchool() {
             getSchoolDropdown({}).then(res => {
                 this.schoolList = res.Data
+                if (this.objOption.School_Id != '') {
+                    console.log(this.objOption)
+                    this.objOption.School_Id = this.schoolList.filter(x => {
+                        if (this.objOption.School_Id == x.SId) {
+                            return x
+                        }
+                    })[0]
+                    console.log(this.objOption)
+                }
             })
         },
         onRejected(rejectedEntries) {
@@ -193,11 +225,18 @@ export default {
             this.persistent = false
 
         },
+        createTag() {
+            if (this.tagText.length > 0) {
+                this.tags.push(this.tagText)
+                this.tagText = ''
+            }
+        },
         saveTeacher() {
             this.saveLoading = true
             this.$refs.School_Id.validate()
             this.$refs.TeacherName.validate()
             this.$refs.TeacherTel.validate()
+            let tempSchool = null
             if (
                 !this.$refs.School_Id.hasError &&
                 !this.$refs.TeacherName.hasError &&
@@ -210,7 +249,9 @@ export default {
                     err_msg = "请上传用户头像"
                 }
                 if (err_msg == "") {
+                    tempSchool = this.objOption.School_Id
                     this.objOption.School_Id = this.objOption.School_Id.SId
+                    this.objOption.TeachTag = JSON.stringify(this.tags)
                     saveTeacher(this.objOption).then(res => {
                         this.saveLoading = false
                         this.$q.notify({
@@ -224,6 +265,7 @@ export default {
                         this.closeSaveForm()
                     }).catch(() => {
                         this.saveLoading = false
+                        this.objOption.School_Id = tempSchool
                     })
                 } else {
                     this.$q.notify({
@@ -242,5 +284,11 @@ export default {
 </script>
 
 <style>
-
+.tag-input {
+    border: 1px solid #777;
+    outline: none;
+    width: 140px;
+    padding: 5px;
+    border-radius: 4px;
+}
 </style>

src/components/school/teacher/teacher-shenhe.vue

+<template>
+<q-dialog v-model="persistent" maximized full-height seamless position="right" @hide="closeShenheForm">
+    <q-card style="margin-top:61px;width:600px" class="no-border-radius q-px-lg">
+        <q-toolbar class="q-my-md q-pa-none">
+            <q-icon name="iconfont icon-11zaixianshenpixitong" size="40px" color="warning" />
+            <q-toolbar-title class="micfont">教师审核</q-toolbar-title>
+        </q-toolbar>
+        <div class="row">
+            <div class="col-6">
+                <q-field :value="text" label="教师照片" borderless>
+                    <template v-slot:control>
+                        <q-avatar class="q-mt-xs">
+                            <img :src="showObj.TeacherIcon">
+                        </q-avatar>
+                    </template>
+                </q-field>
+            </div>
+            <div class="col-6">
+                <q-field :value="text" label="教师姓名" borderless>
+                    <template v-slot:control>
+                        <div class="self-center full-width no-outline text-body1" tabindex="0">{{showObj.TeacherName}}</div>
+                    </template>
+                </q-field>
+            </div>
+        </div>
+        <div class="row q-my-md">
+            <div class="col-6">
+                <q-field :value="text" label="申请时间" borderless>
+                    <template v-slot:control>
+                        <div class="self-center full-width no-outline text-body2" tabindex="0">{{showObj.CreateTimeStr}}</div>
+                    </template>
+                </q-field>
+            </div>
+            <div class="col-6">
+                <q-field :value="text" label="联系电话" borderless>
+                    <template v-slot:control>
+                        <div class="self-center full-width no-outline text-body2" tabindex="0">{{showObj.TeacherTel}}</div>
+                    </template>
+                </q-field>
+            </div>
+        </div>
+        <div>
+            <q-field filled label="申请备注" :value="text" borderless disable>
+                <template v-slot:control>
+                    <div class="self-center full-width no-outline q-mt-xs" style="min-height:100px;">无</div>
+                </template>
+            </q-field>
+        </div>
+        <q-separator class="q-my-md" />
+        <div class="q-mb-md">
+            <q-input square filled v-model="reason" borderless label="审批意见" ref="reason" type="textarea" counter :rules="[val => !!val || '请填写审批意见']" maxlength="100" />
+        </div>
+        <div style="text-align:right">
+            <q-btn size="xs" @click="saveReuslt(2)" icon="iconfont icon-chenggong" color="primary" style="font-weight:400" class="q-mr-md" label="通过" :loading="saveLoading &&saveType==2" :disable="saveLoading &&saveType!=2" />
+            <q-btn size="xs" @click="saveReuslt(3)" icon="iconfont icon-jujue" color="negative" style="font-weight:400" label="拒绝" :loading="saveLoading &&saveType==3" :disable="saveLoading &&saveType!=3" />
+        </div>
+
+    </q-card>
+    <div class="dialog-out-close" @click="closeShenheForm" style="height:40px !important;border-top-left-radius: 4px !important;border-bottom-left-radius: 4px !important;">
+        <q-icon name="iconfont icon-jujue1" size="26px" />
+    </div>
+</q-dialog>
+</template>
+
+<script>
+import {
+    auditTeacher
+} from '../../../api/school/index'
+export default {
+    props: {
+        showObj: {
+            type: Object,
+            default: null
+        }
+    },
+    data() {
+        return {
+            persistent: true,
+            text: 'Field content',
+            reason: '',
+            saveLoading: false,
+            saveType: 0
+        }
+    },
+    methods: {
+        closeShenheForm() {
+            this.$emit('close')
+        },
+        saveReuslt(status) {
+            this.saveType = status
+            this.$refs.reason.validate()
+            if (!this.$refs.reason.hasError) {
+                this.saveLoading = true
+                auditTeacher({
+                    AuditStatus: this.saveType,
+                    AuditRemark: this.reason,
+                    TId: this.showObj.TId
+                }).then(res => {
+                    this.saveLoading = false
+                    this.$q.notify({
+                        icon: 'iconfont icon-chenggong',
+                        color: 'accent',
+                        timeout: 2000,
+                        message: '审核完成！',
+                        position: 'top'
+                    })
+                    this.$emit("success")
+                    this.closeShenheForm()
+                }).catch(() => {
+                    this.saveLoading = false
+                })
+            }
+
+        }
+    },
+}
+</script>
+
+<style>
+
+</style>

src/css/quasar.variables.sass

@@ -22,4 +22,5 @@ $positive  : #43e97b
 $negative  : #f5576c
 $info      : #31CCEC
 $warning   : #F2C037
-$infobg    : #eeeeee
+$infobg    : #eeeeee
\ No newline at end of file
+$infotwo   : #1296db
\ No newline at end of file

src/pages/school/teacher.vue

@@ -6,7 +6,8 @@
                 <q-input @change="resetSearch" clearable standout="bg-primary text-white" v-model="msg.TeacherName" label="教师名称" />
             </div>
             <div class="col-3">
-                <q-input @change="resetSearch" clearable standout="bg-primary text-white" v-model="msg.TeacherTel" label="教师电话" />
+                <!--<q-input @change="resetSearch" clearable standout="bg-primary text-white" v-model="msg.TeacherTel" label="教师电话" />-->
+                <q-select @input="resetSearch" clearable filled stack-label option-value="SId" option-label="SName" v-model="schoolTemp" ref="School_Id" :options="schoolList" label="所属校区" :dense="false" />
             </div>
             <div class="col-3">
                 <q-select @input="resetSearch" standout="bg-primary text-white" v-model="msg.IsShow" :options="ShowOpts" emit-value map-options label="显示状态" />
@@ -59,11 +60,31 @@
                     <q-icon v-if="props==1" name="iconfont icon-good" color="negative" size="16px" />
                 </q-td>
             </template>
+            <template v-slot:body-cell-TeachTag="props">
+                <q-td :props="props">
+                    <q-badge v-for="(x, i) in JSON.parse(props.value)" :key="i" color="red" :label="x" class="q-mr-xs" />
+                </q-td>
+            </template>
             <template v-slot:body-cell-AuditStatus="props">
                 <q-td :props="props">
                     <q-badge v-if="props.value==1" color="dark" label="审核中" />
-                    <q-badge v-if="props.value==2" color="warning" label="审核不通过" />
-                    <q-badge v-if="props.value==3" color="primary" label="审核通过" />
+                    <div v-if="props.value==3">
+                        <q-badge color="warning" class="cursor-pointer" label="审核不通过" />
+                        <q-popup-proxy>
+                            <q-banner class="bg-dark text-white">
+                                {{props.row.AuditRemark}}
+                            </q-banner>
+                        </q-popup-proxy>
+                    </div>
+                    <div v-if="props.value==2">
+                        <q-badge v-if="props.value==2" class="cursor-pointer" color="primary" label="审核通过" />
+                        <q-popup-proxy>
+                            <q-banner class="bg-dark text-white">
+                                {{props.row.AuditRemark}}
+                            </q-banner>
+                        </q-popup-proxy>
+                    </div>
+
                 </q-td>
             </template>
             <template v-slot:bottom>
@@ -71,26 +92,31 @@
             </template>
             <template v-slot:body-cell-optioned="props">
                 <q-td :props="props">
-                    <q-btn flat size="xs" icon="edit" color="accent" style="font-family:perfectFont" label="编辑" @click="addObj(props.value)" />
+                    <q-btn flat size="xs" icon="iconfont icon-shenhe" color="info" style="font-weight:400" class="q-mr-xs" label="审核" @click="showExamine(props.row)" />
+                    <q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400" label="编辑" @click="addObj(props.row)" />
                 </q-td>
             </template>
         </q-table>
-        <teacher-form v-if="persistent" :save-obj="objOption" @close="closeSaveForm" @success=""></teacher-form>
+        <teacher-form v-if="persistent" :save-obj="objOption" @close="closeSaveForm" @success="addAfterQuery"></teacher-form>
+        <teacher-shenhe v-if="persistentExamine" :show-obj="objOption" @close="closeSaveForm" @success="addAfterQuery"></teacher-shenhe>
     </div>
 </div>
 </template>
 
 <script>
 import {
-    getTeacherPage
+    getTeacherPage,
+    getSchoolDropdown
 } from '../../api/school/index'
-import teacherForm from '../../components/school/teacher-form'
+import teacherForm from '../../components/school/teacher/teacher-form'
+import teacherShenhe from '../../components/school/teacher/teacher-shenhe'
 export default {
     meta: {
         title: "教师管理"
     },
     components: {
-        teacherForm
+        teacherForm,
+        teacherShenhe
     },
     data() {
         return {
@@ -114,6 +140,12 @@ export default {
                     field: 'TeacherTel',
                     align: 'left'
                 },
+                {
+                    name: 'TeachTag',
+                    label: '标签',
+                    field: 'TeachTag',
+                    align: 'left'
+                },
                 {
                     name: 'SName',
                     label: '所属校区',
@@ -207,15 +239,20 @@ export default {
                 TeacherName: "",
                 TeacherTel: "",
                 AuditStatus: "-1",
-                IsShow: "-1"
+                IsShow: "-1",
+                School_Id: 0
             },
             pageCount: 0,
             persistent: false,
-            objOption: null
+            objOption: null,
+            schoolList: [],
+            schoolTemp: null,
+            persistentExamine: false
         }
     },
     mounted() {
         this.currentUrl = this.$route.path
+        this.getSchool()
         this.getTeacher()
     },
     methods: {
@@ -223,6 +260,11 @@ export default {
             this.pageIndex = 1
             //this.pageCount = 0
             this.loading = true
+            if (this.schoolTemp) {
+                this.msg.School_Id = this.schoolTemp.SId
+            } else {
+                this.msg.School_Id = 0
+            }
             this.getTeacher()
         },
         changePage(val) {
@@ -231,6 +273,18 @@ export default {
             this.loading = true
             this.getTeacher()
         },
+        getSchool() {
+            getSchoolDropdown({}).then(res => {
+                this.schoolList = res.Data
+                if (this.msg.School_Id != 0) {
+                    this.schoolTemp = this.schoolList.filter(x => {
+                        if (this.objOption.School_Id == x.SId) {
+                            return x
+                        }
+                    })[0]
+                }
+            })
+        },
         getTeacher() {
             getTeacherPage(this.msg).then(res => {
                 this.loading = false
@@ -255,23 +309,21 @@ export default {
             }
             this.getTeacher()
         },
-        addObj(id) {
-            if (id) {
-                let obj = this.data.filter(x => {
-                    if (x.TId == id) {
-                        return x
-                    }
-                    return false
-                })
-                this.objOption = obj[0]
+        addObj(obj) {
+            if (obj) {
+                this.objOption = obj
             } else {
                 this.objOption = null
             }
-
             this.persistent = true
         },
+        showExamine(obj) {
+            this.objOption = obj
+            this.persistentExamine = true
+        },
         closeSaveForm() {
             this.persistent = false
+            this.persistentExamine = false
         }
     },
 }