From 308362a1439b443ed6b959adf1e1d93309ee766c Mon Sep 17 00:00:00 2001
From: xiaozhiyong <xiaozhiyong@sdxkhlw.cn>
Date: Tue, 14 Feb 2023 13:35:22 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/login.js                             |  21 +-
 src/api/refineryAccount.js                   |  22 ++
 src/permission.js                            |  59 +---
 src/utils/dataType.js                        |  12 +
 src/utils/index.js                           |   4 +
 src/views/login/index.vue                    | 119 ++++---
 src/views/product/components/record.vue      |   2 +
 src/views/product/index.vue                  |  39 +++
 src/views/refineryAccount/components/add.vue | 146 +++++++++
 src/views/refineryAccount/index.vue          | 322 +++++++++++++++++++
 src/views/refineryInfo/index.vue             |  53 ++-
 11 files changed, 679 insertions(+), 120 deletions(-)
 create mode 100644 src/api/refineryAccount.js
 create mode 100644 src/utils/dataType.js
 create mode 100644 src/views/refineryAccount/components/add.vue
 create mode 100644 src/views/refineryAccount/index.vue

diff --git a/src/api/login.js b/src/api/login.js
index 8eaa623..0a0e7ca 100644
--- a/src/api/login.js
+++ b/src/api/login.js
@@ -1,7 +1,18 @@
 import request from "utils/axios.js";
 //登录
-// const login = (params) => {
-//   return request.postJson("/oil-identity/operationUser/xlLoginPwd", params);
-// };
-
-export default {};
+const login = (params) => {
+  return request.postJson("/oil-identity/oilRefinery/loginOMSByPwd", params);
+};
+//关联企业
+const getRefineryByCustomerId = (phone) => {
+  return request.get(
+    `/oil-user/oilCustomerRefineryRelation/getRefineryByCustomerId/${phone}`
+  );
+};
+//路由
+const getCustomerRouters = () => {
+  return request.get(
+    "/oil-identity/oilRefinery/getCustomerRouters/REFINERY_OMS_WEB"
+  );
+};
+export default { login, getRefineryByCustomerId, getCustomerRouters };
diff --git a/src/api/refineryAccount.js b/src/api/refineryAccount.js
new file mode 100644
index 0000000..38b4f05
--- /dev/null
+++ b/src/api/refineryAccount.js
@@ -0,0 +1,22 @@
+import request from "utils/axios.js";
+// table
+const getByPage = (params) => {
+  return request.postJson(
+    "/oil-refinery/xoilRefineryAccount/getByPage",
+    params
+  );
+};
+// 新增
+const save = (params) => {
+  return request.postJson("/oil-refinery/xoilRefineryAccount/save", params);
+};
+// 修改
+const update = (params) => {
+  return request.postJson("/oil-refinery/xoilRefineryAccount/update", params);
+};
+
+export default {
+  getByPage,
+  save,
+  update,
+};
diff --git a/src/permission.js b/src/permission.js
index 5d4ef8f..758b924 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -12,66 +12,10 @@ NProgress.configure({ showSpinner: false }); // NProgress Configuration
 
 const whiteList = ["/login"]; // no redirect whitelist
 
-const asyncRoutes = [
-  {
-    component: "Layout",
-    hidden: false,
-    menuType: "C",
-    meta: { title: "", icon: "" },
-    path: "/",
-    children: [
-      {
-        component: "refineryInfo/index",
-        hidden: false,
-        menuType: "C",
-        meta: { title: "炼厂信息", icon: "iconfenpei3" },
-        name: "refineryInfo",
-        path: "refineryInfo",
-      },
-    ],
-  },
-  {
-    component: "Layout",
-    hidden: false,
-    menuType: "C",
-    meta: { title: "", icon: "" },
-    path: "/",
-    children: [
-      {
-        component: "product/index",
-        hidden: false,
-        menuType: "C",
-        meta: { title: "产品列表", icon: "iconfenpei3" },
-        name: "Product",
-        path: "product",
-      },
-    ],
-  },
-  {
-    component: "Layout",
-    hidden: false,
-    menuType: "C",
-    meta: { title: "", icon: "" },
-    path: "/",
-    children: [
-      {
-        component: "order/index",
-        hidden: false,
-        menuType: "C",
-        meta: { title: "订单管理", icon: "iconfenpei3" },
-        name: "Order",
-        path: "order",
-      },
-    ],
-  },
-];
-
 router.beforeEach(async (to, from, next) => {
   NProgress.start();
   document.title = getPageTitle(to.meta.title);
-
   const hasToken = localStorage.getItem("token");
-  // const hasToken = 1;
   if (hasToken) {
     if (to.path === "/login") {
       next({ path: "/" });
@@ -91,8 +35,7 @@ router.beforeEach(async (to, from, next) => {
           };
           store.dispatch("user/info", infoRes.data);
 
-          // let routerRes = await serve.getRouter();
-          let routerRes = { data: asyncRoutes };
+          let routerRes = await serve.getCustomerRouters();
           let realRouter = filterAsyncRouter(routerRes.data);
           store.dispatch("permission/generateRoutes", realRouter);
           router.addRoutes(realRouter);
diff --git a/src/utils/dataType.js b/src/utils/dataType.js
new file mode 100644
index 0000000..8a56550
--- /dev/null
+++ b/src/utils/dataType.js
@@ -0,0 +1,12 @@
+export const refineryTypeEnum = [
+  {
+    label: "普通炼厂",
+    value: "COMMON",
+  },
+];
+export const refineryAccountTypeEnum = [
+  {
+    label: "普通炼厂",
+    value: "COMMON",
+  },
+];
diff --git a/src/utils/index.js b/src/utils/index.js
index 09d2e74..4b6ed6c 100644
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -51,3 +51,7 @@ export function isLicensePlate(no) {
   );
   return instance.test(no);
 }
+
+export function cellStyle() {
+  return "text-align:center";
+}
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index 1e82d77..8a8fbc5 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -62,55 +62,72 @@
         <span> password: any</span>
       </div>
     </el-form>
+
+    <el-dialog
+      :visible.sync="companySelectDialog"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      width="500px"
+      title="请选择登录企业"
+    >
+      <el-table :data="companyList">
+        <el-table-column property="companyName" label="公司名称" width="200" />
+        <el-table-column property="parentMark" label="公司性质">
+          <template slot-scope="{ row }">
+            <el-tag v-if="row.parentMark === 0" effect="dark" size="normal"
+              >主体公司</el-tag
+            >
+            <el-tag v-else effect="dark" type="info" size="normal"
+              >分公司</el-tag
+            >
+          </template>
+        </el-table-column>
+        <el-table-column property="name" label="操作">
+          <template slot-scope="scope">
+            <el-button
+              type="text"
+              size="small"
+              @click="loginAgain(scope.row.companyId)"
+              >登录</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-dialog>
   </div>
 </template>
 
 <script>
-import { validUsername } from "@/utils/validate";
+import serve from "api/login.js";
+import md5 from "js-md5";
 
 export default {
   name: "Login",
   data() {
     const validateUsername = (rule, value, callback) => {
-      if (!validUsername(value)) {
-        callback(new Error("Please enter the correct user name"));
-      } else {
-        callback();
-      }
-    };
-    const validatePassword = (rule, value, callback) => {
-      if (value.length < 6) {
-        callback(new Error("The password can not be less than 6 digits"));
-      } else {
-        callback();
-      }
+      if (!/^1[35789]\d{9}/.test(value)) {
+        callback(new Error("请输入正确的用户名"));
+      } else callback();
     };
     return {
+      loading: false,
+      passwordType: "",
+      companyList: [],
+      companySelectDialog: false,
+
       loginForm: {
-        username: "admin",
-        password: "111111",
+        username: "",
+        password: "",
+        networkId: "",
       },
       loginRules: {
         username: [
           { required: true, trigger: "blur", validator: validateUsername },
         ],
-        password: [
-          { required: true, trigger: "blur", validator: validatePassword },
-        ],
+        password: [{ required: true, message: "请输入密码", trigger: "blur" }],
       },
-      loading: false,
-      passwordType: "password",
-      redirect: undefined,
     };
   },
-  watch: {
-    $route: {
-      handler: function (route) {
-        this.redirect = route.query && route.query.redirect;
-      },
-      immediate: true,
-    },
-  },
   methods: {
     showPwd() {
       if (this.passwordType === "password") {
@@ -123,26 +140,30 @@ export default {
       });
     },
     handleLogin() {
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          localStorage.setItem("token", "1");
-          this.$router.push({ path: this.redirect || "/" });
-          return;
-          this.loading = true;
-          this.$store
-            .dispatch("user/login", this.loginForm)
-            .then(() => {
-              this.$router.push({ path: this.redirect || "/" });
-              this.loading = false;
-            })
-            .catch(() => {
-              this.loading = false;
-            });
-        } else {
-          console.log("error submit!!");
-          return false;
-        }
-      });
+      this.loading = true;
+      let { username, password, networkId } = this.loginForm;
+      serve
+        .login({
+          username,
+          password: md5(password),
+          networkId,
+        })
+        .then((res) => {
+          if (res && res.code === 42014) {
+            serve
+              .getRefineryByCustomerId(this.loginForm.username)
+              .then((res) => {
+                this.companyList = res.data;
+                this.companySelectDialog = true;
+                return;
+              });
+          }
+          localStorage.setItem("token", res.data.accessToken);
+          this.$router.replace("/");
+        })
+        .catch(() => {
+          this.loading = false;
+        });
     },
   },
 };
diff --git a/src/views/product/components/record.vue b/src/views/product/components/record.vue
index c6dc0f5..88b2421 100644
--- a/src/views/product/components/record.vue
+++ b/src/views/product/components/record.vue
@@ -35,6 +35,8 @@
           :height="tableHeight"
           :data="tableData"
           style="width: 100%"
+          :header-cell-style="$utils.cellStyle"
+          :cell-style="$utils.cellStyle"
         >
           <el-table-column label="成本价">
             <template slot-scope="{ row }">
diff --git a/src/views/product/index.vue b/src/views/product/index.vue
index 6bd8732..ae90ca7 100644
--- a/src/views/product/index.vue
+++ b/src/views/product/index.vue
@@ -2,9 +2,37 @@
   <div class="order">
     <div class="frame">
       <el-input
+        class="mr20"
         v-model="parameter.params.productName"
         placeholder="产品名称"
+        clearable
       ></el-input>
+      <el-select
+        v-model="parameter.params.refineryId"
+        placeholder="炼厂名称"
+        clearable
+      >
+        <el-option
+          v-for="item in refineryList"
+          :key="item.id"
+          :label="item.refineryName"
+          :value="item.id"
+        >
+        </el-option>
+      </el-select>
+      <el-input
+        v-model="parameter.params.belongLibrary"
+        placeholder="所处炼厂库"
+        clearable
+      ></el-input>
+      <el-select
+        v-model="parameter.params.enableMark"
+        placeholder="启用禁用"
+        clearable
+      >
+        <el-option label="启用" value="ENABLE"> </el-option>
+        <el-option label="禁用" value="DISABLE"> </el-option>
+      </el-select>
 
       <div class="buttons">
         <el-button icon="el-icon-search" @click="search">查询</el-button>
@@ -24,6 +52,8 @@
         :data="tableData"
         style="width: 100%"
         @selection-change="handleSelectionChange"
+        :header-cell-style="$utils.cellStyle"
+        :cell-style="$utils.cellStyle"
       >
         >
         <el-table-column type="selection" width="55"> </el-table-column>
@@ -168,6 +198,7 @@
 
 <script>
 import serve from "api/product.js";
+import refineryServe from "api/refineryInfo.js";
 
 import add from "./components/add.vue";
 import create from "./components/create.vue";
@@ -190,6 +221,7 @@ export default {
         batch: false,
         adjust: false,
       },
+      refineryList: [],
       multipleRowList: [],
       tableHeight: 0,
       tableData: [],
@@ -243,6 +275,7 @@ export default {
     );
   },
   created() {
+    this.findByEntity();
     this.getByPage();
   },
   methods: {
@@ -261,6 +294,12 @@ export default {
         this.parameter.total = res.data.totalPage;
       });
     },
+    //炼厂list
+    findByEntity() {
+      refineryServe.findByEntity().then((res) => {
+        this.refineryList = res.data;
+      });
+    },
     //新增
     addition() {
       this.controlWindows.addInfo.title = "产品新增";
diff --git a/src/views/refineryAccount/components/add.vue b/src/views/refineryAccount/components/add.vue
new file mode 100644
index 0000000..9d4e929
--- /dev/null
+++ b/src/views/refineryAccount/components/add.vue
@@ -0,0 +1,146 @@
+<template>
+  <el-drawer
+    :title="controlWindows.addInfo.title"
+    direction="rtl"
+    size="40%"
+    :visible="controlWindows.add"
+    @opened="openDrawer"
+    :before-close="closeWindow"
+  >
+    <div class="add">
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="账户名称" prop="accountName">
+          <el-input
+            maxlength="50"
+            v-model="form.accountName"
+            placeholder="请输入账户名称"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="账户类型" prop="accountType">
+          <el-select v-model="form.accountType" placeholder="请选择账户类型">
+            <el-option
+              v-for="(item, index) in refineryAccountTypeEnum"
+              :key="index"
+              :label="item.label"
+              :value="item.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="炼厂名称" prop="refineryId">
+          <el-select
+            class="mr20"
+            v-model="form.refineryId"
+            placeholder="请选择炼厂"
+            clearable
+          >
+            <el-option
+              v-for="item in refineryList"
+              :key="item.id"
+              :label="item.refineryName"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="buttons">
+      <el-button @click="closeWindow">取消 </el-button>
+      <el-button @click="submit">确定</el-button>
+    </div>
+  </el-drawer>
+</template>
+
+<script>
+import refineryInfoServe from "api/refineryInfo.js";
+import serve from "api/refineryAccount.js";
+export default {
+  props: {
+    controlWindows: Object,
+    refineryAccountTypeEnum: Array,
+  },
+  data() {
+    return {
+      form: {},
+      refineryList: [],
+      rules: {
+        accountName: [
+          { required: true, message: "请输入账户名称", trigger: "blur" },
+        ],
+        accountType: [
+          { required: true, message: "请输入账户名称", trigger: "blur" },
+        ],
+        refineryId: [
+          { required: true, message: "请选择炼厂", trigger: "change" },
+        ],
+      },
+    };
+  },
+  methods: {
+    openDrawer() {
+      this.findByEntity();
+    },
+    submit() {
+      this.$refs["form"].validate((valid) => {
+        if (valid) {
+          this.judgeInterface(this.form).then((res) => {
+            if (res.code === 20000) {
+              this.$message.success(res.msg);
+              this.closeWindow();
+            }
+          });
+        }
+      });
+    },
+    judgeInterface(form) {
+      let { id } = this.controlWindows.addInfo;
+      if (id) return serve.update(form);
+      else return serve.save(form);
+    },
+    //炼厂list
+    findByEntity() {
+      refineryInfoServe.findByEntity().then((res) => {
+        this.refineryList = res.data;
+        let { id } = this.controlWindows.addInfo;
+        if (id) {
+          this.form = JSON.parse(JSON.stringify(this.controlWindows.addInfo));
+        }
+      });
+    },
+    closeWindow() {
+      this.$emit("closeWindow");
+      this.form = {};
+      this.controlWindows.addInfo = {};
+      this.$refs.form.clearValidate();
+      this.controlWindows.add = false;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.add {
+  padding: 20px;
+  .el-input,
+  .el-select,
+  .el-textarea {
+    width: 300px;
+  }
+}
+.buttons {
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  padding-right: 40px;
+  width: 100%;
+  height: 80px;
+  line-height: 80px;
+  text-align: right;
+  border-top: 1px solid #f2f3f5;
+  .el-button {
+    text-align: right;
+    font-size: 14px;
+    border-radius: 5px;
+  }
+}
+</style>
diff --git a/src/views/refineryAccount/index.vue b/src/views/refineryAccount/index.vue
new file mode 100644
index 0000000..5a9310d
--- /dev/null
+++ b/src/views/refineryAccount/index.vue
@@ -0,0 +1,322 @@
+<template>
+  <div class="order">
+    <div class="frame">
+      <el-select
+        class="mr20"
+        v-model="parameter.params.id"
+        placeholder="炼厂名称"
+        clearable
+      >
+        <el-option
+          v-for="item in refineryList"
+          :key="item.id"
+          :label="item.refineryName"
+          :value="item.id"
+        >
+        </el-option>
+      </el-select>
+      <el-select
+        v-model="parameter.params.refineryType"
+        placeholder="炼厂类型"
+        clearable
+      >
+        <el-option
+          v-for="item in refineryTypeEnum"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"
+        >
+        </el-option>
+      </el-select>
+      <el-select
+        v-model="parameter.params.accountStatus"
+        placeholder="启用禁用"
+        clearable
+      >
+        <el-option label="启用" value="ENABLE"> </el-option>
+        <el-option label="禁用" value="DISABLE"> </el-option>
+      </el-select>
+      <div class="buttons">
+        <el-button icon="el-icon-search" @click="search">查询</el-button>
+        <el-button icon="el-icon-refresh" @click="reset">重置</el-button>
+      </div>
+    </div>
+    <div class="table">
+      <div class="operation">
+        <el-button @click="addition">新增炼厂账户</el-button>
+        <el-button @click="addition">充值</el-button>
+      </div>
+      <el-table
+        v-if="tableHeight"
+        ref="multipleTable"
+        :height="tableHeight"
+        :data="tableData"
+        style="width: 100%"
+        :header-cell-style="$utils.cellStyle"
+        :cell-style="$utils.cellStyle"
+      >
+        <el-table-column
+          prop="orderSerialNumber"
+          label="炼厂账户名称"
+          show-overflow-tooltip
+        >
+          <template slot-scope="{ row }">
+            <el-tag
+              v-if="row.accountStatus === 'ENABLE'"
+              type="success"
+              size="mini"
+              >启用</el-tag
+            >
+            <el-tag v-else type="danger" size="mini">禁用</el-tag>
+            <span>{{ row.accountName }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="refineryName"
+          label="炼厂名称"
+          show-overflow-tooltip
+        >
+        </el-table-column>
+        <el-table-column prop="orderSerialNumber" label="账户类型" width="90">
+          <template slot-scope="{ row }">
+            <p>
+              {{
+                refineryAccountTypeEnum.find(
+                  (item) => item.value === row.accountType
+                ).label
+              }}
+            </p>
+          </template>
+        </el-table-column>
+        <el-table-column prop="balance" label="总余额" width="90">
+        </el-table-column>
+        <el-table-column prop="rechargeBalance" label="充值余额" width="100">
+        </el-table-column>
+        <el-table-column
+          prop="totalRechargeBalance"
+          label="累计充值余额"
+          width="120"
+        >
+        </el-table-column>
+
+        <el-table-column prop="orderSerialNumber" label="操作" width="100">
+          <template slot-scope="{ row }">
+            <el-link type="primary" :underline="false" @click="detail(row)"
+              >详情</el-link
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+      <pagination :parameter="parameter" @searchAgain="getByPage" />
+    </div>
+    <add
+      :controlWindows="controlWindows"
+      :refineryAccountTypeEnum="refineryAccountTypeEnum"
+      @closeWindow="search"
+    />
+
+    <el-drawer
+      title="详情"
+      direction="ltr"
+      size="60%"
+      :withHeader="false"
+      :visible="controlWindows.detail"
+    >
+      <general-details
+        title="详情"
+        :isHeader="true"
+        v-if="controlWindows.detail"
+        :sourceData="oilCompanyMatch"
+        :mappingData="mappingData"
+        @close="controlWindows.detail = false"
+      >
+      </general-details>
+    </el-drawer>
+  </div>
+</template>
+
+<script>
+import refineryInfoServe from "api/refineryInfo.js";
+import serve from "api/refineryAccount.js";
+
+import add from "./components/add.vue";
+
+import pagination from "components/pagination/index.vue";
+import generalDetails from "components/generalDetails/index.vue";
+
+import { refineryTypeEnum, refineryAccountTypeEnum } from "utils/dataType.js";
+
+export default {
+  data() {
+    return {
+      refineryTypeEnum: refineryTypeEnum,
+      refineryAccountTypeEnum: refineryAccountTypeEnum,
+      controlWindows: {
+        add: false,
+        addInfo: {},
+        detail: false,
+      },
+      refineryList: [],
+      tableHeight: 0,
+      tableData: [],
+      parameter: {
+        currentPage: 1,
+        pageSize: 10,
+        total: 0,
+        params: {},
+      },
+      oilCompanyMatch: {},
+      mappingData: [
+        {
+          carTitle: "",
+          carItems: [
+            { label: "账户名称", value: "accountName" },
+            { label: "账户类型", value: "refineryType" },
+            { label: "炼厂名称", value: "refineryName" },
+            { label: "炼厂ID", value: "refineryId" },
+            { label: "启用状态", value: "accountStatus" },
+            { label: "创建用户ID", value: "createUser" },
+            { label: "创建时间", value: "createTime" },
+            { label: "修改用户ID", value: "updateUser" },
+            { label: "修改时间", value: "updateTime" },
+          ],
+        },
+      ],
+    };
+  },
+  components: {
+    add,
+    pagination,
+    generalDetails,
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.heightHandle();
+    });
+    window.addEventListener(
+      "resize",
+      this.$utils.debounce(this.heightHandle, 500)
+    );
+  },
+  created() {
+    this.findByEntity();
+    this.getByPage();
+  },
+  methods: {
+    search() {
+      this.parameter.currentPage = 1;
+      this.getByPage();
+    },
+    //table list
+    getByPage() {
+      serve.getByPage(this.parameter).then((res) => {
+        this.tableData = res.data.list;
+        this.parameter.total = res.data.totalPage;
+      });
+    },
+    //炼厂list
+    findByEntity() {
+      refineryInfoServe.findByEntity().then((res) => {
+        this.refineryList = res.data;
+      });
+    },
+    //新增
+    addition() {
+      this.controlWindows.addInfo.title = "账户新增";
+      this.controlWindows.add = true;
+    },
+    //修改
+    update(row) {
+      this.controlWindows.addInfo = {
+        title: "账户新增",
+        ...row,
+      };
+      this.controlWindows.add = true;
+    },
+    //详情
+    detail(row) {
+      this.oilCompanyMatch = row;
+      this.controlWindows.detail = true;
+    },
+    //重置
+    reset() {
+      this.parameter = {
+        currentPage: 1,
+        pageSize: 10,
+        total: 0,
+        params: {},
+      };
+    },
+    // table height
+    heightHandle() {
+      let bodyHeight = document.body.clientHeight;
+      let frameHeight = this.obtainElement(".frame").clientHeight;
+      let operationHeight = this.obtainElement(".operation").clientHeight;
+      let paginationHeight = this.obtainElement(".el-pagination").clientHeight;
+      this.tableHeight =
+        bodyHeight - frameHeight - operationHeight - paginationHeight - 145;
+    },
+    obtainElement(className) {
+      return document.documentElement.querySelector(className);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.order {
+  .frame {
+    margin: 20px;
+    padding: 20px;
+    // width: 100%;
+    border-radius: 6px;
+    border: 1px solid #e3e3e5;
+    background: #fff;
+    .el-input,
+    .el-select {
+      width: 183px;
+      height: 40px;
+    }
+    .el-input + .el-input,
+    .el-input + .el-select,
+    .el-select + .el-select,
+    .el-select + .el-input {
+      margin-right: 20px;
+      margin-bottom: 15px;
+    }
+    .mr20 {
+      margin-right: 20px;
+    }
+    .buttons {
+      text-align: right;
+    }
+  }
+
+  .table {
+    overflow: hidden;
+    margin: 0 20px;
+    padding-bottom: 20px;
+    background: #fff;
+    border-radius: 6px;
+    border: 1px solid #e3e3e5;
+    > .operation {
+      box-sizing: content-box;
+      padding: 15px;
+    }
+    .gray {
+      color: #999;
+      span {
+        color: #333;
+      }
+    }
+    .el-table {
+      margin-bottom: 20px;
+      border-radius: 10px 10px 0px 0px;
+    }
+    .el-link {
+      margin-right: 10px;
+    }
+  }
+}
+</style>
diff --git a/src/views/refineryInfo/index.vue b/src/views/refineryInfo/index.vue
index 9153c3b..68abe85 100644
--- a/src/views/refineryInfo/index.vue
+++ b/src/views/refineryInfo/index.vue
@@ -1,7 +1,12 @@
 <template>
   <div class="order">
     <div class="frame">
-      <el-select v-model="parameter.params.id" placeholder="炼厂名称" clearable>
+      <el-select
+        class="mr20"
+        v-model="parameter.params.id"
+        placeholder="炼厂名称"
+        clearable
+      >
         <el-option
           v-for="item in refineryList"
           :key="item.id"
@@ -10,6 +15,38 @@
         >
         </el-option>
       </el-select>
+      <el-select
+        v-model="parameter.params.refineryType"
+        placeholder="炼厂类型"
+        clearable
+      >
+        <el-option
+          v-for="item in refineryTypeEnum"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"
+        >
+        </el-option>
+      </el-select>
+      <el-select
+        v-model="parameter.params.refineryLevel"
+        placeholder="炼厂等级"
+        clearable
+      >
+        <el-option label="A" value="A"></el-option>
+        <el-option label="B" value="B"></el-option>
+        <el-option label="C" value="C"></el-option>
+        <el-option label="D" value="D"></el-option>
+        <el-option label="E" value="E"></el-option>
+      </el-select>
+      <el-select
+        v-model="parameter.params.enableMark"
+        placeholder="启用禁用"
+        clearable
+      >
+        <el-option label="启用" value="ENABLE"> </el-option>
+        <el-option label="禁用" value="DISABLE"> </el-option>
+      </el-select>
       <div class="buttons">
         <el-button icon="el-icon-search" @click="search">查询</el-button>
         <el-button icon="el-icon-refresh" @click="reset">重置</el-button>
@@ -25,6 +62,8 @@
         :height="tableHeight"
         :data="tableData"
         style="width: 100%"
+        :header-cell-style="$utils.cellStyle"
+        :cell-style="$utils.cellStyle"
       >
         <el-table-column
           prop="refineryName"
@@ -134,20 +173,18 @@ import add from "./components/add.vue";
 import pagination from "components/pagination/index.vue";
 import generalDetails from "components/generalDetails/index.vue";
 
+import { refineryTypeEnum } from "utils/dataType.js";
+
 export default {
   data() {
     return {
+      refineryTypeEnum: refineryTypeEnum,
       controlWindows: {
         add: false,
         addInfo: {},
         detail: false,
       },
-      refineryTypeEnum: [
-        {
-          label: "普通炼厂",
-          value: "COMMON",
-        },
-      ],
+
       refineryList: [],
       tableHeight: 0,
       tableData: [],
@@ -196,7 +233,7 @@ export default {
     this.getByPage();
   },
   methods: {
-    serch() {
+    search() {
       this.parameter.currentPage = 1;
       this.getByPage();
     },