Skip to content

C
confucius
Commit 84fb649a authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

parent 4a29064f
Show whitespace changes
Inline Side-by-side
Showing with 208 additions and 265 deletions
src/components/course/course-form.vue
View file @ 84fb649a
...@@ -41,7 +41,6 @@ ...@@ -41,7 +41,6 @@
queryCourseInfo, queryCourseInfo,
} from '../../api/course/index' } from '../../api/course/index'
import { import {
uploadConfig,
UploadSelfFile UploadSelfFile
} from '../../api/common/common' } from '../../api/common/common'
import selectTree from '../common/select-tree' import selectTree from '../common/select-tree'
......
src/components/school/teacher/teacher-form.vue
View file @ 84fb649a
<template> <template>
<q-dialog v-model="persistent" content-class="bg-grey-1" persistent transition-show="scale" transition-hide="scale"> <q-dialog v-model="persistent" content-class="bg-grey-1" persistent transition-show="scale" transition-hide="scale">
<q-card style="width: 800px;max-width:900px;"> <q-card style="width: 800px;max-width:900px;">
<q-card-section> <q-card-section>
<div class="text-h6">{{objOption.TId==0?'新增教师信息':'修改教师信息'}}</div> <div class="text-h6">{{objOption.TId==0?'新增教师信息':'修改教师信息'}}</div>
...@@ -7,36 +7,49 @@ ...@@ -7,36 +7,49 @@
<q-card-section class="q-pt-none scroll" style="max-height: 70vh"> <q-card-section class="q-pt-none scroll" style="max-height: 70vh">
<div class="text-caption q-mb-lg q-px-md text-grey-6">基本资料</div> <div class="text-caption q-mb-lg q-px-md text-grey-6">基本资料</div>
<div class="row wrap"> <div class="row wrap">
<q-input filled stack-label maxlength="20" :dense="false" v-model="objOption.TeacherName" ref="TeacherName" class="col-6 q-pr-lg q-pb-lg" label="教师名称" :rules="[val => !!val || '请填写教师姓名']" /> <q-input filled stack-label maxlength="20" :dense="false" v-model="objOption.TeacherName" ref="TeacherName"
<q-select filled stack-label option-value="SId" option-label="SName" v-model="objOption.School_Id" ref="School_Id" :options="schoolList" label="所属校区" :dense="false" class="col-6 q-pb-lg" :rules="[val => !!val || '请选择所属校区']" /> class="col-6 q-pr-lg q-pb-lg" label="教师名称" :rules="[val => !!val || '请填写教师姓名']" />
<q-input type="tel" filled stack-label maxlength="100" :dense="false" v-model="objOption.TeacherTel" ref="TeacherTel" class="col-6 q-pr-lg q-pb-lg" label="联系电话" :rules="[val => !!val || '请填写教师联系电话']" /> <q-select filled stack-label option-value="SId" option-label="SName" v-model="objOption.School_Id"
<q-input filled stack-label maxlength="100" :dense="false" v-model="objOption.TeacherSay" ref="TeacherSay" class="col-6 q-pb-lg" label="教师营销语" /> ref="School_Id" :options="schoolList" label="所属校区" :dense="false" class="col-6 q-pb-lg"
:rules="[val => !!val || '请选择所属校区']" />
<q-input type="tel" filled stack-label maxlength="100" :dense="false" v-model="objOption.TeacherTel"
ref="TeacherTel" class="col-6 q-pr-lg q-pb-lg" label="联系电话" :rules="[val => !!val || '请填写教师联系电话']" />
<q-input filled stack-label maxlength="100" :dense="false" v-model="objOption.TeacherSay" ref="TeacherSay"
class="col-6 q-pb-lg" label="教师营销语" />
<div class="col-6 q-pr-lg q-pb-lg"> <div class="col-6 q-pr-lg q-pb-lg">
<q-uploader @uploaded="uploadSuccess" hide-upload-btn max-files="1" @rejected="onRejected" label="教师头像" :max-file-size="512*1024" accept=".jpg, image/*" auto-upload :url="action" /> <q-uploader style="display: inline-block;height: 320px;max-width: 100%;"
:style="{'background-image':'url(' + objOption.TeacherHead + ')'}" hide-upload-btn max-files="1"
@rejected="onRejected" label="教师头像" :max-file-size="512*1024" accept=".jpg, image/*" auto-upload
:factory="uploadFile" />
</div> </div>
<div class="col-6 q-pb-lg"> <div class="col-6 q-pb-lg">
<q-uploader @uploaded="uploadSuccess" hide-upload-btn max-files="1" @rejected="onRejected" label="教师形象照" :max-file-size="512*1024" accept=".jpg, image/*" auto-upload :url="actionIcon" /> <q-uploader style="display: inline-block;height:320px; max-width: 100%;"
:style="{'background-image':'url(' + objOption.TeacherIcon + ')'}" hide-upload-btn max-files="1"
@rejected="onRejected" label="教师形象照" :max-file-size="512*1024" accept=".jpg, image/*" auto-upload
:factory="uploadFile" />
</div> </div>
<ext-editor :defaultMsg="objOption.TeacherIntro" classStr="col-12" @getEditValue="getEditValue"></ext-editor>
<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 q-pt-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" /> <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 class="text-grey-6 text-caption">注意：隐藏后，教师将在其他任何地方无法显示</div>
</div> </div>
<div class="col-6 q-pb-lg q-pt-lg"> <div class="col-6 q-pb-lg q-pt-lg">
<q-toggle size="md" label="是否推荐" color="primary" :false-value="0" :true-value="1" v-model="objOption.IsRecommend" /> <q-toggle size="md" label="是否推荐" color="primary" :false-value="0" :true-value="1"
v-model="objOption.IsRecommend" />
<div class="text-grey-6 text-caption">注意：推荐后教师将在营销端呈现</div> <div class="text-grey-6 text-caption">注意：推荐后教师将在营销端呈现</div>
</div> </div>
<div class="col-12 q-pb-lg"> <div class="col-12 q-pb-lg">
<q-field filled label="教师标签" bg-color="white" stack-label> <q-field filled label="教师标签" bg-color="white" stack-label>
<template v-slot:control> <template v-slot:control>
<div class="q-pt-md row" tabindex="0"> <div class="q-pt-md row" tabindex="0">
<div v-if="tags.length<5" class="q-mr-md"> <div v-if="tags.length<5" class="q-mr-md">
<input type="text" placeholder="输入标签后回车确认" v-model="tagText" class="tag-input" @keyup.enter="createTag"> <input type="text" placeholder="输入标签后回车确认" v-model="tagText" class="tag-input"
@keyup.enter="createTag">
</div> </div>
<div class="col"> <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 /> <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>
</div> </div>
</template> </template>
...@@ -47,18 +60,26 @@ ...@@ -47,18 +60,26 @@
<q-separator /> <q-separator />
<q-card-actions align="right" class="bg-white"> <q-card-actions align="right" class="bg-white">
<q-btn label="取消" color="dark" style="font-weight:400 !important" @click="closeSaveForm" /> <q-btn label="取消" color="dark" style="font-weight:400 !important" @click="closeSaveForm" />
<q-btn label="立即提交" color="accent q-px-md" style="font-weight:400 !important" :loading="saveLoading" @click="saveTeacher" /> <q-btn label="立即提交" color="accent q-px-md" style="font-weight:400 !important" :loading="saveLoading"
@click="saveTeacher" />
</q-card-actions> </q-card-actions>
</q-card> </q-card>
</q-dialog> </q-dialog>
</template> </template>
<script> <script>
import { import {
getSchoolDropdown, getSchoolDropdown,
saveTeacher saveTeacher
} from '../../../api/school/index' } from '../../../api/school/index'
export default { import {
UploadSelfFile
} from '../../../api/common/common'
import extEditor from '../../common/ext-editor'
export default {
components: {
extEditor,
},
props: { props: {
saveObj: { saveObj: {
type: Object, type: Object,
...@@ -72,95 +93,18 @@ export default { ...@@ -72,95 +93,18 @@ export default {
optionTitle: "", optionTitle: "",
schoolList: [], schoolList: [],
saveLoading: false, saveLoading: false,
imgDomain: "http://imgfile.oytour.com",
action: "http://upload.oytour.com/Upload?filePath=" + encodeURIComponent('/edu/teacher/'),
actionIcon: "http://upload.oytour.com/Upload?filePath=" + encodeURIComponent('/edu/teacherIcon/'),
toolbar: [],
tagText: "", tagText: "",
tags: [], tags: [],
fonts: {
arial: 'Arial',
arial_black: 'Arial Black',
comic_sans: 'Comic Sans MS',
courier_new: 'Courier New',
impact: 'Impact',
lucida_grande: 'Lucida Grande',
times_new_roman: 'Times New Roman',
verdana: 'Verdana'
}
} }
}, },
mounted() { mounted() {
this.getSchool() this.getSchool()
this.initObj() this.initObj()
this.initToolBar()
}, },
methods: { methods: {
initToolBar() { //获取编辑器值
this.toolbar = [ getEditValue(obj) {
[{ this.objOption.TeacherIntro = obj;
label: '对齐',
icon: this.$q.iconSet.editor.align,
fixedLabel: true,
list: 'only-icons',
options: ['left', 'center', 'right', 'justify']
}],
['bold', 'italic', 'strike', 'underline', 'subscript', 'superscript'],
[{
label: '格式',
icon: this.$q.iconSet.editor.formatting,
list: 'no-icons',
fixedLabel: true,
fixedIcon: true,
options: [
'p',
'h1',
'h2',
'h3',
'h4',
'h5',
'h6',
'code'
]
},
{
label: '字号',
icon: this.$q.iconSet.editor.fontSize,
fixedLabel: true,
fixedIcon: true,
list: 'no-icons',
options: [
'size-1',
'size-2',
'size-3',
'size-4',
'size-5',
'size-6',
'size-7'
]
},
{
label: '字体',
icon: this.$q.iconSet.editor.font,
fixedLabel: true,
fixedIcon: true,
list: 'no-icons',
options: [
'default_font',
'arial',
'arial_black',
'comic_sans',
'courier_new',
'impact',
'lucida_grande',
'times_new_roman',
'verdana'
]
},
'removeFormat'
],
['ordered', 'outdent', 'indent'],
]
}, },
initObj() { initObj() {
if (this.saveObj) { if (this.saveObj) {
...@@ -202,21 +146,19 @@ export default { ...@@ -202,21 +146,19 @@ export default {
}) })
}, },
onRejected(rejectedEntries) { onRejected(rejectedEntries) {
this.this.$q.notify({ this.$q.notify({
type: 'negative', type: 'negative',
position: "top", position: "top",
message: `文件验证失败，请重新上传` message: `文件验证失败，请重新上传`
}) })
}, },
uploadSuccess(info) { uploadFile(files) {
if (info.xhr.status == '200') { UploadSelfFile('teacherIcon', files[0], res => {
let res = JSON.parse(info.xhr.response) if (res.resultCode == 1) {
if (res.FilePath.indexOf('teacherIcon') == -1) { this.objOption.TeacherHead = res.FileUrl;
this.objOption.TeacherHead = this.imgDomain + res.FilePath this.objOption.TeacherIcon = res.FileUrl;
} else {
this.objOption.TeacherIcon = this.imgDomain + res.FilePath
}
} }
})
}, },
closeSaveForm() { closeSaveForm() {
this.$emit('close') this.$emit('close')
...@@ -278,15 +220,17 @@ export default { ...@@ -278,15 +220,17 @@ export default {
} }
}, },
}, },
} }
</script> </script>
<style> <style>
.tag-input { .tag-input {
border: 1px solid #777; border: 1px solid #777;
outline: none; outline: none;
width: 140px; width: 140px;
padding: 5px; padding: 5px;
border-radius: 4px; border-radius: 4px;
} }
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment