管道基础大数据平台系统开发-【前端】-新系統界面
王旭
2023-05-10 86cdd4e6eece0ee4679e62ae347ec003db7d7425
src/views/datamanage/projectManage.vue
@@ -8,7 +8,32 @@
    ></My-bread>
    <el-divider />
    <div class="verSionContent">
      <div class="verSion_leftTree subpage_Div" style="border: 1px solid #dcdfe6;">
      <div
        class="verSion_leftTree subpage_Div"
        style="border: 1px solid #dcdfe6"
      >
        <el-form :inline="true" class="demo-form-inline">
          <el-form-item>
            <el-input
              size="small"
              v-model="filterInput"
              style="width: 200px"
              :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valueprojectName')"
              suffix-icon="el-icon-search"
            ></el-input>
          </el-form-item>
          <el-form-item>
            <el-button
              v-if="btnStatus.insert"
              icon="el-icon-plus"
              @click="insertProject"
              :disabled="count1 != 0 ? true : false"
              type="success"
              size="small"
              >{{ $t("common.increase") }}</el-button
            >
          </el-form-item>
        </el-form>
        <el-tree
          ref="tree"
          :props="defaultProps"
@@ -18,30 +43,20 @@
          :default-expand-all="false"
          draggable
          @node-click="handleNodeClick"
          :filter-node-method="filterNode"
        >
        </el-tree>
      </div>
      <div class="verSion_rightContent subpage_Div">
        <el-form :inline="true" class="demo-form-inline">
          <el-form-item  style="padding-bottom: 14px">
            <el-button
              v-if="btnStatus.insert"
              icon="el-icon-plus"
              @click="insertProject"
              :disabled="count1 != 0 ? true : false"
              type="success"
              size="small"
              >{{ $t("common.append") }}</el-button
            >
          </el-form-item>
        </el-form>
        <!--
        <!-- <el-divider class="eldivider" /> -->
        <div class="dividing-line"></div>
        <div class="table_box" style="height: calc(100% - 89px)">
        <!-- <div class="dividing-line"></div> -->
        <div class="table_box" style="height: 100%">
          <el-table
            ref="filterTable"
            :data="dbTableData"
            height="100%"
            border
            style="width: 100%"
          >
            <el-table-column
@@ -63,7 +78,7 @@
            />
            <el-table-column
                min-width="120"
              min-width="120"
              prop="corpname"
              :label="$t('dataManage.projectObj.corpname')"
            />
@@ -128,8 +143,8 @@
      top="2vh"
      :title="
        behavior == '新增项目'
          ? `${$t('dataManage.projectObj.newProj')}`
          : `${$t('dataManage.projectObj.editProj')}`
          ? `${$t('dataManage.projectObj.lable1')}`
          : `${$t('dataManage.projectObj.lable1')}`
      "
      :visible.sync="outerVisible"
      :before-close="outerClose"
@@ -153,18 +168,29 @@
          label-position="top"
        >
          <el-form-item :label="$t('dataManage.projectObj.projname')">
            <el-input v-model="editFrom.projname" style="width: 85%"></el-input>
            <el-input
              v-model="editFrom.projname"
              style="width: 85%"
              :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valueprojectName')"
            ></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.projectObj.projtype')">
            <el-input v-model="editFrom.projtype" style="width: 85%"></el-input>
            <el-input
              v-model="editFrom.projtype"
              style="width: 85%"
              :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valueprojectType')"
            ></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.projectObj.location')">
          <el-form-item :label="$t('dataManage.projectObj.location')+'('+$t('shuJuGuanLi.shuJuJianSuo.geographicPosition')+')'">
            <div class="BoxFlex">
              <div class="BoxFlexinput">
                <el-input
                  :disabled="true"
                  v-model="editFrom.geom"
                  style="width: 100%"
                  :placeholder="
                    $t('shuJuGuanLi.shuJuJianSuo.geographicPosition')
                  "
                ></el-input>
              </div>
              <div>
@@ -181,40 +207,43 @@
          </el-form-item>
          <el-form-item :label="$t('dataManage.projectObj.country')">
            <el-input v-model="editFrom.country" style="width: 85%"></el-input>
            <el-input v-model="editFrom.country" style="width: 85%"  :placeholder="$t('shuJuGuanLi.shuJuJianSuo.country')"></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.projectObj.province')">
            <el-input v-model="editFrom.province" style="width: 85%"></el-input>
            <el-input v-model="editFrom.province" style="width: 85%"  :placeholder="$t('shuJuGuanLi.shuJuJianSuo.province')"></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.projectObj.county')">
            <el-input v-model="editFrom.location" style="width: 85%"></el-input>
            <el-input v-model="editFrom.location" style="width: 85%"  :placeholder="$t('shuJuGuanLi.shuJuJianSuo.city')"></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.projectObj.corpname')">
            <el-input v-model="editFrom.corpname" style="width: 85%"></el-input>
            <el-input v-model="editFrom.corpname" style="width: 85%"  :placeholder="$t('shuJuGuanLi.shuJuJianSuo.construction')"></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.projectObj.department')">
            <el-input
              v-model="editFrom.department"
              style="width: 85%"
              :placeholder="$t('shuJuGuanLi.shuJuJianSuo.department')"
            ></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.projectObj.conperiod')">
            <el-input
              v-model="editFrom.conperiod"
              style="width: 85%"
               :placeholder="$t('shuJuGuanLi.shuJuJianSuo.constructionperiod')"
            ></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.projectObj.contents')">
            <el-input v-model="editFrom.contents" style="width: 85%"></el-input>
            <el-input v-model="editFrom.contents" style="width: 85%"  :placeholder="$t('shuJuGuanLi.shuJuJianSuo.projectContent')"></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.projectObj.projstate')">
            <el-input
              v-model="editFrom.projstate"
              style="width: 85%"
              :placeholder="$t('shuJuGuanLi.shuJuJianSuo.projectStatus')"
            ></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.projectObj.remarks')">
            <el-input v-model="editFrom.remarks" style="width: 85%"></el-input>
            <el-input v-model="editFrom.remarks" style="width: 85%"    :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valueRemarks')"></el-input>
          </el-form-item>
        </el-form>
      </div>
@@ -252,13 +281,14 @@
  components: { MyBread, ProjectOl },
  data() {
    return {
      filterInput: "",
      behavior: null,
      outerVisible: false,
      innerVisible: false,
      showMap: false,
      count: null,
      projectFrom: {},
      editFrom: { geom: " " },
      editFrom: { geom: " ", projname: "" },
      dirId: null,
      elProject: [],
      dirList: [], //el树数据
@@ -281,6 +311,7 @@
        pageSize: 10,
      },
      count1: 0,
      title: null,
    };
  },
  created() {
@@ -290,6 +321,11 @@
  computed: {},
  methods: {
    filterNode(value, data) {
      if (!value) return true;
      return data.name.indexOf(value) !== -1;
    },
    showPermsBtn() {
      let currentPerms = this.$store.state.currentPerms;
      let permsEntity = this.$store.state.permsEntity;
@@ -320,7 +356,7 @@
        x: wkt.coordinates[0],
        y: wkt.coordinates[1],
      });
      console.log(data.result);
      if (data.code == 200) {
        for (var i in data.result) {
          var key = data.result[i].key;
@@ -401,16 +437,18 @@
    //新增项目
    insertProject() {
      if (this.dirId == null) {
        this.$message.error("请选择需要新增的目录");
        this.$message.error("请选择需要添加的项目");
        return;
      }
      this.behavior = "新增项目";
      this.outerVisible = true;
      this.editFrom.projname = this.title;
    },
    //目录树点击事件
    handleNodeClick(data) {
      //获取目录ID
      // this.dirId = data.id;
      this.title = data.name;
      this.dirId = data.code;
      this.getSelectProject();
    },
@@ -454,7 +492,11 @@
      });
    },
  },
  watch: {},
  watch: {
    filterInput(val) {
      this.$refs.tree.filter(val);
    },
  },
};
</script>
<style lang="less" scoped>
@@ -494,7 +536,7 @@
  border-radius: 5px;
  //border: 1px solid #dcdfe6;
  //margin-bottom: 20px;
  text-align: right;
  // text-align: right;
  .el-form-item {
    margin: 5px;
  }