素材库

packages/wxwork/Announce/AppAnnounce/components/Add.vue

@@ -184,29 +184,29 @@
             <div class="ai-form">
               <el-form-item label="标题" style="width: 100%;" prop="linkTitle" :rules="[{ required: true, message: '请输入标题', trigger: 'blur' }]">
                 <el-input
-                    size="small"
-                    placeholder="请输入标题"
-                    maxlength="42"
-                    show-word-limit
-                    v-model="linkForm.linkTitle">
+                  size="small"
+                  placeholder="请输入标题"
+                  maxlength="42"
+                  show-word-limit
+                  v-model="linkForm.linkTitle">
                 </el-input>
               </el-form-item>
               <el-form-item label="链接" style="width: 100%;" prop="linkUrl" :rules="[{ required: true, message: '请输入链接', trigger: 'blur' }]">
                 <el-input
-                    size="small"
-                    placeholder="请输入链接"
-                    maxlength="682"
-                    show-word-limit
-                    v-model="linkForm.linkUrl">
+                  size="small"
+                  placeholder="请输入链接"
+                  maxlength="682"
+                  show-word-limit
+                  v-model="linkForm.linkUrl">
                 </el-input>
               </el-form-item>
               <el-form-item label="描述" style="width: 100%;" prop="linkDesc">
                 <el-input
-                    size="small"
-                    placeholder="请输入描述"
-                    maxlength="170"
-                    show-word-limit
-                    v-model="linkForm.linkDesc">
+                  size="small"
+                  placeholder="请输入描述"
+                  maxlength="170"
+                  show-word-limit
+                  v-model="linkForm.linkDesc">
                 </el-input>
               </el-form-item>
               <el-form-item label="封面图" prop="linkPicUrl" style="width: 100%;">
@@ -216,34 +216,34 @@
           </el-form>
         </ai-dialog>
         <ai-dialog
-            :visible.sync="isShowAddMiniapp"
-            width="920px"
-            title="小程序消息"
-            @close="onClose"
-            @onConfirm="onMiniAppForm">
+          :visible.sync="isShowAddMiniapp"
+          width="920px"
+          title="小程序消息"
+          @close="onClose"
+          @onConfirm="onMiniAppForm">
           <el-form ref="miniAppForm" :model="miniAppForm" label-width="130px" label-position="right">
             <div class="ai-form">
               <el-form-item label="小程序appid" style="width: 100%;" prop="mpAppid" :rules="[{ required: true, message: '小程序appid', trigger: 'blur' }]">
                 <el-input
-                    size="small"
-                    placeholder="小程序appid"
-                    v-model="miniAppForm.mpAppid">
+                  size="small"
+                  placeholder="小程序appid"
+                  v-model="miniAppForm.mpAppid">
                 </el-input>
               </el-form-item>
               <el-form-item label="小程序page路径" style="width: 100%;" prop="mpPage" :rules="[{ required: true, message: '请输入小程序page路径', trigger: 'blur' }]">
                 <el-input
-                    size="small"
-                    placeholder="请输入小程序page路径"
-                    v-model="miniAppForm.mpPage">
+                  size="small"
+                  placeholder="请输入小程序page路径"
+                  v-model="miniAppForm.mpPage">
                 </el-input>
               </el-form-item>
               <el-form-item label="标题" style="width: 100%;" prop="mpTitle" :rules="[{ required: true, message: '请输入标题', trigger: 'blur' }]">
                 <el-input
-                    size="small"
-                    placeholder="请输入标题"
-                    maxlength="20"
-                    show-word-limit
-                    v-model="miniAppForm.mpTitle">
+                  size="small"
+                  placeholder="请输入标题"
+                  maxlength="20"
+                  show-word-limit
+                  v-model="miniAppForm.mpTitle">
                 </el-input>
               </el-form-item>
               <el-form-item label="封面图" prop="media" style="width: 100%;" :rules="[{ required: true, message: '请上传封面图', trigger: 'change' }]">

packages/wxwork/AppMaterialLibrary/AppMaterialLibrary.vue

@@ -1,14 +1,13 @@
 <template>
   <div class="doc-circulation ailist-wrapper">
     <keep-alive :include="['List']">
-      <component ref="component" :is="component" @change="onChange" :params="params" :instance="instance" :dict="dict"></component>
+      <component ref="component" :is="component" :instance="instance" :dict="dict"></component>
     </keep-alive>
   </div>
 </template>
 
 <script>
   import List from './components/List'
-  import Add from './components/Add'
 
   export default {
     name: 'AppMaterialLibrary',
@@ -28,7 +27,6 @@
     },
 
     components: {
-      Add,
       List
     },
 
@@ -36,23 +34,6 @@
     },
 
     methods: {
-      onChange (data) {
-        if (data.type === 'Add') {
-          this.component = 'Add'
-          this.params = data.params
-        }
-
-        if (data.type === 'list') {
-          this.component = 'List'
-          this.params = data.params
-
-          this.$nextTick(() => {
-            if (data.isRefresh) {
-              this.$refs.component.getList()
-            }
-          })
-        }
-      }
     }
   }
 </script>

packages/wxwork/AppMaterialLibrary/components/Add.vue

@@ -1,119 +0,0 @@
-<template>
-  <ai-detail>
-    <template slot="title">
-      <ai-title title="添加二维码" isShowBack isShowBottomBorder @onBackClick="cancel(false)">
-      </ai-title>
-    </template>
-    <template slot="content">
-      <ai-card title="基本信息">
-        <template #content>
-          <el-form class="ai-form" ref="form" :model="form" label-width="110px" label-position="right">
-            <el-form-item label="地区" style="width: 100%;" prop="codeName">
-              <span style="color: #666;">{{ form.areaName }}</span>
-            </el-form-item>
-            <el-form-item label="二维码名称" prop="codeName" :rules="[{ required: true, message: '请输入二维码名称', trigger: 'blur' }]">
-              <el-input size="small" maxlength="30" show-word-limit placeholder="请输入二维码名称" style="width: 328px;" v-model="form.codeName"></el-input>
-            </el-form-item>
-            <el-form-item style="width: 100%;" label="二维码类型" prop="type" :rules="[{ required: true, message: '请选择二维码类型', trigger: 'change' }]">
-              <el-radio-group v-model="form.type">
-                <el-radio label="0">群二维码</el-radio>
-                <el-radio label="1">个人二维码</el-radio>
-              </el-radio-group>
-            </el-form-item>
-            <el-form-item label="上传二维码" prop="codeUrl" style="width: 100%;" :rules="[{ required: true, message: '请上传二维码', trigger: 'change' }]">
-              <ai-uploader :instance="instance" v-model="form.codeUrl" :limit="1"></ai-uploader>
-            </el-form-item>
-          </el-form>
-        </template>
-      </ai-card>
-    </template>
-    <template #footer>
-      <el-button @click="cancel">取消</el-button>
-      <el-button type="primary" @click="confirm">提交</el-button>
-    </template>
-  </ai-detail>
-</template>
-
-<script>
-  export default {
-    name: 'Add',
-
-    props: {
-      instance: Function,
-      dict: Object,
-      params: Object
-    },
-
-    data () {
-      return {
-        info: {},
-        form: {
-          areaId: '',
-          codeName: '',
-          areaName: '',
-          code: '',
-          codeUrl: [],
-          type: '',
-        },
-        id: ''
-      }
-    },
-
-    created () {
-      if (this.params && this.params.areaId && !this.params.id) {
-        this.form.areaId = this.params.areaId
-        this.form.areaName = this.params.areaName
-      }
-
-      if (this.params && this.params.id) {
-        this.id = this.params.id
-        this.getInfo(this.params.id)
-      }
-    },
-
-    methods: {
-      getInfo (id) {
-        this.instance.post(`/app/appeveryvillagecode/queryDetailById?id=${id}`).then(res => {
-          if (res.code === 0) {
-            this.form = res.data
-            this.form.codeUrl = [{
-              url: res.data.codeUrl
-            }]
-          }
-        })
-      },
-
-      onClose () {
-        this.form.explain = ''
-      },
-
-      confirm () {
-        this.$refs.form.validate((valid) => {
-          if (valid) {
-            this.instance.post(`/app/appeveryvillagecode/addOrUpdate`, {
-              ...this.form,
-              codeUrl: this.form.codeUrl[0].url
-            }).then(res => {
-              if (res.code == 0) {
-                this.$message.success('提交成功')
-                setTimeout(() => {
-                  this.cancel(true)
-                }, 600)
-              }
-            })
-          }
-        })
-      },
-
-      cancel (isRefresh) {
-        this.$emit('change', {
-          type: 'list',
-          isRefresh: !!isRefresh
-        })
-      }
-    }
-  }
-</script>
-
-<style scoped lang="scss">
-</style>

packages/wxwork/AppMaterialLibrary/components/List.vue

@@ -1,31 +1,197 @@
 <template>
-  <ai-list class="villagecode">
+  <ai-list id="AppMaterialLibrary">
     <template slot="title">
-      <ai-title title="一村一码" isShowBottomBorder></ai-title>
+      <ai-title title="素材管理" isShowBottomBorder>
+        <template #sub>
+          <span>可在聊天素材、宣发工具中选择素材发送给居民，提升服务效率；其中文件、视频和网页素材支持记录居民查看行为</span>
+        </template>
+      </ai-title>
     </template>
     <template slot="content">
+      <div class="AppMaterialLibrary-title">
+        <span
+          v-for="(item, index) in typeList"
+          :key="index"
+          :class="[currIndex === index ? 'active' : '']" @click="currIndex = index">
+          {{ item }}
+        </span>
+      </div>
       <ai-search-bar class="search-bar">
         <template #left>
-          <el-button size="small" type="primary" :disabled="isShowAdd" icon="iconfont iconAdd" @click="toAdd('')">添加活码</el-button>
+          <el-button size="small" type="primary" icon="iconfont iconAdd" @click="isShow = true">添加{{ typeList[currIndex] }}</el-button>
+        </template>
+        <template slot="right">
+          <el-input
+            v-model="search.title"
+            size="small"
+            v-throttle="() => { search.current = 1, getList() }"
+            placeholder="请输入标题、话术内容、添加人"
+            clearable
+            @clear="search.current = 1, search.title = '', getList()"
+            suffix-icon="iconfont iconSearch">
+          </el-input>
         </template>
       </ai-search-bar>
       <ai-table
         :tableData="tableData"
         :col-configs="colConfigs"
         :total="total"
-        style="margin-top: 6px;"
+        v-loading="loading"
+        style="margin-top: 6px; width: 100%;"
         :current.sync="search.current"
         :size.sync="search.size"
         @getList="getList">
-        <el-table-column slot="options" width="120px" fixed="right" label="操作" align="center">
+        <el-table-column slot="user" width="140px" label="创建人" align="center">
+          <template slot-scope="{ row }">
+            <div class="userinfo">
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column slot="options" width="140px" fixed="right" label="操作" align="center">
           <template slot-scope="{ row }">
             <div class="table-options">
-              <el-button type="text" @click="toAdd(row.id)">编辑</el-button>
-              <el-button type="text" @click="remove(row.id)">删除</el-button>
+              <el-button type="text" @click="remindExamine(row.id)" v-if="['0'].includes(row.status)">催办</el-button>
+              <el-button type="text" @click="cancel(row.id)" v-if="['0'].includes(row.status)">撤回</el-button>
+              <el-button type="text" @click="toDetail(row.id)">详情</el-button>
+              <el-button type="text" @click="toAdd(row.id)" v-if="['1', '3'].includes(row.status)">编辑</el-button>
             </div>
           </template>
         </el-table-column>
       </ai-table>
+      <ai-dialog
+        :visible.sync="isShow"
+        width="920px"
+        title="小程序消息"
+        @close="onClose"
+        destroy-on-close
+        @onConfirm="confirm">
+        <el-form ref="form" v-if="isShow" :model="form" label-width="130px" label-position="right">
+          <div class="ai-form">
+            <el-form-item v-if="currIndex === 0" label="话术标题" style="width: 100%;" prop="title" :rules="[{ required: true, message: '请输入话术标题', trigger: 'blur' }]">
+              <el-input
+                size="small"
+                placeholder="请输入话术标题"
+                maxlength="42"
+                show-word-limit
+                v-model="form.title">
+              </el-input>
+            </el-form-item>
+            <el-form-item v-if="currIndex === 0" label="话术内容" style="width: 100%;" prop="content" :rules="[{ required: true, message: '请输入话术内容', trigger: 'blur' }]">
+              <el-input
+                size="small"
+                placeholder="请输入话术内容"
+                maxlength="682"
+                show-word-limit
+                v-model="form.content">
+              </el-input>
+            </el-form-item>
+            <el-form-item v-if="currIndex === 1" label="图片名称" style="width: 100%;" prop="title" :rules="[{ required: true, message: '请输入图片名称', trigger: 'blur' }]">
+              <el-input
+                size="small"
+                placeholder="请输入图片名称"
+                maxlength="42"
+                show-word-limit
+                v-model="form.title">
+              </el-input>
+            </el-form-item>
+            <el-form-item v-if="currIndex === 1" label="上传图片" style="width: 100%;" prop="fileUrl" :rules="[{ required: true, message: '请上传', trigger: 'change' }]">
+              <ai-uploader url="/app/wxcp/upload/uploadFile?type=image" :instance="instance" isWechat v-model="form.fileUrl" :limit="1"></ai-uploader>
+            </el-form-item>
+            <el-form-item v-if="currIndex === 3" label="文件名称" style="width: 100%;" prop="title" :rules="[{ required: true, message: '请输入图片名称', trigger: 'blur' }]">
+              <el-input
+                size="small"
+                placeholder="请输入图片名称"
+                maxlength="42"
+                show-word-limit
+                v-model="form.title">
+              </el-input>
+            </el-form-item>
+            <el-form-item v-if="currIndex === 3" label="上传文件" style="width: 100%;" prop="content" :rules="[{ required: true, message: '请上传', trigger: 'change' }]">
+              <ai-uploader url="/app/wxcp/upload/uploadFile?type=image" type="file" :instance="instance" isWechat v-model="form.fileUrl" :limit="1"></ai-uploader>
+            </el-form-item>
+            <el-form-item v-if="currIndex === 4" label="视频标题" style="width: 100%;" prop="title" :rules="[{ required: true, message: '请输入视频标题', trigger: 'blur' }]">
+              <el-input
+                size="small"
+                placeholder="请输入视频标题"
+                maxlength="42"
+                show-word-limit
+                v-model="form.title">
+              </el-input>
+            </el-form-item>
+            <el-form-item v-if="currIndex === 4" label="上传视频" style="width: 100%;" prop="fileUrl" :rules="[{ required: true, message: '请上传', trigger: 'change' }]">
+              <ai-uploader url="/app/wxcp/upload/uploadFile?type=image" type="file" :instance="instance" isWechat v-model="form.fileUrl" :limit="1"></ai-uploader>
+            </el-form-item>
+            <el-form-item v-if="currIndex === 4" label="视频封面图" prop="pictureUrl" style="width: 100%;" :rules="[{ required: true, message: '请上传视频封面图', trigger: 'change' }]">
+              <ai-uploader url="/app/wxcp/upload/uploadFile?type=image" :instance="instance" isWechat v-model="form.pictureUrl" :limit="1"></ai-uploader>
+            </el-form-item>
+            <el-form-item v-if="currIndex === 4" label="视频描述" style="width: 100%;" prop="content" :rules="[{ required: true, message: '请输入视频描述', trigger: 'blur' }]">
+              <el-input
+                size="small"
+                placeholder="请输入视频描述"
+                maxlength="682"
+                show-word-limit
+                v-model="form.content">
+              </el-input>
+            </el-form-item>
+            <el-form-item v-if="currIndex === 5" label="网页标题" style="width: 100%;" prop="title" :rules="[{ required: true, message: '请输入网页标题', trigger: 'blur' }]">
+              <el-input
+                size="small"
+                placeholder="请输入网页标题"
+                maxlength="42"
+                show-word-limit
+                v-model="form.title">
+              </el-input>
+            </el-form-item>
+            <el-form-item v-if="currIndex === 5" label="网页链接" style="width: 100%;" prop="linkUrl" :rules="[{ required: true, message: '请输入网页链接链接', trigger: 'blur' }]">
+              <el-input
+                size="small"
+                placeholder="请输入网页链接链接"
+                maxlength="682"
+                show-word-limit
+                v-model="form.linkUrl">
+              </el-input>
+            </el-form-item>
+            <el-form-item v-if="form.currIndex === 5" label="网页描述" style="width: 100%;" prop="content">
+              <el-input
+                size="small"
+                placeholder="请输入网页描述"
+                maxlength="170"
+                show-word-limit
+                v-model="form.content">
+              </el-input>
+            </el-form-item>
+            <el-form-item v-if="currIndex === 5" label="网页封面图" prop="media" style="width: 100%;" :rules="[{ required: true, message: '请上传封面图', trigger: 'change' }]">
+              <ai-uploader url="/app/wxcp/upload/uploadFile?type=image" :instance="instance" isWechat v-model="form.fileUrl" :limit="1"></ai-uploader>
+            </el-form-item>
+            <el-form-item v-if="currIndex === 2" label="小程序标题" style="width: 100%;" prop="title" :rules="[{ required: true, message: '请输入小程序标题', trigger: 'blur' }]">
+              <el-input
+                size="small"
+                placeholder="请输入小程序标题"
+                maxlength="20"
+                show-word-limit
+                v-model="form.title">
+              </el-input>
+            </el-form-item>
+            <el-form-item v-if="currIndex === 2" label="小程序appid" style="width: 100%;" prop="appid" :rules="[{ required: true, message: '小程序appid', trigger: 'blur' }]">
+              <el-input
+                size="small"
+                placeholder="小程序appid"
+                v-model="form.appid">
+              </el-input>
+            </el-form-item>
+            <el-form-item v-if="currIndex === 2" label="小程序路径" style="width: 100%;" prop="pagePath" :rules="[{ required: true, message: '请输入小程序路径', trigger: 'blur' }]">
+              <el-input
+                size="small"
+                placeholder="请输入小程序page路径"
+                v-model="form.pagePath">
+              </el-input>
+            </el-form-item>
+            <el-form-item v-if="currIndex === 2" label="小程序封面图" prop="media" style="width: 100%;" :rules="[{ required: true, message: '请上传封面图', trigger: 'change' }]">
+              <ai-uploader url="/app/wxcp/upload/uploadFile?type=image" :instance="instance" isWechat v-model="form.fileUrl" :limit="1"></ai-uploader>
+            </el-form-item>
+          </div>
+        </el-form>
+      </ai-dialog>
     </template>
   </ai-list>
 </template>
@@ -44,79 +210,136 @@
         search: {
           current: 1,
           size: 10,
-          status: 0,
           title: '',
-          areaId: ''
         },
-        defaultExpanded: [],
-        defaultChecked: [],
-        areaTree: [],
-        defaultProps: {
-          children: 'children',
-          label: 'name'
+        isShow: false,
+        form: {
+          appId: '',
+          content: '',
+          fileUrl: [],
+          pagePath: '',
+          pictureUrl: [],
+          title: ''
         },
-        currIndex: -1,
-        total: 10,
+        typeList: ['话术', '图片', '小程序', '文件', '视频', '网页'],
+        currIndex: 0,
+        tableData: [],
+        loading: false,
+        total: 0,
         colConfigs: [
-          {prop: 'codeName', label: '名称', align: 'left'},
-          {prop: 'type', label: '二维码类型', align: 'left', format: v => v === '0' ? '群二维码' : '个人二维码'},
-          {prop: 'createUserName', label: '创建人'},
-          {prop: 'createTime', label: '创建时间'},
-          {slot: 'options', label: '操作'}
-        ],
-        areaName: '',
-        unitName: '',
-        tableData: []
+          { prop: 'taskTitle', label: '任务名称' },
+          { prop: 'typeName', label: '群发类型', align: 'center' },
+          { slot: 'user', label: '创建人', openType: 'userName', align: 'center' },
+          { prop: 'choiceTime', label: '群发时间', align: 'center' },
+          { prop: 'completionRate', label: '任务完成率', align: 'center', format: v => v ? v === '0.0' ? '0%' : `${v}%` : '-' }
+        ]
       }
     },
 
-    mounted() {
-      this.search.areaId = this.user.info.areaId
-      this.areaName = this.user.info.areaName
-      this.getList()
-
-      this.$nextTick(() => {
+    created () {
+      this.dict.load('mstStatus').then(() => {
+        this.getList()
       })
     },
 
     methods: {
       getList() {
-        this.instance.post(`/app/appeveryvillagecode/list`, null, {
+        this.loading = true
+        this.instance.post(`/app/appmasssendingtask/list`, null, {
           params: {
-            ...this.search
+            ...this.search,
           }
         }).then(res => {
           if (res.code == 0) {
             this.tableData = res.data.records
             this.total = res.data.total
+
+            this.$nextTick(() => {
+              this.loading = false
+            })
+          } else {
+            this.loading = false
+          }
+        }).catch(() => {
+          this.loading = false
+        })
+      },
+
+      onClose () {
+        this.form.content = ''
+        this.form.appId = ''
+        this.form.fileUrl = []
+        this.form.pagePath = ''
+        this.form.pictureUrl = []
+        this.form.title = ''
+      },
+
+      confirm () {
+        this.$refs.form.validate((valid) => {
+          if (valid) {
+            this.instance.post(`/app/appmaterialinfo/addOrUpdate`, {
+              ...this.form
+            }).then(res => {
+              if (res.code == 0) {
+                this.$message.success('提交成功')
+                this.isShow = false
+              }
+            })
           }
         })
       },
 
-      remove(id) {
+      remove (id) {
         this.$confirm('确定删除该数据？').then(() => {
-          this.instance.post(`/app/appeveryvillagecode/delete?ids=${id}`).then(res => {
+          this.instance.post(`/app/appmaterialinfo/delete?ids=${id}`).then(res => {
             if (res.code == 0) {
               this.$message.success('删除成功！')
               this.getList()
             }
           })
         })
-      },
-
-      toAdd(id) {
-        this.$emit('change', {
-          type: 'Add',
-          params: {
-            areaName: this.areaName,
-            id: id || '',
-            areaId: this.search.areaId
-          }
-        })
       }
     }
   }
 </script>
 
 <style lang="scss" scoped>
+  #AppMaterialLibrary {
+    :deep( .ai-list__content--right-wrapper ) {
+      padding: 0 20px!important;
+    }
+
+    .AppMaterialLibrary-title {
+      display: flex;
+      align-items: center;
+      margin-bottom: 20px;
+      border-bottom: 1px solid #eee;
+
+      span {
+        height: 100%;
+        line-height: 56px;
+        margin-right: 32px;
+        color: #888888;
+        font-size: 16px;
+        font-weight: 600;
+        transition: all ease 0.3s;
+        border-bottom: 3px solid transparent;
+        cursor: pointer;
+        user-select: none;
+
+        &:hover {
+          color: #222;
+        }
+
+        &:last-child {
+          margin-right: 0;
+        }
+
+        &.active {
+          color: #222222;
+          border-bottom: 3px solid #2266FF;
+        }
+      }
+    }
+  }
 </style>

ui/packages/basic/AiUploader.vue

@@ -343,7 +343,7 @@ export default {
                 item.id = res.data.file.id
                 item.path = res.data.file.url
                 item.url = res.data.file.url,
-                    item.media = res.data.media
+                item.media = res.data.media
               }
             })
             this.emitChange(this.fileList)