<template>
  <div>
    <div>
      <div class="flex-box">
        <div class="flex-1">
          <div
            style="background-color: #fff; padding: 20px; margin-bottom: 10px"
            class="br-5"
          >
            <div class="flex-box-ce">
              <div style="margin-right: 10px">
                <userImage
                  :id="course_account_info.id"
                  :img_url="course_account_info.img_url"
                  :user_name="course_account_info.name"
                  width="50px"
                  height="50px"
                ></userImage>
              </div>
              <div class="flex-1">
                <div
                  class="flex-box-ce"
                  style="
                    margin-bottom: 6px;
                    font-size: 14px;
                    color: #666;
                    font-weight: 700;
                  "
                >
                  <div
                    style="
                      font-size: 16px;
                      font-weight: 700;
                      padding-right: 15px;
                    "
                    class="black"
                  >
                    {{ course_account_info.name }}
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="other" style="background-color: #5FA4E8;overflow: hidden;border-radius: 5px;">
        <img
          src="static/images/login2.png"
          style="margin:  150px auto; display: block;"
        />
      </div>
    </div>
  </div>
</template>

<script>
import { mapGetters, mapState } from "vuex";
export default {
  name: "",
  components: {},
  props: [],
  data() {
    return {};
  },
  created() {},
  mounted() {},
  methods: {},
  computed: {
    ...mapGetters(["course_account_info"]),
  },
};
</script>
<style scoped lang="scss">
.page {
  background-color: #fff;
}
</style>
