样式调整

Administrator

2021-11-03 0ba5628cb5282ebbb1eac30c886f1af0d7d431f8

样式调整

 src/views/accreditationRecords/accreditationRecords.vue

@@ -23,6 +23,7 @@
    >
      <template slot="menuLeft">
        <el-button
          style="display:none"
          type="danger"
          size="small"
          icon="el-icon-delete"
@@ -37,11 +38,12 @@
        <el-tag>{{ row.categoryName }}</el-tag>
      </template>
      <template slot-scope="{ type, size, row }" slot="menu">
        <el-button 
        :size="size" 
        :type="type" 
        v-if="permission.notice_upload"
        @click="handleUploadPage(row)"
        <el-button
          style="display:none"
          :size="size"
          :type="type"
          v-if="permission.notice_upload"
          @click="handleUploadPage(row)"
          >附件上传
        </el-button>
        <!-- <el-button
@@ -52,15 +54,26 @@
          >附件查看
        </el-button> -->
      </template>
      <template slot-scope="{ row }" slot="deptName">
            <el-tag>{{ row.deptName }}</el-tag>
      </template>
      <template slot-scope="{ row }" slot="sex">
            <el-tag>{{ row.sex=="1"?"男":row.sex=="2"?"女":""}}</el-tag>
      </template>
    </avue-crud>
  </basic-container>
</template>

<script>
import { getListPage, remove, update, add, getNotice } from "@/api/desk/notice";
import {
  getList,
  remove,
  update,
  add,
} from "@/api/accreditationRecords/accreditationRecords";
import { getDept } from "@/api/system/dept";
import { mapGetters } from "vuex";
import { mapState } from 'vuex';
import { mapState } from "vuex";

export default {
  data() {
@@ -97,116 +110,105 @@
        addBtnText: "发布",
        addTitle: "发布",
        saveBtnText: "发布",
        menuWidth: 320,
        menuWidth: 150,
        dialogClickModal: false,
        column: [
          {
            label: "通知标题",
            prop: "title",
            span: 24,
            searchSpan: 4,
            row: true,
            label: "姓名",
            prop: "realName",
            search: true,
            rules: [
              {
                required: true,
                message: "请输入通知标题",
                trigger: "blur",
              },
            ],
            searchSpan: 3,
            width:100,
            searchLabelWidth: 50,
            display: false,
          },
          // {
          //   label: "所属保安公司",
          //   searchLabelWidth: "110",
          //   // prop: "deptName",
          //   prop: "deptId",
          //   type: "tree",
          //   dicUrl:
          //     "/api/blade-system/dept/security_lazy-tree?parentId=1413470343230877697",
          //   props: {
          //     label: "title",
          //     value: "id",
          //   },
          //   // hide: true,
          //   slot: true,
          //   searchSpan: 5,
          //   display: false,
          //   search: true,
          //   minWidth: 260,
          // },
          {
              label: "所属保安公司",
              searchLabelWidth: "110",
              prop: "deptName",
              // type: "tree",
              // dicUrl: "/api/blade-system/dept/security_lazy-tree?parentId=1413470343230877697",
              // props: {
              //     label: "title",
              //     value: "id",
              // },
              slot: true,
              searchSpan: 5,
              display: false,
              search: true,
              minWidth: 200
          },
          {
            label: "通知类型",
            label: "性别",
            prop: "sex",
            width: 80,
            type: "select",
            dicUrl: "/api/blade-system/dict/dictionary?code=notice",
            props: {
              label: "dictValue",
              value: "dictKey",
            },
            dataType: "number",
            slot: true,
            addDisplay: false,
            editDisplay: false,
            defaultValue: "1",
            prop: "category",
            display: false,
          },
          {
            label: "身份证号码",
            prop: "idCardNo",
            search: true,
            searchLabelWidth: 90,
            searchSpan: 5,
            display: false,
          },
          {
            label: "年龄",
            prop: "age",
            display: false,
          },
          {
            label: "保安证编号",
            prop: "securityNumber",
            search: true,
            searchLabelWidth: 90,
            minWidth: 105,
            searchSpan: 4,
            rules: [
              {
                required: true,
                message: "请输入通知类型",
                trigger: "blur",
              },
            ],
          },
          {
            label: "发布单位",
            prop: "deptId",
            type: "tree",
            dicUrl: "/api/blade-system/dept/lazy-tree",
            props: {
              label: "title",
              value: "id",
            },
            addDisplay: false,
            editDisplay: false,
            rules: [
              {
                required: true,
                message: "所属组织机构",
                trigger: "click",
              },
            ],
            // hide: true,
          },
          // {
          //   label: "申请人",
          //   prop: "createUser",
          //   search: true,
          //   searchLabelWidth: 90,
          //   minWidth: 105,
          //   searchSpan: 4,
          //   addDisplay: false,
          //   editDisplay: false,
          //   // hide: true,
          // },
          {
            label: "通知时间",
            prop: "releaseTimeRange",
            type: "datetime",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            searchRange: true,
            hide: true,
            label: "申请时间",
            prop: "createTime",
            // search: true,
            searchLabelWidth: 90,
            minWidth: 105,
            // searchSpan: 4,
            addDisplay: false,
            editDisplay: false,
            viewDisplay: false,
            search: true,
            searchSpan:6,
            rules: [
              {
                required: true,
                message: "请输入通知时间",
                trigger: "blur",
              },
            ],
          },
          {
            label: "通知日期",
            prop: "releaseTime",
            type: "date",
            format: "yyyy-MM-dd hh:mm:ss",
            valueFormat: "yyyy-MM-dd hh:mm:ss",
            rules: [
              {
                required: true,
                message: "请输入通知日期",
                trigger: "click",
              },
            ],
          },
          {
            label: "通知内容",
            prop: "content",
            component: "AvueUeditor",
            options: {
              action: "/api/blade-resource/oss/endpoint/put-file",
              props: {
                res: "data",
                url: "link",
              },
            },
            hide: true,
            minRows: 6,
            span: 24,
            // hide: true,
          },
        ],
      },
@@ -217,10 +219,10 @@
    ...mapGetters(["userInfo", "permission"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.notice_add, false),
        addBtn: this.vaildData(null, false),
        viewBtn: this.vaildData(this.permission.notice_view, false),
        delBtn: this.vaildData(this.permission.notice_delete, false),
        editBtn: this.vaildData(this.permission.notice_edit, false),
        delBtn: this.vaildData(null, false),
        editBtn: this.vaildData(null, false),
      };
    },
    ids() {
@@ -231,8 +233,8 @@
      return ids.join(",");
    },
    ...mapState({
        userInfo: state => state.user.userInfo
    })
      userInfo: (state) => state.user.userInfo,
    }),
  },
  mounted() {
    this.getDeptInfo(this.userInfo.dept_id);
@@ -246,7 +248,6 @@
        deptCategory == 1
          ? (that.deptCategory = true)
          : (that.deptCategory = false);

      });
    },
    //跳转到附件列表页面
@@ -262,10 +263,10 @@
    rowSave(row, done, loading) {
      if (this.deptCategory) {
        row.category = 1;
      }else{
      } else {
        row.category = 2;
      }
      row['type'] = 1;
      row["type"] = 1;
      row.deptId = this.deptId;
      add(row).then(
        () => {
@@ -390,23 +391,23 @@
          ? (that.deptCategory = true)
          : (that.deptCategory = false);

        const { releaseTimeRange } = this.query;
        // const { releaseTimeRange } = this.query;
        params["jurisdiction"] = this.jurisdiction;
        params["type"] = 1;
        let values = {
          ...params,
        };
        if (releaseTimeRange) {
          values = {
            ...params,
            startTime: releaseTimeRange[0],
            endTime: releaseTimeRange[1],
            ...this.query,
          };
          values.releaseTimeRange = null;
        }
        // if (releaseTimeRange) {
        //   values = {
        //     ...params,
        //     startTime: releaseTimeRange[0],
        //     endTime: releaseTimeRange[1],
        //     ...this.query,
        //   };
        //   values.releaseTimeRange = null;
        // }
        this.loading = true;
        getListPage(page.currentPage, page.pageSize, values).then((res) => {
        getList(page.currentPage, page.pageSize, values).then((res) => {
          const data = res.data.data;
          this.page.total = data.total;
          this.data = data.records;

 src/views/securityGuard/securityCertificate.vue

@@ -23,22 +23,22 @@
        <div v-if="!data.avatar">暂无照片</div>
        <img :src="data.avatar" alt="" v-else />
      </div>
      <div class="security_m_l_titleName">{{ data.realName }}</div>
      <div class="security_m_l_titlepaperTimenian">
      <div class="security_m_l_titleName widt">{{ data.realName }}</div>
      <div class="security_m_l_titlepaperTimenian widt">
        {{ data.paperTime.slice(0, 4) }}
      </div>
      <div class="security_m_l_titlepaperTimeyue">
      <div class="security_m_l_titlepaperTimeyue widt">
        {{ data.paperTime.slice(5, 7) }}
      </div>
      <div class="security_m_l_titlepaperTimeri">
      <!-- <div class="security_m_l_titlepaperTimeri">
        {{ data.paperTime.slice(8, 10) }}
      </div>
      <div class="security_m_l_downsecuritynumber">
      </div> -->
      <div class="security_m_l_downsecuritynumber widt">
        {{ data.securitynumber }}
      </div>
      <div class="security_m_r_o_right">{{ data.realName }}</div>
      <div class="security_m_r_o_rightbirthday">{{ data.birthday }}</div>
      <div class="security_m_r_o_rightaddress security_m_r_o_l_r">
      <div class="security_m_r_o_right widt">{{ data.realName }}</div>
      <div class="security_m_r_o_rightbirthday widt">{{ data.cardid.slice(6, 10) }}. {{ data.cardid.slice(10, 12) }}. {{ data.cardid.slice(12, 14) }}</div>
      <div class="security_m_r_o_rightaddress security_m_r_o_l_r widt">
        {{ data.address }}
      </div>
      <div class="security_m_r_o_rightcardid">{{ data.cardid }}</div>
@@ -96,7 +96,7 @@
}
// 标题
$upTop: 55px;
$downTop: 280px;
$downTop: 230px;  //整体高度
//经国家保安员考试审查合格。<br />特颁此证。
.security_main-title {
  position: absolute;
@@ -121,6 +121,7 @@
  top: 421px;
  left: 32px;
  font-size: 24px;
  font-weight: 500;
}

$rightLeft: 343px;
@@ -137,6 +138,7 @@
  width: $rightWidth;
  text-align: justify;
  text-align-last: justify;
  font-weight: 500;
}
//出生年月
.security_m_r_b {
@@ -186,7 +188,7 @@
// 抬头名字
.security_m_l_titleName {
  position: absolute;
  top: 46px;
  top: 16px;
  left: 85px;
  line-height: 45px;
  font-size: 22px;
@@ -194,7 +196,7 @@
  letter-spacing: 3px;
}
//发证时间
$timeTop: 320px;
$timeTop: 280px; //整体高度
//年
.security_m_l_titlepaperTimenian {
  position: absolute;
@@ -202,6 +204,7 @@
  left: 104px;
  font-size: 18px;
  line-height: 40px;
  // font-weight: 500;
}
//月
.security_m_l_titlepaperTimeyue {
@@ -210,6 +213,7 @@
  left: 164px;
  font-size: 18px;
  line-height: 40px;
  // font-weight: 500;
}
//日
.security_m_l_titlepaperTimeri {
@@ -218,22 +222,28 @@
  left: 209px;
  font-size: 18px;
  line-height: 40px;
  // font-weight: 500;
}
//证件编号
.security_m_l_downsecuritynumber {
  position: absolute;
  top: 419px;
  top: 369px; //整体高度
  left: 146px;
  font-size: 24px;
}



//内容
// 姓名
$centerLeft: 430px;
$centerLeft: 440px;
.security_m_r_o_right {
  position: absolute;
  top: $downTop;
  left: $centerLeft;
  font-size: $rightFontSize;
  // width: $rightWidth;
  // font-weight: 500;
}
// 生日
.security_m_r_o_rightbirthday {
@@ -242,6 +252,7 @@
  left: $centerLeft;
  font-size: $rightFontSize;
  // width: $rightWidth;
  // font-weight: 500;
}
// 地址
.security_m_r_o_rightaddress {
@@ -250,6 +261,7 @@
  left: $centerLeft;
  font-size: $rightFontSize;
  width: 160px;
  // font-weight: 500;
}
// 身份证
.security_m_r_o_rightcardid {
@@ -258,6 +270,7 @@
  left: $centerLeft;
  font-size: $rightFontSize;
  // width: $rightWidth;
  // font-weight: 500;
}
//背景图
.security_main_backImge {
@@ -268,4 +281,7 @@
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
// .widt{
//   font-weight: 550;
// }
</style>

 src/views/securityGuard/securityGuard.vue

@@ -58,6 +58,7 @@
              >个人照片批量上传
            </el-button>
            <el-button
              style="display:none"
              type="primary"
              size="small"
              plain