update

HiTeachCE/ClientApp/src/components/Chart/Bar.vue

@@ -1,13 +1,14 @@
 <template>
     <!--<div class="hello" style="width:100%; height:195px;margin:0 auto;padding:20px 0">-->
-        <div class="hello" :style="'width:'+ barwidthL +'%;height:'+barheight+'px;margin:0 auto;padding:20px 0'">
-            <!--<div class="topic_box">-->
-            <!--<p class="topic_title">题目：</p>-->
-            <!--<div class="topic_content">题目内容</div>-->
-            <!--</div>-->
-            <!--<button  @click="drawLine(1)">变色</button>-->
-            <div id="main"  :style="'width:'+barwidthL+'%;height:'+barheight+'px;'"></div>
-        </div>
+    <div class="hello" :style="'width:'+ barwidthL +'%;height:'+barheight+'px;margin:0 auto;padding:20px 0'">
+        <!--<div class="topic_box">-->
+        <!--<p class="topic_title">题目：</p>-->
+        <!--<div class="topic_content">题目内容</div>-->
+        <!--</div>-->
+        <!--<button  @click="drawLine(1)">变色</button>-->
+        <div id="main" :style="'width:'+barwidthL+'%;height:'+barheight+'px;'" v-if="oneanswer"></div>
+        <div id="multiplebar" :style="'width:'+barwidthL+'%;height:'+barheight+'px;'" v-if="multiple"></div>
+    </div>
 </template>
 <script>
     export default {
@@ -20,11 +21,15 @@
           cssvalue: '',
           barheight: '240',
           barwidthL: '95',
-          letterOrnumber:["A", "B", "C", "D","E","F","G","H","I","J"],
+          letterOrnumber: ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J"],
+          //是否有二次作答
+          oneanswer:true,
+          multiple:false,
       }
         },
         created() {
             this.init();
+            this.charinit()
         },
         mounted() {
             this.cssvalues()
@@ -58,65 +63,65 @@
                  shopCharts.resize();
                 }
             },
-        drawLine(defaultcolor,Data,patternvalue) {
-        // 基于准备好的dom，初始化echarts实例
-        let myChart = this.$echarts.init(document.getElementById('main'))
-        // 绘制图表
-        myChart.setOption({
-            tooltip: {},
-            xAxis: {
-                data:patternvalue,
-                axisLabel: {
-       show: true,
-        textStyle: {
-          color: '#6D7278',  //更改坐标轴文字颜色
-          fontSize : 20      //更改坐标轴文字大小
-        }
-     },
-            },
-           yAxis : [
-         {
-             min: 0,
-             max: 100,
-             axisLine: {show:false},
-             axisTick: {show:false},
-             splitLine:{show:false},
-             axisLabel : {
-             formatter: function(){
-             return " ";
-             }
-             }
-          }
-           ],
-            series: [{
-                name: '答案占比',
-                type: 'bar',
-                barWidth: 80,
-                data: Data,
-                itemStyle: {
-                 normal: {
-                  //柱形图圆角，初始化效果
-                    barBorderRadius: [10, 10, 0, 0],
-                    color: function(params) {
-                    var colorList = defaultcolor;
-                    return colorList[params.dataIndex]
-                    }, 
-                  label: {
-                   show: true,//是否展示,
-                  position: "top",
-                   formatter: '{@score}%',
-                   textStyle: {
-                    fontSize : '20',
-                    fontFamily: '微软雅黑',
-                    color:"#1E90FF"
+            drawLine(defaultcolor, Data, patternvalue) {
+                // 基于准备好的dom，初始化echarts实例
+                let myChart = this.$echarts.init(document.getElementById('main'))
+                // 绘制图表
+                myChart.setOption({
+                    tooltip: {},
+                    xAxis: {
+                        data: patternvalue,
+                        axisLabel: {
+                            show: true,
+                            textStyle: {
+                                color: '#6D7278',  //更改坐标轴文字颜色
+                                fontSize: 20      //更改坐标轴文字大小
+                            }
+                        },
                     },
-                  },
-                  }
-                },
-                      }
-            ]
-        });
-        },
+                    yAxis: [
+                        {
+                            min: 0,
+                            max: 100,
+                            axisLine: { show: false },
+                            axisTick: { show: false },
+                            splitLine: { show: false },
+                            axisLabel: {
+                                formatter: function () {
+                                    return " ";
+                                }
+                            }
+                        }
+                    ],
+                    series: [{
+                        name: '答案占比',
+                        type: 'bar',
+                        barWidth: 80,
+                        data: Data,
+                        itemStyle: {
+                            normal: {
+                                //柱形图圆角，初始化效果
+                                barBorderRadius: [10, 10, 0, 0],
+                                color: function (params) {
+                                    var colorList = defaultcolor;
+                                    return colorList[params.dataIndex]
+                                },
+                                label: {
+                                    show: true,//是否展示,
+                                    position: "top",
+                                    formatter: '{@score}%',
+                                    textStyle: {
+                                        fontSize: '20',
+                                        fontFamily: '微软雅黑',
+                                        color: "#1E90FF"
+                                    },
+                                },
+                            }
+                        },
+                    }
+                    ]
+                });
+            },
             init() {
                 let answerpattern = this.$store.state.answerpattern
                 let AnswerSelect = this.$store.state.AnswerSelect
@@ -161,20 +166,125 @@
                this.BarData=this.$store.state.echartbaranswer
             }
             console.log(this.$store.state.answervalue, '目前答案结果');
-        },
+            },
+        charinit() {
+            let reuse = this.$store.state.FirstRecord
+            console.log(reuse,'!!!!')
+            if (reuse.length != 0) {
+                console.log('查看是否执行')
+                this.oneanswer = false
+                this.multiple=true 
+                }
+            },
+        //二次作答柱状图
+            multiplecharbar(defaultcolor, Data, patternvalue) {
+                // 基于准备好的dom，初始化echarts实例
+                let myChart = this.$echarts.init(document.getElementById('multiplebar'))
+                // 绘制图表
+                myChart.setOption({
+                    tooltip: {},
+                    xAxis: {
+                        data: patternvalue,
+                        axisLabel: {
+                            show: true,
+                            textStyle: {
+                                color: '#6D7278',  //更改坐标轴文字颜色
+                                fontSize: 20      //更改坐标轴文字大小
+                            }
+                        },
+                    },
+                    yAxis: [
+                        {
+                            min: 0,
+                            max: 100,
+                            axisLine: { show: false },
+                            axisTick: { show: false },
+                            splitLine: { show: false },
+                            axisLabel: {
+                                formatter: function () {
+                                    return " ";
+                                }
+                            }
+                        }
+                    ],
+                    series: [{
+                        name: '第一次作答',
+                        type: 'bar',
+                        barWidth: 80,
+                        data: Data,
+                        itemStyle: {
+                            normal: {
+                                //柱形图圆角，初始化效果
+                                barBorderRadius: [10, 10, 0, 0],
+                                color: function (params) {
+                                    var colorList = defaultcolor;
+                                    return colorList[params.dataIndex]
+                                },
+                                label: {
+                                    show: true,//是否展示,
+                                    position: "top",
+                                    formatter: '{@score}%',
+                                    textStyle: {
+                                        fontSize: '20',
+                                        fontFamily: '微软雅黑',
+                                        color: "#1E90FF"
+                                    },
+                                },
+                            }
+                        },
+                    },
+                        {
+                            name: '第二次作答',
+                            type: 'bar',
+                            barWidth: 80,
+                            data: Data,
+                            itemStyle: {
+                                normal: {
+                                    //柱形图圆角，初始化效果
+                                    barBorderRadius: [10, 10, 0, 0],
+                                    color: function (params) {
+                                        var colorList = defaultcolor;
+                                        return colorList[params.dataIndex]
+                                    },
+                                    label: {
+                                        show: true,//是否展示,
+                                        position: "top",
+                                        formatter: '{@score}%',
+                                        textStyle: {
+                                            fontSize: '20',
+                                            fontFamily: '微软雅黑',
+                                            color: "#1E90FF"
+                                        },
+                                    },
+                                }
+                            },
+                        }
+                    ]
+                });
+            },
     },
         watch: {
             echartbaranswer(a) {
                 console.log(a,'a')
                 let newColor = ['#0097FF', '#0097FF', '#0097FF', '#0097FF', '#0097FF', '#0097FF', '#0097FF', '#0097FF', '#0097FF', '#0097FF']
                 let nowpattern=this.letterOrnumber
-                this.drawLine(newColor, a,nowpattern);
+                let reuse = this.$store.state.FirstRecord
+                if (reuse.length != 0) {
+                    this.multiplecharbar(newColor, b, nowpattern);
+                } else if (reuse.length == 0) {
+                    this.drawLine(newColor, b, nowpattern);
+                }
             },
             BarData(b) {
                 console.log(b,'b')
                 let newColor = ['#0097FF', '#0097FF', '#0097FF', '#0097FF', '#0097FF', '#0097FF', '#0097FF', '#0097FF', '#0097FF', '#0097FF']
                 let nowpattern=this.letterOrnumber
-                this.drawLine(newColor,b,nowpattern);
+                let reuse = this.$store.state.FirstRecord
+                if (reuse.length != 0) {
+                    this.multiplecharbar(newColor, b, nowpattern);
+                } else if (reuse.length == 0) {
+                    this.drawLine(newColor, b, nowpattern);
+                }
             },
             defaultcolor(e) {
                 let answercolor = e

HiTeachCE/ClientApp/src/components/Chart/OptionView.vue

@@ -4,7 +4,12 @@
         <!--cmy新写-->
         <!--初始页面-->
         <Row class="headerTollBox" v-if="fullscreen ==='0'">
-            <Col span="2" /><div class="switch" @click="againanswer"><q-btn color="deep-orange" glossy label="重新作答" /></div></Col>
+            <Col span="2" /><div class="switch" @click="answerAsk=true"><q-btn color="deep-orange" glossy label="重新作答" /></div></Col>
+            <div v-if="answerAsk" class="askbox">
+                <p>是否选择保留本次作答记录？</p>
+            <div class="asksuccessbtn" @click="reuseanswer('success')"><img src="../../assets/img/screenfull-success.png" /></div>
+            <div class="askerrorbtn" @click="reuseanswer('error')"><img src="../../assets/img/screenfull-error.png" /></div>
+            </div>
             <Col span="5" offset="5" v-if="Answerstatus === 0">
             <div class="triggerbox">
                 <div :class='["allstudents",btnname ==="allstudents"? "pickonall":""]' v-if="status ==='default'|| status ==='list'" @click="accurate('allstudents')">全部人员:{{iconnum}}</div>
@@ -341,7 +346,9 @@
                 //IRS开关
                 irsswitch: true,
                 second: this.$store.state.IRSswitch,
-                confirm:false,
+                confirm: false,
+                //二次作答
+                answerAsk:false
             }
         },
         created() {
@@ -766,18 +773,41 @@
                     this.$store.state.IRSswitch = false
                 }
             },
-            //重新作答
+            //重新作答 二次作答
             againanswer() {
+                this.answerAsk=true
+                //this.$store.state.FirstRecord = this.$store.state.students
+                //let nowstudent = this.$store.state.students
+                //for (var i= 0; i < nowstudent.length; i++) {
+                //    nowstudent[i].option = ''
+                //    nowstudent[i].class = 'studyboxone'
+                //    nowstudent[i].showcardclass = 'brand'
+                //    nowstudent[i].answerclass = 'studyboxone'
+                //    nowstudent[i].answerbrand='brand'
+                //}
+                //this.$store.state.IRSswitch=true
+                //this.$store.state.students=nowstudent
+                //this.$Message.success('答案已重新开启！请重新作答')
+            },
+            //二次作答相关
+            reuseanswer(value) {
+                let ant = value
+                if (ant === 'success') {
+                    this.$store.state.FirstRecord = this.$store.state.students
+                }
                 let nowstudent = this.$store.state.students
-                for (var i= 0; i < nowstudent.length; i++) {
+                for (var i = 0; i < nowstudent.length; i++) {
                     nowstudent[i].option = ''
                     nowstudent[i].class = 'studyboxone'
                     nowstudent[i].showcardclass = 'brand'
                     nowstudent[i].answerclass = 'studyboxone'
-                    nowstudent[i].answerbrand='brand'
+                    nowstudent[i].answerbrand = 'brand'
                 }
-                this.$store.state.IRSswitch=true
-                this.$store.state.students=nowstudent
+                this.$store.state.IRSswitch = true
+                this.$store.state.students = nowstudent
+                console.log(this.$store.state.FirstRecord, '保存的第一次作答信息')
+                console.log(this.$store.state.students, '清理后的作答数据')
+                this.answerAsk = false
                 this.$Message.success('答案已重新开启！请重新作答')
             },
             //阈值样式
@@ -1683,6 +1713,31 @@
     .triggerbox div:hover {
         cursor: pointer
     }
+    .askbox {
+        position: fixed;
+        top: 40%;
+        right: 40%;
+        z-index: 9999;
+        padding: 30px;
+        border-radius: 25px;
+        border: 2px solid #8AC007;
+        background-color:#fcfcfc;
+    }
+    .askbox p {
+        font-size:24px;
+        }
+    .asksuccessbtn {
+        width:60px;
+        height:60px;
+        float:left;
+        margin:10px 20px;
+    }
+    .askerrorbtn {
+        width: 60px;
+        height: 60px;
+        float: right;
+        margin: 10px 20px;
+    }
     /*.ivu-modal-footer button + button {
         margin-left: 0px !important;
     }*/

HiTeachCE/ClientApp/src/store.js

@@ -112,7 +112,9 @@ export default new Vuex.Store({
         IRSswitch: true,
         //柱状图默认选项呈现
         AnswerSelect: ["A","B","C","D"],
-        AnswerNumselect:["1","2","3","4"],
+        AnswerNumselect: ["1", "2", "3", "4"],
+        //二次作答
+        FirstRecord:[],
   mutations: {
 
         }