|
@@ -0,0 +1,192 @@
|
|
|
+import OHeader from '@/components/o-header'
|
|
|
+import OSticky from '@/components/o-sticky'
|
|
|
+import { Field, CellGroup, Icon, Button, showToast, ActionSheet } from 'vant'
|
|
|
+import { defineComponent, reactive, ref, onMounted } from 'vue'
|
|
|
+import styles from './index.module.less'
|
|
|
+import { useRouter } from 'vue-router'
|
|
|
+import { state as globalState } from '@/state'
|
|
|
+// import locIcon from './images/loc-icon.png'
|
|
|
+import request from '@/helpers/request'
|
|
|
+
|
|
|
+export default defineComponent({
|
|
|
+ name: 'unit-create',
|
|
|
+ setup() {
|
|
|
+ const router = useRouter()
|
|
|
+ const state = reactive({
|
|
|
+ actions: [] as any,
|
|
|
+ classList: [] as any,
|
|
|
+ showPopoverOrchestra: false,
|
|
|
+ showPopoverClass: false
|
|
|
+ })
|
|
|
+ const forms = reactive({
|
|
|
+ orchestraId: '',
|
|
|
+ orchestraName: '',
|
|
|
+ classGroupName: '',
|
|
|
+ classGroupId: '',
|
|
|
+ emergencyContact: '',
|
|
|
+ addressLongitudeLatitude: '',
|
|
|
+ unitName: '',
|
|
|
+ unitId: ''
|
|
|
+ })
|
|
|
+ const schoolImageRef = ref()
|
|
|
+ const submitInfo = async () => {
|
|
|
+ sessionStorage.setItem('unit-create', JSON.stringify(forms))
|
|
|
+ }
|
|
|
+ const chioseLesson = () => {
|
|
|
+ if (!forms.classGroupId) {
|
|
|
+ showToast('请选择测验班级')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ sessionStorage.setItem('unit-create', JSON.stringify(forms))
|
|
|
+ router.push({ path: '/unit-Lesson', query: { classGroupId: forms.classGroupId } })
|
|
|
+ }
|
|
|
+ onMounted(() => {
|
|
|
+ getOrchestraList()
|
|
|
+ })
|
|
|
+ const getOrchestraList = async () => {
|
|
|
+ try {
|
|
|
+ const res = await request.post('/api-school/orchestra/page', {
|
|
|
+ data: { page: 1, rows: 9999, status: 'DONE' }
|
|
|
+ })
|
|
|
+ state.actions = res.data.rows.map((item) => {
|
|
|
+ return {
|
|
|
+ name: item.name,
|
|
|
+ value: item.id as string
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } catch (e: any) {
|
|
|
+ const message = e.message
|
|
|
+ showToast(message)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ const checkOrchestra = async (val: any) => {
|
|
|
+ forms.orchestraId = val.value
|
|
|
+ forms.orchestraName = val.name
|
|
|
+ forms.classGroupName = ''
|
|
|
+ forms.classGroupId = ''
|
|
|
+
|
|
|
+ if (val.value) {
|
|
|
+ try {
|
|
|
+ const res = await request.post('/api-teacher/classGroup/page', {
|
|
|
+ data: { page: 1, rows: 9999, orchestraId: val.value }
|
|
|
+ })
|
|
|
+ state.classList = res.data.rows.map((item) => {
|
|
|
+ return {
|
|
|
+ name: item.name,
|
|
|
+ value: item.id as string
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ if (state.classList.length < 1) {
|
|
|
+ showToast('当前乐团暂无班级')
|
|
|
+ }
|
|
|
+ } catch (e) {
|
|
|
+ console.log(e, 'cuowu')
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ state.classList = []
|
|
|
+ }
|
|
|
+
|
|
|
+ state.showPopoverOrchestra = false
|
|
|
+ }
|
|
|
+ const checkClass = async (val: any) => {
|
|
|
+ forms.classGroupName = val.name
|
|
|
+ forms.classGroupId = val.value
|
|
|
+ state.showPopoverClass = false
|
|
|
+ }
|
|
|
+ return () => (
|
|
|
+ <>
|
|
|
+ <div class={styles.schoolEidtWrap}>
|
|
|
+ <div class={styles.eidtWrap}>
|
|
|
+ {/* onClick={() => setAddress()} */}
|
|
|
+ <CellGroup inset>
|
|
|
+ <Field
|
|
|
+ v-model={forms.orchestraName}
|
|
|
+ placeholder="选择乐团"
|
|
|
+ disabled
|
|
|
+ input-align="right"
|
|
|
+ onClick={() => {
|
|
|
+ state.showPopoverOrchestra = true
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ {{
|
|
|
+ extra: () => (
|
|
|
+ <div class={styles.loctionIconWrap}>
|
|
|
+ <Icon name="arrow" color="#d8d8d8"></Icon>
|
|
|
+ {/* <Image width={19} height={18} src={locIcon}></Image> */}
|
|
|
+ </div>
|
|
|
+ ),
|
|
|
+ label: () => <p class={styles.addP}>选择乐团</p>
|
|
|
+ }}
|
|
|
+ </Field>
|
|
|
+ <Field
|
|
|
+ rows={3}
|
|
|
+ v-model={forms.classGroupName}
|
|
|
+ maxlength={50}
|
|
|
+ placeholder="测验班级"
|
|
|
+ disabled
|
|
|
+ input-align="right"
|
|
|
+ onClick={() => {
|
|
|
+ if (!forms.orchestraId) {
|
|
|
+ showToast('请先选择乐团')
|
|
|
+ } else {
|
|
|
+ state.showPopoverClass = true
|
|
|
+ }
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ {{
|
|
|
+ extra: () => (
|
|
|
+ <div class={styles.loctionIconWrap}>
|
|
|
+ <Icon name="arrow" color="#d8d8d8"></Icon>
|
|
|
+ {/* <Image width={19} height={18} src={locIcon}></Image> */}
|
|
|
+ </div>
|
|
|
+ ),
|
|
|
+ label: () => <p class={styles.addP}>测验班级</p>
|
|
|
+ }}
|
|
|
+ </Field>
|
|
|
+ <Field
|
|
|
+ rows={3}
|
|
|
+ v-model={forms.unitName}
|
|
|
+ maxlength={50}
|
|
|
+ placeholder="测验内容"
|
|
|
+ disabled
|
|
|
+ input-align="right"
|
|
|
+ onClick={chioseLesson}
|
|
|
+ >
|
|
|
+ {{
|
|
|
+ extra: () => (
|
|
|
+ <div class={styles.loctionIconWrap}>
|
|
|
+ <Icon name="arrow" color="#d8d8d8"></Icon>
|
|
|
+ {/* <Image width={19} height={18} src={locIcon}></Image> */}
|
|
|
+ </div>
|
|
|
+ ),
|
|
|
+ label: () => <p class={styles.addP}>测验内容</p>
|
|
|
+ }}
|
|
|
+ </Field>
|
|
|
+ </CellGroup>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <OSticky position="bottom">
|
|
|
+ <div class={'btnGroup'}>
|
|
|
+ <Button block round type="primary">
|
|
|
+ 下一步
|
|
|
+ </Button>
|
|
|
+ </div>
|
|
|
+ </OSticky>
|
|
|
+ </div>
|
|
|
+ <ActionSheet
|
|
|
+ v-model:show={state.showPopoverOrchestra}
|
|
|
+ title="选择乐团"
|
|
|
+ actions={state.actions}
|
|
|
+ onSelect={checkOrchestra}
|
|
|
+ ></ActionSheet>
|
|
|
+ <ActionSheet
|
|
|
+ v-model:show={state.showPopoverClass}
|
|
|
+ title="选择班级"
|
|
|
+ actions={state.classList}
|
|
|
+ onSelect={checkClass}
|
|
|
+ ></ActionSheet>
|
|
|
+ </>
|
|
|
+ )
|
|
|
+ }
|
|
|
+})
|