fix:政府站点修改

quanyawei

2023-09-21 78044879ff5f5b5966d594b51e9568fd57ed0e8a

fix:政府站点修改

 src/views/device/govMonitorPoint.vue

@@ -5,22 +5,13 @@
        <a-form-model layout="horizontal">

          <a-row  :gutter="15">

            <a-col :span="5">

              <a-button

                  icon="plus"

                  type="primary"

                  @click="() => this.handleModalVisible(true)"

                  style="margin-left: 25px;"

              >新建</a-button>

              <a-button icon="plus" type="primary" @click="() => this.handleModalVisible(true)"

                style="margin-left: 25px;">新建</a-button>

            </a-col>

            <a-col :span="5" style="margin-left: 37%">

              <a-form-model-item :wrapperCol="wrapperCol">

                <a-select

                    placeholder="选择站点类型"

                    style="width: 240px;margin-top:4px"

                    @change="handleChange"

                    allow-clear

                    show-search

                >

                <a-select placeholder="选择站点类型" style="width: 240px;margin-top:4px" @change="handleChange" allow-clear

                  show-search>

                  <a-select-option v-for="(item,index) in stationLevel" :key="index" :value="index">

                    {{ item }}

                  </a-select-option>

@@ -28,236 +19,89 @@
              </a-form-model-item>

            </a-col>

            <a-col :span="5" >

              <a-form-model-item

                  :wrapperCol="wrapperCol">

              <a-form-model-item :wrapperCol="wrapperCol">

                <a-input v-model="searchName" placeholder="请输入站点名称" allow-clear />

              </a-form-model-item>

            </a-col>

          </a-row>

        </a-form-model

         >

        </a-form-model>

      </div>

      <av-standard-table

          :dataSource="dataSource"

          :columns="columns"

          :loading="tableLoading"

          :paginationProps="pagination"

          @tableChange="handlerTableChange"

      ></av-standard-table>

      <av-standard-table :dataSource="dataSource" :columns="columns" :loading="tableLoading" :paginationProps="pagination"

        @tableChange="handlerTableChange"></av-standard-table>

    </div>

    <a-modal

        title="政府站点添加"

        destroyOnClose

        :visible="addShowOrHiddenFlag"

        @ok="addOK"

        @cancel="addCancel"

        okText="保存"

    >

      <a-form-model

          style="margin-top: 8px"

          :model="addForm"

          :rules="rules"

          ref="addRulesForm"

      >

        <a-form-model-item has-feedback

                           :labelCol="{ span: 5 }"

                           :wrapperCol="{ span: 15 }"

                           label="站点编号"

                           prop="guid">

          <a-input

              placeholder="请输入站点编号"

              type="string"

              v-model="addForm.guid"

          />

    <a-modal title="政府站点添加" destroyOnClose :visible="addShowOrHiddenFlag" @ok="addOK" @cancel="addCancel" okText="保存">

      <a-form-model style="margin-top: 8px" :model="addForm" :rules="rules" ref="addRulesForm">

        <a-form-model-item has-feedback :labelCol="{ span: 5 }" :wrapperCol="{ span: 15 }" label="站点编号" prop="guid">

          <a-input placeholder="请输入站点编号" type="string" v-model="addForm.guid" />

        </a-form-model-item>

        <a-form-model-item has-feedback

                           :labelCol="{ span: 5 }"

                           :wrapperCol="{ span: 15 }"

                           label="名称"

                           prop="name">

          <a-input

              placeholder="设备名称"

              type="string"

              v-model="addForm.name"

          />

        <a-form-model-item has-feedback :labelCol="{ span: 5 }" :wrapperCol="{ span: 15 }" label="名称" prop="name">

          <a-input placeholder="设备名称" type="string" v-model="addForm.name" />

        </a-form-model-item>



        <a-form-model-item

            :labelCol="{ span: 5 }"

            has-feedback

            :wrapperCol="{ span: 15 }"

            label="经度"

            prop="longitude"

        >

          <a-input

              placeholder="请输入经度"

              type="string"

              v-model="addForm.longitude"

          />

        <a-form-model-item :labelCol="{ span: 5 }" has-feedback :wrapperCol="{ span: 15 }" label="经度" prop="longitude">

          <a-input placeholder="请输入经度" type="string" v-model="addForm.longitude" />

        </a-form-model-item>

        <a-form-model-item

            :labelCol="{ span: 5 }"

            has-feedback

            :wrapperCol="{ span: 15 }"

            label="纬度"

            prop="latitude"

        >

          <a-input

              placeholder="请输入纬度"

              type="string"

              v-model="addForm.latitude"

          />

        <a-form-model-item :labelCol="{ span: 5 }" has-feedback :wrapperCol="{ span: 15 }" label="纬度" prop="latitude">

          <a-input placeholder="请输入纬度" type="string" v-model="addForm.latitude" />

        </a-form-model-item>

        <a-form-model-item

            :labelCol="{ span: 5 }"

            :wrapperCol="{ span: 15 }"

            label="位置"

            has-feedback

            prop="position"

        >

        <a-form-model-item :labelCol="{ span: 5 }" :wrapperCol="{ span: 15 }" label="位置" has-feedback prop="position">

<!--            v-decorator="['position', { rules: [{ required: true, message: '定位级别不能为空'  }] }]"-->

            <a-cascader :options="areaData" placeholder="选择城市" @change="positionLevel" labelInValue/>

        </a-form-model-item>

        <a-form-model-item

            :labelCol="{ span: 5 }"

            has-feedback

            :wrapperCol="{ span: 15 }"

            label="站点类型"

            prop="stationLevel"

        >

          <a-select

              placeholder="选择站点类型"

              type="string"

              allow-clear

              show-search

              v-model="addForm.stationLevel"

          >

            <a-select-option v-for="(item,index) in stationLevel" :key="index" :value = 'index'>{{ item }}</a-select-option>

        <a-form-model-item :labelCol="{ span: 5 }" has-feedback :wrapperCol="{ span: 15 }" label="站点类型"

          prop="stationLevel">

          <a-select placeholder="选择站点类型" type="string" allow-clear show-search v-model="addForm.stationLevel">

            <a-select-option v-for="(item, index) in stationLevel" :key="index" :value='index'>{{ item

            }}</a-select-option>

          </a-select>

        </a-form-model-item>

        <a-form-model-item

            :labelCol="{ span: 5 }"

            has-feedback

            :wrapperCol="{ span: 15 }"

            label="描述"

            prop="desc"

        >

          <a-input

              placeholder="描述"

              type="string"

              v-model="addForm.desc"

          />

        <a-form-model-item :labelCol="{ span: 5 }" has-feedback :wrapperCol="{ span: 15 }" label="描述" prop="desc">

          <a-input placeholder="描述" type="string" v-model="addForm.desc" />

        </a-form-model-item>

      </a-form-model>

    </a-modal>

    <a-modal

        title="政府站点编辑"

        destroyOnClose

        :visible="editShowOrHiddenFlag"

        @ok="editSave"

        @cancel="editCancel"

        okText="保存"

    >

      <a-form-model

          style="margin-top: 8px"

          :model="editForm"

          :rules="rules"

          ref="editRulesForm"

      >

        <a-form-model-item has-feedback

                           :labelCol="{ span: 5 }"

                           :wrapperCol="{ span: 15 }"

                           label="站点编号"

                           prop="guid">

          <a-input

              placeholder="请输入站点编号"

              type="string"

              v-model="editForm.guid"

          />

    <a-modal title="政府站点编辑" destroyOnClose :visible="editShowOrHiddenFlag" @ok="editSave" @cancel="editCancel"

      okText="保存">

      <a-form-model style="margin-top: 8px" :model="editForm" :rules="rules" ref="editRulesForm">

        <a-form-model-item has-feedback :labelCol="{ span: 5 }" :wrapperCol="{ span: 15 }" label="站点编号" prop="guid">

          <a-input placeholder="请输入站点编号" type="string" v-model="editForm.guid" />

        </a-form-model-item>

        <a-form-model-item has-feedback

                           :labelCol="{ span: 5 }"

                           :wrapperCol="{ span: 15 }"

                           label="名称"

                           prop="name">

          <a-input

              placeholder="设备名称"

              type="string"

              v-model="editForm.name"

          />

        <a-form-model-item has-feedback :labelCol="{ span: 5 }" :wrapperCol="{ span: 15 }" label="名称" prop="name">

          <a-input placeholder="设备名称" type="string" v-model="editForm.name" />

        </a-form-model-item>



        <a-form-model-item

            :labelCol="{ span: 5 }"

            has-feedback

            :wrapperCol="{ span: 15 }"

            label="经度"

            prop="longitude"

        >

          <a-input

              placeholder="请输入经度"

              type="string"

              v-model="editForm.longitude"

          />

        <a-form-model-item :labelCol="{ span: 5 }" has-feedback :wrapperCol="{ span: 15 }" label="经度" prop="longitude">

          <a-input placeholder="请输入经度" type="string" v-model="editForm.longitude" />

        </a-form-model-item>

        <a-form-model-item

            :labelCol="{ span: 5 }"

            has-feedback

            :wrapperCol="{ span: 15 }"

            label="纬度"

            prop="latitude"

        >

          <a-input

              placeholder="请输入纬度"

              type="string"

              v-model="editForm.latitude"

          />

        <a-form-model-item :labelCol="{ span: 5 }" has-feedback :wrapperCol="{ span: 15 }" label="纬度" prop="latitude">

          <a-input placeholder="请输入纬度" type="string" v-model="editForm.latitude" />

        </a-form-model-item>

        <a-form-model-item

            :labelCol="{ span: 5 }"

            :wrapperCol="{ span: 15 }"

            label="位置"

            has-feedback

            prop="position"

        >

        <a-form-model-item :labelCol="{ span: 5 }" :wrapperCol="{ span: 15 }" label="位置" has-feedback prop="position">

          <!--            v-decorator="['position', { rules: [{ required: true, message: '定位级别不能为空'  }] }]"-->

          <a-cascader v-model="editForm.position" :options="areaData" placeholder="双击选择城市"

                      @change="positionLevel" labelInValue/>

          <a-cascader v-model="editForm.position" :options="areaData" placeholder="双击选择城市" @change="positionLevel"

            labelInValue />

        </a-form-model-item>

        <a-form-model-item

            :labelCol="{ span: 5 }"

            has-feedback

            :wrapperCol="{ span: 15 }"

            label="站点类型"

            prop="stationLevel"

        >

          <a-select

              placeholder="选择站点类型"

              type="string"

              allow-clear

              show-search

              v-model="editForm.stationLevel"

          >

            <a-select-option v-for="(item,index) in stationLevel" :key="index" :value = 'index'>{{ item }}</a-select-option>

        <a-form-model-item :labelCol="{ span: 5 }" has-feedback :wrapperCol="{ span: 15 }" label="站点类型"

          prop="stationLevel">

          <a-select placeholder="选择站点类型" type="string" allow-clear show-search v-model="editForm.stationLevel">

            <a-select-option v-for="(item, index) in stationLevel" :key="index" :value='index'>{{ item

            }}</a-select-option>

          </a-select>

        </a-form-model-item>

        <a-form-model-item

            :labelCol="{ span: 5 }"

            has-feedback

            :wrapperCol="{ span: 15 }"

            label="描述"

            prop="desc"

        >

          <a-input

              placeholder="描述"

              type="string"

              v-model="editForm.desc"

          />

        <a-form-model-item :labelCol="{ span: 5 }" has-feedback :wrapperCol="{ span: 15 }" label="描述" prop="desc">

          <a-input placeholder="描述" type="string" v-model="editForm.desc" />

        </a-form-model-item>

      </a-form-model>

    </a-modal>

    <a-modal title="政府站点编辑" destroyOnClose :visible="editSiteShowOrHiddenFlag" :rules="siteRules" @ok="editSiteSave"

      @cancel="editSiteCancel" okText="保存">

      <a-form-model style="margin-top: 8px" :model="editSiteForm" ref="editSiteRulesForm">

        <a-form-model-item has-feedback :labelCol="{ span: 5 }" :wrapperCol="{ span: 15 }" label="站点编号" prop="guid">

          <a-input placeholder="请输入站点编号" type="string" v-model="editSiteForm.guid" />

        </a-form-model-item>

      </a-form-model>

    </a-modal>

  </a-card>



</template>



<script lang="tsx">

@@ -321,6 +165,8 @@
  private addShowOrHiddenFlag: boolean = false

  // 显示编辑隐藏标识

  private editShowOrHiddenFlag: boolean = false



  private editSiteShowOrHiddenFlag: boolean = false

  // 存放地理位置信息

  private areaData: any = JSON.parse(JSON.stringify(org))

  // 指定新增和编辑规则

@@ -344,10 +190,16 @@
      {required: true, message: '请选择站点类型', trigger: ['change', 'blur']},

    ]

  }

  private siteRules: any = {

    guid: [

      { required: true, message: '设备编号不能为空', trigger: ['change', 'blur'] },

    ]

  }

  // 政府站点类型

  private stationLevel: any = {}

  // 存放编辑前的数据record

  private editBeforeRecord: any = null

  private editBeforeSiteRecord: any = null

  // 新增表单数据

  private addForm: any = {

    guid: '',

@@ -368,6 +220,11 @@
    position: [],

    stationLevel: undefined,

    desc: ''

  }

  // 编辑表单数据

  private editSiteForm: any = {

    id: -1,

    guid: ''

  }

  // 分页数据

  private pagination: any = {

@@ -522,6 +379,54 @@
      desc: record.desc === undefined ? '' : record.desc

    }

  }

  // 编辑显示

  private editSiteShow(flag: boolean, record: any) {

    this.editSiteShowOrHiddenFlag = flag

    this.editBeforeSiteRecord = record

    const positon = []

    positon.push(record.provinceCode)

    positon.push(record.cityCode)

    positon.push(record.areaCode)

    this.editSiteForm = {

      id: record.id,

      guid: record.guid

    }

  }

  // 编辑站点保存

  private editSiteSave() {

    this.$refs.editSiteRulesForm.validate((valid: any) => {

      if (valid) {

        const guid = this.editSiteForm.guid === this.editBeforeSiteRecord.guid ? null : this.editSiteForm.guid

        if (!(guid)) {

          this.$message.warning('未修改！')

        } else {

          get('govMonitorPoint/updateGuid', {

            id: this.editSiteForm.id,

            guid

          }).then((res: any) => {

            if (res.data.code === 0) {

              this.$message.success(res.data.message)

              this.editSiteForm = {

                id: -1,

                guid: ''

              }

              this.editSiteShowOrHiddenFlag = false

              this.queryGovDatas()

            } else {

              this.$message.warning(res.data.message)

            }

          })

        }

      }

    })

  }

  private editSiteCancel() {

    this.editForm = {

      id: -1,

      guid: ''

    }

    this.editSiteShowOrHiddenFlag = false

  }

  // 编辑保存

  private editSave() {

    this.$refs.editRulesForm.validate((valid: any) => {

@@ -618,12 +523,15 @@
          >

            <a href="#">删除</a>

          </a-popconfirm>

        <a-divider type="vertical" />

        <a onClick={() => this.editSiteShow(true, record)}>

          {" "}

          政府站点修改{" "}

        </a>

        </div>

    )

  }

}

</script>



<style scoped>



</style>

<style scoped></style>