定制项目提交一波

2022-07-04 14:16:07 +08:00
parent 3e87d2afca
commit 59d0a80043
4 changed files with 124 additions and 3 deletions
--- a/project/oms/apps/develop/AppDeployCustom/AiLibTable.vue
+++ b/project/oms/apps/develop/AppDeployCustom/AiLibTable.vue
@@ -0,0 +1,114 @@
+<template>
+  <section class="AiLibTable">
+    <ai-search-bar>
+      <template v-if="$scopedSlots.left" #left>
+        <slot name="left"/>
+      </template>
+      <template #right>
+        <slot v-if="$scopedSlots.right" name="right"/>
+        <el-input v-else placeholder="搜索应用名称" size="small" v-model="search[searchKey]" @change="page.current=1,getTableData()" clearable/>
+      </template>
+    </ai-search-bar>
+    <ai-table :tableData="tableData" :total="page.total" :current.sync="page.current" :colConfigs="columns"
+              :size.sync="page.size" border @getList="getTableData" tableSize="mini" height="430px">
+      <el-table-column slot="chb" width="100px">
+        <template slot-scope="{row}">
+          <el-checkbox v-model="row.checked" @change="handleCheck(row)"/>
+        </template>
+      </el-table-column>
+    </ai-table>
+  </section>
+</template>
+
+<script>
+export default {
+  name: "AiLibTable",
+  model: {
+    prop: "value",
+    event: "change"
+  },
+  props: {
+    value: {default: null},
+    instance: Function,
+    dict: Object,
+    permissions: Function,
+    action: {default: "/node/wechatapps/list"},
+    colConfigs: {
+      default: () => [
+        {prop: 'label', label: "应用名称"},
+        {prop: 'project', label: "项目/框架"},
+        {prop: 'name', label: "模块名"},
+      ]
+    },
+    nodeKey: {default: "id"},
+    searchKey: {default: "name"},
+    multiple: Boolean
+  },
+  data() {
+    return {
+      page: {total: 0, current: 1, size: 10},
+      search: {},
+      tableData: [],
+    }
+  },
+  computed: {
+    columns() {
+      return [
+        {slot: "chb"}, ...this.colConfigs
+      ]
+    },
+    selected() {
+      return [this.value].flat().filter(e => !!e) || []
+    }
+  },
+  watch: {
+    action(v) {
+      v && (this.page.current = 1, this.getTableData())
+    },
+  },
+  methods: {
+    getTableData() {
+      let {page, search, action, nodeKey} = this
+      this.instance?.post(action, null, {
+        params: {...page, ...search}
+      }).then(res => {
+        if (res?.data) {
+          const list = res.data.records || res.data || []
+          list.map(e => {
+            if (/\/project\//.test(e.libPath)) {
+              e.project = e.libPath.replace(/.*project\/([^\/]+)\/.+/, '$1')
+            } else if (/\/core\//.test(e.libPath)) {
+              e.project = "core"
+            } else e.project = "standard"
+          })
+          this.tableData = list.map(e => ({...e, checked: this.selected.includes(e[nodeKey])}))
+          this.page.total = res.data.total
+        }
+      })
+    },
+    handleCheck(row) {
+      const {nodeKey} = this
+      if (this.multiple) {
+        let selected = this.$copy(this.selected)
+        if (row.checked) {
+          selected.push(row[nodeKey])
+        } else {
+          selected = selected.filter(e => e != row[nodeKey])
+        }
+        this.$emit("change", selected)
+      } else {
+        this.$emit("change", row.checked ? row[nodeKey] : '')
+      }
+    }
+  },
+  created() {
+    this.$set(this.search, this.searchKey, "")
+    this.getTableData()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.AiLibTable {
+}
+</style>