第六个

lxl

2022-09-20 1e09b147f84337bcf4d0a106cf246c2ad9d16236

 src/views/maintenance/blackwhiteList.vue

@@ -8,10 +8,7 @@
    ></My-bread>
    <el-divider />
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane
        :label="$t('operatManage.BWL.blackList')"
        :name="$t('operatManage.BWL.blackList')"
      >
      <el-tab-pane :label="$t('operatManage.BWL.blackList')" name="first">
        <div class="inquire">
          <el-form ref="ruleForm" :model="form" :inline="true">
            <el-form-item
@@ -20,7 +17,7 @@
            >
              <el-input
                v-model="form.blackListIP"
                :placeholder="$t('operatManage.BWL.blackListIPInfo')"
                :placeholder="$t('operatManage.BWL.listIPInfo')"
              />
            </el-form-item>
            <el-form-item
@@ -63,9 +60,21 @@
              />
            </el-form-item>
            <el-form-item>
              <el-button @click="onSubmit">{{
                $t("operatManage.BWL.change")
              }}</el-button>
            </el-form-item>
            <el-form-item>
              <el-button @click="onSubmit"
                ><i class="el-icon-search"></i> &nbsp;{{
                  $t("operatManage.BWL.change")
                  $t("operatManage.BWL.search")
                }}</el-button
              >
            </el-form-item>
            <el-form-item>
              <el-button @click="onSubmit"
                ><i class="el-icon-delete"></i> &nbsp;{{
                  $t("operatManage.BWL.reset")
                }}</el-button
              >
            </el-form-item>
@@ -81,43 +90,44 @@
            />
            <el-table-column
              align="center"
              prop="username"
              :label="$t('operatManage.BWL.username')"
              prop="serviceName"
              :label="$t('operatManage.BWL.serviceName')"
            />
            <el-table-column
              align="center"
              prop="ip"
              :label="$t('operatManage.BWL.ip')"
              prop="accessSourceSystem"
              :label="$t('operatManage.BWL.accessSourceSystem')"
            />
            <el-table-column
              align="center"
              prop="IPState"
              :label="$t('operatManage.BWL.IPState')"
              prop="IPRequest"
              :label="$t('operatManage.BWL.IPRequest')"
            />
            <el-table-column
              align="center"
              prop="largeModuleName"
              :label="$t('operatManage.BWL.largeModuleName')"
              prop="servicesRequestUrl"
              :label="$t('operatManage.BWL.servicesRequestUrl')"
            />

            <el-table-column
              align="center"
              prop="resourceIDRequest"
              :label="$t('operatManage.BWL.resourceIDRequest')"
            />
            <el-table-column
              align="center"
              prop="smallModuleName"
              :label="$t('operatManage.BWL.smallModuleName')"
              prop="serviceSystemRequest"
              :label="$t('operatManage.BWL.serviceSystemRequest')"
            />
            <el-table-column
              align="center"
              prop="resourceName"
              :label="$t('operatManage.BWL.resourceName')"
              prop="blackListStatus"
              :label="$t('operatManage.BWL.blackListStatus')"
            />
            <el-table-column
              align="center"
              prop="date"
              :label="$t('operatManage.BWL.date')"
            />
            <el-table-column
              align="center"
              prop="operationType"
              :label="$t('operatManage.BWL.operationType')"
              prop="operate"
              :label="$t('operatManage.BWL.operate')"
            />
          </el-table>
          <div style="margin-top: 40px" class="pagination_box">
@@ -128,13 +138,105 @@
              :page-sizes="[10, 20, 30, 40]"
              :page-size="10"
              layout="total, sizes, prev, pager, next, jumper"
              :total="9"
              :total="0"
            >
            </el-pagination>
          </div>
        </div>
      </el-tab-pane>
      <el-tab-pane label="配置管理" name="second">配置管理</el-tab-pane>
      <el-tab-pane :label="$t('operatManage.BWL.whiteList')" name="second"
        ><div class="inquire">
          <el-form ref="ruleForm" :model="form" :inline="true">
            <el-form-item
              :label="$t('operatManage.BWL.whiteListIP')"
              prop="whiteListIP"
            >
              <el-input
                v-model="form.blackListIP"
                :placeholder="$t('operatManage.BWL.listIPInfo')"
              />
            </el-form-item>
            <el-form-item
              :label="$t('operatManage.BWL.IPState')"
              prop="IPState"
            >
              <el-select v-model="form.IPState">
                <el-option :label="$t('operatManage.BWL.all')" value="0" />
                <el-option :label="$t('operatManage.BWL.validity')" value="1" />
                <el-option
                  :label="$t('operatManage.BWL.invalidity')"
                  value="2"
                />
              </el-select>
            </el-form-item>
            <el-form-item>
              <el-button @click="onSubmit"
                ><i class="el-icon-search"></i> &nbsp;{{
                  $t("operatManage.BWL.search")
                }}</el-button
              >
            </el-form-item>
            <el-form-item>
              <el-button @click="onSubmit"
                ><i class="el-icon-delete"></i> &nbsp;{{
                  $t("operatManage.BWL.reset")
                }}</el-button
              >
            </el-form-item>
          </el-form>
        </div>
        <div class="table_box">
          <el-table :data="tableData" stripe style="width: 100%" height="99%">
            <el-table-column
              align="center"
              type="index"
              :label="$t('operatManage.BWL.index')"
              width="70px"
            />
            <el-table-column
              align="center"
              prop="whiteListIP"
              :label="$t('operatManage.BWL.whiteListIP')"
            />
            <el-table-column
              align="center"
              prop="effectiveDate"
              :label="$t('operatManage.BWL.effectiveDate')"
            />
            <el-table-column
              align="center"
              prop="requestUser"
              :label="$t('operatManage.BWL.requestUser')"
            />
            <el-table-column
              align="center"
              prop="tokenInfo"
              :label="$t('operatManage.BWL.tokenInfo')"
            />
            <el-table-column
              align="center"
              prop="whiteListStatus"
              :label="$t('operatManage.BWL.whiteListStatus')"
            />
            <el-table-column
              align="center"
              prop="operate"
              :label="$t('operatManage.BWL.operate')"
            />
          </el-table>
          <div style="margin-top: 40px" class="pagination_box">
            <el-pagination
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="currentPage"
              :page-sizes="[10, 20, 30, 40]"
              :page-size="10"
              layout="total, sizes, prev, pager, next, jumper"
              :total="0"
            >
            </el-pagination>
          </div></div
      ></el-tab-pane>
    </el-tabs>
  </div>
</template>
@@ -150,107 +252,16 @@

  data() {
    return {
      activeName: this.$t("operatManage.BWL.blackList"),
      activeName: "first",
      currentPage: 1,
      form: {
        blackListIP: "",
        IPState: this.$t("operatManage.BWL.all"),
        IPState: "",
        interceptionCycle: "",
        unit: this.$t("operatManage.BWL.seconds"),
        unit: "",
        interceptionNumber: "",
      },
      tableData: [
        {
          username: "管理员",
          ip: "221.182.31.12",
          date: "2022-08-05",
          IPState: "",
          largeModuleName: "运维监控",
          smallModuleName: "资源操作日志",
          resourceName: "",
          operationType: "查询",
        },
        {
          date: "2022-08-05",
          username: "管理员",
          IPState: "",
          largeModuleName: "运维监控",
          smallModuleName: "资源操作日志",
          resourceName: "",
          operationType: "查询",
          ip: "221.182.31.12",
        },
        {
          date: "2022-08-05",
          username: "管理员",
          IPState: "",
          largeModuleName: "运维监控",
          smallModuleName: "资源操作日志",
          resourceName: "",
          operationType: "查询",
          ip: "221.182.31.12",
        },
        {
          date: "2022-08-05",
          username: "管理员",
          IPState: "",
          largeModuleName: "运维监控",
          smallModuleName: "资源操作日志",
          resourceName: "",
          operationType: "查询",
          ip: "221.182.31.12",
        },
        {
          date: "2022-08-05",
          username: "管理员",
          IPState: "",
          largeModuleName: "运维监控",
          smallModuleName: "资源操作日志",
          resourceName: "",
          operationType: "查询",
          ip: "221.182.31.12",
        },
        {
          date: "2022-08-05",
          username: "管理员",
          IPState: "",
          largeModuleName: "运维监控",
          smallModuleName: "资源操作日志",
          resourceName: "",
          operationType: "查询",
          ip: "221.182.31.12",
        },
        {
          date: "2022-08-05",
          username: "管理员",
          IPState: "",
          largeModuleName: "运维监控",
          smallModuleName: "资源操作日志",
          resourceName: "",
          operationType: "查询",
          ip: "221.182.31.12",
        },
        {
          date: "2022-08-05",
          username: "管理员",
          IPState: "",
          largeModuleName: "运维监控",
          smallModuleName: "资源操作日志",
          resourceName: "",
          operationType: "查询",
          ip: "221.182.31.12",
        },
        {
          date: "2022-08-05",
          username: "管理员",
          IPState: "",
          largeModuleName: "运维监控",
          smallModuleName: "资源操作日志",
          resourceName: "",
          operationType: "查询",
          ip: "221.182.31.12",
        },
      ],
      tableData: [],
    };
  },
  methods: {