Merge branch 'master' of https://git.cocorobo.cn/CocoRoboLabs/pbl-teacher-table

src/components/pages/race/addRace.vue

@@ -176,6 +176,7 @@ export default {
           info: JSON.stringify(this.raceInfo),
           over: JSON.stringify(this.raceOverView),
           pro: JSON.stringify(this.raceProcess),
+          courseType: JSON.stringify(this.raceInfo.type),
           res: JSON.stringify(this.raceEffect),
         },
       ];

src/components/pages/race/eventCenter.vue

@@ -18,7 +18,7 @@
     </div>
     <div class="center_body">
       <EventMessage v-if="steps == 1"></EventMessage>
-      <MyAnli v-if="steps == 2"></MyAnli>
+      <MyAnli :userid="userid" :oid="oid" v-if="steps == 2"></MyAnli>
       <ProjectJd v-if="steps == 3"></ProjectJd>
     </div>
     <div class="center_btn">

src/components/pages/race/eventCenter/myAnli.vue

@@ -1,11 +1,105 @@
 <template>
-    <div class="center_content">我的案例</div>
+  <div class="center_content">
+    <div class="myAnliBox">
+      <div class="anLi" v-for="(an, anIndex) in anliBox" :key="anIndex">
+        <div class="anliTop">
+          <div class="anliTopLeft">
+            <div>比赛名称：广东省PBL案例征集</div>
+            <div>比赛类别：{{ an.typename ? an.typename : "暂无分类" }}</div>
+          </div>
+          <div class="anliTopRight">创建人：{{ an.username }}</div>
+        </div>
+
+        <div class="anliMiddle">
+          <div class="anliBox">
+            <div class="anliImg">
+              <img
+                :src="
+                  JSON.parse(an.info).cover && JSON.parse(an.info).cover.length
+                    ? JSON.parse(an.info).cover[0].url
+                    : noBanner
+                "
+                alt=""
+              />
+            </div>
+            <div class="anliNav">
+              <div>项目名称：{{ JSON.parse(an.info).title }}</div>
+              <div>单位：{{ an.schoolName }}</div>
+              <div>
+                {{ JSON.parse(an.info).courseText }}
+              </div>
+              <div class="people">
+                <div class="man">
+                  <img src="../../../../assets/people.png" alt />
+                </div>
+                <div class="person">12人</div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div class="anliBottom">
+          <div class="bottomLeft">
+            当前状态：{{ an.state == 0 ? "未提交" : "已提交" }}
+          </div>
+          <div class="bottomRight">
+            <div class="rightButton" @click="updateState(an.id)">提交</div>
+            <div class="rightButton">导出</div>
+            <div class="rightButton">开始教学</div>
+            <div class="rightButton">编辑</div>
+            <div class="rightButton" style="background: #225ac7">查看详情</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
 export default {
-
-}
+  props: ["userid", "oid"],
+  data() {
+    return {
+      anliBox: [],
+      noBanner: require("../../../../assets/noBanner.jpg"),
+    };
+  },
+  methods: {
+    selectAnLi() {
+      let params = {
+        uid: this.userid,
+      };
+      this.ajax
+        .get(this.$store.state.api + "selectRaceList", params)
+        .then((res) => {
+          this.anliBox = res.data[0];
+        })
+        .catch((err) => {
+          console.error(err);
+        });
+    },
+    updateState(id) {
+      let params = {
+        id: id,
+      };
+      this.ajax
+        .get(this.$store.state.api + "updateRaceState", params)
+        .then((res) => {
+          this.$message({
+            message: "提交成功",
+            type: "success",
+          });
+          this.selectAnLi();
+        })
+        .catch((err) => {
+          console.error(err);
+        });
+    },
+  },
+  created() {
+    this.selectAnLi();
+  },
+};
 </script>
 
 <style scoped>
@@ -13,4 +107,105 @@ export default {
   width: 100%;
   height: 100%;
 }
+.anLi {
+  background: #fff;
+  width: 95%;
+  margin: 20px auto;
+  border-radius: 10px;
+}
+.anliTop {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+  justify-content: space-between;
+}
+.anliTopLeft {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+  color: #afafaf;
+  padding: 20px 0 10px 30px;
+}
+.anliTopLeft > div:nth-child(2) {
+  padding-left: 20px;
+}
+.anliTopRight {
+  padding: 20px 30px 10px 0;
+}
+.anliMiddle {
+  padding: 0 0 5px 30px;
+}
+.anliImg {
+  width: 200px;
+}
+.anliImg > img {
+  width: 100%;
+  height: 100%;
+}
+.people {
+  display: flex;
+}
+
+.person {
+  margin-left: 10px;
+  line-height: 18px;
+}
+.man {
+  width: 16px;
+  height: 16px;
+}
+
+.man > img {
+  width: 100%;
+  height: 100%;
+}
+.anliBox {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: flex-start;
+}
+.anliNav {
+  padding-left: 30px;
+}
+.anliNav > div:nth-child(1) {
+  font-size: 20px;
+  font-weight: bold;
+}
+.anliNav > div:nth-child(2) {
+  font-weight: bold;
+  margin: 15px 0 10px 0;
+}
+.anliNav > div:nth-child(3) {
+  color: #aba8a8;
+  margin-bottom: 10px;
+}
+.anliBottom {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 10px 15px 30px;
+}
+.bottomRight {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+}
+.rightButton {
+  background: #499eef;
+  color: #fff;
+  width: 60px;
+  height: 30px;
+  text-align: center;
+  line-height: 30px;
+  font-size: 14px;
+  border-radius: 5px;
+  cursor: pointer;
+  margin-right: 20px;
+}
 </style>