@lambo-design/workflow-approve 1.0.0-beta.9 → 1.0.0-beta.90

package/src/components/opinion.vue

@@ -1,302 +1,322 @@
-<template>
-  <div>
-    <div style="font-size: small; background-color: #f0f0f0">
-      &nbsp;
-      <a style="color: black" @click="customCommentListModal = true"><Icon type="ios-browsers-outline" /> 常用意见</a> &nbsp;
-      <Tooltip placement="bottom" v-if="attachmentFile" max-width="200">
-        <div style="font-size: smaller" slot="content">支持扩展名：.pdf .doc .docx .txt .xls .xlsx .jpg .jpeg .png .gif</div>
-        <UploadFile @upload-result="uploadFile" :upload-btn="false" :show-file-list="false" :multiple="true"
-                    :oss-server-context="smartFlowServerContext" :oss-file-put-url="ossFilePutUrl"></UploadFile>
-      </Tooltip>
-    </div>
-    <Input v-model="auditOpinion" type="textarea" :autosize="{ minRows: 3, maxRows: 5 }" show-word-limit
-           :maxlength="200" placeholder="处理意见" style="width: 100%"
-    ></Input>
-     <div>
-       <div v-for="(item, index) in attachmentdata" :key="index" style="font-size: 14px">
-         <span style="color:#2D8cF0 ">  {{ item.fileName }}</span>
-         <a @click="forRemoveAttachment(index)" style="font-size: 13px;"> &nbsp;.删除</a>
-       </div>
-     </div>
-    <Modal v-model="customCommentListModal" title="常用意见" width="800px" footer-hide>
-      <LamboPagingTable :requestSuccessCodes="requestSuccessCodes" ref="customCommentTable" :dataUrl="dataUrl"
-                        :columns="tableColumn">
-        <div slot="buttons">
-          <Button type="primary" ghost icon="md-add" @click="openDetailModal('create')">新增</Button>
-        </div>
-      </LamboPagingTable>
-    </Modal>
-    <Modal v-model="customCommentDetailModal" :title="customCommentDetailTitle" width="700px"
-           @on-cancel="customCommentDetailCancel"
-           @on-ok="customCommentDetailOk">
-      <Card v-model="customCommentDetailModal" width="600px" dis-hover>
-        <Form ref="customCommentForm" :model="customCommentDetailForm" :rules="customCommentRuleValidate"
-              :label-width="100" label-position="right">
-          <FormItem label="常用意见：" prop="commentContent">
-            <Input type="textarea" v-model="customCommentDetailForm.commentContent" show-word-limit :maxlength="1000"
-                   style="width: 500px"/>
-          </FormItem>
-          <FormItem label="排序码：">
-            <Input style="width: 100px" v-model="customCommentDetailForm.orders"/>
-          </FormItem>
-        </Form>
-      </Card>
-    </Modal>
-  </div>
-</template>
-
-<script>
-import ajax from "@lambo-design/shared/utils/ajax";
-import { operateHref } from '@lambo-design/shared/utils/assist';
-import LamboPagingTable from "@lambo-design/paging-table";
-import UploadFile from "@lambo-design/upload-file";
-
-// 引入docx-preview插件
-let docx = require('docx-preview');
-export default {
-  components: {
-    LamboPagingTable,
-    UploadFile
-  },
-  props: {
-    attachmentFile:{
-      type: Boolean,
-      default: false,
-    },
-    actionUrl: {
-      default: "/api/oss-server/file/put",
-    },
-    attachmentdata: {
-      type: Array,
-      default: function () {
-        return []
-      }
-    },
-    smartFlowServerContext: {
-      type: String,
-      default: '/api/smart-flow-server',
-    },
-  },
-  data() {
-    return {
-      requestSuccessCodes: [200, "200"],
-      tempFileArr: [],
-      fileList: [],
-      ossFilePutUrl: '/manage/oss/file/put',
-      auditOpinionText: '',
-      customCommentListModal: false,
-      auditOpinion: '',
-      customCommentDetailModal: false,
-      customCommentDetailTitle: '',
-      dataUrl: this.smartFlowServerContext + '/manage/smartflowCustomComment/list',
-      customCommentDetailForm: {
-        id: '',
-        commentContent: '',
-        orders: 10
-      },
-      customCommentRuleValidate: {
-        commentContent: [
-          {required: true, trigger: "blur", message: "意见不能为空"},
-          {max: 1000, message: "意见不能大于1000位", trigger: "blur"}
-        ]
-      },
-    }
-  },
-  computed: {
-    tableColumn() {
-      let column = [];
-      let self = this;
-      column.push({
-        title: '常用意见',
-        key: "commentContent",
-        minWidth: 150,
-        align: 'center',
-      });
-      column.push({
-        title: "意见类型",
-        key: "commentType",
-        width: 170,
-        align: "center",
-        render: (v, param) => {
-          if (param.row.commentType === '10') {
-            return v("span", '自定义');
-          }
-          return v("span", '系统预置')
-        }
-      });
-      column.push({
-        title: "排序码",
-        key: "orders",
-        width: 100,
-        align: "center",
-      });
-
-      column.push({
-        title: "修改时间",
-        key: "updateTime",
-        width: 170,
-        align: "center",
-        render: (v, param) => {
-          if (param.row.updateTime) {
-            let date = new Date(param.row.updateTime)
-            let y = date.getFullYear() // 年
-            let MM = date.getMonth() + 1 // 月
-            MM = MM < 10 ? ('0' + MM) : MM
-            let d = date.getDate() // 日
-            d = d < 10 ? ('0' + d) : d
-            let h = date.getHours() // 时
-            h = h < 10 ? ('0' + h) : h
-            let m = date.getMinutes()// 分
-            m = m < 10 ? ('0' + m) : m
-            let s = date.getSeconds()// 秒
-            s = s < 10 ? ('0' + s) : s
-            let state = y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
-            return v("span", state);
-          }
-          return v("span", '')
-        }
-      });
-
-      column.push({
-        title: "操作", width: 160, align: 'center', tooltip: true,
-        render: (h, {row}) => {
-          if (row.commentType === '10'){
-            return h("div", [
-              operateHref(this, h, row, "修改", () => {
-                this.openDetailModal('update', row);
-              }, "primary"),
-              operateHref(this, h, row, "删除", () => {
-                this.deleteCustomComment(row);
-              }, "error"),
-              operateHref(this, h, row, "选择", () => {
-                this.choose(row);
-              }, "primary")
-            ]);
-          }else {
-            return h("div", [
-              operateHref(this, h, row, "选择", () => {
-                this.choose(row);
-              }, "primary")
-            ]);
-          }
-
-        }
-
-      });
-
-      return column;
-    },
-  },
-  methods: {
-    openDetailModal(type, row) {
-      this.customCommentDetailModal = true
-      if (type === 'create') {
-        this.customCommentDetailTitle = '新增常用意见'
-      } else {
-        this.customCommentDetailTitle = '修改常用意见'
-        this.customCommentDetailForm.id = row.id
-        this.customCommentDetailForm.commentContent = row.commentContent
-        this.customCommentDetailForm.orders = row.orders
-      }
-    },
-    customCommentDetailCancel() {
-      this.getAuditOpinionForSelect()
-      this.customCommentDetailForm = {
-        id: '',
-        commentContent: '',
-        orders: 10
-      }
-      this.customCommentDetailModal = false
-    },
-    customCommentDetailOk() {
-      const self = this
-      self.$refs.customCommentForm.validate((valid) => {
-        if (valid) {
-          if (self.customCommentDetailForm.id) {
-            ajax.post(self.smartFlowServerContext + "/manage/smartflowCustomComment/update", self.customCommentDetailForm).then((resp) => {
-              if (resp.data.code === "200") {
-                self.customCommentDetailForm = {
-                  id: '',
-                  commentContent: '',
-                  orders: 10
-                }
-                self.refreshTable()
-              }
-            }).catch(err => {
-              console.log(err);
-            })
-          } else {
-            ajax.post(self.smartFlowServerContext + "/manage/smartflowCustomComment/insert", self.customCommentDetailForm).then((resp) => {
-              if (resp.data.code === "200") {
-                self.customCommentDetailForm = {
-                  id: '',
-                  commentContent: '',
-                  orders: 10
-                }
-                self.refreshTable()
-              }
-            }).catch(err => {
-              console.log(err);
-            })
-          }
-          self.customCommentDetailModal = false
-        }
-      })
-    },
-    deleteCustomComment(row) {
-      const self = this
-      self.$Modal.confirm({
-        title: '提示',
-        content: `<p>确定要删除${row.commentContent}吗?</p>`,
-        onOk: () => {
-          ajax.post(self.smartFlowServerContext + "/manage/smartflowCustomComment/delete/" + row.id).then(function (resp) {
-            if (resp.data.code === "200") {
-              self.refreshTable()
-            } else {
-              self.$Message.error(resp.data.message);
-            }
-          }).catch(function (err) {
-            self.$Message.error('删除失败,请联系应用管理员');
-          });
-        }
-      });
-    },
-    refreshTable() {
-      this.$refs.customCommentTable.tableRefresh()
-    },
-    choose(row) {
-      this.auditOpinion = row.commentContent
-      this.customCommentListModal = false
-    },
-    uploadFile(file){
-      const self = this;
-      file.forEach(item => {
-        self.attachmentdata.push({
-          fileName: item.fileName,
-          fileId: item.fileCode,
-        });
-      })
-    },
-    forRemoveAttachment: function (index) {
-      this.attachmentdata.splice(index, 1);
-    },
-  },
-  mounted() {
-  },
-  watch: {
-    auditOpinionText(label) {
-      this.auditOpinion = label;
-    },
-    auditOpinion(val) {
-      this.$emit('input', val)
-    }
-  }
-
-}
-</script>
-
-<style scoped>
-/deep/ .upload-btn-box{
-  padding-bottom: 0;
-}
-</style>
+<template>
+  <div>
+    <div style="font-size: small; background-color: #f0f0f0">
+      &nbsp;
+      <a style="color: black" @click="customCommentListModal = true"><Icon type="ios-browsers-outline" /> 常用意见</a> &nbsp;
+      <Tooltip placement="bottom" v-if="attachmentFile" max-width="200">
+        <div style="font-size: smaller" slot="content">支持扩展名：.pdf .doc .docx .txt .xls .xlsx .jpg .jpeg .png .gif</div>
+        <UploadFile @upload-result="uploadFile" :upload-btn="false" :show-file-list="false" :multiple="true"
+                    :oss-server-context="smartFlowServerContext" :oss-file-put-url="ossFilePutUrl"></UploadFile>
+      </Tooltip>
+    </div>
+    <Input v-model="auditOpinion" type="textarea" :autosize="{ minRows: 3, maxRows: 5 }" show-word-limit
+           :maxlength="200" placeholder="处理意见" style="width: 100%"
+    ></Input>
+    <div>
+      <div v-for="(item, index) in attachmentdata" :key="index" style="font-size: 14px">
+        <span style="color:#2D8cF0 ">  {{ item.fileName }}</span>
+        <a @click="forRemoveAttachment(index)" style="font-size: 13px;"> &nbsp;.删除</a>
+      </div>
+    </div>
+    <Modal v-model="customCommentListModal" title="常用意见" width="800px" footer-hide>
+      <LamboPagingTable :requestSuccessCodes="requestSuccessCodes" ref="customCommentTable" :dataUrl="dataUrl"
+                        :columns="tableColumn">
+        <div slot="buttons">
+          <Button type="primary" ghost icon="md-add" @click="openDetailModal('create')">新增</Button>
+        </div>
+      </LamboPagingTable>
+    </Modal>
+    <Modal v-model="customCommentDetailModal" :title="customCommentDetailTitle" width="700px"
+           @on-cancel="customCommentDetailCancel"
+           @on-ok="customCommentDetailOk">
+      <Card v-model="customCommentDetailModal" width="600px" dis-hover>
+        <Form ref="customCommentForm" :model="customCommentDetailForm" :rules="customCommentRuleValidate"
+              :label-width="100" label-position="right">
+          <FormItem label="常用意见：" prop="commentContent">
+            <Input type="textarea" v-model="customCommentDetailForm.commentContent" show-word-limit :maxlength="1000"
+                   style="width: 500px"/>
+          </FormItem>
+          <FormItem label="排序码：">
+            <Input style="width: 100px" v-model="customCommentDetailForm.orders"/>
+          </FormItem>
+        </Form>
+      </Card>
+    </Modal>
+  </div>
+</template>
+
+<script>
+import ajax from "@lambo-design/shared/utils/ajax";
+import { operateHref } from '@lambo-design/shared/utils/assist';
+import LamboPagingTable from "@lambo-design/paging-table";
+import UploadFile from "@lambo-design/upload-file";
+
+// 引入docx-preview插件
+let docx = require('docx-preview');
+export default {
+  components: {
+    LamboPagingTable,
+    UploadFile
+  },
+  props: {
+    value: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    attachmentFile:{
+      type: Boolean,
+      default: false,
+    },
+    actionUrl: {
+      default: "/api/oss-server/file/put",
+    },
+    attachmentdata: {
+      type: Array,
+      default: function () {
+        return []
+      }
+    },
+    defaultAuditOpinion: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    smartFlowServerContext: {
+      type: String,
+      default: '/api/smart-flow-server',
+    },
+  },
+  data() {
+    return {
+      requestSuccessCodes: [200, "200"],
+      tempFileArr: [],
+      fileList: [],
+      ossFilePutUrl: '/manage/oss/file/put',
+      auditOpinionText: '',
+      customCommentListModal: false,
+      auditOpinion: '',
+      customCommentDetailModal: false,
+      customCommentDetailTitle: '',
+      dataUrl: this.smartFlowServerContext + '/manage/smartflowCustomComment/list',
+      customCommentDetailForm: {
+        id: '',
+        commentContent: '',
+        orders: 10
+      },
+      customCommentRuleValidate: {
+        commentContent: [
+          {required: true, trigger: "blur", message: "意见不能为空"},
+          {max: 1000, message: "意见不能大于1000位", trigger: "blur"}
+        ]
+      },
+    }
+  },
+  computed: {
+    tableColumn() {
+      let column = [];
+      let self = this;
+      column.push({
+        title: '常用意见',
+        key: "commentContent",
+        minWidth: 150,
+        align: 'center',
+      });
+      column.push({
+        title: "意见类型",
+        key: "commentType",
+        width: 170,
+        align: "center",
+        render: (v, param) => {
+          if (param.row.commentType === '10') {
+            return v("span", '自定义');
+          }
+          return v("span", '系统预置')
+        }
+      });
+      column.push({
+        title: "排序码",
+        key: "orders",
+        width: 100,
+        align: "center",
+      });
+
+      column.push({
+        title: "修改时间",
+        key: "updateTime",
+        width: 170,
+        align: "center",
+        render: (v, param) => {
+          if (param.row.updateTime) {
+            let date = new Date(param.row.updateTime)
+            let y = date.getFullYear() // 年
+            let MM = date.getMonth() + 1 // 月
+            MM = MM < 10 ? ('0' + MM) : MM
+            let d = date.getDate() // 日
+            d = d < 10 ? ('0' + d) : d
+            let h = date.getHours() // 时
+            h = h < 10 ? ('0' + h) : h
+            let m = date.getMinutes()// 分
+            m = m < 10 ? ('0' + m) : m
+            let s = date.getSeconds()// 秒
+            s = s < 10 ? ('0' + s) : s
+            let state = y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
+            return v("span", state);
+          }
+          return v("span", '')
+        }
+      });
+
+      column.push({
+        title: "操作", width: 160, align: 'center', tooltip: true,
+        render: (h, {row}) => {
+          if (row.commentType === '10'){
+            return h("div", [
+              operateHref(this, h, row, "修改", () => {
+                this.openDetailModal('update', row);
+              }, "primary"),
+              operateHref(this, h, row, "删除", () => {
+                this.deleteCustomComment(row);
+              }, "error"),
+              operateHref(this, h, row, "选择", () => {
+                this.choose(row);
+              }, "primary")
+            ]);
+          }else {
+            return h("div", [
+              operateHref(this, h, row, "选择", () => {
+                this.choose(row);
+              }, "primary")
+            ]);
+          }
+
+        }
+
+      });
+
+      return column;
+    },
+  },
+  methods: {
+    openDetailModal(type, row) {
+      this.customCommentDetailModal = true
+      if (type === 'create') {
+        this.customCommentDetailTitle = '新增常用意见'
+      } else {
+        this.customCommentDetailTitle = '修改常用意见'
+        this.customCommentDetailForm.id = row.id
+        this.customCommentDetailForm.commentContent = row.commentContent
+        this.customCommentDetailForm.orders = row.orders
+      }
+    },
+    customCommentDetailCancel() {
+      this.getAuditOpinionForSelect()
+      this.customCommentDetailForm = {
+        id: '',
+        commentContent: '',
+        orders: 10
+      }
+      this.customCommentDetailModal = false
+    },
+    customCommentDetailOk() {
+      const self = this
+      self.$refs.customCommentForm.validate((valid) => {
+        if (valid) {
+          if (self.customCommentDetailForm.id) {
+            ajax.post(self.smartFlowServerContext + "/manage/smartflowCustomComment/update", self.customCommentDetailForm).then((resp) => {
+              if (resp.data.code === "200") {
+                self.customCommentDetailForm = {
+                  id: '',
+                  commentContent: '',
+                  orders: 10
+                }
+                self.refreshTable()
+              }
+            }).catch(err => {
+              console.log(err);
+            })
+          } else {
+            ajax.post(self.smartFlowServerContext + "/manage/smartflowCustomComment/insert", self.customCommentDetailForm).then((resp) => {
+              if (resp.data.code === "200") {
+                self.customCommentDetailForm = {
+                  id: '',
+                  commentContent: '',
+                  orders: 10
+                }
+                self.refreshTable()
+              }
+            }).catch(err => {
+              console.log(err);
+            })
+          }
+          self.customCommentDetailModal = false
+        }
+      })
+    },
+    deleteCustomComment(row) {
+      const self = this
+      self.$Modal.confirm({
+        title: '提示',
+        content: `<p>确定要删除${row.commentContent}吗?</p>`,
+        onOk: () => {
+          ajax.post(self.smartFlowServerContext + "/manage/smartflowCustomComment/delete/" + row.id).then(function (resp) {
+            if (resp.data.code === "200") {
+              self.refreshTable()
+            } else {
+              self.$Message.error(resp.data.message);
+            }
+          }).catch(function (err) {
+            self.$Message.error('删除失败,请联系应用管理员');
+          });
+        }
+      });
+    },
+    refreshTable() {
+      this.$refs.customCommentTable.tableRefresh()
+    },
+    choose(row) {
+      this.auditOpinion = row.commentContent
+      this.customCommentListModal = false
+    },
+    uploadFile(file){
+      const self = this;
+      file.forEach(item => {
+        self.attachmentdata.push({
+          fileName: item.fileName,
+          fileId: item.fileCode,
+        });
+      })
+      self.$emit('handle-file', self.attachmentdata)
+    },
+    forRemoveAttachment: function (index) {
+      this.attachmentdata.splice(index, 1);
+      this.$emit('handle-file', this.attachmentdata)
+    },
+  },
+  mounted() {
+    this.auditOpinion = this.defaultAuditOpinion || this.value
+  },
+  watch: {
+    auditOpinionText(label) {
+      this.auditOpinion = label;
+    },
+    auditOpinion(val) {
+      this.$emit('input', val)
+    },
+    value(newVal) {
+      this.auditOpinion = newVal;
+    },
+    defaultAuditOpinion(val) {
+      this.auditOpinion = this.defaultAuditOpinion
+      this.$emit('input', val)
+    }
+  }
+
+}
+</script>
+
+<style scoped>
+/deep/ .upload-btn-box{
+  padding-bottom: 0;
+}
+</style>