chengxiangling
2025-05-13 7e9e0bff3ef15366693648f25810723ec557ed62
src/views/mainPlan/gasProduceStatics/index.vue
@@ -9,48 +9,55 @@
      :label-width="locale === 'zh' ? '68px' : '134px'"
    >
      <el-row type="flex" justify="left">
        <el-form-item :label="$t('plan.query.statistical')">
          <el-select
            v-model="queryParams.searchType"
            style="width: 200px"
            placeholder="Select"
            @change="handleChangeSelectType"
          >
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item :label="$t('plan.query.selectDateRange')">
          <div v-if="!dayCom">
            <el-date-picker
              v-model="queryParams.monthRange"
              type="monthrange"
              :range-separator="$t('plan.placeholder.to')"
              :start-placeholder="$t('plan.placeholder.startMonth')"
              :end-placeholder="$t('plan.placeholder.endMonth')"
            />
          </div>
          <div v-else>
            <el-date-picker
              v-model="queryParams.monthDays"
              type="month"
              :placeholder="$t('plan.placeholder.selectMonth')"
            />
          </div>
        </el-form-item>
        <el-form-item class="column-with-margin">
          <el-button type="primary" icon="Search" @click="handleQuery">{{
            $t("common.common.query")
          }}</el-button>
          <el-button icon="Refresh" @click="resetQuery">{{
            $t("common.common.reset")
          }}</el-button>
        </el-form-item>
        <el-col :span="locale === 'zh' ? 5: 7">
          <el-form-item :label="$t('plan.query.statistical')">
            <el-select
              v-model="queryParams.searchType"
              :style="{ width: locale === 'zh' ? '120px' : '160px' }"
              placeholder="Select"
              @change="handleChangeSelectType"
            >
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="locale === 'zh' ? 5: 8">
          <el-form-item :label="$t('plan.query.selectDateRange')">
            <div v-if="!dayCom">
              <el-date-picker
                :style="{ width: locale === 'zh' ? '200px' : '220px' }"
                v-model="queryParams.monthRange"
                type="monthrange"
                :range-separator="$t('plan.placeholder.to')"
                :start-placeholder="$t('plan.placeholder.startMonth')"
                :end-placeholder="$t('plan.placeholder.endMonth')"
              />
            </div>
            <div v-else>
              <el-date-picker
                :style="{ width: locale === 'zh' ? '200px' : '220px' }"
                v-model="queryParams.monthDays"
                type="month"
                :placeholder="$t('plan.placeholder.selectMonth')"
              />
            </div>
          </el-form-item>
        </el-col>
        <el-col :span="locale === 'zh' ? 14: 9" style="text-align:right;">
          <el-form-item class="column-with-margin">
            <el-button type="primary" icon="Search" @click="handleQuery">{{
              $t("common.common.query")
            }}</el-button>
            <el-button icon="Refresh" @click="resetQuery">{{
              $t("common.common.reset")
            }}</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <el-row :gutter="10" class="mb8">
@@ -136,27 +143,31 @@
let tableColumn = [];
let tableData = [];
let merges = [];
watch(locale, (newLocale) => {
  options.value = [
    {
      value: "month",
      label: t("plan.options.monthlyStatic"),
    },
    {
      value: "day",
      label: t("plan.options.dailyStatic"),
    },
  ];
  queryParams.value.searchType = t("plan.options.monthlyStatic");
  if (
    (!queryParams.value.monthRange && dayCom.value == false) ||
    (!queryParams.value.monthDays && dayCom.value == true)
  ) {
    return;
  }
  // queryParams.value.pageNum = 1;
  getGasList();
},{ immediate: true, deep: true });
watch(
  locale,
  (newLocale) => {
    options.value = [
      {
        value: "month",
        label: t("plan.options.monthlyStatic"),
      },
      {
        value: "day",
        label: t("plan.options.dailyStatic"),
      },
    ];
    queryParams.value.searchType = t("plan.options.monthlyStatic");
    if (
      (!queryParams.value.monthRange && dayCom.value == false) ||
      (!queryParams.value.monthDays && dayCom.value == true)
    ) {
      return;
    }
    // queryParams.value.pageNum = 1;
    getGasList();
  },
  { immediate: true, deep: true }
);
function handleChangeSelectType(e) {
  searchTypeValue.value = e;
  if (e === "day") {
@@ -429,6 +440,9 @@
// getList();
</script>
<style lang="scss" scoped>
.column-with-margin {
  margin-right: 0px;
}
.box_container {
  width: 100%;
  margin: 20px auto;