ducha-qianduan/src/components/look_word/bdgleven.vue

<template>
  <div>
    <el-button class="box1" @click="daochu">导出</el-button>

    <div class="word" id="contents" style="font-family: 'fangsong'">
      <!-- <div class="fTitle">大队连务会记录本</div> -->
      <p
        style="
          font-size: 14pt;
          font-weight: 900;
          margin-botttom: 30px;
          color: black;
          text-align: center;
        "
      >
        《连务会记录本》
      </p>

      <table
        border="1"
        style="
          border-collapse: collapse;
          border: none;
          mso-border-left-alt: 0.5pt solid windowtext;
          mso-border-top-alt: 0.5pt solid windowtext;
          mso-border-right-alt: 0.5pt solid windowtext;
          mso-border-bottom-alt: 0.5pt solid windowtext;
          mso-border-insideh: 0.5pt solid windowtext;
          mso-border-insidev: 0.5pt solid windowtext;
          mso-padding-alt: 0pt 0pt 0pt 0pt;
        "
        width="600"
        align="center"
        bordercolor="black"
      >
        <tbody>
          <tr class="JR_tr">
            <td
              width="80"
              class="JR_left"
              style="border-right: 1px dashed #999"
            >
              <p align="center">&nbsp;&nbsp;时 &nbsp;&nbsp;&nbsp;&nbsp;间</p>
            </td>
            <td class="JR_right">
              <p align="left" style="padding-left: 20px">
                {{ message.convokeTime }}
              </p>
            </td>
          </tr>
          <tr class="JR_tr">
            <td class="JR_left">
              <p align="center">&nbsp;&nbsp;地 &nbsp;&nbsp;&nbsp;&nbsp;点</p>
            </td>
            <td class="JR_right">
              <p align="left" style="padding-left: 20px">
                {{ message.address }}
              </p>
            </td>
          </tr>
          <tr class="JR_tr">
            <td class="JR_left">
              <p align="center">&nbsp;&nbsp;出席人</p>
            </td>
            <td class="JR_right">
              <p align="left" style="padding-left: 20px">
                {{ message.joinId }}
              </p>
            </td>
          </tr>
          <tr class="JR_tr">
            <td class="JR_left">
              <p align="center">&nbsp;&nbsp;主持人</p>
            </td>
            <td class="JR_right">
              <p align="left" style="padding-left: 20px">
                {{ message.compereRen }}
              </p>
            </td>
          </tr>
          <tr class="JR_tr">
            <td class="JR_left">
              <p align="center">&nbsp;&nbsp;记录人</p>
            </td>
            <td class="JR_right">
              <p align="left" style="padding-left: 20px">
                {{ message.peopleJiLu }}
              </p>
            </td>
          </tr>

          <tr class="JR_tr">
            <td class="JR_left">
              <p align="right" style="text-align: center; line-height: 20px">
                议<br />题
              </p>
            </td>
            <td
              class="JR_right"
              align="left"
              style="line-height: 20px; text-indent: 30px"
              v-html="message.title"
            >
              <!-- {{ message.title }} -->
            </td>
          </tr>
          <tr class="JR_tr">
            <td class="JR_left">
              <p align="right" style="text-align: center; line-height: 20px">
                会<br />议<br />内<br />容
              </p>
            </td>
            <td
              align="left"
              class="JR_right"
              style="line-height: 20px; text-indent: 30px"
              v-html="message.contents"
            ></td>
          </tr>

          <tr class="JR_tr">
            <td
              colspan="2"
              class="JR_bottom"
              style="border-left: 1px solid black"
            >
              <p style="text-align: right; padding-right: 80px">主持人：</p>
            </td>
          </tr>
          <tr class="JR_tr">
            <td
              colspan="2"
              class="JR_bottom"
              style="border-left: 1px solid black"
            >
              <p style="text-align: right; padding-right: 80px">记录人：</p>
            </td>
          </tr>
          <tr class="JR_tr">
            <td
              colspan="2"
              class="JR_bottom"
              style="border-left: 1px solid black"
            >
              <!--<p style=" text-align:right;padding-right: 10px;">　　　　年　　月　　日</p>-->
              <p style="text-align: right; padding-right: 80px">时间：</p>
            </td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</template>
<script>
import { lookWord } from "@/utils/look_word.js";

import "@/utils/lodJs.js";
export default {
  name: "bdgleven",
  props: ["message"],
  data() {
    return {
      title: "连务会记录本",
      style:
        ".JR_tr {height: 40px;};.JR_left{border-right:none;width: 120px;font-size: 1.331em; font-family: '楷体_GB2312';};.JR_right{border-left:0; font-size: 1.331em; font-family: 仿宋_GB2312;};.JR_bottom{border-left:0; font-size: 1.331em; font-family: 仿宋_GB2312; text-align: right}",
    };
  },
  methods: {
    daochu() {
      lookWord(this.title, "#contents", this.style);
    },
  },
};
</script>
<style scoped>
tbody {
  color: #fff;
  text-align: center;
}
tr:last-child {
  border-bottom: 1px solid;
}

/* @font-face {
  font-family: 'siYuan';
  src: url('../../assets/css/siyuan.OTF');
}
@font-face {
  font-family: 'siyuan-x';
  src: url('../../assets/css/SOURCEHANSANSCN-REGULAR.OTF');
} */
.box1 {
  position: absolute;
  right: 30px;
  top: 80px;
  border: 1px solid rgb(129, 130, 131);
  border-radius: 5px;
}
</style>