初始化

packages/2.0.5/AppMediaManage/components/List.vue

@@ -0,0 +1,178 @@
+<template>
+  <section class="AppPetitionManage">
+    <ai-list>
+      <ai-title slot="title" title="媒资管理" isShowBottomBorder/>
+      <template #content>
+        <ai-search-bar bottomBorder>
+          <template slot="left">
+            <ai-select v-model="search.type" placeholder="媒资类型" clearable :selectList="$dict.getDict('dlbResourceType')"
+                       @change=";(page.current = 1), getList()"></ai-select>
+          </template>
+          <template slot="right">
+            <el-input v-model="search.name" size="small" placeholder="媒资名称" clearable
+                      @keyup.enter.native=";(page.current = 1), getList()"
+                      @clear=";(page.current = 1), (search.name = ''), getList()" suffix-icon="iconfont iconSearch"/>
+          </template>
+        </ai-search-bar>
+        <ai-search-bar class="ai-search-ba mar-t10">
+          <template slot="left">
+            <el-button icon="iconfont iconAdd" type="primary" size="small" @click="onAdd('')">添加</el-button>
+            <el-button icon="iconfont iconDelete" size="small" @click="removeAll" :disabled="ids.length == 0">删除
+            </el-button>
+          </template>
+        </ai-search-bar>
+        <ai-table :tableData="tableData" :col-configs="colConfigs" :total="total" ref="aitableex"
+                  :current.sync="page.current" :size.sync="page.size" @getList="getList"
+                  @selection-change="(v) => (ids = v.map((e) => e.id))">
+          <el-table-column slot="content" label="内容" width="200" show-overflow-tooltip>
+            <template slot-scope="{ row }">
+              <span type="text" v-if="row.type == 3">{{ row.content }}</span>
+              <ai-audio v-else-if="row.type == 1 && row.url" :src="row.url" skin="flat"/>
+            </template>
+          </el-table-column>
+          <el-table-column slot="options" label="操作" align="center" width="180" fixed="right">
+            <template slot-scope="{ row }">
+              <el-button type="text" @click="remove(row.id)">删除</el-button>
+            </template>
+          </el-table-column>
+        </ai-table>
+      </template>
+    </ai-list>
+  </section>
+</template>
+
+<script>
+import {mapState} from 'vuex'
+
+export default {
+  name: 'List',
+  props: {
+    dict: Object,
+    instance: Function,
+    params: Object,
+  },
+
+  data() {
+    return {
+      isAdd: false,
+      page: {
+        current: 1,
+        size: 10,
+      },
+      total: 0,
+      search: {
+        type: '',
+        name: '',
+      },
+      id: '',
+      ids: [],
+      colConfigs: [
+        {type: 'selection', width: 100, align: 'center'},
+        {
+          prop: 'name',
+          label: '媒资名称',
+        },
+        {
+          prop: 'type',
+          label: '媒资类型',
+          width: '100',
+          align: 'center',
+          render: (h, {row}) => {
+            return h('span', null, this.dict.getLabel('dlbResourceType', row.type))
+          },
+        },
+        {
+          slot: 'content',
+        },
+        {prop: 'createTime', label: '创建时间', align: 'center'},
+        {
+          prop: 'createUserName',
+          label: '创建人',
+          align: 'center',
+        },
+        // { prop: 'liveBuildingArea', label: '状态', align: 'center',width: 120 },
+        // { prop: 'liveBuildingArea', label: '发布次数', align: 'center',width: 120 },
+        {
+          slot: 'options',
+          label: '操作',
+          align: 'center',
+        },
+      ],
+      tableData: [],
+      areaId: '',
+    }
+  },
+
+  computed: {
+    ...mapState(['user']),
+    param() {
+      return {
+        ...this.search,
+        areaId: this.user.info?.areaId,
+        ids: this.ids,
+      }
+    },
+  },
+  created() {
+    this.dict.load('dlbResourceType').then(() => {
+      this.getList()
+    })
+  },
+
+  methods: {
+    getList() {
+      this.instance
+      .post(`/app/appdlbresource/list`, null, {
+        params: {
+          ...this.page,
+          ...this.search,
+        },
+      })
+      .then((res) => {
+        if (res.code == 0) {
+          this.tableData = res.data.records
+          this.total = res.data.total
+        }
+      })
+    },
+
+    // 添加
+    onAdd(id) {
+      this.$emit('change', {
+        type: 'add',
+        params: {
+          id: id || '',
+          areaId: this.areaId,
+        },
+      })
+    },
+
+    // 删除
+    remove(id) {
+      this.$confirm('确定删除该数据?').then(() => {
+        this.instance.post(`/app/appdlbresource/delete?id=${id}`).then((res) => {
+          if (res.code == 0) {
+            this.$message.success('删除成功！')
+            this.getList()
+          }
+        })
+      })
+    },
+
+    removeAll() {
+      var id = this.ids.join(',')
+      this.remove(id)
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.AppPetitionManage {
+  height: 100%;
+
+  .mar-t10 {
+    margin-top: 10px;
+  }
+}
+</style>