feat:搭好了工作台架子，增加了工单的搜索方法，修改了部分样式

src/views/home/index.vue

@@ -1,12 +1,142 @@
 <template>
-  工作台
+  <div class="home">
+    <div class="real-time-call">实时通话</div>
+    <div class="call-history">历史通话记录
+
+      <fvTable ref="tableIns" :tableConfig="tableConfig" :data="mockData" @headBtnClick="headBtnClick"></fvTable>
+    </div>
+  </div>
 </template>
 
-<script setup>
+<script setup lang="jsx">
+const tableIns = ref()
+const mockData = ref([
+  {
+    workOrderNumber: 1211,
+    workOrderTime: '2022-02-09 00 : 12',
+    state: 0,
+    callState: 0
+  },
+  {
+    workOrderNumber: 232,
+    state: 1,
+    callState: 1
+  }
+])
+const auths = reactive({
+  report: ['mosr:collect:reported'],
+})
+const tableConfig = reactive({
+  columns: [
+    {
+      prop: 'index',
+      type: 'index',
+      label: '工单号',
+      align: 'center',
+      width: 80,
+    },
+    {
+      prop: 'workOrderNumber',
+      label: '工单名称',
+      align: 'center'
+    },
+    {
+      prop: 'workOrderNumber',
+      label: '工单内容',
+      align: 'center'
+    },
+    {
+      prop: 'workOrderNumber',
+      label: '处理人',
+      align: 'center'
+    },
+    {
+      prop: 'workOrderNumber',
+      label: '关单人',
+      align: 'center'
+    },
+    {
+      prop: 'workOrderNumber',
+      label: '用户名',
+      align: 'center'
+    },
+    {
+      prop: 'workOrderNumber',
+      label: '号码',
+      align: 'center'
+    },
+
+    {
+      prop: 'callState',
+      label: '电话拨打状态',
+      align: 'center',
+      showOverflowTooltip: false,
+      currentRender: ({ row, index }) => {
+        if (row.callState !== null) {
+          return (<PointTag dictType={'call_state'} value={row.callState} />)
+        } else {
+          return '--'
+        }
+      }
+    },
+    {
+      prop: 'workOrderTime',
+      label: '拨打时间',
+      align: 'center',
+      width: 200
+    },{
+      prop: 'oper',
+      label: '操作',
+      align: 'center',
+      fixed: 'right',
+      width: 150,
+      showOverflowTooltip: false,
+      currentRender: ({ row, index }) => {
+        // console.log(row);
+        let btn = []
+        btn.push({ label: '语音', prem: auths.detail, func: () => handleDetail(row), type: 'primary' })
+        btn.push({ label: '信息', prem: auths.detail, func: () => handleClose(row), type: 'primary' })
+        return (
+          <div style={{ width: '100%' }}>
+            {
+              btn.map(item => (
+                <el-button
+                  type={item.type}
+                  // v-perm={item.prem}
+                  onClick={() => item.func()}
+                  link
+                >
+                  {item.label}
+                </el-button>
+              ))
+            }
+          </div>
+        )
+      }
+    }
+  ],
+  api: '',
+  params: {},
+  btns: [
+    // {name: '新增', key: 'add',type:'primary',icon:'Plus'},
+  ]
+})
 
 
 </script>
 
 <style lang="scss" scoped>
+.home {
+  .real-time-call {
+    width: 100%;
+    height: 50vh;
+    // background-color: red;
+  }
 
+  .call-history {
+    width: 100%;
+    height: 50vh;
+    // background-color: blue;
+  }
+}
 </style>