完成清洗分析页面

src/views/analysisInfo/_OverDate.vue

@@ -0,0 +1,262 @@
+<script setup lang="ts">
+import { ref, onMounted } from "vue"
+import moment from "moment"
+import Rs from "@/core/services/RequestService"
+import { useRouter } from "vue-router"
+const router = useRouter()
+const ringOptions = {
+  legend: { top: "center", bottom: "auto", right: "20%", orient: "vertical" },
+  pieCenter: ["40%", "50%"],
+  titleText: "",
+}
+const timeType = ref(0)
+const date = ref<[Date, Date]>([new Date(), new Date()])
+const chartDatas = ref<Array<any>>([{}, {}, {}, {}])
+function queryChart(type: number) {
+  let url = ""
+  let data: any = {}
+  switch (type) {
+    case 0:
+      url = "sys/overdueCompany/selectOverdueCountByOrgChart"
+      data = {
+        time_type: timeType.value,
+        query_start_time: moment(date.value[0]).format("YYYYMMDD"),
+        query_end_time: moment(date.value[1]).format("YYYYMMDD"),
+      }
+      break
+    case 1:
+      url = "sys/overdueCompany/selectPurifierCountByOrgChart"
+      break
+  }
+  if (type == 1) {
+    Rs.get(url).then((res) => {
+      chartDatas.value[type] = res.data
+      chartDatas.value[type].chartData.title = ""
+    })
+  } else {
+    Rs.post(url, { data: data, successAlert: false }).then((res) => {
+      chartDatas.value[type] = res.data
+      chartDatas.value[type].chartData.title = ""
+    })
+  }
+}
+
+const size = ref<any>("default")
+const dySearchSelectStyle = { width: "120px" }
+const companyName = ref("")
+const orgId = ref<string | null>(null)
+//const operateStatus = ref("")
+const type = ref("")
+const cateringScale = ref("")
+const cateringStyle = ref("")
+const queryParams = ref<any>({
+  time_type: timeType.value,
+})
+const cols = ref([
+  {
+    name: "序号",
+    field: "index",
+  },
+  {
+    name: "区域",
+    field: "org_name",
+  },
+  {
+    name: "商户名称",
+    field: "name",
+  },
+  {
+    name: "菜系",
+    field: "catering_style_name",
+  },
+  {
+    name: "规模",
+    field: "catering_scale_name",
+  },
+  {
+    name: "净化器数量",
+    field: "purifier_num",
+  },
+  {
+    name: "操作",
+    width: 150,
+    field: "action",
+  },
+])
+const jump = function (v: any) {
+  console.log("jump", v)
+  router.push({
+    path: "/goLineData/oilFumeConcentration",
+    query: {
+      comName: v.company_name,
+      company_id: v.company_id,
+      backNeed: 1,
+    },
+  })
+}
+
+function query() {
+  const params = {
+    time_type: timeType.value,
+    org_id: orgId.value,
+    name: companyName.value,
+    //operate_status: operateStatus.value,
+    type: type.value,
+    catering_scale: cateringScale.value,
+    catering_style: cateringStyle.value,
+    query_start_time: moment(date.value[0]).format("YYYYMMDD"),
+    query_end_time: moment(date.value[1]).format("YYYYMMDD"),
+  }
+  // const keys = Object.keys(params)
+  // keys.forEach((key) => {
+  //   if (params[key] == "" && key != "clean_flag" && key != "exceed_company_flag") {
+  //     delete params[key]
+  //   }
+  // })
+  queryParams.value = params
+  queryChart(0)
+  queryChart(1)
+}
+function reset() {
+  type.value = ""
+  companyName.value = ""
+  orgId.value = "0"
+  //operateStatus.value = ""
+  type.value = ""
+  cateringScale.value = ""
+  cateringStyle.value = ""
+  timeType.value = 0
+  date.value = [new Date(), new Date()]
+  query()
+}
+function exported() {
+  const params = {
+    name: companyName.value,
+    catering_scale: cateringScale.value,
+    catering_style: cateringStyle.value,
+    type: type.value,
+    org_id: orgId.value,
+    time_type: timeType.value,
+    query_start_time: moment(date.value[0]).format("YYYYMMDD"),
+    query_end_time: moment(date.value[1]).format("YYYYMMDD"),
+  }
+  let str = ""
+  for (const key in params) {
+    str += `${key}=${params[key]}&`
+  }
+  window.open("/api/sys/overdueCompany/export?" + str)
+}
+const detail = function (row: any) {
+  router.push({
+    path: "/purify/washInfo/details",
+    query: { company_id: row.company_id },
+  })
+}
+function init() {
+  queryChart(0)
+  queryChart(1)
+}
+onMounted(init)
+</script>
+
+<template>
+  <el-row :gutter="20" class="mb-8">
+    <el-col :span="12">
+      <div class="card card-bordered border-primary h-325px">
+        <div class="card-header bg-light-primary min-h-50px">
+          <div class="card-title">
+            <h3 class="text-primary">逾期商户数量</h3>
+          </div>
+        </div>
+        <div class="card-body p-2">
+          <BaseChart :data="chartDatas[0]" type="ring" h="100%" :options="ringOptions"></BaseChart>
+        </div>
+      </div>
+    </el-col>
+    <el-col :span="12">
+      <div class="card card-bordered border-primary h-325px">
+        <div class="card-header bg-light-primary min-h-50px">
+          <div class="card-title">
+            <h3 class="text-primary">净化器数量</h3>
+          </div>
+        </div>
+        <div class="card-body p-2">
+          <BaseChart :data="chartDatas[1]" type="ring" h="100%" :options="ringOptions"></BaseChart>
+        </div>
+      </div>
+    </el-col>
+  </el-row>
+  <VbDataTable
+    ref="table"
+    :header="cols"
+    url="sys/overdueCompany/selectForPage"
+    method="post"
+    :query-params="queryParams"
+    :has-checkbox="false"
+  >
+    <template v-slot:table-tool="">
+      <el-form class="align-items-center" :inline="true">
+        <el-form-item class="mb-0 me-5 align-items-center" label="商户名称">
+          <el-input class="" style="width: 180px" v-model="companyName" placeholder="请输入商户名称" :size="size" />
+        </el-form-item>
+        <el-form-item class="mb-0 me-5 align-items-center" label="区域">
+          <OrgSelectTree v-model:value="orgId" style="width: 180px"></OrgSelectTree>
+        </el-form-item>
+        <el-form-item class="mb-0 me-5 align-items-center" label="菜系">
+          <DySelect
+            v-model="cateringStyle"
+            :formatRemoteData="(v:any)=>{return v?.list}"
+            :url="'sys/dict/getList?code=000010001&key=temp'"
+            :style="dySearchSelectStyle"
+            placeholder="请选择菜系"
+          ></DySelect>
+        </el-form-item>
+        <el-form-item class="mb-0 me-5 align-items-center" label="规模">
+          <DySelect
+            v-model="cateringScale"
+            :formatRemoteData="(v:any)=>{return v?.list}"
+            :url="'sys/dict/getList?code=000090001&key=temp'"
+            :style="dySearchSelectStyle"
+            placeholder="请选择规模"
+          ></DySelect>
+        </el-form-item>
+        <el-form-item class="mb-0 me-5 align-items-center" label="类型">
+          <DySelect
+            v-model="type"
+            :formatRemoteData="(v:any)=>{return v?.list}"
+            :url="'sys/dict/getList?code=000200000&key=temp'"
+            :style="dySearchSelectStyle"
+            placeholder="请选择类型"
+          ></DySelect>
+        </el-form-item>
+        <DateRangeSelect
+          v-model:date-value="date"
+          v-model:select-value="timeType"
+          :select-class="'mb-0 align-items-center'"
+          :date-class="'mb-0 mt-3 align-items-center'"
+          :style="dySearchSelectStyle"
+          :size="size"
+        />
+        <!-- <el-form-item class="mb-0 me-5 align-items-center" label="营业状态">
+          <el-select v-model="operateStatus" style="width: 150px" placeholder="请选择营业状态" :clearable="true">
+            <el-option value="0" label="营业"></el-option>
+            <el-option value="1" label="间休"></el-option>
+            <el-option value="2" label="停业"></el-option>
+          </el-select>
+        </el-form-item> -->
+        <el-form-item class="mb-0 me-0 align-items-center" :class="timeType == 4 ? `mt-3` : ''">
+          <el-button class="ms-3 mt-0 btn btn-sm btn-primary" @click="query">查询</el-button>
+          <el-button class="ms-3 mt-0 btn btn-sm btn-light-primary btn-outline" @click="reset">重置</el-button>
+          <el-button class="ms-3 mt-0 btn btn-sm btn-light-info btn-outline" @click="exported">导出</el-button>
+        </el-form-item>
+      </el-form>
+    </template>
+    <template #name="{ row }">
+      <span class="text-primary" @click="jump(row)" style="cursor: pointer">{{ row["company_name"] }}</span>
+    </template>
+
+    <template #action="{ row }">
+      <span class="table-action" @click="detail(row)">查看详情</span>
+    </template>
+  </VbDataTable>
+</template>

src/views/analysisInfo/_WeekClean.vue

@@ -0,0 +1,236 @@
+<script setup lang="ts">
+import { ref, onMounted } from "vue"
+import moment from "moment"
+import Rs from "@/core/services/RequestService"
+import { useRouter } from "vue-router"
+const router = useRouter()
+const ringOptions = {
+  legend: { top: "center", bottom: "auto", right: "20%", orient: "vertical" },
+  pieCenter: ["40%", "50%"],
+  titleText: "",
+}
+const barOptions = {
+  grid: { top: 30, left: 15 },
+  legend: { show: false },
+  titleText: " ",
+}
+const timeType = ref(0)
+const date = ref<[Date, Date]>([new Date(), new Date()])
+const chartDatas = ref<Array<any>>([{}, {}, {}, {}])
+function queryChart(type: number) {
+  let url = ""
+  switch (type) {
+    case 0:
+      url = "sys/waitForClean/getOrgCleanStatus"
+
+      break
+    case 1:
+      url = "sys/waitForClean/getOrgWaitForCleanPie"
+      break
+  }
+  Rs.get(url).then((res) => {
+    chartDatas.value[type] = res.data
+    chartDatas.value[type].chartData.title = ""
+  })
+}
+
+const size = ref<any>("default")
+const dySearchSelectStyle = { width: "120px" }
+const companyName = ref("")
+const orgId = ref<string | null>(null)
+const type = ref("")
+const cateringScale = ref("")
+const cateringStyle = ref("")
+const queryParams = ref<any>({
+  time_type: timeType.value,
+})
+const cols = ref([
+  {
+    name: "序号",
+    field: "index",
+  },
+  {
+    name: "区域",
+    field: "org_name",
+  },
+  {
+    name: "商户名称",
+    field: "name",
+  },
+  {
+    name: "菜系",
+    field: "catering_style_name",
+  },
+  {
+    name: "规模",
+    field: "catering_scale_name",
+  },
+  {
+    name: "净化器数量",
+    field: "purifier_num",
+  },
+  {
+    name: "操作",
+    width: 150,
+    field: "action",
+  },
+])
+const jump = function (v: any) {
+  console.log("jump", v)
+  router.push({
+    path: "/goLineData/oilFumeConcentration",
+    query: {
+      comName: v.company_name,
+      company_id: v.company_id,
+      backNeed: 1,
+    },
+  })
+}
+
+function query() {
+  const params = {
+    time_type: timeType.value,
+    org_id: orgId.value,
+    name: companyName.value,
+    //operate_status: operateStatus.value,
+    type: type.value,
+    catering_scale: cateringScale.value,
+    catering_style: cateringStyle.value,
+    query_start_time: moment(date.value[0]).format("YYYYMMDD"),
+    query_end_time: moment(date.value[1]).format("YYYYMMDD"),
+  }
+  const keys = Object.keys(params)
+  keys.forEach((key) => {
+    if (params[key] == "" && key != "clean_flag" && key != "exceed_company_flag") {
+      delete params[key]
+    }
+  })
+  queryParams.value = params
+}
+function reset() {
+  type.value = ""
+  companyName.value = ""
+  orgId.value = "0"
+  type.value = ""
+  cateringScale.value = ""
+  cateringStyle.value = ""
+  timeType.value = 0
+  date.value = [new Date(), new Date()]
+  query()
+}
+function exported() {
+  const params = {
+    name: companyName.value,
+    catering_scale: cateringScale.value,
+    catering_style: cateringStyle.value,
+    type: type.value,
+    org_id: orgId.value,
+  }
+  let str = ""
+  for (const key in params) {
+    str += `${key}=${params[key]}&`
+  }
+  window.open("/api/sys/waitForClean/exportWaitCleanCompany?" + str)
+}
+const detail = function (row: any) {
+  router.push({
+    path: "/DataBoard/index/cleanList",
+    query: {
+      company_id: row.company_id,
+      type: "1",
+    },
+  })
+}
+
+function init() {
+  queryChart(0)
+  queryChart(1)
+}
+onMounted(init)
+</script>
+<template>
+  <el-row :gutter="20">
+    <el-col :span="12">
+      <div class="card card-bordered border-primary h-325px">
+        <div class="card-header bg-light-primary min-h-50px">
+          <div class="card-title">
+            <h3 class="text-primary">区域净化效能</h3>
+          </div>
+        </div>
+        <div class="card-body p-2">
+          <BaseChart :data="chartDatas[0]" type="bar" h="100%" :options="barOptions"></BaseChart>
+        </div>
+      </div>
+    </el-col>
+    <el-col :span="12">
+      <div class="card card-bordered border-primary h-325px">
+        <div class="card-header bg-light-primary min-h-50px">
+          <div class="card-title">
+            <h3 class="text-primary">一周内待清洗数量</h3>
+          </div>
+        </div>
+        <div class="card-body p-2">
+          <BaseChart :data="chartDatas[1]" type="ring" h="100%" :options="ringOptions"></BaseChart>
+        </div>
+      </div>
+    </el-col>
+  </el-row>
+  <VbDataTable
+    ref="table"
+    :header="cols"
+    url="sys/waitForClean/getComapnyForPage"
+    method="post"
+    :query-params="queryParams"
+    :has-checkbox="false"
+  >
+    <template v-slot:table-tool="">
+      <el-form class="align-items-center" :inline="true">
+        <el-form-item class="mb-0 me-5 align-items-center" label="商户名称">
+          <el-input class="" style="width: 180px" v-model="companyName" placeholder="请输入商户名称" :size="size" />
+        </el-form-item>
+        <el-form-item class="mb-0 me-5 align-items-center" label="区域">
+          <OrgSelectTree v-model:value="orgId" style="width: 180px"></OrgSelectTree>
+        </el-form-item>
+        <el-form-item class="mb-0 me-5 align-items-center" label="菜系">
+          <DySelect
+            v-model="cateringStyle"
+            :formatRemoteData="(v:any)=>{return v?.list}"
+            :url="'sys/dict/getList?code=000010001&key=temp'"
+            :style="dySearchSelectStyle"
+            placeholder="请选择菜系"
+          ></DySelect>
+        </el-form-item>
+        <el-form-item class="mb-0 me-5 align-items-center" label="规模">
+          <DySelect
+            v-model="cateringScale"
+            :formatRemoteData="(v:any)=>{return v?.list}"
+            :url="'sys/dict/getList?code=000090001&key=temp'"
+            :style="dySearchSelectStyle"
+            placeholder="请选择规模"
+          ></DySelect>
+        </el-form-item>
+        <el-form-item class="mb-0 me-5 align-items-center" label="类型">
+          <DySelect
+            v-model="type"
+            :formatRemoteData="(v:any)=>{return v?.list}"
+            :url="'sys/dict/getList?code=000200000&key=temp'"
+            :style="dySearchSelectStyle"
+            placeholder="请选择类型"
+          ></DySelect>
+        </el-form-item>
+        <el-form-item class="mb-0 me-0 align-items-center" :class="timeType == 4 ? `mt-3` : ''">
+          <el-button class="ms-3 mt-0 btn btn-sm btn-primary" @click="query">查询</el-button>
+          <el-button class="ms-3 mt-0 btn btn-sm btn-light-primary btn-outline" @click="reset">重置</el-button>
+          <el-button class="ms-3 mt-0 btn btn-sm btn-light-info btn-outline" @click="exported">导出</el-button>
+        </el-form-item>
+      </el-form>
+    </template>
+    <template #name="{ row }">
+      <span class="text-primary" @click="jump(row)" style="cursor: pointer">{{ row["company_name"] }}</span>
+    </template>
+
+    <template #action="{ row }">
+      <span class="table-action" @click="detail(row)">查看详情</span>
+    </template>
+  </VbDataTable>
+</template>

src/views/analysisInfo/clean.vue

@@ -1,7 +1,17 @@
 <script setup lang="ts">
-import { defineProps, reactive, ref, toRefs } from "vue"
+import { ref } from "vue"
+import OverDate from "./_OverDate.vue"
+import WeekClean from "./_WeekClean.vue"
+const queryType = ref(0)
 </script>
 
 <template>
-  <div>clean</div>
+  <div class="mb-3">
+    <el-radio-group v-model="queryType" size="large">
+      <el-radio-button label="0">逾期商户</el-radio-button>
+      <el-radio-button label="1">一周待清洗</el-radio-button>
+    </el-radio-group>
+  </div>
+  <OverDate v-if="queryType == 0"></OverDate>
+  <WeekClean v-if="queryType == 1"></WeekClean>
 </template>

src/views/overAnalysis/overTime.vue

@@ -16,13 +16,11 @@ const cols = ref<Array<Header>>([
   {
     name: "接入商户数",
     field: "total",
-    tdClass: "text-success",
     width: 120,
   },
   {
     name: "超标商户数",
     field: "exceed_total",
-    thClass: "text-warning",
   },
   {
     name: "油烟超标商户数",
@@ -60,11 +58,11 @@ const queryParams = ref({
 })
 const table = ref()
 
-function changeQueryType(type: number) {
-  queryType.value = type
-  name.value = type == 0 ? "区域" : type == 1 ? "菜系" : type == 2 ? "规模" : "类型"
+function changeQueryType() {
+  //queryType.value = type
+  name.value = queryType.value == 0 ? "区域" : queryType.value == 1 ? "菜系" : queryType.value == 2 ? "规模" : "类型"
   queryParams.value = {
-    query_type: type,
+    query_type: queryType.value,
     time_type: 0,
     query_start_time: moment().format("YYYYMMDD"),
     query_end_time: moment().format("YYYYMMDD"),
@@ -116,35 +114,13 @@ const detail = function (v: any) {
 </script>
 
 <template>
-  <div class="btn-group mb-3">
-    <button
-      class="btn btn-outline btn-light-primary"
-      :class="queryType == 0 ? 'active btn-active-primary' : ''"
-      @click="changeQueryType(0)"
-    >
-      区域
-    </button>
-    <button
-      class="btn btn-outline btn-light-primary"
-      :class="queryType == 1 ? 'active btn-active-primary' : ''"
-      @click="changeQueryType(1)"
-    >
-      菜系
-    </button>
-    <button
-      class="btn btn-outline btn-light-primary"
-      :class="queryType == 2 ? 'active btn-active-primary' : ''"
-      @click="changeQueryType(2)"
-    >
-      规模
-    </button>
-    <button
-      class="btn btn-outline btn-light-primary"
-      :class="queryType == 3 ? 'active btn-active-primary' : ''"
-      @click="changeQueryType(3)"
-    >
-      类型
-    </button>
+  <div class="mb-3">
+    <el-radio-group v-model="queryType" size="large" @change="changeQueryType">
+      <el-radio-button label="0">区域</el-radio-button>
+      <el-radio-button label="1">菜系</el-radio-button>
+      <el-radio-button label="2">规模</el-radio-button>
+      <el-radio-button label="3">类型</el-radio-button>
+    </el-radio-group>
   </div>
 
   <!-- 
@@ -181,12 +157,7 @@ const detail = function (v: any) {
         </el-form-item>
       </el-form>
     </template>
-    <template v-slot:name_header="">
-      <span class="text-danger text-center">{{ name }}</span>
-    </template>
-    <template #name="{ row }">
-      <div class="text-danger w-100">{{ row.name }}</div>
-    </template>
+
     <template #action="{ row }">
       <div class="text-danger text-center">
         <span class="table-action" @click="detail(row)">查看详情</span>