管道基础大数据平台系统开发-【前端】-新系統界面
584911253@qq.com
2023-02-25 9660afd3e2ed1b9bd87c9316f8b24c63ad4c9a4e
src/views/maintenance/menuSettings.vue
@@ -26,7 +26,7 @@
      </div>
      <div class="right_menu subpage_Div">
        <div style="display:flex;justify-content:space-between">
        <div style="display:flex;justify-content:space-between;align-items: center;padding-bottom: 14px">
          <el-breadcrumb separator="/">
            <el-breadcrumb-item :to="{ path: '/' }">{{
            $t('dataManage.dictionaryManageObj.particulars')
@@ -41,7 +41,7 @@
              type="success"
              icon="el-icon-plus"
              size="small"
            >新增同级</el-button>
            >{{$t('operatManage.menuSetObj.insert')}}</el-button>
            <el-button
              v-if="menuStatus.insert"
              :disabled="itemdetail.pid == null ? true : false"
@@ -49,7 +49,7 @@
              type="success"
              icon="el-icon-plus"
              size="small"
            >新增子级</el-button>
            >{{$t('operatManage.menuSetObj.subInsert')}}</el-button>
            <el-button
              v-if="menuStatus.delete"
              @click="setDelNode()"
@@ -57,7 +57,7 @@
              type="danger"
              icon="el-icon-delete"
              size="small"
            >删除</el-button>
            >{{$t('operatManage.menuSetObj.delete')}}</el-button>
            <el-button
              v-if="menuStatus.update"
              :disabled="itemdetail.pid == null ? true : false"
@@ -65,7 +65,7 @@
              type="info"
              icon="el-icon-top"
              size="small"
            >向上移动</el-button>
            >{{$t('operatManage.menuSetObj.moveUp')}}</el-button>
            <el-button
              v-if="menuStatus.update"
              :disabled="itemdetail.pid == null ? true : false"
@@ -73,11 +73,12 @@
              type="info"
              icon="el-icon-bottom"
              size="small"
            >向下移动</el-button>
            >{{$t('operatManage.menuSetObj.moveDown')}}</el-button>
          </div>
        </div>
        <el-divider />
        <div class="dividing-line"></div>
<!--        <el-divider />-->
        <div class="form_box">
          <el-form
            :model="itemdetail"
@@ -93,6 +94,7 @@
              <el-input
                clear="el_input"
                v-model="itemdetail.enName"
                :placeholder="$t('operatManage.menuSetObj.enNameHolder')"
                autocomplete="off"
              ></el-input>
            </el-form-item>
@@ -103,6 +105,7 @@
            >
              <el-input
                v-model="itemdetail.cnName"
                :placeholder="$t('operatManage.menuSetObj.cnNameHolder')"
                autocomplete="off"
              ></el-input>
            </el-form-item>
@@ -112,6 +115,7 @@
            >
              <el-input
                v-model="itemdetail.icon"
                :placeholder="$t('operatManage.menuSetObj.iconHolder')"
                autocomplete="off"
              ></el-input>
            </el-form-item>
@@ -124,14 +128,16 @@
                style="width: 400px"
                :popper-append-to-body="false"
                v-model="itemdetail.isShow"
                placeholder=""
                :placeholder="$t('operatManage.menuSetObj.show')"
              >
                <el-option
                  v-for="item in options1"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                <el-option :label="$t('operatManage.menuSetObj.hiddeen')" value="0" />
                <el-option :label="$t('operatManage.menuSetObj.isshow')" value="1" />
<!--                <el-option-->
<!--                  v-for="item in options1"-->
<!--                  :key="item.value"-->
<!--                  :label="item.label"-->
<!--                  :value="item.value"-->
<!--                >-->
                </el-option>
              </el-select>
            </el-form-item>
@@ -141,6 +147,7 @@
            >
              <el-input
                v-model="itemdetail.url"
                :placeholder="$t('operatManage.menuSetObj.menuUrlHolder')"
                autocomplete="off"
              ></el-input>
            </el-form-item>
@@ -150,6 +157,7 @@
            >
              <el-input
                v-model="itemdetail.perms"
                :placeholder="$t('operatManage.menuSetObj.permsHolder')"
                autocomplete="off"
              ></el-input>
            </el-form-item>
@@ -162,15 +170,18 @@
                style="width: 400px"
                :popper-append-to-body="false"
                v-model="itemdetail.type"
                :placeholder="$t('common.choose')"
                :placeholder="$t('operatManage.menuSetObj.typeHolder')"
              >
                <el-option
                  v-for="item in options2"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
                <el-option :label="$t('operatManage.menuSetObj.rootpath')" value="0" />
                <el-option :label="$t('operatManage.menuSetObj.menu')" value="1" />
                <el-option :label="$t('operatManage.menuSetObj.button')" value="2" />
<!--                <el-option-->
<!--                  v-for="item in options2"-->
<!--                  :key="item.value"-->
<!--                  :label="item.label"-->
<!--                  :value="item.value"-->
<!--                >-->
<!--                </el-option>-->
              </el-select>
            </el-form-item>
            <el-form-item
@@ -180,10 +191,11 @@
              <el-input
                v-model="itemdetail.bak"
                autocomplete="off"
                :placeholder="$t('operatManage.menuSetObj.bakHolder')"
              ></el-input>
            </el-form-item>
            <div
              class="btnBox"
              style="margin-left: 100px"
              v-if="menuStatus.update"
            >
              <el-button
@@ -398,53 +410,54 @@
        type: null,
        bak: '',
      },
      rules: {
      rules :  {
        enName: [
          { required: true, message: '请输入英文名称', trigger: 'blur' },
          { required: true, message: this.$t('operatManage.menuSetObj.enNameHolder'), trigger: 'blur' },
        ],
        cnName: [
          { required: true, message: '请输入中文名称', trigger: 'blur' },
          { required: true, message: this.$t('operatManage.menuSetObj.cnNameHolder'), trigger: 'blur' },
        ],
        isShow: [
          {
            required: true,
            message: '请选择是否显示',
            message: this.$t('operatManage.menuSetObj.show'),
            trigger: 'change',
          },
        ],
        type: [
          {
            required: true,
            message: '请选择节点类型',
            message: this.$t('operatManage.menuSetObj.typeHolder'),
            trigger: 'change',
          },
        ],
      },
      // 下拉的option里面的value定义成0,1,不能定义成’0’,'1’字符串,
      // 如果要定义成字符串,后台需要返回的也是字符串
      options1: [
        {
          value: 0,
          label: '隐藏',
          label:this.$t('operatManage.menuSetObj.hiddeen')
        },
        {
          value: 1,
          label: '显示',
          label:this.$t('operatManage.menuSetObj.isshow')
        },
      ],
      options2: [
        {
          value: 0,
          label: '根目录',
          label:this.$t('operatManage.menuSetObj.rootpath')
          // label: '根目录',
        },
        {
          value: 1,
          label: '菜单',
          label:this.$t('operatManage.menuSetObj.menu')
          // label: '菜单',
        },
        {
          value: 2,
          label: '按钮',
          label:this.$t('operatManage.menuSetObj.button')
          // label: '按钮',
        },
      ],
      newNode: null,
@@ -860,7 +873,7 @@
.menuSettings_box {
  height: 98%;
  width: 98%;
  padding: 1%;
  padding: 0.5% 1%;
  .cataLogContent {
    width: 100%;
@@ -869,7 +882,8 @@
    justify-content: space-between;
    .left_Tree {
      width: 15%;
      height: 91%;
      //height: 91%;
      height: 100%;
      border-radius: 5px;
      padding: 1%;
      overflow-y: auto;
@@ -882,6 +896,7 @@
      overflow: auto;
      .form_box {
        box-sizing: border-box;
        padding-top: 20px;
        width: 100%;
        .el-input {
          width: 400px;
@@ -897,4 +912,3 @@
  right: 0;
}
</style>