Browse Source

智能表单评分

11wqe1 1 tháng trước cách đây
mục cha
commit
0b80b17adb
3 tập tin đã thay đổi với 631 bổ sung9 xóa
  1. 3 0
      src/assets/clear.svg
  2. 3 0
      src/assets/delicon.svg
  3. 625 9
      src/components/pages/test/check/index.vue

+ 3 - 0
src/assets/clear.svg

@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7 4H9V2H7V4ZM10 2V4H13C13.5523 4 14 4.44772 14 5V7C14 7.50427 13.6267 7.92137 13.1414 7.99007L13.8369 12.8586C13.923 13.461 13.4555 14 12.847 14H3.15301C2.54446 14 2.077 13.461 2.16306 12.8586L2.85856 7.99007C2.37326 7.92137 2 7.50427 2 7V5C2 4.44772 2.44772 4 3 4H6V2C6 1.44772 6.44772 1 7 1H9C9.55228 1 10 1.44772 10 2ZM12.1327 7H13V5H9H7H3L3 7H3.8673H12.1327ZM12.1327 8H3.8673L3.15301 13H5V11H6V13H7.5V11H8.5V13H10V11H11V13H12.847L12.1327 8Z" fill="black" fill-opacity="0.9"/>
+</svg>

+ 3 - 0
src/assets/delicon.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10 19.7456C14.8325 19.7456 18.75 15.8281 18.75 10.9956C18.75 6.16307 14.8325 2.24556 10 2.24556C5.16751 2.24556 1.25 6.16307 1.25 10.9956C1.25 15.8281 5.16751 19.7456 10 19.7456ZM9.24988 5.99556H10.7498V7.4955H9.24988V5.99556ZM9.38202 9.12056H10.632V15.9953H9.38202V9.12056Z" fill="#D54941"/>
+</svg>

+ 625 - 9
src/components/pages/test/check/index.vue

@@ -214,6 +214,141 @@
                 >
                   AI分析
                 </div>
+
+
+
+                 <el-popover
+                 v-if="stype == 2"
+                  placement="top-start"
+                  width="320"
+                  ref="popover1"
+                  :visible-arrow="false"
+                  trigger="click"
+                  
+                  >
+                    <div class="openCeBox" v-loading="aiscoLoading">
+                        <div style="display: flex;justify-content: space-between;align-items: center;">
+                          <div class="TopTit">智能分析列</div>
+                          <el-popover
+                            placement="bottom"
+                            @click.native.stop
+                            :visible-arrow="false"
+                            width="300"
+                            ref="popover2"
+                            v-model="opQvisible"
+                            trigger="click">
+                            <div> 
+                              <div style="display: flex;align-items: center;margin-bottom: 10px;">
+                                <img src="../../../../assets/delicon.svg" alt="">是否确认清空
+                              </div>
+                              <div style="padding: 0 20px;box-sizing: border-box;">清空会删除所有配置信息,并同步删除已经生成完成的数据列。请谨慎操作!</div>
+                              <div style="display: flex;justify-content: flex-end;margin-top: 10px;">
+                                  <el-button class="BtnOPC" @click="opQvisible = false"> 取消</el-button>
+                                  <el-button class="BtnOPC" @click="cleancueWord" style="background: #1456F0;" type="primary">确定</el-button>
+                              </div>
+                            </div>
+                            <div class="Topkong" slot="reference">
+                              <img src="../../../../assets/clear.svg" alt="">
+                              清空
+                            </div> 
+                          </el-popover>
+
+                        </div>
+                        <div style="font-size: 12px;color: #6E6B6B;">标题</div>
+                        <div>
+                          <el-input v-model="cueWord.openCeTit" placeholder="输入列标题"></el-input>
+                        </div>
+                        <div style="font-size: 12px;color: #6E6B6B;">配置</div>
+                        <div style="background: #F5F6F7;padding: 10px;box-sizing: border-box;border-radius: 5px;">
+                          <div style="display: flex;justify-content: space-between;align-items: center;margin-bottom: 5px;">
+                            <div style="font-size: 12px;color: #6E6B6B;">输入指令*</div>
+                              
+                              <div style="position: relative;font-size: 12px;color: #3992EA;" >
+                                <div style="cursor: pointer;" @click="quoteShow">
+                                    <i class="el-icon-circle-plus-outline"></i>
+                                    引用字段
+                                </div>
+                                
+                              
+                                <div class="quoteBlock" v-if="quoteV">
+                                  <el-input  v-model="opcInp" placeholder="请输入内容">
+                                    <i slot="prefix" class="el-input__icon el-icon-search"></i>
+                                  </el-input>
+                                  <div class="quoteBlockCon">
+                                    <div v-if="!opcInp.trim() ? true : '序号'.includes(opcInp)" :class="[cueWord.fieldList.indexOf('序号') != -1 ? 'selCss' :'']" 
+                                    @click="addfield('序号')">序号</div>
+
+                                    <div v-if="!opcInp.trim() ? true :'提交人'.includes(opcInp)" :class="[cueWord.fieldList.indexOf('提交人') != -1 ? 'selCss' :'']" 
+                                    @click="addfield('提交人')">提交人</div>
+
+                                    <template  v-for="(i,index) in teaType">
+                                      <div v-if="!opcInp.trim() ? true : i.name.includes(opcInp)" :class="[cueWord.fieldList.indexOf(i.name) != -1 ? 'selCss' :'']" 
+                                       @click="addfield(i.name)" :key="index+'a'">
+                                        {{ i.name }}
+                                      </div>
+                                    </template>
+                                    
+
+                                    <div v-if="!opcInp.trim() ? true : '提交时间'.includes(opcInp)" :class="[cueWord.fieldList.indexOf('提交时间') != -1 ? 'selCss' :'']" 
+                                    @click="addfield('提交时间')">提交时间</div>
+
+                                    <template v-for="(i,index) in fie(chapters)">
+                                      <div :class="[cueWord.fieldList.indexOf(i.json.title) != -1 ? 'selCss' :'']" 
+                                        v-if="!opcInp.trim() ? true :i.json.title.includes(opcInp)" @click="addfield(i.json.title)" 
+                                        :key="index+'b'">
+                                        {{ i.json.title }}
+                                      </div>
+                                    </template>
+                                    
+                                  </div>
+                                 
+                                </div>
+                                <div class="maskCss" v-if="quoteV" @click.stop="quoteV = false,opcInp=''"></div>
+
+                              </div>
+
+                          </div>
+                          <div style="display: flex;gap: 8px;margin-bottom: 5px;flex-wrap: wrap;">
+                            <span class="SPCE" v-for="(i,index) in cueWord.fieldList" :key="index+'c'">
+                              {{ i }} <i @click="addfield(i)" class="el-icon-close" style="cursor: pointer;"></i>
+                            </span>
+                          </div>
+                          <div>
+                            <el-input
+                              resize="none"
+                              type="textarea"
+                              :rows="8"
+                              placeholder="请输入内容"
+                              v-model="cueWord.openCeCon">
+                            </el-input>
+                          </div>
+                        </div>
+                        <!-- <div style="display: flex;justify-content: flex-start;align-items: center;gap: 5px;">
+                          <el-switch
+                            v-model="openCeVal"
+                            >
+                          </el-switch>
+                          <span>自动更新
+                             <el-tooltip class="item" effect="dark" content="开启后,当前字段将跟随配置内容的变化同步更新" placement="top">
+                                <i class="el-icon-warning-outline"></i>
+                              </el-tooltip>
+                            </span>
+                        </div> -->
+                        <div style="margin-top: 10px;display: flex;justify-content: flex-end;">
+                          <el-button @click="opQvisible0 = false">取消</el-button>
+                          <el-button style="background: #1456F0;" @click="markSco()" type="primary">确定</el-button>
+                        </div>
+                    </div>
+
+
+                    <div
+                      slot="reference"
+                      class="btnA"
+                    >
+                      智能分析列
+                    </div>
+                </el-popover>
+
                 <!--v-if="this.worksArray.length"-->
               </div>
             </div>
@@ -1169,7 +1304,7 @@
                 width="170px"
                 align="left"
               >
-              <template slot="header" slot-scope="scope">
+              <template slot="header">
                   <div
                   style="display: flex; align-items: center"
                   >
@@ -1228,7 +1363,7 @@
                 "
               >
                 <!--  item.type==8?getTimeFilterText(item,index): item.type==8?(value,row)=>{return filterTime(value,row,index)}:  item.type == 8 ||-->
-                <template slot="header" slot-scope="scope">
+                <template slot="header">
                   <div
                     v-if="item.type == 8"
                     style="display: flex; align-items: center"
@@ -1369,6 +1504,21 @@
                   </div>
                 </template>
               </el-table-column>
+              <el-table-column
+                label="dee"
+                width="150px"
+                fixed="right"
+                v-if="scoList.length"
+              >
+              <template #header>
+                <div>
+                  <span>{{ cueWordCopy.openCeTit }} <span class="proBar" v-if="aiscoLoading">AI生成中{{ LoadingProgress }}%</span></span>
+                </div>
+              </template>
+                <template slot-scope="scope">
+                  <span>{{ userSco(scope.row.userid) }}</span>
+                </template>
+              </el-table-column>
               <el-table-column
                 label="操作"
                 width="200px"
@@ -1898,6 +2048,26 @@ export default {
   },
   data() {
     return {
+      aiscoId:'',
+      aiscoLoading:true,
+      cueWord:{
+        openCeCon:'', //指令
+        openCeTit:'', //标题
+        fieldList:[]
+      },
+      cueWordCopy:{
+        openCeCon:'', //指令
+        openCeTit:'', //标题
+        fieldList:[]
+      },
+      scoList:[],
+      quoteV:false, 
+      openCeVal:false,
+      LoadingProgress:0,
+      opQvisible:false,
+      opQvisible2:false,
+      opcInp:'',
+      languageSetting: 0,
       userid: this.$route.query.userid,
       oid: this.$route.query.oid,
       org: this.$route.query.org,
@@ -1969,6 +2139,24 @@ export default {
   },
   watch: {},
   computed: {
+     // 去除不能评分的指令
+    fie(){
+      return function (val) {
+        console.log('fie',val);
+        
+        const con = val.filter(e => [12,11,6,14].indexOf(e.type) == -1) 
+        return con
+      }
+    },
+    // ai评分分数
+    userSco(){
+      return function (val) {
+        const con = this.scoList.find(u => u.uid === val);
+        // console.log('con',con);
+        
+        return con ? con.sco : '';
+      }
+    },
     TeachNameCpt: function () {
       // `this` 指向 vm 实例
       return this.TeachingOptions.filter((i) => {
@@ -2133,6 +2321,337 @@ export default {
     }
   },
   methods: {
+// 清除分数
+    cleancueWord(){
+      if (!this.aiscoId) return
+      let params = [{
+        tid:this.cid
+      }]
+      console.log('params',params);
+       this.ajax
+        .post(this.$store.state.api + "deltestAisco", params)
+        .then((res) => {
+          console.log(res);
+           this.$message({
+            message: "删除成功",
+            type: "success"
+          });
+          this.getAiSco()
+        })
+        .catch((err) => {
+          this.$message({
+            message: "删除失败",
+            type: "error"
+          });
+          console.error(err);
+        });
+        this.opQvisible = false
+    },
+ // 点击开始评分
+    async markSco(){
+      if (!this.cueWord.openCeTit.trim()) return this.$message.error('请输入标题')
+      if (!this.cueWord.openCeCon.trim()) return this.$message.error('请输入指令')
+      if (this.cueWord.fieldList.length == 0) return this.$message.error('请选择引用字段')
+        this.aiscoLoading = true
+
+      let forAllList = [];
+      // this.scoList = []
+
+      for (let index = 0; index < this.tableWorksArray.length; index++) {
+          let mkAwit = this.loopSco(this.tableWorksArray[index],index)
+          forAllList.push(mkAwit);
+      }
+
+      Promise.all(forAllList)
+        .then(values => {
+          console.log("values", values);
+          
+          this.uploadSCo()
+
+          setTimeout(() => {
+            this.LoadingProgress = 0
+          }, 1000);
+        })
+        .catch(reason => {
+          this.aiscoLoading = false
+
+          this.$message({
+            message: "评价失败",
+            type: "error"
+          });
+          console.error("reasonreasonreasonreasonreason", reason);
+          // 输出“失败原因”
+        });
+    },
+    // ai评分循环
+    async loopSco(val){
+      console.log('6666',val);
+      
+      let userWork =[]
+      let _fileid = ''
+        for (let index = 0; index < val.array.length; index++) {
+          if (val.array[index].type == 3) {
+            userWork.push( {
+              // type:'文本',
+              tit: val.array[index].json.title,
+              con: val.array[index].json.answer2
+            })
+          }
+          if (val.array[index].type == 5) {
+            
+            if (val.array[index].json.file && val.array[index].json.file[0].url && this.cueWord.fieldList.indexOf('附件') != -1) {
+              _fileid = await this.createFileid(val.array[index].json.file[0].url)
+            }
+
+            userWork.push( {
+              // type:"附件",
+              detail:val.array[index].json.detail,
+              tit: val.array[index].json.title,
+              con: _fileid
+            })
+          }
+          if (val.array[index].type == 7) {
+            userWork.push( {
+              // type:"评分",
+              rule:`${val.array[index].json.small}分-${val.array[index].json.big}分`,
+              detail:val.array[index].json.detail,
+              tit: val.array[index].json.title,
+              con: val.array[index].json.answer2
+            })
+          }
+          if (val.array[index].type == 1) {
+            let kk = []
+            val.array[index].json.answer2.forEach((e)=>{
+              kk.push(val.array[index].json.array[e].option)
+            })
+            userWork.push( {
+              tit: val.array[index].json.title,
+              con: kk.join(','),
+              type: val.array[index].json.type == 1?"单选题": "多选题",
+            })
+          }
+        }
+      return new Promise((resolve, reject) => {
+        const result = userWork.filter(item => this.cueWord.fieldList.includes(item.tit));
+
+        let messages = `NOTICE
+                Role: 你是一个资深的教师,你要根据评分标准,对用户回答进行评分
+                  Language: ${this.getLang()}
+
+                  #目标
+                  作业内容中,tit是题目,con是用户回答。
+
+                  #评分资料#
+                  用户信息:
+                    ${this.cueWord.fieldList.includes('提交人') ? '提交人:' +val.name :''}
+                    ${this.cueWord.fieldList.includes('学段') ? '学段:' +this.getTType(this.teaType[0].id,val.cclassid) :''}
+                    ${this.cueWord.fieldList.includes('年级') ? '年级:' +this.getTType(this.teaType[1].id,val.cclassid) :''}
+                    ${this.cueWord.fieldList.includes('学科') ? '学科:' +this.getTType(this.teaType[2].id,val.cclassid) :''}
+                    ${this.cueWord.fieldList.includes('职务') ? '职务:' +this.getTType(this.teaType[3].id,val.cclassid) :''}
+                    ${this.cueWord.fieldList.includes('教龄') ? '教龄:' +this.getTType(this.teaType[4].id,val.cclassid) :''}
+                    ${this.cueWord.fieldList.includes('作业提交时间') ? '作业提交时间:' +val.time :''}
+
+                  评价标准:${this.cueWord.openCeCon}
+                  作业内容 :${_fileid ? "知识库中上传的文件内容与"+JSON.stringify(result)  : JSON.stringify(result)}
+                
+              
+                  #输出要求#
+                  未找到评价内容或相关信息的评为0分。
+                  直接输出分数!不要输入任何其他无关内容!
+
+                  #输出格式#
+                  0
+                  `;
+              
+                  // console.log('messages',messages);
+                  
+          let _this = this;
+          let params = {
+          assistant_id: "6063369f-289a-11ef-8bf4-12e77c4cb76b",
+          message: [
+            {
+              type: "text",
+              text: messages.replaceAll("\n", " ").replaceAll("*", "")
+            }
+          ],
+          session_name: uuidv4(),
+          userId: this.userid,
+          file_ids: _fileid ? [_fileid] : [],
+          isImage: "",
+          model: "gpt-4o-2024-11-20"
+          };
+          this.ajax
+            .post("https://gpt4.cocorobo.cn/ai_agent_park_chat", params)
+            .then(response => {
+                 let data = response.data.FunctionResponse;
+                  console.log("data", data);
+
+              try {
+                  //  const prompt = [
+                  //     {
+                  //       role: 'user',
+                  //       content: `输出一个json格式的格式如下:{uid:${ val.userid },sco: ${data.message}}}`,
+                  //     },
+                  //   ];
+                  //   this.chat_no_stream(prompt, { type: 'json_object' }).then((res) => {
+                  //     // this.suggestList = JSON.parse(res).suggest;
+                  //     console.log(res);
+                  //   });
+                  let ind = this.scoList.findIndex(e=> e.uid == val.userid )
+                 console.log('ind',ind);
+
+                  if (ind != -1) {
+                    this.scoList.splice(ind,1,{uid: val.userid ,sco: data.message})
+                  }else{
+                    this.scoList.push({uid: val.userid ,sco: data.message})
+                  }
+
+              } catch (error) {
+                 let ind = this.scoList.findIndex(e=> e.uid == val.userid )
+                 console.log('ind',ind);
+                 
+                  if (ind != -1) {
+                    this.scoList.splice(ind,1,{uid: val.userid ,sco: ''})
+                  }else{
+                    this.scoList.push({uid: val.userid ,sco: ''})
+                  }
+                // this.scoList.push({uid: val.userid ,sco: data.message})
+                this.$message.error( val.name + '评分失败')
+              }
+              this.LoadingProgress = ((this.scoList.length / this.tableWorksArray.length) * 100).toFixed(0)
+
+              return resolve(1)
+            })
+            .catch(error => {
+              this.aiscoLoading = false
+              this.$message.error('评分失败')
+              reject(error)
+              console.log(error);
+            });
+        })
+      
+    },
+    // 获取评分
+    async getAiSco(){
+      return new Promise((resolve, reject) => {
+        this.aiscoLoading = true
+        let params = {
+          tid: this.cid,
+        };
+        this.ajax
+          .get(this.$store.state.api + "getTestAiSco", params)
+          .then((res) => {
+            if (res.data[0].length) {
+                this.aiscoId = res.data[0][0].id
+                this.cueWord = JSON.parse(res.data[0][0].cueWord)
+                this.cueWordCopy = JSON.parse(res.data[0][0].cueWord)
+                this.scoList = JSON.parse(res.data[0][0].json)
+            }else{
+              this.cueWord={
+                openCeCon:'', //指令
+                openCeTit:'', //标题
+                fieldList:[]
+              }
+              this.cueWordCopy={
+                openCeCon:'', //指令
+                openCeTit:'', //标题
+                fieldList:[]
+              }
+              this.scoList=[]
+            }
+            this.aiscoLoading = false
+             
+              console.log('8888888888',res.data[0]);
+              resolve(1)
+          })
+          .catch((err) => {
+            reject(err)
+            this.aiscoLoading = false
+
+            console.error(err);
+          });
+      })
+      
+    },
+    // 上传评分
+    uploadSCo(){
+      this.aiscoLoading = true
+
+      let params = [{
+        tid:this.cid,
+        uid:'6063369f-289a-11ef-8bf4-12e77c4cb76b',
+        json:JSON.stringify(this.scoList),
+        cw: JSON.stringify(this.cueWord)
+      }]
+      console.log('params',params);
+       this.ajax
+        .post(this.$store.state.api + "addtestAiSco", params)
+        .then((res) => {
+          console.log(res);
+           this.$message({
+            message: "评价成功",
+            type: "success"
+          });
+          this.getAiSco()
+        })
+        .catch((err) => {
+          this.aiscoLoading = false
+          this.$message({
+            message: "评价失败",
+            type: "error"
+          });
+          console.error(err);
+        });
+    },
+    // 获取文档id
+    createFileid(url) {
+      let _this = this;
+      return new Promise((resolve, reject) => {
+        try {
+          _this.ajax
+            .put("https://gpt4.cocorobo.cn/upload_file_knowledge", {
+              url: url
+            })
+            .then(res => {
+              let _data = res.data.FunctionResponse;
+              if (_data.result && _data.result.id) {
+                resolve(_data.result.id);
+              } else {
+                resolve(1);
+              }
+            })
+            .catch(function(error) {
+              resolve(1);
+            });
+        } catch (e) {
+          resolve(1);
+        }
+      });
+    },
+    getLang() {
+      let lang = "";
+      if (this.languageSetting == 0) {
+        lang = "Chinese.";
+      } else if (this.languageSetting == 1) {
+        lang = "Traditional Chinese.";
+      } else if (this.languageSetting == 2) {
+        lang = "English.";
+      }
+      return lang;
+    },
+    // 打开引用字段弹框
+    quoteShow(){
+      this.quoteV = !this.quoteV 
+    },
+    // 添加指令字段
+    addfield(val){
+      if (this.cueWord.fieldList.indexOf(val) != -1) {
+        const index = this.cueWord.fieldList.indexOf(val)
+        this.cueWord.fieldList.splice(index, 1)
+      }else{
+        this.cueWord.fieldList.push(val)
+      }
+    },
     openChat() {
       this.aiChatV = !this.aiChatV;
       this.$nextTick(() => {
@@ -2317,8 +2836,10 @@ export default {
       }
     },
 
-    getData() {
+    async getData() {
       this.isLoading = true;
+      await this.getAiSco()
+
       let params = [
         {
           cid: this.cid,
@@ -4070,8 +4591,8 @@ ${JSON.stringify(item.array)}
   color: #00000099;
 }
 
-.test_title .left .info .info_box span:nth-child(2) {
-}
+/* .test_title .left .info .info_box span:nth-child(2) {
+} */
 
 .test_title .right {
   display: flex;
@@ -4094,11 +4615,11 @@ ${JSON.stringify(item.array)}
   align-items: center;
 }
 
-.test_title .right .data_box span:nth-child(1) {
+/* .test_title .right .data_box span:nth-child(1) {
 }
 
 .test_title .right .data_box span:nth-child(2) {
-}
+} */
 
 .test_title .right .data_box span:nth-child(2) .big {
   font-size: 22px;
@@ -4127,8 +4648,8 @@ ${JSON.stringify(item.array)}
   background-size: 100% 100%;
 }
 
-.test_title .right .btn_box span:nth-child(2) {
-}
+/* .test_title .right .btn_box span:nth-child(2) {
+} */
 
 .search_nav {
   border-bottom: 1px solid #e7e7e7;
@@ -4893,4 +5414,99 @@ ${JSON.stringify(item.array)}
 .timePickerActive{
   color: #409EFF;
 }
+.openCeBox{
+  width: 320px;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  font-size: 14px !important;
+  padding: 10px;
+  box-sizing: border-box;
+}
+.TopTit{
+  font-family: PingFang SC;
+  font-weight: 600;
+  font-size: 16px;
+  line-height: 24px;
+  color: #000;
+}
+.Topkong{
+  font-family: PingFang SC;
+  font-weight: 400;
+  font-size: 12px;
+  color: #000;
+  display: flex;
+  align-items: center;
+  gap: 5px;
+  cursor: pointer;
+}
+.BtnOPC{
+    width: 50px;height: 30px;font-size: 14px;display: flex;
+    justify-content: center;
+    align-items: center;
+    background: #E7E7E7;
+}
+.quoteBlock{
+  position: absolute;
+  right: 0;
+  width: 220px;
+  background: #fff;
+  border-radius: 10px;
+  color: #000;
+  z-index: 100001;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); /* 浅灰色阴影 */
+  border-radius: 5px;overflow: hidden;
+}
+.quoteBlock >>> .el-input__inner{
+    border-radius: 0 !important;
+    border: none !important;
+    box-shadow: none !important;
+   resize: none !important;
+   border-bottom: 1px #DCDFE6 solid !important;
+}
+.quoteBlockCon{
+  padding: 10px 10px;box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  font-size: 14px;
+  height: 200px;
+  overflow: auto;
+}
+
+.quoteBlockCon > div{
+  height: 25px;line-height: 25px;
+  cursor: pointer;
+  padding: 0 5px;
+  box-sizing: border-box;
+  border-radius: 5px;
+}
+.maskCss{
+  /* background: #000; */
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 10000;
+  opacity: .5;
+}
+.SPCE{
+  font-size: 12px;
+  background: #fff;
+  padding: 2px 5px;box-sizing: border-box;
+  border-radius: 3px;
+}
+.selCss{
+  background: #e7e7e7;
+  color:#0061ff;
+}
+.proBar{
+    background: #dae0f0;
+    font-size: 14px;
+    font-weight: normal;
+    color: #6f93ea;
+    padding: 4px;
+    border-radius: 3px;
+}
 </style>