11

WXL

2024-01-07 41355b421530e46b4386569bb26bc505c55cce77

11

 src/views/project/fund/performancedetails/index.vue

@@ -7,28 +7,54 @@
        <el-row>
          <el-col :span="5">
            <el-form-item label="申请日期" prop="applyTime">
              <el-date-picker clearable style="width: 100%" v-model="form.applyTime" type="date"
                value-format="yyyy-MM-dd HH:mm:ss" placeholder="申请日期" disabled="true">
              <el-date-picker
                clearable
                style="width: 100%"
                v-model="form.applyTime"
                type="date"
                value-format="yyyy-MM-dd HH:mm:ss"
                placeholder="申请日期"
                disabled="true"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item label="经办人" prop="username">
              <el-select v-model="form.username" placeholder="申请人" clearable filterable allow-create style="width: 100%"
                @change="getUserAccount">
                <el-option v-for="dict in userlist" :key="dict.index" :label="dict.nickname"
                  :value="dict.nickname"></el-option>
              <el-select
                v-model="form.username"
                placeholder="申请人"
                clearable
                filterable
                allow-create
                style="width: 100%"
                @change="getUserAccount"
              >
                <el-option
                  v-for="dict in userlist"
                  :key="dict.index"
                  :label="dict.nickname"
                  :value="dict.nickname"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item label="所属组别" prop="deptmentname">
              <el-input v-model="form.deptmentname" placeholder="请输入所属组别" clearable />
              <el-input
                v-model="form.deptmentname"
                placeholder="请输入所属组别"
                clearable
              />
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item label="组长" prop="managername">
              <el-input v-model="form.managername" placeholder="请输入组长" clearable />
              <el-input
                v-model="form.managername"
                placeholder="请输入组长"
                clearable
              />
            </el-form-item>
          </el-col>
        </el-row>
@@ -40,13 +66,26 @@
          </el-col>
          <el-col :span="5">
            <el-form-item label="申请金额" prop="pretaxcost">
              <el-input v-model="form.pretaxcost" placeholder="税前金额合计" :disabled="true" />
              <el-input
                v-model="form.pretaxcost"
                placeholder="税前金额合计"
                :disabled="true"
              />
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item label="申请材料状态" prop="infoid">
              <el-select v-model="form.checkstatus" filterable placeholder="请选择申请材料状态">
                <el-option v-for="item in baselisttages" :key="item.id" :label="item.name" :value="item.id">
              <el-select
                v-model="form.checkstatus"
                filterable
                placeholder="请选择申请材料状态"
              >
                <el-option
                  v-for="item in baselisttages"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                >
                </el-option>
              </el-select>
            </el-form-item>
@@ -61,103 +100,239 @@
        </el-row>
        <el-row style="margin-top: 5px; margin-bottom: 5px" />
        <el-row v-if="jurisdiction">
          <el-alert title="当前为查看状态，不支持修改存储。" type="warning" show-icon>
          <el-alert
            title="当前为查看状态，不支持修改存储。"
            type="warning"
            show-icon
          >
          </el-alert>
        </el-row>
        <el-row>
          <el-col :span="3">
            <div style="margin-bottom: 15px;">
              <el-button type="primary" icon="el-icon-download" size="small" @click="Batchentry">批量录入人员</el-button>
              <el-button
                type="primary"
                icon="el-icon-download"
                size="small"
                @click="Batchentry"
                >批量录入人员</el-button
              >
            </div>
          </el-col>
          <el-col :span="3" v-if="userprofile.nickName == '陈慕华' && operationType == 'check'">
          <el-col
            :span="3"
            v-if="userprofile.nickName == '陈慕华' && operationType == 'check'"
          >
            <div style="margin-bottom: 15px;">
              <el-button type="success" icon="el-icon-edit-outline" size="small" @click="Manualcalculationfn">计算个税</el-button>
              <el-button
                type="success"
                icon="el-icon-edit-outline"
                size="small"
                @click="Manualcalculationfn"
                >计算个税</el-button
              >
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-table :data="rbDetails" v-loading="loading" max-height="800" border highlight-current-row>
            <el-table-column prop="orderno" align="center" label="序号" width="88">
          <el-table
            :data="rbDetails"
            v-loading="loading"
            max-height="800"
            border
            highlight-current-row
          >
            <el-table-column
              prop="orderno"
              align="center"
              label="序号"
              width="88"
            >
              <template slot-scope="scope">
                <el-input v-model="scope.row.orderno" placeholder="序号" />
              </template>
            </el-table-column>
            <el-table-column prop="applytype" align="center" label="服务类型" width="200">
            <el-table-column
              prop="applytype"
              align="center"
              label="服务类型"
              width="200"
            >
              <template slot-scope="scope">
                <el-select v-model="scope.row.applytype" placeholder="请选择服务类型" @change="verifyFeeItemType(scope.row)">
                  <el-option v-for="dict in rowfeeItemTypes" :key="dict.value" :label="dict.label"
                    :value="dict.value"></el-option>
                <el-select
                  v-model="scope.row.applytype"
                  placeholder="请选择服务类型"
                  @change="verifyFeeItemType(scope.row)"
                >
                  <el-option
                    v-for="dict in rowfeeItemTypes"
                    :key="dict.value"
                    :label="dict.label"
                    :value="dict.value"
                  ></el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column prop="itemid" align="center" label="服务项目" width="260">
            <el-table-column
              prop="itemid"
              align="center"
              label="服务项目"
              width="260"
            >
              <template slot-scope="scope">
                <el-select v-model="scope.row.itemid" placeholder="请选择服务项目" filterable @change="verifyFeeItem(scope.row)"
                  :filter-method="val => searchItemType(val, scope)">
                  <el-option v-for="dict in scope.row.itemlist" :key="dict.id" :label="dict.itemName"
                    :value="dict.id"></el-option>
                <el-select
                  v-model="scope.row.itemid"
                  placeholder="请选择服务项目"
                  filterable
                  @change="verifyFeeItem(scope.row)"
                  :filter-method="val => searchItemType(val, scope)"
                >
                  <el-option
                    v-for="dict in scope.row.itemlist"
                    :key="dict.id"
                    :label="dict.itemName"
                    :value="dict.id"
                  ></el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column prop="amount" align="center" label="税前金额" width="120">
            <el-table-column
              prop="amount"
              align="center"
              label="税前金额"
              width="120"
            >
              <template slot-scope="scope">
                <el-input v-model="scope.row.amount" placeholder="税前金额" @blur="val => {
                  calculateTax(scope.row, 'A');
                }
                  " />
                <el-input
                  v-model="scope.row.amount"
                  placeholder="税前金额"
                  @blur="
                    val => {
                      calculateTax(scope.row, 'A');
                    }
                  "
                />
              </template>
            </el-table-column>
            <el-table-column prop="taxedamount" align="center" label="税后金额" width="120">
            <el-table-column
              prop="taxedamount"
              align="center"
              label="税后金额"
              width="120"
            >
              <template slot-scope="scope">
                <el-input v-model="scope.row.taxedamount" placeholder="税后金额" @blur="val => {
                  calculateTax(scope.row, 'B');
                }
                  " />
                <el-input
                  v-model="scope.row.taxedamount"
                  placeholder="税后金额"
                  @blur="
                    val => {
                      calculateTax(scope.row, 'B');
                    }
                  "
                />
              </template>
            </el-table-column>
            <el-table-column prop="beneficiaryname" align="center" label="绩效人员或单位" width="250">
            <el-table-column
              prop="beneficiaryname"
              align="center"
              label="绩效人员或单位"
              width="250"
            >
              <template slot-scope="scope">
                <el-button type="primary" plain @click="ShowDetailDialog(scope, 'expert')">{{
                  scope.row.beneficiaryname
                  ? scope.row.beneficiaryname
                  : "点击选择"
                }}</el-button>
                <el-button
                  type="primary"
                  plain
                  @click="ShowDetailDialog(scope, 'expert')"
                  >{{
                    scope.row.beneficiaryname
                      ? scope.row.beneficiaryname
                      : "点击选择"
                  }}</el-button
                >
              </template>
            </el-table-column>
            <el-table-column prop="idcardno" align="center" label="身份证号" width="200">
            <el-table-column
              prop="idcardno"
              align="center"
              label="身份证号"
              width="200"
            >
              <template slot-scope="scope">
                <el-input v-model="scope.row.idcardno" placeholder="身份证号" />
              </template>
            </el-table-column>

            <el-table-column prop="depositbank" align="center" label="开户银行" width="200">
            <el-table-column
              prop="depositbank"
              align="center"
              label="开户银行"
              width="200"
            >
              <template slot-scope="scope">
                <el-input v-model="scope.row.depositbank" placeholder="开户银行" />
                <el-input
                  v-model="scope.row.depositbank"
                  placeholder="开户银行"
                />
              </template>
            </el-table-column>
            <el-table-column prop="bankcardno" align="center" label="银行帐号" width="210">
            <el-table-column
              prop="bankcardno"
              align="center"
              label="银行帐号"
              width="210"
            >
              <template slot-scope="scope">
                <el-input v-model="scope.row.bankcardno" placeholder="银行帐号" />
                <el-input
                  v-model="scope.row.bankcardno"
                  placeholder="银行帐号"
                />
              </template>
            </el-table-column>
            <el-table-column prop="remark" align="center" width="330" label="备注">
            <el-table-column
              prop="remark"
              align="center"
              width="330"
              label="备注"
            >
              <template slot-scope="scope">
                <el-input type="textarea" :rows="2" v-model="scope.row.remark" placeholder="备注" />
                <el-input
                  type="textarea"
                  :rows="2"
                  v-model="scope.row.remark"
                  placeholder="备注"
                />
              </template>
            </el-table-column>
            <el-table-column fixed="right" align="center" label="操作" width="180">
            <el-table-column
              fixed="right"
              align="center"
              label="操作"
              width="180"
            >
              <template slot-scope="scope">
                <el-button type="text" size="mini" @click="addRow(scope.$index)" v-if="operationType == 'add' ||
                  operationType == 'update' ||
                  operationType == 'check'
                  ">新增</el-button>
                <el-button @click.native.prevent="
                  deleteRows(scope.row, scope.$index, rbDetails)
                  " type="text" size="small" v-if="operationType == 'add' ||
    operationType == 'update' ||
    operationType == 'check'
    ">
                <el-button
                  type="text"
                  size="mini"
                  @click="addRow(scope.$index)"
                  v-if="
                    operationType == 'add' ||
                      operationType == 'update' ||
                      operationType == 'check'
                  "
                  >新增</el-button
                >
                <el-button
                  @click.native.prevent="
                    deleteRows(scope.row, scope.$index, rbDetails)
                  "
                  type="text"
                  size="small"
                  v-if="
                    operationType == 'add' ||
                      operationType == 'update' ||
                      operationType == 'check'
                  "
                >
                  删除
                </el-button>
              </template>
@@ -165,23 +340,48 @@
          </el-table>
        </el-row>

        <el-row v-if="operationType == 'detail' ||
          operationType == 'check' ||
          operationType == 'update'
          ">
        <el-row
          v-if="
            operationType == 'detail' ||
              operationType == 'check' ||
              operationType == 'update'
          "
        >
          <el-table :data="fundflowList" border>
            <el-table-column label="审核日期" align="center" width="160" prop="createTime" />
            <el-table-column label="审核人" align="center" width="120" prop="checkusername" />
            <el-table-column label="审核结果" align="center" width="200" prop="flowconclusion">
            <el-table-column
              label="审核日期"
              align="center"
              width="160"
              prop="createTime"
            />
            <el-table-column
              label="审核人"
              align="center"
              width="120"
              prop="checkusername"
            />
            <el-table-column
              label="审核结果"
              align="center"
              width="200"
              prop="flowconclusion"
            >
              <template slot-scope="scope">
                <span v-if="scope.row.flowconclusion == 1">通过</span>
                <span v-if="scope.row.flowconclusion == 2">不通过</span>
              </template>
            </el-table-column>
            <el-table-column label="审核备注" align="center" prop="flowcontent" />
            <el-table-column
              label="审核备注"
              align="center"
              prop="flowcontent"
            />
          </el-table>
        </el-row>
        <el-row style="margin-top: 25px; margin-bottom: 5px" v-if="operationType == 'check'">
        <el-row
          style="margin-top: 25px; margin-bottom: 5px"
          v-if="operationType == 'check'"
        >
          <el-col :span="7">
            <el-form-item label="审核结果" align="left">
              <el-radio-group v-model="checkObj.flowlevelone" align="left">
@@ -200,28 +400,62 @@
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm" v-if="operationType == 'add' ||
          operationType == 'update' ||
          ismanager == true ||
          beforehandType == '1'
          ">提交保存</el-button>
        <el-button type="success" @click="handleup"
          v-if="operationType == 'add' || operationType == 'update'">上报</el-button>
        <el-button type="primary" @click="checksubmit"
          v-if="operationType == 'check' && beforehandType != '1'">提交审核</el-button>
        <el-button
          type="primary"
          @click="submitForm"
          v-if="
            operationType == 'add' ||
              operationType == 'update' ||
              ismanager == true ||
              beforehandType == '1'
          "
          >提交保存</el-button
        >
        <el-button
          type="success"
          @click="handleup"
          v-if="operationType == 'add' || operationType == 'update'"
          >上报</el-button
        >
        <el-button
          type="primary"
          @click="checksubmit"
          v-if="operationType == 'check' && beforehandType != '1'"
          >提交审核</el-button
        >
        <el-button @click="cancel">关 闭</el-button>
      </div>
    </div>

    <el-dialog :visible.sync="showSelectionDialog" :close-on-click-modal="false" :title="'绩效人员（含所在单位）账号选择'" width="500px"
      style="text-align: center" v-loading="loading">
    <el-dialog
      :visible.sync="showSelectionDialog"
      :close-on-click-modal="false"
      :title="'绩效人员（含所在单位）账号选择'"
      width="500px"
      style="text-align: center"
      v-loading="loading"
    >
      <el-form ref="funddetailForm" :model="funddetailForm">
        <el-row>
          <el-form-item label="请输入选择：" prop="unitno" label-width="120px">
            <el-select v-model="funddetailForm.userName" filterable remote reserve-keyword allow-create
              default-first-option placeholder="请输入姓名或单位名称" :remote-method="remoteMethod" :loading="loadingperformance"
              style="width: 100%">
              <el-option v-for="item in optionsperformance" :key="item.value" :label="item.label" :value="item.value">
            <el-select
              v-model="funddetailForm.userName"
              filterable
              remote
              reserve-keyword
              allow-create
              default-first-option
              placeholder="请输入姓名或单位名称"
              :remote-method="remoteMethod"
              :loading="loadingperformance"
              style="width: 100%"
            >
              <el-option
                v-for="item in optionsperformance"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
@@ -229,14 +463,20 @@
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="showSelectionDialog = false">取 消</el-button>
        <el-button type="primary" @click="ConfirmDetailDialog()">确 定</el-button>
        <el-button type="primary" @click="ConfirmDetailDialog()"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <el-dialog title="提示" :visible.sync="Savereminder" width="30%">
      <el-alert :title="'您已添加' +
        totalquantity +
        '条数据，为防止数据丢失是否提交保存再继续添加。'
        " type="warning">
      <el-alert
        :title="
          '您已添加' +
            totalquantity +
            '条数据，为防止数据丢失是否提交保存再继续添加。'
        "
        type="warning"
      >
      </el-alert>
      <span slot="footer" class="dialog-footer">
        <el-button @click="unsave">取 消</el-button>
@@ -245,7 +485,11 @@
    </el-dialog>

    <!-- 批量选取 -->
    <el-dialog title="批量生成明细信息" :visible.sync="batchdialogVisible" width="40%">
    <el-dialog
      title="批量生成明细信息"
      :visible.sync="batchdialogVisible"
      width="40%"
    >
      <div style="margin-bottom: 15px; margin-left: 10px;">
        <el-radio-group v-model="Performanceclass">
          <el-radio-button :label="68">月度绩效</el-radio-button>
@@ -254,11 +498,24 @@
        </el-radio-group>
      </div>
      <div style="max-height: 330px; overflow-y: auto">
        <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
        <el-checkbox
          :indeterminate="isIndeterminate"
          v-model="checkAll"
          @change="handleCheckAllChange"
          >全选</el-checkbox
        >
        <div style="margin: 15px 0;"></div>
        <el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
          <el-checkbox border v-for="city in cityOptions" :label="city" :key="city.userNo">{{ city.userName
          }}</el-checkbox>
        <el-checkbox-group
          v-model="checkedCities"
          @change="handleCheckedCitiesChange"
        >
          <el-checkbox
            border
            v-for="city in cityOptions"
            :label="city"
            :key="city.userNo"
            >{{ city.userName }}</el-checkbox
          >
        </el-checkbox-group>
      </div>

@@ -577,13 +834,13 @@
  watch: {},
  //方法集合
  methods: {
    bbaaccss(val) { },
    bbaaccss(val) {},
    // 浏览器页面关闭或刷新提示
    beforeunloadHandler(e) {
      if (
        (JSON.stringify(this.form) == sessionStorage.getItem("apiform") &&
          JSON.stringify(this.rbDetails) ==
          sessionStorage.getItem("apifunddetail")) ||
            sessionStorage.getItem("apifunddetail")) ||
        !sessionStorage.getItem("apifunddetail")
      ) {
      } else {
@@ -768,7 +1025,10 @@
            }

            sessionStorage.removeItem("apifunddetail");
            sessionStorage.setItem("apifunddetail", JSON.stringify(this.rbDetails));
            sessionStorage.setItem(
              "apifunddetail",
              JSON.stringify(this.rbDetails)
            );
          } else {
            this.addRow(0);
          }
@@ -884,7 +1144,7 @@
    handleDelete() {
      this.$modal
        .confirm("是否确认删除该记录？")
        .then(function () {
        .then(function() {
          return delFund(this.curId);
        })
        .then(() => {
@@ -897,7 +1157,7 @@
          this.getfundList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => { });
        .catch(() => {});
    },

    /** 上报按钮操作 */
@@ -905,7 +1165,7 @@
      if (
        (JSON.stringify(this.form) == sessionStorage.getItem("apiform") &&
          JSON.stringify(this.rbDetails) ==
          sessionStorage.getItem("apifunddetail")) ||
            sessionStorage.getItem("apifunddetail")) ||
        !sessionStorage.getItem("apifunddetail")
      ) {
      } else {
@@ -922,7 +1182,18 @@
          //判断是否存在上报记录
          this.form.recordstatus = 0;
          var currenttime = new Date();
          this.form.applyTime = currenttime.getFullYear() + "-" + (currenttime.getMonth() + 1) + "-" + currenttime.getDate() + " " + currenttime.getHours() + ":" + currenttime.getMinutes() + ":" + currenttime.getSeconds();
          this.form.applyTime =
            currenttime.getFullYear() +
            "-" +
            (currenttime.getMonth() + 1) +
            "-" +
            currenttime.getDate() +
            " " +
            currenttime.getHours() +
            ":" +
            currenttime.getMinutes() +
            ":" +
            currenttime.getSeconds();

          if (!this.form.id) {
            this.form.id = this.$route.query.id;
@@ -963,7 +1234,7 @@
      return randomString;
    },
    /** 提交按钮 */
    submitForm: debounce(function () {
    submitForm: debounce(function() {
      if (!this.randomnumber) {
        this.randomnumber = this.generateRandomString(9);
        this.form.randomnumber = this.randomnumber;
@@ -979,16 +1250,16 @@
            if (tempDetail.itemid == null) {
              this.$modal.msgWarning(
                "服务项目表中，第" +
                (k + 1).toString() +
                "行的服务项目未选择，请先选择服务项目后再提交保存！"
                  (k + 1).toString() +
                  "行的服务项目未选择，请先选择服务项目后再提交保存！"
              );
              return;
            }
            if (tempDetail.idcardno == null) {
              this.$modal.msgWarning(
                "服务项目表中，第" +
                (k + 1).toString() +
                "行的身份证未完善，请先填写身份证后再提交保存！"
                  (k + 1).toString() +
                  "行的身份证未完善，请先填写身份证后再提交保存！"
              );
              return;
            }
@@ -997,8 +1268,8 @@
              if (tempDetail.servicesscope == null) {
                this.$modal.msgWarning(
                  "服务项目表中，第" +
                  (k + 1).toString() +
                  "行的费用说明未选择,请选择费用说明后再提交保存！"
                    (k + 1).toString() +
                    "行的费用说明未选择,请选择费用说明后再提交保存！"
                );
                return;
              }
@@ -1006,8 +1277,8 @@
              if (tempDetail.beneficiaryno == null) {
                this.$modal.msgWarning(
                  "服务项目表中，第" +
                  (k + 1).toString() +
                  "行的服务人员姓名为选择,请选择人员后再提交保存！"
                    (k + 1).toString() +
                    "行的服务人员姓名为选择,请选择人员后再提交保存！"
                );
                return;
              }
@@ -1053,8 +1324,8 @@
              ) {
                this.$modal.msgWarning(
                  "服务项目表中，第" +
                  (j + 1).toString() +
                  "行的金额未输入，请先输入金额后再提交保存！"
                    (j + 1).toString() +
                    "行的金额未输入，请先输入金额后再提交保存！"
                );
                return;
              }
@@ -1068,8 +1339,8 @@
              ) {
                this.$modal.msgWarning(
                  "服务项目表中，第" +
                  (j + 1).toString() +
                  "行的金额未输入，请先输入金额后再提交保存！"
                    (j + 1).toString() +
                    "行的金额未输入，请先输入金额后再提交保存！"
                );
                return;
              }
@@ -1453,8 +1724,8 @@
            if (tempDetail.itemid == null) {
              this.$modal.msgWarning(
                "服务项目表中，第" +
                (k + 1).toString() +
                "行的服务项目未选择，请先选择服务项目后再提交保存！"
                  (k + 1).toString() +
                  "行的服务项目未选择，请先选择服务项目后再提交保存！"
              );
              return;
            }
@@ -1463,8 +1734,8 @@
              if (tempDetail.servicesscope == null) {
                this.$modal.msgWarning(
                  "服务项目表中，第" +
                  (k + 1).toString() +
                  "行的费用说明未选择,请选择费用说明后再提交保存！"
                    (k + 1).toString() +
                    "行的费用说明未选择,请选择费用说明后再提交保存！"
                );
                return;
              }
@@ -1472,8 +1743,8 @@
              if (tempDetail.beneficiaryno == null) {
                this.$modal.msgWarning(
                  "服务项目表中，第" +
                  (k + 1).toString() +
                  "行的服务人员姓名为选择,请选择人员后再提交保存！"
                    (k + 1).toString() +
                    "行的服务人员姓名为选择,请选择人员后再提交保存！"
                );
                return;
              }
@@ -1518,8 +1789,8 @@
            ) {
              this.$modal.msgWarning(
                "服务项目表中，第" +
                (j + 1).toString() +
                "行的金额未输入，请先输入金额后再提交保存！"
                  (j + 1).toString() +
                  "行的金额未输入，请先输入金额后再提交保存！"
              );
              return;
            }
@@ -1867,7 +2138,7 @@
  destroyed() {
    window.removeEventListener("beforeunload", e => this.beforeunloadFn(e));
  }, //生命周期 - 销毁完成
  activated() { } //如果页面有keep-alive缓存功能，这个函数会触发
  activated() {} //如果页面有keep-alive缓存功能，这个函数会触发
};
</script>

@@ -1950,7 +2221,7 @@
  line-height: 25px;
}

::v-deep .el-checkbox.is-bordered+.el-checkbox.is-bordered {
::v-deep .el-checkbox.is-bordered + .el-checkbox.is-bordered {
  margin-left: 0 !important;
  margin-bottom: 10px;
}