lxl
2022-09-20 b8720f30d8916555067c22acb7fda83efbc2f9f3
src/views/Thematic/index.vue
@@ -3,54 +3,98 @@
    <el-card style="height: 100%">
      <el-row :gutter="20">
        <el-col :span="6">
          <div class="th_title">专题地图</div>
          <div class="th_title">{{ $t("themaic.name") }}</div>
        </el-col>
        <el-col :span="4" :offset="14">
          <el-input size="small" placeholder="请输入内容" suffix-icon="el-icon-search" v-model="input3">
          <el-input
            size="small"
            :placeholder="$t('common.pleaseInput')"
            suffix-icon="el-icon-search"
            v-model="input3"
          >
          </el-input>
        </el-col>
      </el-row>
      <el-divider />
      <el-row>
        <el-col :span="5">
          <label style="margin-right: 10px">地图名称:</label>
          <el-select v-model="selvalue" class="m-2" placeholder="Select" style="width: 150px">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
          <label style="margin-right: 10px"
            >{{ $t("themaic.maptltle") }}:</label
          >
          <el-select
            v-model="selvalue"
            class="m-2"
            placeholder="Select"
            style="width: 150px"
          >
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-col>
        <el-col :span="3">
          <div style="margin-top: 5px">
            <label style="margin-right: 10px">按时间排序:</label>
            <label style="margin-right: 10px"
              >{{ $t("themaic.sortbytime") }}:</label
            >
            <i @click="changetime(1)" :class="{ active: timeindex == 1 }" class="el-icon-caret-bottom"></i>
            <i
              @click="changetime(1)"
              :class="{ active: timeindex == 1 }"
              class="el-icon-caret-bottom"
            ></i>
            <i @click="changetime(2)" :class="{ active: timeindex == 2 }" class="el-icon-caret-top"></i>
            <i
              @click="changetime(2)"
              :class="{ active: timeindex == 2 }"
              class="el-icon-caret-top"
            ></i>
          </div>
        </el-col>
        <el-col :span="3">
          <div style="margin-top: 5px">
            <label style="margin-right: 10px">按浏览次数排序:</label>
            <label style="margin-right: 10px"
              >{{ $t("themaic.sortbyviews") }}:</label
            >
            <i @click="changeChecked(1)" :class="{ active: checkindex == 1 }" class="el-icon-caret-bottom"></i>
            <i
              @click="changeChecked(1)"
              :class="{ active: checkindex == 1 }"
              class="el-icon-caret-bottom"
            ></i>
            <i @click="changeChecked(2)" :class="{ active: checkindex == 2 }" class="el-icon-caret-top"></i>
            <i
              @click="changeChecked(2)"
              :class="{ active: checkindex == 2 }"
              class="el-icon-caret-top"
            ></i>
          </div>
        </el-col>
        <el-col :span="10"> </el-col>
        <el-col :span="3">
          <div style="margin-top: 5px">
            <label style="margin-right: 10px">共找到{{ listcount }}个结果</label>
            {{ $t("themaic.find") }}
            <label style="magin: 0% 15px">{{ listcount }}</label>
            {{ $t("themaic.record") }}
          </div>
        </el-col>
      </el-row>
      <el-divider />
      <el-card shadow="never" class="themic_middle_card">
        <div @click="showThematic(item)" v-for="(item, i) in middleList" class="midedle_div" :key="i">
        <div
          @click="showThematic(item)"
          v-for="(item, i) in middleList"
          class="midedle_div"
          :key="i"
        >
          <el-card class="middle_card">
            <!-- <div>
           </div> -->
            <table>
@@ -61,31 +105,43 @@
              </tr>
              <tr>
                <td>
                  <div class="middle_image"
                    :style="{ background: 'url(' + item.url + ') no-repeat center', 'background-size': '100% 100%', }">
                  </div>
                  <div
                    class="middle_image"
                    :style="{
                      background: 'url(' + item.url + ') no-repeat center',
                      'background-size': '100% 100%',
                    }"
                  ></div>
                </td>
              </tr>
              <tr>
                <td>
                  <div style="position: absolute;
    bottom: 2%;
    right: 4%;"><label class="t2">{{ item.time }}</label><label class="t2">浏览{{ item.count }}次</label></div>
                  <div style="position: absolute; bottom: 2%; right: 4%">
                    <label class="t2">{{ item.time }}</label
                    ><label class="t2">浏览{{ item.count }}次</label>
                  </div>
                </td>
              </tr>
            </table>
          </el-card>
        </div>
      </el-card>
      <el-pagination layout="prev, pager, next, jumper" :total="pagesize" @size-change="handleSizeChange"
        @current-change="handleCurrentChange" />
      <el-pagination
        layout="prev, pager, next, jumper"
        :total="pagesize"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
    </el-card>
    <el-dialog class="themaic_dialog" :modal-append-to-body="true" :append-to-body="true" :show-close="false"
      :visible.sync="dialogVisible" width="99%" :before-close="handleClose">
    <el-dialog
      class="themaic_dialog"
      :modal-append-to-body="true"
      :append-to-body="true"
      :show-close="false"
      :visible.sync="dialogVisible"
      width="99%"
      :before-close="handleClose"
    >
      <map-View @close="close" :typeIndex="typeIndex"></map-View>
    </el-dialog>
  </div>
@@ -173,8 +229,8 @@
      typeIndex: "",
    };
  },
  mounted(){
     this.timeindex = 7888;
  mounted() {
  },
  methods: {
    close() {
@@ -210,8 +266,8 @@
    showThematic(res) {
      this.typeIndex = res.index;
      this.dialogVisible = true;
      // var url = "http://localhost/" + res.pop;
      // window.open(