train-student/src/layout/user/pingfen.vue

<template>
  <div id="groupList">
    <el-row>
      <van-form @submit="onSubmit">
        <van-field readonly clickable name="picker" :value="value" label="学生" placeholder="点击选择学生" @click="showPicker = true" />
        <van-field v-model="form.selfscore" name="分数" label="分数" placeholder="请输入分数(数字)" />
        <div style="margin:16px,16px,0,16px;text-align:center">
          <van-button type="info">提交</van-button>
        </div>
      </van-form>
      <van-popup v-model="showPicker" position="bottom">
        <van-picker value-key="stuname" show-toolbar :columns="columns" @confirm="onConfirm" @cancel="showPicker = false" />
      </van-popup>
    </el-row>
  </div>
</template>
<script>
import { mapState, createNamespacedHelpers, mapGetters } from 'vuex';
import Vue from 'vue';
import { Dialog } from 'vant';
// 全局注册
Vue.use(Dialog);
export default {
  name: 'groupList',
  props: {
    show: null,
    groupList: null,
    stuIdAndGroupId: null,
    form: null,
    columns: null,
  },
  components: {},
  data: () => ({
    value: '',
    column: ['杭州', '宁波', '温州', '嘉兴', '湖州'],
    showPicker: false,
  }),
  created() {},
  computed: {
    ...mapState(['user']),
    userid() {
      return this.user.userid;
    },
  },
  methods: {
    openClick(item) {
      this.$emit('opanSubmit', item);
    },
    onSubmit() {
      this.$emit('onSubmit', { data: this.form });
    },

    onConfirm(value, index) {
      this.value = value;
      this.showPicker = false;
      this.$emit('onvalue', { value });
    },
    save(item) {
      this.$emit('queren', item);
    },
    onConfirms(value) {},
  },
};
</script>

<style lang="less" scoped>
p {
  padding: 0;
  margin: 0;
}
.list {
  background: #fff;
  margin: 0 5px 5px 5px;
  width: 97%;
  padding: 0 10px;
  border-radius: 15px;
}
.list .groupName {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.childName {
  padding: 15px 0;
  font-size: 15px;
}
button {
  width: 120%;
}
/deep/.van-dialog {
  height: 400px;
}
</style>