常用语前端

SC-web/src/views/workFlow/components/FlowBox.vue

@@ -13,12 +13,12 @@
           <template v-if="setting.opType == '-1'">
             <el-button type="primary" @click="eventLauncher('submit')" :loading="candidateLoading"
               :disabled="allBtnDisabled">{{ properties.submitBtnText || '提 交' }}</el-button>
-            <el-button type="warning" @click="eventLauncher('save')" :loading="btnLoading"
-              :disabled="allBtnDisabled">{{ properties.saveBtnText || '暂 存' }}</el-button>
+            <el-button type="warning" @click="eventLauncher('save')" :loading="btnLoading" :disabled="allBtnDisabled">{{
+              properties.saveBtnText || '暂 存' }}</el-button>
           </template>
           <template v-if="setting.opType == 1">
-            <el-button type="warning" @click="openUserBox('transfer')"
-              v-if="properties.hasTransferBtn">{{ properties.transferBtnText || '转 审' }}</el-button>
+            <el-button type="warning" @click="openUserBox('transfer')" v-if="properties.hasTransferBtn">{{
+              properties.transferBtnText || '转 审' }}</el-button>
             <el-button type="primary" @click="eventLauncher('audit')" :loading="candidateLoading"
               v-if="properties.hasAuditBtn">{{ properties.auditBtnText || '通 过' }}</el-button>
             <el-button type="warning" @click="eventLauncher('saveAudit')" v-if="properties.hasSaveBtn"
@@ -35,8 +35,8 @@
               v-if="properties.hasRevokeBtn || properties.hasRevokeBtn === undefined">
               {{ properties.revokeBtnText || '撤 回' }}</el-button>
           </template>
-          <el-button type="danger" v-if="setting.opType == 2 && properties.hasRevokeBtn"
-            @click="recall()">{{ properties.revokeBtnText || '撤 回' }}</el-button>
+          <el-button type="danger" v-if="setting.opType == 2 && properties.hasRevokeBtn" @click="recall()">{{
+            properties.revokeBtnText || '撤 回' }}</el-button>
           <template v-if="setting.opType == 4">
             <el-button type="primary" @click="openAssignBox" v-if="setting.status == 1">指 派
             </el-button>
@@ -83,8 +83,13 @@
           </el-form-item>
           <el-form-item label="审批意见">
             <el-input v-model="reason" placeholder="请输入审批意见（选填）" type="textarea" :rows="4" />
-            <el-radio v-model="reason" label="同意">同意</el-radio>
-            <el-radio v-model="reason" label="不同意">不同意</el-radio>
+            <el-tag :key="tag" v-for="tag in dynamicTags" closable :disable-transitions="false" @close="handleClose(tag)" @click="useTag(tag)">
+              {{ tag }}
+            </el-tag>
+            <el-input class="input-new-tag" v-if="inputVisible" v-model="tagValue" ref="saveTagInput" size="small"
+              @keyup.enter.native="handleInputConfirm" @blur="handleInputConfirm">
+            </el-input>
+            <el-button v-else class="button-new-tag" size="small" @click="showInput">+ 新增标签</el-button>
           </el-form-item>
           <el-form-item label="审批签名" v-if="properties.hasSign">
             <div class="sign-main">
@@ -205,7 +210,10 @@ export default {
       copyIds: [],
       fullName: '',
       thisStep: '',
-      allBtnDisabled: false
+      allBtnDisabled: false,
+      dynamicTags: ['同意', '不同意'],
+      inputVisible: false,
+      tagValue: '',
     }
   },
   computed: {
@@ -225,6 +233,26 @@ export default {
     }
   },
   methods: {
+    useTag(tag){
+      this.reason = tag;
+    },
+    handleClose(tag) {
+      this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
+    },
+    showInput() {
+      this.inputVisible = true;
+      this.$nextTick(_ => {
+        this.$refs.saveTagInput.$refs.input.focus();
+      });
+    },
+    handleInputConfirm() {
+      let tagValue = this.tagValue;
+      if (tagValue) {
+        this.dynamicTags.push(tagValue);
+      }
+      this.inputVisible = false;
+      this.tagValue = '';
+    },
     goBack(isRefresh) {
       this.$emit('close', isRefresh)
     },
@@ -691,4 +719,22 @@ export default {
     overflow: hidden;
   }
 }
+
+.el-tag+.el-tag {
+  margin-left: 10px;
+}
+
+.button-new-tag {
+  margin-left: 10px;
+  height: 32px;
+  line-height: 30px;
+  padding-top: 0;
+  padding-bottom: 0;
+}
+
+.input-new-tag {
+  width: 90px;
+  margin-left: 10px;
+  vertical-align: bottom;
+}
 </style>