update

HiTeachCE/ClientApp/src/components/Tools/BasePick.vue

@@ -1,42 +1,53 @@
 <template>
-    <div class="move-box">
-        <div class="flex content-around column">
-            <div class="flex flex-center start-wrap">
-                <Icon :type="playIcon" class="btn-start" :style="playIcon=='md-pause'?'margin:0':''" @click="handlePickAction" />
-                <!--<Icon type="md-play" class="btn-start" @click="handlePickAction" />-->
-            </div>
-            <div class="picker-conditions">
-                <CheckboxGroup v-model="checkVal">
-                    <Checkbox label="repeat">重复挑人</Checkbox>
-                    <Checkbox label="quick">快速挑人</Checkbox>
-                </CheckboxGroup>
-                <div class="picker-select">
-                    <span>一次挑</span>
-                    <Select v-model="pickNum" style="width:70px" @on-change="handleSelectNum">
-                        <Option v-for="(item,index) in numList" :value="index" :key="item">{{ item }}</Option>
-                    </Select>
-                    <span>人</span>
-                </div>
-                <div class="picker-select" v-if="answershow">
-                    <span>挑选</span>
-                    <Select v-model="pickText" style="width:85px" @on-change="cons">
-                        <Option v-for="(item,index) in textList" :value="index" :key="item">{{ item }}</Option>
-                    </Select>
-                    <span>人</span>
-                </div>
-            </div>
+  <div class="move-box">
+    <div class="flex content-around column">
+      <div class="flex flex-center start-wrap">
+        <Icon
+          :type="playIcon"
+          class="btn-start"
+          :style="playIcon=='md-pause'?'margin:0':''"
+          @click="handlePickAction"
+        />
+        <!--<Icon type="md-play" class="btn-start" @click="handlePickAction" />-->
+      </div>
+      <div class="picker-conditions">
+        <CheckboxGroup v-model="checkVal">
+          <Checkbox label="repeat">重复挑人</Checkbox>
+          <Checkbox label="quick">快速挑人</Checkbox>
+        </CheckboxGroup>
+        <div class="picker-select" v-if="answershow">
+          <span>来源</span>
+          <Select v-model="pickText" style="width:85px" @on-change="cons">
+            <Option v-for="(item,index) in textList" :value="index" :key="item">{{ item }}</Option>
+          </Select>
+        </div>
+        <div class="picker-select">
+          <span>人数</span>
+          <Select v-model="pickNum" style="width:85px" @on-change="handleSelectNum">
+            <Option v-for="(item,index) in numList" :value="index" :key="item">{{ item + 1 }}</Option>
+          </Select>
+        </div>
+      </div>
 
-            <div class="result-box">
-                <div class="person-item" v-for="(item,index) in personList" :key="index" v-if="index < showLength">
-                    <div class="person-box flex flex-center" :style="'background-image:url('+item.headImg+')' ">
-                        <div class="person-name" v-if="item.studentName">{{item.studentName}}</div>
-                        <span class="person-id" v-if="item.sort">{{item.sort}}</span>
-                    </div>
-                </div>
-            </div>
-            <q-btn color="primary" :label="btnLable" @click="handlePickAction" />
+      <div class="result-box">
+        <div
+          class="person-item"
+          v-for="(item,index) in personList"
+          :key="index"
+          v-if="index < showLength"
+        >
+          <div
+            class="person-box flex flex-center"
+            :style="'background-image:url('+item.headImg+')' "
+          >
+            <div class="person-name" v-if="item.studentName">{{item.studentName}}</div>
+            <span class="person-id" v-if="item.sort">{{item.sort}}</span>
+          </div>
         </div>
+      </div>
+      <q-btn color="primary" :label="btnLable" @click="handlePickAction" />
     </div>
+  </div>
 </template>
 
 <script>
@@ -44,7 +55,120 @@
         name: "BasePick",
         data() {
             return {
-                nameList: this.$store.state.students,
+                nameList:[],
+                allList: [{
+                    accountid: "oqADO5n-GBZX8AJZ86JpRExN2Nxo",     
+                    answerbrand: "banrd-success",
+                    answerclass: "answer-error",
+                    class: "studybox",
+                    done: true,
+                    headImg: "https://wx.qlogo.cn/mmopen/vi_32/PrRia23ibmWw3ay17Qf04kiaibCiaY1CpKqTUH19xcUfpJZxF9YGFHSooK702DVB1DYTgic0cR1Lp9O7mM50rt2HdyqQ/132",
+                    id: "oqADO5n-GBZX8AJZ86JpRExN2Nxo",
+                    option: "C",
+                    rank: "",
+                    score: 1,
+                    showcardclass: "brand-answer",
+                    sort: 1,
+                    statement: "",
+                    status: "online",
+                    studentName: "cmy,"
+                },{
+                    accountid: "oqADO5n-GBZX8AJZ86JpRExN2Nxo",     
+                    answerbrand: "banrd-success",
+                    answerclass: "answer-error",
+                    class: "studybox",
+                    done: true,
+                    headImg: "https://tvax2.sinaimg.cn/crop.0.0.996.996.50/0068Fh7Zly8gdnhvpt6a4j30ro0roabs.jpg?KID=imgbed,tva&Expires=1596197704&ssig=ru7PdaSAOv",
+                    id: "oqADO5n-GBZX8AJZ86JpRExN2Nxo",
+                    option: "C",
+                    rank: "",
+                    score: 1,
+                    showcardclass: "brand-answer",
+                    sort: 1,
+                    statement: "",
+                    status: "online",
+                    studentName: "嗯恩恩,"
+                },{
+                    accountid: "oqADO5n-GBZX8AJZ86JpRExN2Nxo",     
+                    answerbrand: "banrd-success",
+                    answerclass: "answer-error",
+                    class: "studybox",
+                    done: true,
+                    headImg: "https://tvax3.sinaimg.cn/crop.0.0.1080.1080.50/86b6ac98ly8gg91nhsi5nj20u00u0gny.jpg?KID=imgbed,tva&Expires=1596197704&ssig=d2no65ZWxQ",
+                    id: "oqADO5n-GBZX8AJZ86JpRExN2Nxo",
+                    option: "C",
+                    rank: "",
+                    score: 1,
+                    showcardclass: "brand-answer",
+                    sort: 1,
+                    statement: "",
+                    status: "online",
+                    studentName: "呵呵,"
+                },{
+                    accountid: "oqADO5n-GBZX8AJZ86JpRExN2Nxo",     
+                    answerbrand: "banrd-success",
+                    answerclass: "answer-error",
+                    class: "studybox",
+                    done: true,
+                    headImg: "https://tvax2.sinaimg.cn/crop.0.0.996.996.50/df208685ly8gh7iri2z3kj20ro0romzv.jpg?KID=imgbed,tva&Expires=1596197704&ssig=RlkdlJWrVo",
+                    id: "oqADO5n-GBZX8AJZ86JpRExN2Nxo",
+                    option: "C",
+                    rank: "",
+                    score: 1,
+                    showcardclass: "brand-answer",
+                    sort: 1,
+                    statement: "",
+                    status: "online",
+                    studentName: "沈六,"
+                },{
+                    accountid: "oqADO5n-GBZX8AJZ86JpRExN2Nxo",     
+                    answerbrand: "banrd-success",
+                    answerclass: "answercorrect",
+                    class: "studybox",
+                    done: true,
+                    headImg: "https://tvax3.sinaimg.cn/crop.0.0.512.512.50/ad7c13bcly8gha6nqdjlmj20e80e8mx8.jpg?KID=imgbed,tva&Expires=1596197704&ssig=WoH%2B5qzeHs",
+                    id: "oqADO5n-GBZX8AJZ86JpRExN2Nxo",
+                    option: "C",
+                    rank: "",
+                    score: 1,
+                    showcardclass: "brand-answer",
+                    sort: 1,
+                    statement: "",
+                    status: "online",
+                    studentName: "王五,"
+                },{
+                    accountid: "oqADO5n-GBZX8AJZ86JpRExN2Nxo",     
+                    answerbrand: "banrd-success",
+                    answerclass: "answercorrect",
+                    class: "studybox",
+                    done: true,
+                    headImg: "https://wx.qlogo.cn/mmopen/vi_32/PrRia23ibmWw3ay17Qf04kiaibCiaY1CpKqTUH19xcUfpJZxF9YGFHSooK702DVB1DYTgic0cR1Lp9O7mM50rt2HdyqQ/132",
+                    id: "oqADO5n-GBZX8AJZ86JpRExN2Nxo",
+                    option: "C",
+                    rank: "",
+                    score: 1,
+                    showcardclass: "brand-answer",
+                    sort: 1,
+                    statement: "",
+                    status: "online",
+                    studentName: "李四,"
+                },{
+                    accountid: "oqADO5n-GBZX8AJZ86JpRExN2Nxo",     
+                    answerbrand: "banrd-success",
+                    answerclass: "answercorrect",
+                    class: "studybox",
+                    done: true,
+                    headImg: "https://tvax2.sinaimg.cn/crop.0.0.1080.1080.50/006YaPmAly8gesf8cdbecj30u00u0myu.jpg?KID=imgbed,tva&Expires=1596197756&ssig=tfpfnzruPo",
+                    id: "oqADO5n-GBZX8AJZ86JpRExN2Nxo",
+                    option: "C",
+                    rank: "",
+                    score: 1,
+                    showcardclass: "brand-answer",
+                    sort: 1,
+                    statement: "",
+                    status: "online",
+                    studentName: "张三"
+                }],
                 pickNum: 0,
                 pickText: 0,
                 mytime: "",
@@ -56,14 +180,16 @@
                 showLength: 1,
                 showTextlength:1,
                 playIcon: 'md-play',
-                answershow:false,
+                answershow:true,
             };
         },
         created() {
+            this.numList =  [...new Array(6).keys()]
             // pickName={headImg: require('../../assets/img/head1.jpg'), studentName: '李四'};
-            for (let i = 0; i < 6; i++) {
+            for (let i = 0; i < this.numList.length; i++) {
                 this.personList.push({ headImg: require("../../assets/img/question.jpg"), studentName: "", sort: "" });
             }
+            this.nameList = this.allList
             this.init()
         },
         methods: {
@@ -74,18 +200,39 @@
                 }
             },
             cons(val) {
-                alert(this.pickText)
+                this.personList = []
+                switch (this.pickText){
+                    case 0:
+                        this.nameList = this.allList
+                        break;
+                    case 1:
+                        this.nameList = this.allList.filter(i => i.answerclass === 'answercorrect')
+                        break;
+                    case 2:
+                        this.nameList = this.allList.filter(i => i.answerclass === 'answer-error')
+                        break;
+                    default:
+                        break;
+                }
+                console.log(this.nameList.map(i => i.studentName))
+                this.numList = this.nameList.length < 6 ? [...new Array(this.nameList.length).keys()] : [...new Array(6).keys()]
+                for (let i = 0; i < this.numList.length; i++) {
+                    this.personList.push({ headImg: require("../../assets/img/question.jpg"), studentName: "", sort: "" });
+                }
+                this.showLength = 1
+                this.pickNum = 0
+                
             },
             show() {
                 let that = this;
             },
             handleSelectNum(val) {
                 this.showLength = val + 1;
-                for (let i = 0; i < 6; i++) {
-                    if (!this.personList[i]) {
-                        this.personList[i] = this.nameList[0]
-                    }
-                }
+                // for (let i = 0; i < 6; i++) {
+                //     if (!this.personList[i]) {
+                //         this.personList[i] = this.nameList[0]
+                //     }
+                // }
             },
             handlePickAction() {
                 let that = this;
@@ -143,114 +290,126 @@
         mounted() {
             this.refTest();
         },
+        computed: {
+            // 获取最新柱状图数据
+            getAnswerStatus() {
+                return this.$store.state.answerstatus
+            }
+        },
+        watch: {
+            getAnswerStatus(val) {
+                if (!val) return
+                this.answershow = val
+            }
+        }
     };
 </script>
 
 <style>
-    .person-box {
-        position: relative;
-        background: url("../../assets/img/head0.jpg") no-repeat 0 0;
-        background-size: cover;
-        width: 100%;
-        height: 100%;
-        border: 4px solid #a8aaab;
-        font-size: 26px;
-        border-radius: 10px;
-    }
+.person-box {
+  position: relative;
+  background: url("../../assets/img/head0.jpg") no-repeat 0 0;
+  background-size: cover;
+  width: 100%;
+  height: 100%;
+  border: 4px solid #a8aaab;
+  font-size: 26px;
+  border-radius: 10px;
+}
 
-    .start-wrap {
-        width: 120px;
-        height: 120px;
-        background: #027be3;
-        border-radius: 50%;
-        font-size: 80px;
-        margin: 0 auto;
-        cursor: pointer;
-    }
+.start-wrap {
+  width: 120px;
+  height: 120px;
+  background: #027be3;
+  border-radius: 50%;
+  font-size: 80px;
+  margin: 0 auto;
+  cursor: pointer;
+}
 
-    .btn-start {
-        color: #fff;
-        margin-left: 12px;
-    }
+.btn-start {
+  color: #fff;
+  margin-left: 12px;
+}
 
-    .picker-conditions {
-        margin: 20px 0;
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-        align-items: center;
-    }
+.picker-conditions {
+  margin: 20px 0;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
 
-    .picker-select {
-        margin: 20px 0;
-    }
+.picker-select {
+  margin: 20px 0;
+}
 
-        .picker-select .ivu-select {
-            margin: 0 20px;
-            height: 25px;
-            line-height: 25px;
-        }
+.picker-select .ivu-select {
+  margin: 0 20px;
+  height: 25px;
+  line-height: 25px;
+}
 
-    .picker-conditions .ivu-checkbox-wrapper {
-        font-size: 14px;
-    }
+.picker-conditions .ivu-checkbox-wrapper {
+  font-size: 14px;
+}
 
-    .picker-select .ivu-select-selected-value {
-        line-height: 25px !important;
-        padding-left: 20px !important;
-    }
+.picker-select .ivu-select-selected-value {
+  line-height: 25px !important;
+  padding-left: 20px !important;
+}
 
-    .picker-select .ivu-select-single .ivu-select-selection {
-        height: 25px;
-        line-height: 25px;
-    }
+.picker-select .ivu-select-single .ivu-select-selection {
+  height: 25px;
+  line-height: 25px;
+}
 
-    .picker-select .ivu-select-item {
-        padding: 7px 32px;
-    }
+.picker-select .ivu-select-item {
+  padding: 7px 32px;
+}
 
-    .person-name {
-        position: absolute;
-        bottom: 0;
-        left: 0;
-        width: 100%;
-        height: 40px;
-        color: #fff;
-        font-weight: bold;
-        letter-spacing: 3px;
-        background: rgba(113, 115, 116, 0.67);
-        text-align: center;
-    }
+.person-name {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 40px;
+  color: #fff;
+  font-weight: bold;
+  letter-spacing: 3px;
+  background: rgba(113, 115, 116, 0.67);
+  text-align: center;
+}
 
-    .person-id {
-        position: absolute;
-        left: 0px;
-        top: 0px;
-        width: 40px;
-        height: 40px;
-        border-radius: 50%;
-        background: #027be3;
-        color: #fff;
-        font-size: 18px;
-        font-weight: bold;
-        text-align: center;
-        line-height: 35px;
-        border: 2px solid rgb(153, 151, 151);
-    }
+.person-id {
+  position: absolute;
+  left: 0px;
+  top: 0px;
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  background: #027be3;
+  color: #fff;
+  font-size: 18px;
+  font-weight: bold;
+  text-align: center;
+  line-height: 35px;
+  border: 2px solid rgb(153, 151, 151);
+}
 
-    .result-box {
-        position: absolute;
-        width: 450px;
-        left: -450px;
-        top: -2px;
-        display: flex;
-        justify-content: flex-end;
-        flex-wrap: wrap;
-    }
+.result-box {
+  position: absolute;
+  width: 450px;
+  left: -450px;
+  top: -2px;
+  display: flex;
+  justify-content: flex-end;
+  flex-wrap: wrap;
+}
 
-    .person-item {
-        width: 150px;
-        height: 150px;
-        /*border: 1px solid #fff;*/
-    }
+.person-item {
+  width: 150px;
+  height: 150px;
+  /*border: 1px solid #fff;*/
+}
 </style>

HiTeachCE/ClientApp/src/views/Board.vue

@@ -1729,7 +1729,6 @@
                             studentnum[i].answerbrand = 'brand'
                             Noanswerdata.push(studentnum[i]);
                         } else if (studentnum[i].option == rightanswers[0]) {
-                           
                             studentnum[i].answerclass = 'answercorrect'
                             studentnum[i].answerbrand = 'banrd-success'
                             studentnum[i].score = 1