添加防止重复点击

Admin

2022-11-24 d6bc20ee2a65bc69237dda0b0296d514e7e28763

添加防止重复点击

 src/main.js

@@ -41,6 +41,9 @@
Vue.config.productionTip = false
Vue.config.devtools = true

import { stopReClick } from './utils/stopReClick'
Vue.use(stopReClick)

window.vueInstance = new Vue({
  el: '#app',
  router,

 src/utils/stopReClick.js

对比新文件
@@ -0,0 +1,24 @@
import Vue from 'vue'
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
// import App from './App.vue';

Vue.use(ElementUI);
// 在vue上挂载一个指量 stopReClick
// vue防止按钮重复点击
const stopReClick = Vue.directive('stopReClick', {
    inserted: function (el, binding) {
        el.addEventListener('click', () => {
            if (!el.disabled) {
                el.disabled = true
                el.style.cursor = 'not-allowed'
                setTimeout(() => {
                    el.style.cursor = 'pointer'
                    el.disabled = false
                    //设置时间
                }, binding.value || 3000)
            }
        })
    }
})
export { stopReClick }

 src/views/selfCheck/components/repair.vue

@@ -95,7 +95,7 @@
            </el-form>
            <span slot="footer" class="dialog-footer">
              <el-button @click="dialogFix = false">取消</el-button>
              <el-button type="primary" @click="confirmFix('fixForm')">提交</el-button>
              <el-button type="primary" v-stop-re-click @click="confirmFix('fixForm')">提交</el-button>
            </span>
        </el-dialog>
    </el-dialog>

 src/views/selfCheck/components/selfReport.vue

@@ -72,7 +72,7 @@

        <span slot="footer" class="dialog-footer">
          <el-button @click="dialogVisible = false">取消</el-button>
          <el-button type="primary" @click="submitForm('checkForm')">提交</el-button>
          <el-button type="primary" v-stop-re-click @click="submitForm('checkForm')">提交</el-button>
        </span>
    </el-dialog>
</template>

 src/views/selfCheck/components/supervisionDetails.vue

@@ -60,6 +60,25 @@
                    <td class="w-50">{{corpInfo.hiddendangerSum}}</td>
                    <td class="w-50">{{corpInfo.majorHiddendangerNum}}</td>
                </tr>
                <tr class="m-color b-font" style="text-align: center" v-if="corpInfo.hiddendangerStatus == 1">执法处罚情况</tr>
                <tr v-if="corpInfo.hiddendangerStatus == 1">
                    <td class="m-color w-25">罚款金额（万元）</td>
                    <td class="w-25">{{ corpInfo.amerceMoney }}</td>
                    <td class="m-color w-25">是否责令停产整顿</td>
                    <td class="w-25">
                        {{ corpInfo.stopProductionStatus == 1 ? '是': '否' }}
                    </td>
                </tr>
                <tr v-if="corpInfo.hiddendangerStatus == 1">
                    <td class="m-color w-25">是否吊销许可证</td>
                    <td class="w-25">
                        {{ corpInfo.revokeLicenseStatus == 1 ? '是': '否' }}
                    </td>
                    <td class="m-color w-25">是否暂扣许可证</td>
                    <td class="w-25">
                        {{ corpInfo.detainLicenseStatus == 1 ? '是': '否' }}
                    </td>
                </tr>
            </table>
<!--            <div class="table-bottom">-->
<!--                <div>填报人: <span class="m-color">{{corpInfo.selfcheckReportUserName}}</span></div>-->

 src/views/specialCheck/components/feedbackDetails.vue

@@ -108,7 +108,7 @@
                </el-form>
                <div style="display: flex;justify-content: center;margin: 20px 0">
                    <el-button @click="confirmBack()">返回列表</el-button>
                    <el-button type="primary" @click="confirmSubmit('feedbackForm')">提交</el-button>
                    <el-button type="primary" v-stop-re-click @click="confirmSubmit('feedbackForm')">提交</el-button>
                </div>
            </div>
        </div>
@@ -456,7 +456,7 @@
            </el-form>
            <span slot="footer" class="dialog-footer">
              <el-button @click="editDialog = false">取消</el-button>
              <el-button type="primary" @click="postEdit('editForm')">提交</el-button>
              <el-button type="primary" v-stop-re-click @click="postEdit('editForm')">提交</el-button>
            </span>
        </el-dialog>
        <check-details ref="report"></check-details>

 src/views/specialCheck/components/sendWork.vue

@@ -164,7 +164,7 @@
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button @click="resetForm('workForm')">重置</el-button>
          <el-button type="primary" @click="confirmSend('workForm')">确认下发</el-button>
          <el-button type="primary" v-stop-re-click @click="confirmSend('workForm')">确认下发</el-button>
        </span>
    </el-dialog>
</template>
@@ -218,7 +218,6 @@
        methods:{
            confirmSend(formName){
                const t = this
                console.log(t.workForm,'66666666666')
                t.$refs[formName].validate((valid) => {
                    if (valid) {
                        this.$confirm('此操作将把任务下发给所有单位, 是否继续?', '提示', {

 src/views/specialCheck/components/sumSheet.vue

@@ -14,7 +14,7 @@
                <div v-else style="width: 140px"></div>
            </div>
            <div class="tabpanel">
                <table v-show="sheetStatus==1||sheetStatus==2" class="data-table" id="tableExcel">
                <table v-show="sheetStatus==1||sheetStatus==2" class="data-table" id="tableExcel" v-if="thisLevelStatistic && institutionalData && institutionalData.length>0">
                    <tr>
                        <th rowspan="3">序号</th>
                        <th rowspan="3">{{sheetStatus==1?'地市':'区县'}}</th>
@@ -185,6 +185,7 @@
                    </tr>
                    </template>
                </table>
                <div v-else style="text-align: center;font-size: 16px">暂无汇总数据</div>
                <area-form v-show="sheetStatus==3" ref="areaSheet"></area-form>
            </div>
        </div>

 src/views/specialCheck/index.vue

@@ -3,6 +3,7 @@
        <div class="menu-area">
            <el-button v-if="unitType==1" class="add-btn" type="primary" icon="el-icon-plus" @click="sendJob()">新任务下发</el-button>
            <el-menu
                v-if="taskMenu && taskMenu.length>0"
                default-active="0-1"
                class="el-menu-vertical-demo"
                background-color="#eee"
@@ -20,11 +21,15 @@
                    <el-menu-item :index="i + '-' + 3" v-if="unitType==1||unitType==2">安全检查情况汇总</el-menu-item>
                </el-submenu>
            </el-menu>
            <div v-else style="background:#eee;color: #333;font-size: 16px;padding: 20px 10px">
                暂无任务
            </div>
        </div>
        <div class="table-area">
        <div class="table-area" v-if="taskMenu && taskMenu.length>0">
            <wholesale-form v-show="curTab == 1 || curTab == 2" ref="wholesale"></wholesale-form>
            <sum-sheet v-show="curTab == 3" ref="sumSheet"></sum-sheet>
        </div>
        <div v-else class="table-area" style="text-align:center;margin-top: 200px">暂无任务信息</div>
        <send-work ref="send"></send-work>
    </div>
</template>