新增连词成句

src/components/studyStudent.vue

@@ -903,6 +903,14 @@
                             />
                             <div style="margin: 5px 0">汉字宫</div>
                           </div>
+                          <div v-if="tooC == 47">
+                            <img
+                              @click="addTools(tooC, toolIndex, taskCount)"
+                              src="../assets/icon/fourthToolList/conSentences.png"
+                              alt
+                            />
+                            <div style="margin: 5px 0">连词成句</div>
+                          </div>
                         </div>
                       </div>
                     </div>
@@ -914,7 +922,12 @@
                     </div>
                   </div>
                   <div
-                    v-if="tType && tType == 2 && !sIsOpen && tool.tool.indexOf(16) != -1"
+                    v-if="
+                      tType &&
+                      tType == 2 &&
+                      !sIsOpen &&
+                      tool.tool.indexOf(16) != -1
+                    "
                     class="worksBox"
                   >
                     <div
@@ -1039,7 +1052,12 @@
                     </div>
                   </div>
                   <div
-                    v-if="tType && tType == 2 && !sIsOpen && tool.tool.indexOf(4) != -1"
+                    v-if="
+                      tType &&
+                      tType == 2 &&
+                      !sIsOpen &&
+                      tool.tool.indexOf(4) != -1
+                    "
                     class="worksBox"
                   >
                     <div
@@ -1111,7 +1129,12 @@
                     </div>
                   </div>
                   <div
-                    v-if="tType && tType == 2 && !sIsOpen && tool.tool.indexOf(45) != -1"
+                    v-if="
+                      tType &&
+                      tType == 2 &&
+                      !sIsOpen &&
+                      tool.tool.indexOf(45) != -1
+                    "
                     class="worksBox"
                   >
                     <div
@@ -1151,7 +1174,12 @@
                     </div>
                   </div>
                   <div
-                    v-if="tType && tType == 2 && !sIsOpen && tool.tool.indexOf(15) != -1"
+                    v-if="
+                      tType &&
+                      tType == 2 &&
+                      !sIsOpen &&
+                      tool.tool.indexOf(15) != -1
+                    "
                     class="worksBox"
                   >
                     <div
@@ -1223,7 +1251,12 @@
                     </div>
                   </div>
                   <div
-                    v-if="tType && tType == 2 && !sIsOpen && tool.tool.indexOf(1) != -1"
+                    v-if="
+                      tType &&
+                      tType == 2 &&
+                      !sIsOpen &&
+                      tool.tool.indexOf(1) != -1
+                    "
                     class="worksBox"
                   >
                     <div
@@ -1291,7 +1324,12 @@
                     </div>
                   </div>
                   <div
-                    v-if="tType && tType == 2 && !sIsOpen && tool.tool.indexOf(3) != -1"
+                    v-if="
+                      tType &&
+                      tType == 2 &&
+                      !sIsOpen &&
+                      tool.tool.indexOf(3) != -1
+                    "
                     class="worksBox"
                   >
                     <div
@@ -1359,7 +1397,12 @@
                     </div>
                   </div>
                   <div
-                    v-if="tType && tType == 2 && !sIsOpen && tool.tool.indexOf(6) != -1"
+                    v-if="
+                      tType &&
+                      tType == 2 &&
+                      !sIsOpen &&
+                      tool.tool.indexOf(6) != -1
+                    "
                     class="worksBox"
                   >
                     <div
@@ -1427,7 +1470,12 @@
                     </div>
                   </div>
                   <div
-                    v-if="tType && tType == 2 && !sIsOpen && tool.tool.indexOf(7) != -1"
+                    v-if="
+                      tType &&
+                      tType == 2 &&
+                      !sIsOpen &&
+                      tool.tool.indexOf(7) != -1
+                    "
                     class="worksBox"
                   >
                     <div
@@ -1495,7 +1543,12 @@
                     </div>
                   </div>
                   <div
-                    v-if="tType && tType == 2 && !sIsOpen && tool.tool.indexOf(26) != -1"
+                    v-if="
+                      tType &&
+                      tType == 2 &&
+                      !sIsOpen &&
+                      tool.tool.indexOf(26) != -1
+                    "
                     class="worksBox"
                   >
                     <div
@@ -2794,7 +2847,12 @@
                     </div>
                   </div>
                   <div
-                    v-if="tType && tType == 2 && !sIsOpen && tool.tool.indexOf(40) != -1"
+                    v-if="
+                      tType &&
+                      tType == 2 &&
+                      !sIsOpen &&
+                      tool.tool.indexOf(40) != -1
+                    "
                     class="worksBox"
                   >
                     <div
@@ -2940,7 +2998,12 @@
                     </div>
                   </div>
                   <div
-                    v-if="tType && tType == 2  && !sIsOpen && tool.tool.indexOf(41) != -1"
+                    v-if="
+                      tType &&
+                      tType == 2 &&
+                      !sIsOpen &&
+                      tool.tool.indexOf(41) != -1
+                    "
                     class="worksBox"
                   >
                     <div
@@ -2990,6 +3053,122 @@
                       </div>
                     </div>
                   </div>
+                  <div
+                    v-if="
+                      tType &&
+                      tType == 2 &&
+                      !sIsOpen &&
+                      tool.tool.indexOf(47) != -1
+                    "
+                    class="worksBox"
+                  >
+                    <div
+                      class="zuoyeYulan"
+                      v-if="workStudent[toolIndex].length > 0"
+                    >
+                      <span>作业预览</span>
+                      <el-button
+                        type="text"
+                        @click="jump()"
+                        v-if="tType == 2"
+                        class="buttonA"
+                        >我的评价</el-button
+                      >
+                    </div>
+                    <div
+                      class="worksDetailBox"
+                      v-if="workStudent[toolIndex].length > 0"
+                    >
+                      <div
+                        class="works"
+                        style="
+                          width: 200px;
+                          height: 140px;
+                          margin: 10px 10px 10px 0;
+                        "
+                        v-for="(w, wIndex) in workStudent[toolIndex]"
+                        :key="wIndex"
+                      >
+                        <!-- @click="openXz(w, toolIndex)" -->
+                        <div class="workImg" @click="openSen(w, toolIndex)">
+                          <img src="../assets/icon/works/noImg.png" alt />
+                          <img
+                            class="deleteImg"
+                            src="../assets/deleteworks.png"
+                            v-if="w.userid == userid"
+                            @click.stop="deleteWorks(w.wid)"
+                            alt
+                          />
+                        </div>
+                        <div class="worksName">
+                          <div>
+                            {{ w.sName }}
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    v-if="
+                      tType &&
+                      ((tType == 2 && sIsOpen == true) ||
+                        tType == 1 ||
+                        tType == 4) &&
+                      tool.tool.indexOf(47) != -1
+                    "
+                    class="worksBox"
+                  >
+                    <div
+                      class="zuoyeYulan"
+                      v-if="
+                        worksStudent.length &&
+                        worksStudent[toolIndex].length > 0
+                      "
+                    >
+                      <span>作业预览</span>
+                      <el-button
+                        type="text"
+                        @click="jump()"
+                        v-if="tType == 2"
+                        class="buttonA"
+                        >我的评价</el-button
+                      >
+                    </div>
+                    <div
+                      class="worksDetailBox"
+                      v-if="
+                        worksStudent.length &&
+                        worksStudent[toolIndex].length > 0
+                      "
+                    >
+                      <!-- @click="openXz(w, toolIndex)" -->
+                      <div
+                        v-for="(w, wIndex) in worksStudent[toolIndex]"
+                        :key="wIndex"
+                        class="isWorksName"
+                        @click="openSen(w, toolIndex)"
+                      >
+                        {{ w.sName }}
+                        <img
+                          class="deleteImg deleteImg2"
+                          src="../assets/deleteworks.png"
+                          v-if="w.userid == userid"
+                          @click.stop="deleteWorks(w.wid)"
+                          alt
+                        />
+                      </div>
+                    </div>
+                    <div style="font-size: 18px">未提交</div>
+                    <div class="noWorksS">
+                      <div
+                        v-for="(s, sIndex) in noWorksS[toolIndex]"
+                        :key="sIndex"
+                        class="noWorksName"
+                      >
+                        {{ s.student }}
+                      </div>
+                    </div>
+                  </div>
                 </div>
                 <!-- <div class="upload_toolBtn" @click="addImg($event)">
                   上传文件
@@ -3878,7 +4057,7 @@
           </div>
           <div
             class="returnBtn"
-            style="margin-left: auto;width: 80px;"
+            style="margin-left: auto; width: 80px"
             v-if="
               commentDetail.works &&
               commentDetail.type == 0 &&
@@ -3998,13 +4177,13 @@
           </div>
         </div>
         <div class="drawPBox" v-if="commentDetail.img">
-            <span>教师批注</span>
-            <img
-              :src="commentDetail.img"
-              alt=""
-              @click="previewImg(commentDetail.img)"
-            />
-          </div>
+          <span>教师批注</span>
+          <img
+            :src="commentDetail.img"
+            alt=""
+            @click="previewImg(commentDetail.img)"
+          />
+        </div>
       </div>
       <div class="commentBox">
         <div class="pl">评论：</div>
@@ -4409,6 +4588,190 @@
         >
       </span>
     </el-dialog>
+    <el-dialog
+      title="连词成句"
+      :visible.sync="dialogVisibleSentence"
+      :append-to-body="true"
+      width="1000px"
+      :before-close="handleClose"
+      class="dialog_diy dialog_diy3"
+    >
+      <div>
+        <div class="sentenBox">
+          <div
+            v-for="(st, stIndex) in sentenceList"
+            :key="stIndex"
+            style="padding-bottom: 20px"
+          >
+            <div style="padding: 15px 0 10px 20px">请选择正确顺序</div>
+            <div class="cardList" v-if="st.chooseSenList">
+              <div class="cardBox">
+                <div
+                  v-for="(r, rIndex) in st.chooseSenList"
+                  :key="rIndex"
+                  @click="returnCard(r, stIndex, rIndex)"
+                >
+                  <el-tooltip
+                    class="item"
+                    effect="light"
+                    :content="r"
+                    placement="top"
+                  >
+                    <div
+                      :class="{
+                        isCard: r,
+                        isChooseCard: r == '' || r == undefined,
+                      }"
+                    >
+                      <div>{{ r }}</div>
+                    </div>
+                  </el-tooltip>
+                </div>
+              </div>
+            </div>
+            <div class="cardList" v-if="st.addChangeSen">
+              <div class="cardBox">
+                <div
+                  v-for="(s, sIndex) in st.addChangeSen"
+                  :key="sIndex"
+                  @click="setRightAnswer(s, stIndex, sIndex)"
+                >
+                  <el-tooltip
+                    class="item"
+                    effect="light"
+                    :content="s"
+                    placement="top"
+                  >
+                    <div
+                      :class="{ noCard: s == '' || s == undefined, isCard: s }"
+                    >
+                      <div>{{ s }}</div>
+                    </div>
+                  </el-tooltip>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisibleSentence = false">取 消</el-button>
+        <el-button type="primary" @click="addSenWorks">确 定</el-button>
+      </span>
+    </el-dialog>
+    <el-dialog
+      title="连词成句"
+      :visible.sync="dialogVisibleSentence1"
+      :append-to-body="true"
+      width="1000px"
+      :before-close="handleClose"
+      class="dialog_diy dialog_diy3"
+    >
+      <div>
+        <div class="sentenBox">
+          <div style="padding: 15px 0 10px 20px; font-size: 20px">
+            {{ sentenceList1.stuName }}的作业
+          </div>
+          <div
+            v-for="(st, stIndex) in sentenceList1"
+            :key="stIndex"
+            style="padding-bottom: 20px"
+          >
+            <div style="padding: 15px 0 10px 20px; font-size: 20px">
+              第{{ stIndex + 1 }}题
+            </div>
+            <div class="isWrong">
+              <div class="cardList1" v-if="st.chooseSenList">
+                <div class="cardBox">
+                  <div v-for="(s, sIndex) in st.chooseSenList" :key="sIndex">
+                    <el-tooltip
+                      class="item"
+                      effect="light"
+                      :content="s"
+                      placement="top"
+                    >
+                      <div class="isCard">
+                        <div>{{ s }}</div>
+                      </div>
+                    </el-tooltip>
+                  </div>
+                </div>
+              </div>
+              <div v-if="tType == 2" class="isTj">
+                <div class="isTjImg">
+                  <img src="../assets/icon/conSentences/right.png" alt="" />
+                </div>
+                <div>已提交</div>
+              </div>
+              <div
+                class="answerRight isTj"
+                v-if="
+                  st.chooseSenList.toString() == st.rightAnswer.toString() &&
+                  (tType == 1 || tType == 4)
+                "
+              >
+                <div class="isTjImg">
+                  <img src="../assets/icon/conSentences/right.png" alt="" />
+                </div>
+                <div>回答正确</div>
+              </div>
+              <div
+                class="answerRight isTj"
+                v-if="
+                  st.chooseSenList.toString() != st.rightAnswer.toString() &&
+                  (tType == 1 || tType == 4)
+                "
+              >
+                <div class="isTjImg">
+                  <img src="../assets/icon/conSentences/wrong.png" alt="" />
+                </div>
+                <div>回答错误</div>
+              </div>
+              <div v-if="tType == 2" class="isTj">
+                <div class="isTjImg">
+                  <img src="../assets/icon/conSentences/right.png" alt="" />
+                </div>
+                <div>已提交</div>
+              </div>
+            </div>
+            <div
+              v-if="
+                st.chooseSenList.toString() != st.rightAnswer.toString() &&
+                (tType == 1 || tType == 4)
+              "
+            >
+              <div style="padding: 15px 0 10px 20px">正确答案如下：</div>
+              <div
+                class="cardList"
+                v-if="st.rightAnswer"
+                style="border: none; padding: 10px 0 10px 10px; margin: 0"
+              >
+                <div class="cardBox">
+                  <div v-for="(r, rIndex) in st.rightAnswer" :key="rIndex">
+                    <el-tooltip
+                      class="item"
+                      effect="light"
+                      :content="r"
+                      placement="top"
+                    >
+                      <div class="isCard1">
+                        <div>{{ r }}</div>
+                      </div>
+                    </el-tooltip>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisibleSentence1 = false">取 消</el-button>
+        <el-button type="primary" @click="dialogVisibleSentence1 = false"
+          >确 定</el-button
+        >
+      </span>
+    </el-dialog>
     <ImgDraw
       :drawShow="drawShow"
       @closeDraw="closeDraw"
@@ -4433,6 +4796,7 @@ import SeeBoard from "./tools/seeBoard";
 import * as imageConversion from "image-conversion";
 import Audio from "./components/audio.vue";
 import ImgDraw from "./tools/imgDraw/imgDraw";
+import { Empty } from "element-ui";
 
 export default {
   components: {
@@ -4459,6 +4823,8 @@ export default {
       studentEvalDialogVisible: false,
       dialogVisibleSelect: false,
       dialogVisibleScore: false,
+      dialogVisibleSentence: false,
+      dialogVisibleSentence1: false,
       bzText: "",
       commentDetail: [],
       selectAnswer: [],
@@ -4482,6 +4848,8 @@ export default {
       IsLookOpen: false,
       pzDialog: false,
       type: 1,
+      sentenceList: [{ sentenceTitle: "", addSentence: [], rightAnswer: [] }],
+      sentenceList1: [],
       vedio: [],
       text: [],
       textList: [],
@@ -4750,6 +5118,35 @@ export default {
           console.error(err);
         });
     },
+    addSenWorks() {
+      let params = [
+        {
+          uid: this.userid,
+          cid: this.id,
+          stage: this.courseType,
+          task: this.taskCount,
+          tool: this.toolindex,
+          content: JSON.stringify(this.sentenceList),
+          type: 9,
+        },
+      ];
+      this.ajax
+        .post(this.$store.state.api + "addCourseWorks", params)
+        .then((res) => {
+          this.$message({
+            message: "提交成功",
+            type: "success",
+          });
+          this.dialogVisibleSentence = false;
+          // this.selectAnswer = {};
+          this.selectSWorks();
+          this.selectStudent();
+        })
+        .catch((err) => {
+          this.$message.error("提交失败");
+          console.error(err);
+        });
+    },
     addCourseWorks(i) {
       var typesql;
       if (this.fileType === 0) {
@@ -5039,6 +5436,18 @@ export default {
                     userid: b[j].userid,
                     wid: b[j].id,
                   });
+                } else if (b[j].type == 9 && a[i].tool[0] == 47) {
+                  //选择题
+                  this.workStudent[i].push({
+                    works: b[j].content,
+                    sName: b[j].name,
+                    score: b[j].score,
+                    img: b[j].img,
+                    type: 9,
+                    time: b[j].time,
+                    userid: b[j].userid,
+                    wid: b[j].id,
+                  });
                 }
               }
             }
@@ -5253,6 +5662,11 @@ export default {
       this.isSelect = true;
       this.dialogVisibleSelect = true;
     },
+    openSen(w, i) {
+      this.sentenceList1 = JSON.parse(w.works);
+      this.sentenceList1.stuName = w.sName;
+      this.dialogVisibleSentence1 = true;
+    },
     openPj(w, toolindex) {
       this.isStar = true;
       this.eScore = JSON.parse(w);
@@ -5626,6 +6040,22 @@ export default {
                     isLikes: isLikes,
                     commentJson: commentJson,
                   });
+                } else if (b[j].type == 9 && a[i].tool[0] == 47) {
+                  //选择题
+                  this.worksStudent[i].push({
+                    userid: b[j].userid,
+                    wid: b[j].id,
+                    works: b[j].content,
+                    sName: b[j].name,
+                    type: 8,
+                    time: b[j].time,
+                    score: b[j].score,
+                    img: b[j].img,
+                    likesCount: likesCount,
+                    commentCount: commentCount,
+                    isLikes: isLikes,
+                    commentJson: commentJson,
+                  });
                 }
 
                 this.isWorksS[i].push({ uid: b[j].userid, sName: b[j].name });
@@ -7512,8 +7942,57 @@ export default {
         this.dialogVisibleSelect = true;
       } else if (t == 44) {
         window.parent.postMessage({ tools: "44" }, "*");
+      } else if (t == 47) {
+        this.sentenceList = this.chapInfoList[this.courseType].chapterInfo[0]
+          .taskJson[index].toolChoose[i].sentenceList
+          ? JSON.parse(
+              JSON.stringify(
+                this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
+                  index
+                ].toolChoose[i].sentenceList
+              )
+            )
+          : [{ sentenceTitle: "", addSentence: [], rightAnswer: [] }];
+        for (var q = 0; q < this.sentenceList.length; q++) {
+          this.sentenceList[q].chooseSenList = [];
+          this.sentenceList[q].addChangeSen = [];
+          this.sentenceList[q].addChangeSen = JSON.parse(
+            JSON.stringify(this.sentenceList[q].addSentence)
+          );
+          this.sentenceList[q].chooseSenList.length =
+            this.sentenceList[q].rightAnswer.length;
+        }
+        this.dialogVisibleSentence = true;
       }
     },
+    setRightAnswer(s, i, j) {
+      for (var q = 0; q < this.sentenceList[i].chooseSenList.length; q++) {
+        if (
+          this.sentenceList[i].chooseSenList[q] == undefined ||
+          this.sentenceList[i].chooseSenList[q] == ""
+        ) {
+          this.sentenceList[i].chooseSenList[q] = s;
+          this.sentenceList[i].addChangeSen[j] = "";
+          break;
+        }
+      }
+      this.$forceUpdate();
+    },
+    returnCard(r, i, j) {
+      var a = this.sentenceList[i].addSentence.indexOf(r);
+      this.sentenceList[i].chooseSenList[j] = "";
+      this.sentenceList[i].addChangeSen[a] = r;
+      this.$forceUpdate();
+    },
+    // addSentenceTool() {
+    //   this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
+    //     this.taskCount
+    //   ].toolChoose[this.toolindex].sentenceList = this.sentenceList;
+    //   this.sentenceList = [
+    //     { sentenceTitle: "", addSentence: [], rightAnswer: [] },
+    //   ];
+    //   this.dialogVisibleSentence = false;
+    // },
     toolsCount(a, t) {
       let params = {
         cid: this.id,
@@ -9660,8 +10139,8 @@ export default {
 .worksAnswer > img {
   width: 500px;
   height: 300px;
-  object-fit:contain;
-  margin:0 auto;
+  object-fit: contain;
+  margin: 0 auto;
   display: block;
 }
 
@@ -10407,4 +10886,171 @@ ol {
   cursor: pointer;
   margin: 0 auto;
 }
+.sentenBox {
+  background: #fff;
+  height: 450px;
+  overflow: auto;
+  background-image: url("../assets/icon/conSentences/stuBg.png");
+  background-position: 102%;
+  background-repeat: no-repeat;
+  background-size: 60%;
+}
+.addSen {
+  background: #409efe;
+  width: 90px;
+  color: #fff;
+  height: 35px;
+  text-align: center;
+  line-height: 35px;
+  border-radius: 5px;
+  float: right;
+  margin: 10px 20px 0 0;
+  cursor: pointer;
+}
+.sentenTop {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+  padding: 55px 0 0 20px;
+  box-sizing: border-box;
+}
+.sentenTop > div:nth-child(2) {
+  width: 300px;
+  margin: 0 15px;
+}
+.sentenTop > div:nth-child(3) {
+  background: #409efe;
+  color: #fff;
+  width: 65px;
+  height: 35px;
+  text-align: center;
+  line-height: 35px;
+  border-radius: 5px;
+  cursor: pointer;
+}
+.cardList,
+.cardList1 {
+  padding: 10px 0 10px 0;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  align-items: center;
+  box-sizing: border-box;
+  border-bottom: 1px solid #f4f4f4;
+  width: 98%;
+  margin: 0 auto;
+  min-width: 60%;
+  max-width: 85%;
+}
+.cardList1 {
+  padding: 10px 0 10px 10px !important;
+  margin: 0 !important;
+}
+.cardBox {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  align-items: center;
+  align-content: center;
+}
+.cardBox > div {
+  margin-bottom: 10px;
+}
+.isCard,
+.isChooseCard,
+.noCard,
+.isCard1 {
+  width: 130px;
+  height: 60px;
+  text-align: center;
+  line-height: 60px;
+  font-size: 20px;
+  cursor: pointer;
+  background-image: url("../assets/icon/conSentences/titleBorder.png");
+  background-size: cover;
+  transition: all 2s;
+  margin-right: 20px;
+}
+.isCard > div,
+.noCard > div,
+.isCard1 > div {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  width: 75%;
+  margin: 0 auto;
+}
+.noCard {
+  background-image: none;
+}
+.isCard1 {
+  background-image: url("../assets/icon/conSentences/answerBorder.png");
+}
+.isChooseCard {
+  background-image: none;
+  border: 1px dashed #b9b9b9;
+  border-radius: 10px;
+}
+.card {
+  width: 130px;
+  height: 60px;
+}
+.card > img {
+  width: 100%;
+  height: 100%;
+}
+.rightCardBox {
+  margin: 10px 0 0 10px;
+}
+.rightCardBox > div:nth-child(1) {
+  margin-bottom: 10px;
+}
+.cardCss {
+  display: flex;
+  flex-direction: column;
+  flex-wrap: nowrap;
+  align-items: center;
+  border-bottom: 3px solid #b4c3d3;
+  padding: 0 0 5px 0;
+  margin-right: 10px;
+}
+.cardCss > div:nth-child(2) {
+  background: #5b7b9d;
+  color: #fff;
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  text-align: center;
+  line-height: 20px;
+}
+.isWrong {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-content: center;
+  align-items: center;
+}
+
+.answerRight {
+  width: 25%;
+}
+.isTj {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+}
+.isTj > div:nth-child(2) {
+  color: #727070;
+  margin-left: 10px;
+}
+.isTjImg {
+  width: 30px;
+  height: 30px;
+}
+.isTjImg > img {
+  width: 100%;
+  height: 100%;
+}
 </style>