提交

1

src/views/unit-test/unit-create/index.module.less

@@ -5,6 +5,9 @@
       .van-cell {
         padding: 18px 12px;
       }
+      .van-field__control:disabled {
+        color: #333 !important;
+      }
     }
   }
 }
@@ -31,7 +34,7 @@
 .addP {
   font-size: 16px;
   font-weight: 500;
-  color: #333333;
+  color: #333333 !important;
   line-height: 22px;
 }
 .schoolDtailWrap {

src/views/unit-test/unit-create/index.tsx

@@ -1,7 +1,7 @@
 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 { Field, CellGroup, Icon, Button, showToast, ActionSheet, Popup, Picker } from 'vant'
+import { defineComponent, reactive, ref, onMounted, nextTick } from 'vue'
 import styles from './index.module.less'
 import { useRouter } from 'vue-router'
 import { state as globalState } from '@/state'
@@ -29,6 +29,7 @@ export default defineComponent({
       unitId: ''
     } as any)
     const schoolImageRef = ref()
+    const showFirstloading = ref(false)
     const submitInfo = async () => {
       sessionStorage.setItem('unit-create', JSON.stringify(forms.value))
     }
@@ -74,21 +75,26 @@ export default defineComponent({
             value: item.id as string
           }
         })
+        nextTick(() => {
+          showFirstloading.value = true
+        })
       } catch (e: any) {
+        showFirstloading.value = true
         const message = e.message
         showToast(message)
       }
     }
     const checkOrchestra = async (val: any) => {
-      forms.value.orchestraId = val.value
-      forms.value.orchestraName = val.name
+      console.log(val.selectedOptions)
+      forms.value.orchestraId = val.selectedOptions[0].value
+      forms.value.orchestraName = val.selectedOptions[0].name
       forms.value.classGroupName = ''
       forms.value.classGroupId = ''
 
-      if (val.value) {
+      if (val.selectedOptions[0].value) {
         try {
           const res = await request.post('/api-teacher/classGroup/page', {
-            data: { page: 1, rows: 9999, orchestraId: val.value }
+            data: { page: 1, rows: 9999, orchestraId: val.selectedOptions[0].value }
           })
           state.classList = res.data.rows.map((item) => {
             return {
@@ -110,102 +116,123 @@ export default defineComponent({
       state.showPopoverOrchestra = false
     }
     const checkClass = async (val: any) => {
-      forms.value.classGroupName = val.name
-      forms.value.classGroupId = val.value
+      forms.value.classGroupName = val.selectedOptions[0].name
+      forms.value.classGroupId = val.selectedOptions[0].value
       state.showPopoverClass = false
     }
     return () => (
       <>
-        <div class={styles.schoolEidtWrap}>
-          <div class={styles.eidtWrap}>
-            {/*      onClick={() => setAddress()} */}
-            <CellGroup inset>
-              <Field
-                v-model={forms.value.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.value.classGroupName}
-                maxlength={50}
-                placeholder="测验班级"
-                disabled
-                input-align="right"
-                onClick={() => {
-                  if (!forms.value.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.value.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>
+        {showFirstloading.value ? (
+          <div class={styles.schoolEidtWrap}>
+            <div class={styles.eidtWrap}>
+              {/*      onClick={() => setAddress()} */}
+              <CellGroup inset>
+                <Field
+                  v-model={forms.value.orchestraName}
+                  placeholder="选择乐团"
+                  readonly
+                  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.value.classGroupName}
+                  maxlength={50}
+                  placeholder="测验班级"
+                  readonly
+                  input-align="right"
+                  onClick={() => {
+                    if (!forms.value.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.value.unitName}
+                  maxlength={50}
+                  placeholder="测验内容"
+                  readonly
+                  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>
+        ) : null}
 
-          <OSticky position="bottom">
-            {/* <div class={'btnGroup'}>
-              <Button block round type="primary">
-                下一步
-              </Button>
-            </div> */}
-          </OSticky>
-        </div>
-        <ActionSheet
+        {/* <ActionSheet
           v-model:show={state.showPopoverOrchestra}
           title="选择乐团"
           actions={state.actions}
           onSelect={checkOrchestra}
-        ></ActionSheet>
+        ></ActionSheet> */}
+        <Popup v-model:show={state.showPopoverOrchestra} position="bottom" round>
+          <Picker
+            columns={state.actions}
+            columnsFieldNames={{ text: 'name', value: 'id' }}
+            onCancel={() => (state.showPopoverOrchestra = false)}
+            onConfirm={checkOrchestra}
+          />
+        </Popup>
+
+        <Popup v-model:show={state.showPopoverClass} position="bottom" round>
+          <Picker
+            columns={state.classList}
+            columnsFieldNames={{ text: 'name', value: 'id' }}
+            onCancel={() => (state.showPopoverOrchestra = false)}
+            onConfirm={checkClass}
+          />
+        </Popup>
+        {/*
         <ActionSheet
           v-model:show={state.showPopoverClass}
           title="选择班级"
           actions={state.classList}
           onSelect={checkClass}
-        ></ActionSheet>
+        ></ActionSheet> */}
       </>
     )
   }

src/views/unit-test/unit-list/index.tsx

@@ -89,6 +89,7 @@ export default defineComponent({
     })
 
     const createUnit = () => {
+      sessionStorage.removeItem('unit-create')
       router.push('/unit-create')
     }
     return () => (