添加零工服务

src/views/manage/works/supplyDemand/index.vue

@@ -0,0 +1,201 @@
+<template>
+  <div>
+    <basic-container>
+      <el-form
+        size="small"
+        label-position="right"
+        style="padding-left: 10px; padding-right: 10px"
+        :inline="true"
+      >
+        <el-row :span="24">
+          <el-form-item label="类型：">
+            <el-select v-model="query.type">
+              <el-option
+                v-for="(item, index) in types"
+                :key="index"
+                :label="item.label"
+                :value="item.value"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="日期类型：" v-if="query.type === 2">
+            <el-select v-model="query.timeType" @blur="delete query.time">
+              <el-option
+                v-for="(item, index) in times"
+                :key="index"
+                :label="item.label"
+                :value="item.value"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="日期：" v-if="query.type === 2">
+            <el-date-picker
+              v-if="timeEleType[query.timeType] === 'monthrange'"
+              v-model="query.time"
+              :type="timeEleType[query.timeType]"
+              placeholder="选择开始日期"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期">
+            </el-date-picker>
+            <YearRange
+              v-else
+              v-model="query.time"
+            ></YearRange>
+          </el-form-item>
+          <div class="searchBtn">
+            <el-button
+              type="primary"
+              size="small"
+              icon="el-icon-search"
+              @click="searchTabs"
+            >搜 索
+            </el-button
+            >
+            <el-button size="small" icon="el-icon-delete" @click="searchReset"
+            >清 空
+            </el-button
+            >
+          </div>
+        </el-row>
+      </el-form>
+      <avue-crud
+        :option="option"
+        :table-loading="loading"
+        :page.sync="page"
+        :data="data"
+        ref="crud"
+        v-model="form"
+      ></avue-crud>
+    </basic-container>
+  </div>
+</template>
+
+<script>
+import {
+  getAllCountPostCount
+} from "@/api/work/work";
+import YearRange from "@/components/yearRange/index.vue";
+import {missionState} from "@/common/dic";
+import {dateFormat} from "@/util/date";
+
+let types = [
+  {value: 0, label: '供需人数'},
+  {value: 1, label: '按行业'},
+  {value: 2, label: '按时间'},
+]
+let times = [
+  {value: 3, label: '年'},
+  {value: 1, label: '月'},
+  // {value: 3, label: '周'},
+]
+let timeEleType = {
+  3: 'year',
+  1: 'monthrange',
+  // 3: 'week',
+}
+export default {
+  name: 'supplyDemand',
+  components: {YearRange},
+  data() {
+    return {
+      types,
+      times,
+      timeEleType,
+      loading: false,
+      data: [],
+      form: {},
+      query: {
+        type: 0,
+        timeType: 1
+      },
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0,
+      },
+    }
+  },
+  created() {
+    this.getDetail()
+  },
+  computed: {
+    option() {
+      return {
+        height: "auto",
+        tip: false,
+        columnBtn: false,
+        searchShow: true,
+        searchMenuSpan: 5,
+        menuWidth: 110,
+        border: true,
+        selection: false,
+        viewBtn: false,
+        menu: false,
+        addBtn: false,
+        editBtn: false,
+        delBtn: false,
+        dialogClickModal: false,
+        dialogType: "drawer",
+        dialogFullscreen: true,
+        mStatusList: missionState,
+        align: 'center',
+        column: [
+          {
+            label: "名称",
+            prop: "name",
+          },
+          {
+            label: "零工人数",
+            prop: "workerCount",
+          },
+          {
+            label: "零工岗位人数",
+            prop: "workCount",
+          },
+          {
+            label: "求人倍率",
+            prop: "ratio",
+          },
+        ]
+      }
+    }
+  },
+  methods: {
+    searchTabs() {
+      this.getDetail()
+    },
+    searchReset() {
+      this.query = {
+        type: 0,
+        timeType: 1
+      }
+      this.getDetail()
+    },
+    async getDetail() {
+      let params = {
+        ...this.query,
+      }
+      if (params.type === 2 && params.timeType) {
+        if (params.time && params.time.length === 2) {
+          params.stime = dateFormat(typeof params.time[0] === 'string' ? new Date(params.time[0]) : params.time[0], 'yyyy-MM-dd hh:mm:ss')
+          params.etime = dateFormat(typeof params.time[1] === 'string' ? new Date(params.time[1]) : params.time[1], 'yyyy-MM-dd hh:mm:ss')
+          delete params.time
+        } else {
+          return this.$message({type: "info", message: "请选择日期"});
+        }
+      }
+
+      let resData = await getAllCountPostCount(params)
+      if (resData.data.code === 200) {
+        console.log(resData.data)
+        const {records, page, size, total} = resData.data.data
+        this.data = records
+      }
+    }
+  }
+}
+</script>
+
+<style>
+
+</style>