已办箱

+<template>
+  <div class="from-clues">
+    <!-- 表单部分 -->
+    <div class="from-clues-header">
+      <el-form :model="queryForm" ref="queryForm" label-width="70px">
+        <el-row>
+          <el-col :span="5">
+            <el-form-item label="业务来源">
+              <el-select
+                v-model="queryForm.ywly"
+                filterable
+                clearable
+                placeholder="请选择业务来源"
+              >
+                <el-option
+                  v-for="item in ywlys"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="5">
+            <el-form-item label="权利类型">
+              <el-select
+                v-model="queryForm.qllx"
+                filterable
+                clearable
+                placeholder="请选择权利类型"
+              >
+                <el-option
+                  v-for="item in qllxs"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="5">
+            <el-form-item label="登记类型">
+              <el-select
+                v-model="queryForm.djlx"
+                filterable
+                clearable
+                placeholder="请选择登记类型"
+              >
+                <el-option
+                  v-for="item in djlxs"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="5">
+            <el-form-item label="业务号">
+              <el-input
+                placeholder="请输入业务号"
+                v-model="queryForm.ywh"
+                clearable
+                class="width200px"
+              >
+              </el-input>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="4" class="btnCol">
+            <el-form-item>
+              <el-button type="primary" @click="queryClick()">查询</el-button>
+              <el-button @click="moreQueryClick()">高级查询</el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </div>
+    <!-- 表格 -->
+    <div class="from-clues-content">
+      <lb-table
+        :page-size="pageData.size"
+        @sort-change="handleSort"
+        :current-page.sync="pageData.current"
+        :total="pageData.total"
+        @selection-change="handleSelectionChange"
+        @size-change="handleSizeChange"
+        @p-current-change="handleCurrentChange"
+        :column="tableData.columns"
+        :data="tableData.data"
+      >
+      </lb-table>
+    </div>
+  </div>
+</template>
+<script>
+import table from "@/utils/mixin/table";
+import { datas, sendThis } from "./ybxdata";
+export default {
+  name: "dbx",
+  components: {},
+  mixins: [table],
+  mounted() {
+    sendThis(this);
+  },
+  data() {
+    return {
+      queryForm: {
+        ywly: "",
+        qllx: "",
+        djlx: "",
+        ywh: "",
+      },
+      pageData: {
+        current: 1,
+        size: 10,
+        total: 2,
+      },
+
+      ywlys: datas.ywlys(),
+      
+      tableData: {
+        columns: datas.columns(),
+        data: [
+          {
+            slsj: "2022-5-12",
+          },
+          {
+            slsj: "2022-5-13",
+          },
+        ],
+      },
+    };
+  },
+  methods: {
+    // 初始化数据
+    fetchData() {},
+    handleSort(name, sort) {
+      console.log(name, sort);
+    },
+    openDialog() {
+      console.log(999999999999999);
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+@import "~@/styles/public.scss";
+</style>

+import filter from '@/utils/filter.js'
+let vm = null
+
+const sendThis = (_this) => {
+  vm = _this
+}
+class data extends filter {
+  constructor() {
+    super()
+  }
+  columns () {
+    return [
+      {
+        label: '序号',
+        type: 'index',
+        width: '50'
+      },
+      {
+        prop: "ywly",
+        label: "业务来源",
+      },
+      {
+        prop: "lczt",
+        label: "流程状态",
+      },
+      {
+        prop: "zbhj",
+        label: "在办环节",
+      },
+      {
+        prop: "ywh",
+        label: "业务号",
+      },
+      {
+        prop: "sqywmc",
+        label: "申请业务名称",
+      },
+      {
+        prop: "qlr",
+        label: "权利人",
+      },
+      {
+        prop: "ywr",
+        label: "义务人",
+      },
+      {
+        prop: "zl",
+        label: "坐落",
+      },
+      {
+        prop: "slsj",
+        label: "受理时间",
+        sortable: 'custom'
+      },
+      {
+        prop: "slry",
+        label: "受理人员",
+      },
+      {
+        prop: "zrsj",
+        label: "转入时间",
+        sortable: 'custom'
+      },
+      {
+        label: '操作',
+        width: '80',
+        align: 'center',
+        fixed: 'right',
+        render: (h, scope) => {
+          return <el-button type="text" icon="el-icon-delete" onClick={() => { vm.openDialog(scope) }}>编辑</el-button>
+        }
+      }
+    ]
+  }
+
+  ywlys(){
+    return[
+      { value: 1, label: "办事大厅" },
+      { value: 2, label: "微信小程序" },
+      { value: 3, label: "法院端" },
+      { value: 4, label: "银行端" },
+    ]
+  } 
+
+}
+let datas = new data()
+export {
+  datas,
+  sendThis
+}