NEZ-3070 fix：software asset列表编辑页面 （50%）

nezha-fronted/package-lock.json

@@ -4294,7 +4294,7 @@
     "boolbase": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
-      "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
+      "integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww=="
     },
     "brace-expansion": {
       "version": "1.1.11",
@@ -5302,7 +5302,7 @@
     "color-name": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
+      "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw=="
     },
     "color-string": {
       "version": "1.9.1",
@@ -5413,7 +5413,7 @@
     "concat-map": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
-      "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
+      "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg=="
     },
     "concat-stream": {
       "version": "1.6.2",
@@ -8254,7 +8254,7 @@
     "escape-string-regexp": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
+      "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg=="
     },
     "escodegen": {
       "version": "1.14.3",
@@ -9314,7 +9314,7 @@
     "fast-levenshtein": {
       "version": "2.0.6",
       "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
-      "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=",
+      "integrity": "sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==",
       "dev": true
     },
     "faye-websocket": {
@@ -9732,7 +9732,7 @@
     "fs.realpath": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
-      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
+      "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw=="
     },
     "fsevents": {
       "version": "1.2.13",
@@ -10263,7 +10263,7 @@
     "has-flag": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
-      "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0="
+      "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw=="
     },
     "has-symbol-support-x": {
       "version": "1.4.2",
@@ -10819,7 +10819,7 @@
     "imurmurhash": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
-      "integrity": "sha1-khi5srkoojixPcT7a21XbyMUU+o="
+      "integrity": "sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA=="
     },
     "in-publish": {
       "version": "2.0.1",
@@ -10845,7 +10845,7 @@
     "inflight": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
-      "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
+      "integrity": "sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==",
       "requires": {
         "once": "^1.3.0",
         "wrappy": "1"
@@ -11089,7 +11089,7 @@
     "is-extglob": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
-      "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
+      "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ=="
     },
     "is-finite": {
       "version": "1.0.2",
@@ -11304,7 +11304,7 @@
     "isexe": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-      "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA=",
+      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
       "dev": true
     },
     "isobject": {
@@ -12608,7 +12608,7 @@
     "json-stable-stringify-without-jsonify": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz",
-      "integrity": "sha1-nbe1lJatPzz+8wp1FC0tkwrXJlE="
+      "integrity": "sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw=="
     },
     "json-stringify-safe": {
       "version": "5.0.1",
@@ -14137,7 +14137,7 @@
     "natural-compare": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz",
-      "integrity": "sha1-Sr6/7tdUHywnrPspvbvRXI1bpPc=",
+      "integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==",
       "dev": true
     },
     "ncp": {
@@ -14627,7 +14627,7 @@
     "once": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
-      "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
+      "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==",
       "requires": {
         "wrappy": "1"
       }
@@ -15004,7 +15004,7 @@
     "path-is-absolute": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
-      "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18="
+      "integrity": "sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg=="
     },
     "path-is-inside": {
       "version": "1.0.2",
@@ -18573,7 +18573,7 @@
     "svg-tags": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/svg-tags/-/svg-tags-1.0.0.tgz",
-      "integrity": "sha1-WPcc7jvVGbWdSyqEO2x95krAR2Q=",
+      "integrity": "sha512-ovssysQTa+luh7A5Weu3Rta6FJlFBBbInjOh722LIt6klpU2/HtdUbszju/G4devcvk8PGt7FCLv5wftu3THUA==",
       "dev": true
     },
     "svgo": {
@@ -19288,7 +19288,7 @@
     "text-table": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
-      "integrity": "sha1-f17oI66AUgfACvLfSoTsP8+lcLQ=",
+      "integrity": "sha512-N+8UisAXDGk8PFXP4HAzVR9nbfmVJ3zYLAWiTIoqC5v5isinhr+r5uaO8+7r3BMfuNIufIsA7RdpVgacC2cSpw==",
       "dev": true
     },
     "throat": {
@@ -19928,7 +19928,7 @@
     "util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
+      "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw=="
     },
     "util.promisify": {
       "version": "1.0.0",
@@ -21254,7 +21254,7 @@
     "wrappy": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
-      "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
+      "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ=="
     },
     "write-file-atomic": {
       "version": "2.4.1",

nezha-fronted/src/components/common/mixin/dataList.js

@@ -161,6 +161,8 @@ export default {
           if (this.detailType === 'view') {
             this.$refs.dataDetail && (this.$refs.dataDetail.$refs.dataTable.scrollTop = 0)
           }
+        } else {
+          this.$message.error(response.error || response.msg)
         }
       })
     },

nezha-fronted/src/components/common/rightBox/software/softwareAssetBox.vue

@@ -0,0 +1,260 @@
+<template>
+  <div v-clickoutside="{obj: editSoftwareAsset, func: esc}" class="right-box right-box-editSoftwareAsset right-box-edit-endpoint ">
+    <div class="right-box__header">
+      <div class="header__title">{{editSoftwareAsset.id ? $t('softwareAsset.edit') : $t('softwareAsset.create')}}</div>
+      <div class="header__operation">
+        <span v-cancel="{obj: editSoftwareAsset, func: esc}"><i class="nz-icon nz-icon-close" :title="$t('overall.close')"></i></span>
+      </div>
+    </div>
+    <div class="right-box__container">
+      <div class="container__form">
+        <el-form ref="modelForm" :model="editSoftwareAsset" :rules="rules" label-position="top" label-width="120px">
+          <!--name-->
+          <el-form-item :label="$t('config.model.name')" prop="name">
+            <el-input maxlength="128" show-word-limit v-model="editSoftwareAsset.name" size="small" type="text"></el-input>
+          </el-form-item>
+          <!--type-->
+          <el-form-item :label="$t('softwareType.text')" prop="typeId" class="select-warp">
+<!--            <el-input maxlength="128" show-word-limit v-model="editSoftwareAsset.type" size="small" type="text"></el-input>-->
+            <el-select v-model="editSoftwareAsset.typeId" size="small" class="right-box__select" popper-class="right-box-select-top prevent-clickoutside" x>
+              <el-option v-for="item in softwareTypeArr" :key="item.id" :value="item.id" :label="item.name"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item :label='$t("asset.asset")' label-width="125px" prop="assetId" v-if="!disabled">
+            <!--            <el-select id="module-box-input-asset"  @change="renderEndpoint" v-model="editEndpoint.assetId" :disabled="disabled" class="right-box__select" placeholder="" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="id">-->
+            <!--              <el-option v-for="item in assetList" :id="'asset-'+item.id" :key="item.id" :label="item.name" :value="item.id"></el-option>-->
+            <!--            </el-select>-->
+            <v-selectpage
+              :data="assetList"
+              :tb-columns="columns"
+              :params="{
+                varType: 2, dashboardId: 0,
+                returnChildren:0,groupId:0,
+              }"
+              :multiple="false"
+              :language="language"
+              title="ChartSearch"
+              key-field="id"
+              show-field="name"
+              :width="626"
+              v-model="editSoftwareAsset.assetId"
+              class="form-control"
+              ref="sp"
+              :result-format="resultFormat"
+            ></v-selectpage>
+          </el-form-item>
+          <!--project-->
+          <el-form-item :label='$t("project.project.projectName")' class="select-warp" prop="projectId">
+            <el-select id="add-endpoint-project" v-model="editSoftwareAsset.projectId" class="right-box__select" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="id">
+              <el-option v-for="item in projectList" :id="'project-'+item.id" :key="item.id" :label="item.name" :value="item.id"></el-option>
+            </el-select>
+          </el-form-item>
+          <!--remark-->
+          <el-form-item :label="$t('overall.remark')" prop="remark">
+            <el-input maxlength="256" show-word-limit v-model="editSoftwareAsset.remark" size="small" :rows="2" type="textarea"></el-input>
+          </el-form-item>
+          <!--params-->
+          <div class="form__sub-title" >
+            <span>{{$t('softwareAsset.params')}}</span>
+          </div>
+        </el-form>
+      </div>
+    </div>
+    <div class="right-box__footer">
+      <button id="asset-edit-cancel" v-cancel="{obj: editSoftwareAsset, func: esc}" class="footer__btn footer__btn--light">
+        <span>{{$t('overall.cancel')}}</span>
+      </button>
+      <button id="asset-edit-save" :class="{'footer__btn--disabled': prevent_opt.save}" :disabled="prevent_opt.save" class="footer__btn" @click="save">
+        <span>{{$t('overall.save')}}</span>
+      </button>
+    </div>
+  </div>
+</template>
+
+<script>
+// import { host, port } from '@/components/common/js/validate'
+import editRigthBox from '../../mixin/editRigthBox'
+import { sysObjectIdInput } from '@/components/common/js/validate'
+import iconList from '@/components/common/js/iconList'
+import { asset as assetConstants } from '@/components/common/js/constants'
+
+export default {
+  name: 'softwareAssetBox',
+  components: {
+  },
+  props: {
+    obj: {
+      type: Object
+    }
+  },
+  computed: {
+    isCurrentUser () {
+      return function (username) {
+        return localStorage.getItem('nz-username') == username
+      }
+    },
+    language () { return this.$store.getters.getLanguage }
+  },
+  mixins: [editRigthBox],
+  data () {
+    const vm = this
+    return {
+      assetConstants,
+      editSoftwareAsset: {
+        id: '',
+        name: '',
+        typeId: '',
+        assetId: '',
+        projectId: '',
+        params: {},
+        remark: ''
+      },
+      DashboardSearchShowparamObj: [ // DashboardSearch 下拉搜索表头
+        { title: 'ID', data: 'id' },
+        { title: this.$t('overall.name'), data: 'name', key: 'name' },
+        { title: this.$t('overall.remark'), data: 'remark', key: 'remark' }
+      ],
+      url: '/asset/software',
+      roles: [],
+      rules: {
+        name: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        typeId: [
+          { required: true, message: this.$t('validate.required'), trigger: 'change' }
+        ]
+      },
+      projectList: [],
+      softwareTypeArr: [],
+      assetList: [],
+      columns: [
+        { title: 'ID', data: 'id' },
+        {
+          title: this.$t('overall.name'),
+          data: function (row) {
+            if (row.name.length > 15) {
+              return row.name.substring(0, 12) + '...'
+            }
+            return row.name
+          }
+        },
+        { title: this.$t('asset.manageIp'), data: 'manageIp' },
+        {
+          title: this.$t('overall.type'),
+          data: (row) => {
+            return row.type ? row.type.name : ''
+          }
+        },
+        {
+          title: this.$t('asset.model'),
+          data: (row) => {
+            return row.model ? row.model.name : ''
+          }
+        },
+        {
+          title: this.$t('overall.dc'),
+          data: (row) => {
+            return row.dc ? row.dc.name : ''
+          }
+        }
+      ],
+    }
+  },
+  watch: {
+    obj: {
+      deep: true,
+      immediate: true,
+      handler (n) {
+        this.isEdit = true
+        const editSoftwareAsset = JSON.parse(JSON.stringify(n))
+        this.editSoftwareAsset = editSoftwareAsset
+      }
+    },
+  },
+  created () {
+    this.getProjectList()
+    this.getAsset()
+  },
+  mounted () {
+  },
+  methods: {
+    clickOutside () {
+      this.esc(false)
+    },
+    iconActive (subItem) {
+      console.log(subItem, this.editSoftwareAsset.icon)
+      if (this.editSoftwareAsset.icon === subItem.value) {
+        this.editSoftwareAsset.icon = undefined
+        this.$set(this.editSoftwareAsset, 'icon', '')
+      } else {
+        this.editSoftwareAsset.icon = subItem.value
+        this.$set(this.editSoftwareAsset, 'icon', subItem.value)
+      }
+    },
+    /* 关闭弹框 */
+    esc (refresh) {
+      this.prevent_opt.save = false
+      this.$emit('close', refresh)
+    },
+    save () {
+      this.$refs.modelForm.validate((valid) => {
+        if (valid) {
+          const params = {
+            ...this.editSoftwareAsset
+          }
+          params.icon = this.imageUrl
+          params.params = {}
+          params.paramObj.forEach(item => {
+            params.params[item.name] = item
+          })
+          if (this.editSoftwareAsset.id) {
+            this.$put(this.url, params).then(res => {
+              this.prevent_opt.save = false
+              if (res.code === 200) {
+                this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
+                this.esc(true)
+              } else {
+                this.$message.error(res.msg)
+              }
+            })
+          } else {
+            this.$post(this.url, params).then(res => {
+              this.prevent_opt.save = false
+              if (res.code === 200) {
+                this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
+                this.esc(true)
+              } else {
+                this.$message.error(res.msg)
+              }
+            })
+          }
+        } else {
+          this.prevent_opt.save = false
+          return false
+        }
+      })
+    },
+    /* 获取project列表 */
+    getProjectList () {
+      this.$get('monitor/project', { pageSize: -1, pageNo: 1 }).then(response => {
+        if (response.code === 200) {
+          this.projectList = response.data.list
+        }
+      })
+    },
+    getAsset () {
+      this.$get('asset/asset', { pageSize: -1 }).then(res => {
+        this.assetList = res.data.list
+      })
+    },
+    resultFormat (resp) {
+      if (resp && resp.data) {
+        const assetData = {}
+        assetData.list = resp.data.list
+        assetData.totalRow = resp.data.total
+        return assetData
+      }
+    }
+  }
+}
+</script>

nezha-fronted/src/components/common/rightBox/software/softwareTypeBox.vue

@@ -18,26 +18,33 @@
             <el-input maxlength="128" show-word-limit v-model="editSoftwareType.category" size="small" type="text"></el-input>
           </el-form-item>
           <!--icon-->
-          <el-form-item :label="$t('config.menus.icon')" prop="icon">
+<!--          <el-form-item :label="$t('config.menus.icon')" prop="icon">-->
-            <el-upload
+<!--            <el-upload-->
-              class="avatar-uploader"
+<!--              class="avatar-uploader"-->
-              action="#"
+<!--              action="#"-->
-              :show-file-list="false"
+<!--              :show-file-list="false"-->
-              :on-change="beforeAvatarUpload"
+<!--              :on-change="beforeAvatarUpload"-->
-              :auto-upload="false"
+<!--              :auto-upload="false"-->
-              accept=".jpg,.png"
+<!--              accept=".jpg,.png"-->
-              :limit="1"
+<!--              :limit="1"-->
-              :on-remove="handleRemove"
+<!--              :on-remove="handleRemove"-->
-              ref="avatarUploader"
+<!--              ref="avatarUploader"-->
-              :fileList="fileList"
+<!--              :fileList="fileList"-->
-            >
+<!--            >-->
-              <img v-if="imageUrl" :src="imageUrl" class="avatar">
+<!--              <img v-if="imageUrl" :src="imageUrl" class="avatar">-->
-              <i v-else class="nz-icon nz-icon-create-square avatar-uploader-icon"></i>
+<!--              <i v-else class="nz-icon nz-icon-create-square avatar-uploader-icon"></i>-->
-              <i class="nz-icon nz-icon-circle-close" v-if="imageUrl" @click.stop="removeIcon" :title="$t('overall.delete')"/>
+<!--              <i class="nz-icon nz-icon-circle-close" v-if="imageUrl" @click.stop="removeIcon" :title="$t('overall.delete')"/>-->
-            </el-upload>
+<!--            </el-upload>-->
+<!--          </el-form-item>-->
+          <!--remark-->
+          <el-form-item :label="$t('overall.remark')" prop="remark">
+            <el-input maxlength="256" show-word-limit v-model="editSoftwareType.remark" size="small" :rows="2" type="textarea"></el-input>
           </el-form-item>
           <!--params-->
-          <el-form-item :label="$t('config.assetLabel.params')" prop="paramObj">
+          <div class="form__sub-title" >
+            <span>{{$t('softwareType.params')}}</span>
+          </div>
+          <el-form-item prop="paramObj">
             <div v-for="(label, i) in editSoftwareType.paramObj" :key="i" class="form__dotted-item form__dotted-item-required">
               <el-form-item :prop="'paramObj.' + i + '.value.0'" :rules="[ { required: JSON.parse(label.param).required === '1', message: $t('validate.required'), trigger: 'blur' }]">
                 <template v-slot:label>
@@ -144,10 +151,6 @@
               ></el-cascader>
             </div>
           </el-form-item>
-          <!--remark-->
-          <el-form-item :label="$t('overall.remark')" prop="remark">
-            <el-input maxlength="256" show-word-limit v-model="editSoftwareType.remark" size="small" :rows="2" type="textarea"></el-input>
-          </el-form-item>
         </el-form>
       </div>
     </div>
@@ -225,14 +228,8 @@ export default {
         name: [
           { required: true, message: this.$t('validate.required'), trigger: 'blur' }
         ],
-        brandId: [
+        category: [
           { required: true, message: this.$t('validate.required'), trigger: 'change' }
-        ],
-        typeId: [
-          { required: true, message: this.$t('validate.required'), trigger: 'change' }
-        ],
-        sysObjectId: [
-          { validator: sysObjectIdInput, trigger: 'blur' }
         ]
       },
       labelCascProp: {

nezha-fronted/src/components/common/table/settings/softwareAssetTable.vue

@@ -0,0 +1,203 @@
+<template>
+  <div style="height: 100%">
+    <el-table
+      id="softwareTypeTable"
+      ref="dataTable"
+      :data="tableData"
+      :height="height"
+      border
+      :default-sort="orderBy"
+      @header-dragend="dragend"
+      @sort-change="tableDataSort"
+      @selection-change="selectionChange"
+      @row-dblclick="(row)=>{}"
+    >
+      <el-table-column
+        :resizable="false"
+        align="center"
+        type="selection"
+        width="55">
+      </el-table-column>
+      <el-table-column
+        v-for="(item, index) in customTableTitle"
+        v-if="item.show"
+        :key="`col-${index}-${item.prop}`"
+        :fixed="item.fixed"
+        :label="item.label"
+        :min-width="`${item.minWidth}`"
+        :prop="item.prop"
+        :resizable="true"
+        :sort-orders="['ascending', 'descending']"
+        :sortable="item.sortable"
+        :width="`${item.width}`"
+      >
+        <template slot="header">
+          <span class="data-column__span">{{item.label}}</span>
+          <div class="col-resize-area"></div>
+        </template>
+        <template slot-scope="scope" :column="item">
+          <template v-if="item.prop === 'name'">
+            <copy :copyData='scope.row[item.prop]' :showInfo='scope.row[item.prop]'>
+              <template slot="copy-text">
+                {{scope.row[item.prop]?scope.row[item.prop]:'-'}}
+              </template>
+            </copy>
+          </template>
+          <template v-else-if="item.prop === 'asset'">
+            <div class="document-copy-block">
+              <span
+                class="document-copy-text"
+                :title="scope.row.asset&&scope.row.asset.name"
+                @mouseenter="labelHover(scope.row, item.prop, true,true, $event)"
+                @mouseleave="labelHover(scope.row, item.prop, false,true)">
+                <i class="nz-icon nz-icon-overview-project monitorColor color23BF9A"></i>
+                {{scope.row.asset&&scope.row.asset.name}}
+              </span>
+              <i v-if="scope.row.asset&&scope.row.asset.name" class="nz-icon nz-icon-override" style="visibility: hidden" @click="onCopy(scope.row.asset.name)" :title="$t('overall.copyText')"></i>
+            </div>
+          </template>
+          <template v-else-if="item.prop === 'project'">
+            <div class="document-copy-block">
+              <span class="document-copy-text"
+                    :title="scope.row[item.prop].name"
+                    @mouseenter="labelHover(scope.row, item.prop, true,true, $event)"
+                    @mouseleave="labelHover(scope.row, item.prop, false,true)">
+              {{scope.row[item.prop].name}}
+              </span>
+              <i v-if="scope.row[item.prop].name" class="nz-icon nz-icon-override" style="visibility: hidden" @click="onCopy(scope.row[item.prop].name)" :title="$t('overall.copyText')"></i>
+            </div>
+          </template>
+          <span v-else-if="scope.row[item.prop]" :class="item.prop === 'remark'? 'el-table-remark':''">{{scope.row[item.prop]}}</span>
+          <span v-else>-</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        :resizable="false"
+        :width="operationWidth"
+        fixed="right">
+        <div slot="header" class="table-operation-title">{{$t('overall.option')}}</div>
+        <div slot-scope="scope" class="table-operation-items">
+          <!-- <button class="table-operation-item" v-has="'softwareAsset_edit'" @click="$emit('edit', scope.row)" :title="$t('overall.edit')"><i class="nz-icon nz-icon-edit"></i></button> -->
+          <button class="table-operation-item" @click="showBottomBox('asset', scope.row)" :title="$t('overall.view')"><i class="nz-icon nz-icon-view1"></i></button>
+          <el-dropdown size="medium" v-has="['softwareAsset_delete','main_edit','softwareAsset_edit']" trigger="click" @command="tableOperation">
+            <div class="table-operation-item table-operation-item--more" :title="$t('overall.moreOperations')">
+              <i class="nz-icon nz-icon-more3"></i>
+            </div>
+            <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
+              <el-dropdown-item v-has="'softwareAsset_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
+              <el-dropdown-item v-has="'softwareAsset_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
+              <el-dropdown-item v-has="'softwareAsset_delete'" :command="['delete-rel', scope.row, {forceDeleteShow:true, single:true,from:'model'}]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+              <el-dropdown-item v-has="'main_edit'" :command="['sync', scope.row]"><i class="nz-icon nz-icon-sync"></i><span class="operation-dropdown-text">{{$t('overall.syncChart')}}</span></el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+        </div>
+      </el-table-column>
+      <template slot="empty">
+        <div v-if="!loading" class="table-no-data">
+          <svg class="icon" aria-hidden="true">
+            <use xlink:href="#nz-icon-no-data-list"></use>
+          </svg>
+          <div class="table-no-data__title">No results found</div>
+        </div>
+        <div v-else>&nbsp;</div>
+      </template>
+    </el-table>
+    <alertLabel
+      v-if="alertLabelShow"
+      :id="alertLabelId"
+      :that="alertLabelObj"
+      :type="alertLabelType"
+    ></alertLabel>
+  </div>
+</template>
+
+<script>
+import table from '@/components/common/mixin/table'
+import copy from '@/components/common/copy'
+import alertLabelMixin from '@/components/common/mixin/alertLabelMixin'
+export default {
+  name: 'softwareTypeTable',
+  mixins: [table, alertLabelMixin],
+  components: { copy },
+  props: {
+    loading: Boolean
+  },
+  data () {
+    return {
+      tableTitle: [ // 原始table列
+        {
+          label: 'ID',
+          prop: 'id',
+          show: true,
+          width: 120,
+          sortable: 'custom'
+        }, {
+          label: this.$t('config.model.name'),
+          prop: 'name',
+          show: true,
+          width: 350,
+          sortable: 'custom'
+        }, {
+          label: this.$t('softwareType.category'),
+          prop: 'category',
+          show: true,
+          minWidth: 200,
+          sortable: 'custom'
+        },
+        // {
+        //   label: this.$t('config.menus.icon'),
+        //   prop: 'icon',
+        //   show: true,
+        //   width: 120,
+        //   sortable: 'custom'
+        // },
+        {
+          label: this.$t('project.project.projectName'),
+          prop: 'project',
+          minWidth: 200,
+          show: true
+        }, {
+          label: this.$t('asset.asset'),
+          prop: 'asset',
+          minWidth: 200,
+          show: true
+        },
+        {
+          label: this.$t('overall.type'),
+          prop: 'type',
+          minWidth: 200,
+          show: true
+        },
+        {
+          label: this.$t('overall.remark'),
+          prop: 'remark',
+          minWidth: 200,
+          show: true
+        }
+      ]
+    }
+  },
+  methods: {
+    copyValue (item) {
+      const str = item
+      // const domUrl = document.createElement('input')
+      // domUrl.value = JSON.stringify(str)
+      // domUrl.id = 'creatDom'
+      // document.body.appendChild(domUrl)
+      // domUrl.select() // 选择对象
+      // document.execCommand('Copy') // 执行浏览器复制命令
+      // const creatDom = document.getElementById('creatDom')
+      // creatDom.parentNode.removeChild(creatDom)
+      // this.$message.success(this.$t('overall.copySuccess'))
+      this.$copyText(JSON.stringify(str)).then(() => {
+        this.$message.success({ message: this.$t('overall.copySuccess') })
+      })
+    }
+  },
+  created () {
+  },
+  computed: {
+
+  }
+}
+</script>

nezha-fronted/src/components/common/table/settings/softwareTypeTable.vue

@@ -139,32 +139,35 @@ export default {
           label: 'ID',
           prop: 'id',
           show: true,
-          width: 80,
+          width: 120,
           sortable: 'custom'
         }, {
           label: this.$t('config.model.name'),
           prop: 'name',
           show: true,
-          minWidth: 350,
+          width: 350,
           sortable: 'custom'
         }, {
           label: this.$t('softwareType.category'),
           prop: 'category',
           show: true,
-          width: 200,
-          sortable: 'custom'
-        }, {
-          label: this.$t('config.menus.icon'),
-          prop: 'icon',
-          show: true,
-          width: 120,
-          sortable: 'custom'
-        }, {
-          label: this.$t('config.assetLabel.params'),
-          prop: 'params',
           minWidth: 200,
-          show: true
+          sortable: 'custom'
-        }, {
+        },
+        // {
+        //   label: this.$t('config.menus.icon'),
+        //   prop: 'icon',
+        //   show: true,
+        //   width: 120,
+        //   sortable: 'custom'
+        // },
+        // {
+        //   label: this.$t('config.assetLabel.params'),
+        //   prop: 'params',
+        //   minWidth: 200,
+        //   show: true
+        // },
+        {
           label: this.$t('issue.createTime'),
           prop: 'cts',
           minWidth: 200,

nezha-fronted/src/components/page/asset/software/softwareAsset.vue

@@ -0,0 +1,137 @@
+<template>
+  <div>
+    <nz-data-list
+      ref="dataList"
+      :api="url"
+      :custom-table-title.sync="tools.customTableTitle"
+      :from="fromRoute.model"
+      :layout="['searchInput', 'elementSet', 'pagination']"
+      :search-msg="searchMsg"
+      @search="search"
+    >
+      <template v-slot:top-tool-right>
+        <button id="account-add" v-has="'softwareAsset_add'" :title="$t('overall.createSoftwareAsset')" class="top-tool-btn margin-r-10" type="button" @click="add">
+          <i class="nz-icon-create-square nz-icon"></i>
+        </button>
+       <top-tool-more-options
+          :delete-objs="batchDeleteObjs"
+          ref="export"
+          id="model"
+          :params="searchLabel"
+          :permissions="{
+            import: 'softwareAsset_add',
+            export: 'softwareAsset_edit'
+          }"
+          class="top-tool-export margin-r-10"
+          export-file-name="asset-model"
+          @afterImport="getTableData"
+          v-has="['softwareAsset_add','softwareAsset_edit','softwareAsset_delete']"
+        >
+          <template v-slot:before>
+            <div>
+              <el-dropdown-item :disabled="batchDeleteObjs.length==0" :class="'nz-el-dropdown-menu-item'">
+                <delete-button
+                  ref="deleteButton"
+                  :single="false"
+                  :from="'softwareAsset'"
+                  :forceDeleteShow="true"
+                  :type="'link'"
+                  :title="$t('overall.batchDel')"
+                  id="account-list-batch-delete"
+                  v-has="'softwareAsset_delete'"
+                  :api="url"
+                  :delete-objs="batchDeleteObjs"
+                  @after="getTableData"
+                  @before="delFlag=true"
+                ></delete-button>
+              </el-dropdown-item>
+            </div>
+          </template>
+        </top-tool-more-options>
+      </template>
+      <template v-slot="slotProps">
+        <softwareAssetTable
+          ref="dataTable"
+          :orderByFa="orderBy"
+          v-my-loading="tools.loading"
+          :loading="tools.loading"
+          :api="url"
+          :custom-table-title="tools.customTableTitle"
+          :height="mainTableHeight"
+          :table-data="tableData"
+          @del="del"
+          @edit="edit"
+          @copy="copy"
+          @orderBy="tableDataSort"
+          @reload="getTableData"
+          @selectionChange="selectionChange"
+          @showBottomBox="(targetTab, object) => { $refs.dataList.showBottomBox(targetTab, object) }"></softwareAssetTable>
+      </template>
+      <template v-slot:pagination>
+        <Pagination ref="Pagination" :page-obj="pageObj" :table-id="tableId" @pageNo='pageNo' @pageSize='pageSize'></Pagination>
+      </template>
+    </nz-data-list>
+    <transition name="right-box">
+      <softwareAssetBox v-if="rightBox.show" :obj="object" @close="closeRightBox"></softwareAssetBox>
+    </transition>
+  </div>
+</template>
+<script>
+import deleteButton from '@/components/common/deleteButton'
+import softwareAssetBox from '@/components/common/rightBox/software/softwareAssetBox'
+import nzDataList from '@/components/common/table/nzDataList'
+import dataListMixin from '@/components/common/mixin/dataList'
+import softwareAssetTable from '@/components/common/table/settings/softwareAssetTable'
+import topToolMoreOptions from '@/components/common/popBox/topToolMoreOptions'
+
+export default {
+  name: 'softwareAsset',
+  components: {
+    nzDataList,
+    softwareAssetBox,
+    deleteButton,
+    softwareAssetTable,
+    topToolMoreOptions
+  },
+  mixins: [dataListMixin],
+  data () {
+    return {
+      url: '/asset/software',
+      blankObject: { // 空白对象
+        id: '',
+        name: '',
+        typeId: '',
+        assetId: '',
+        projectId: '',
+        params: {},
+        remark: ''
+      },
+      tableId: 'softwareAssetTable',
+      searchMsg: { // 给搜索框子组件传递的信息
+        searchLabelList: [{
+          name: 'ID',
+          type: 'input',
+          label: 'ids',
+          disabled: false
+        }, {
+          name: this.$t('overall.name'),
+          type: 'input',
+          label: 'name',
+          disabled: false
+        }]
+      }
+    }
+  },
+  created () {
+
+  },
+  computed: {
+  },
+  mounted () {
+  },
+  methods: {
+  },
+  beforeDestroy () {
+  }
+}
+</script>

nezha-fronted/src/components/page/asset/software/softwareType.vue

@@ -10,7 +10,7 @@
       @search="search"
     >
       <template v-slot:top-tool-right>
-        <button id="account-add" v-has="'model_add'" :title="$t('overall.createSoftwareType')" class="top-tool-btn margin-r-10" type="button" @click="add">
+        <button id="account-add" v-has="'software_type_add'" :title="$t('overall.createSoftwareType')" class="top-tool-btn margin-r-10" type="button" @click="add">
           <i class="nz-icon-create-square nz-icon"></i>
         </button>
        <top-tool-more-options
@@ -19,13 +19,13 @@
           id="model"
           :params="searchLabel"
           :permissions="{
-            import: 'model_add',
+            import: 'software_type_add',
-            export: 'model_edit'
+            export: 'software_type_edit'
           }"
           class="top-tool-export margin-r-10"
           export-file-name="asset-model"
           @afterImport="getTableData"
-          v-has="['model_add','model_edit','model_delete']"
+          v-has="['software_type_add','software_type_edit','software_type_delete']"
         >
           <template v-slot:before>
             <div>
@@ -33,12 +33,12 @@
                 <delete-button
                   ref="deleteButton"
                   :single="false"
-                  :from="'model'"
+                  :from="'software_type'"
                   :forceDeleteShow="true"
                   :type="'link'"
                   :title="$t('overall.batchDel')"
                   id="account-list-batch-delete"
-                  v-has="'model_delete'"
+                  v-has="'software_type_delete'"
                   :api="url"
                   :delete-objs="batchDeleteObjs"
                   @after="getTableData"
@@ -118,6 +118,11 @@ export default {
           type: 'input',
           label: 'name',
           disabled: false
+        }, {
+          name: this.$t('softwareType.category'),
+          type: 'input',
+          label: 'category',
+          disabled: false
         }]
       }
     }

nezha-fronted/src/permission.js

@@ -8,7 +8,7 @@ import VueResource from 'vue-resource'
 import bus from '@/libs/bus'
 Vue.use(VueResource)
 
-const loginWhiteList = ['/setup', '/sys/license/upload', '/sys/license/state', '/sys/appearance', '/i18n', '/terminal', '/softwareType'] // 免登陆白名单
+const loginWhiteList = ['/setup', '/sys/license/upload', '/sys/license/state', '/sys/appearance', '/i18n', '/terminal'] // 免登陆白名单
 export const permissionWhiteList = ['/profile', '/menu', ...loginWhiteList] // 权限白名单
 router.beforeEach((to, from, next) => {
   if (window.entrance) {

nezha-fronted/src/router/index.js

@@ -235,6 +235,10 @@ export default new Router({
         {
           path: '/softwareType',
           component: resolve => require(['@/components/page/asset/software/softwareType'], resolve)
+        },
+        {
+          path: '/softwareAsset',
+          component: resolve => require(['@/components/page/asset/software/softwareAsset'], resolve)
         }
       ]
     },