裁决书页面

package.json

@@ -57,6 +57,7 @@
     "vue": "2.6.12",
     "vue-count-to": "1.0.13",
     "vue-cropper": "0.5.5",
+    "vue-esign": "^1.1.4",
     "vue-meta": "2.4.0",
     "vue-router": "3.4.9",
     "vuedraggable": "2.24.3",

src/api/awardManagement/awardManagement.js

@@ -0,0 +1,34 @@
+import request from '@/utils/request'
+// 案件列表
+export function caseApplicationList(data) {
+    return request({
+        url: '/caseApplication/list',
+        // headers: {
+        //   isToken: false
+        // },
+        method: 'get',
+        params: data
+    })
+}
+// 查看详情
+export function caseApplicationDetail(data) {
+    return request({
+        url: '/caseApplication/selectCaseApplication',
+        // headers: {
+        //   isToken: false
+        // },
+        method: 'post',
+        data: data
+    })
+}
+// 检验裁决书
+export function verificationArbitrateRecord(data) {
+    return request({
+        url: '/caseApplication/verificationArbitrateRecord',
+        // headers: {
+        //   isToken: false
+        // },
+        method: 'post',
+        data: data
+    })
+}

src/main.js

@@ -39,7 +39,8 @@ import DictTag from '@/components/DictTag'
 import VueMeta from 'vue-meta'
 // 字典数据组件
 import DictData from '@/components/DictData'
-
+//画布组件
+import vueEsign from 'vue-esign'
 // 全局方法挂载
 Vue.prototype.getDicts = getDicts
 Vue.prototype.getConfigKey = getConfigKey
@@ -63,6 +64,7 @@ Vue.component('ImagePreview', ImagePreview)
 Vue.use(directive)
 Vue.use(plugins)
 Vue.use(VueMeta)
+Vue.use(vueEsign)
 DictData.install()
 
 /**

src/views/awardManagement/components/paymentdetailsDialog.vue

@@ -0,0 +1,116 @@
+<template>
+  <div>
+    <el-dialog :title="title" :visible="openDialog" width="1000px" @close="cancel" :destroy-on-close="true">
+      <el-descriptions title="案件信息" border style="margin-bottom: 30px;">
+        <el-descriptions-item label="案件编号">{{form.caseNum}}</el-descriptions-item>
+        <el-descriptions-item label="案件标的">{{form.caseSubjectAmount}}</el-descriptions-item>
+        <el-descriptions-item label="借款开始日期">{{form.loanStartDate}}</el-descriptions-item>
+        <el-descriptions-item label="借款结束日期">{{form.loanEndDate}}</el-descriptions-item>
+        <el-descriptions-item label="合同编号">{{form.contractNumber}}</el-descriptions-item>
+        <el-descriptions-item label="申请人主张欠本金">{{form.claimPrinciOwed}}</el-descriptions-item>
+        <el-descriptions-item label="申请人主张欠利息">{{form.claimInterestOwed}}</el-descriptions-item>
+        <el-descriptions-item label="申请人主张违约金">{{form.claimLiquidDamag}}</el-descriptions-item>
+        <el-descriptions-item label="申请人案件证据资料">{{form.aaa}}</el-descriptions-item>
+        <el-descriptions-item label="被申请人案件证据资料">{{form.aaa}}</el-descriptions-item>
+        <el-descriptions-item label="裁决书附件">{{form.aaa}}</el-descriptions-item>
+      </el-descriptions>
+      <el-form ref="form" :model="arbitrateRecord" label-width="300px" label-position="left">
+        <el-form-item label="经庭审质证，对各方提供的证据认定如下" prop="caseNum">
+          <el-input type="textarea" autosize placeholder="请输入内容" v-model="arbitrateRecord.evidenDetermi" />
+        </el-form-item>
+        <el-form-item label="仲裁庭经审理查明(写明仲裁庭认定的事实)" prop="caseSubjectAmount">
+          <el-input type="textarea" autosize placeholder="请输入内容" v-model="arbitrateRecord.factDetermi" />
+        </el-form-item>
+        <el-form-item label="综上所述" prop="caseNum">
+          <el-input type="textarea" autosize placeholder="请输入内容" v-model="arbitrateRecord.caseSketch" />
+        </el-form-item>
+        <el-form-item label="本庭认为" prop="feePayable">
+          <el-input type="textarea" autosize placeholder="请输入内容" v-model="arbitrateRecord.arbitrateThink" />
+        </el-form-item>
+        <el-form-item label="裁决如下" prop="caseStatusName">
+          <el-input type="textarea" autosize placeholder="请输入内容" v-model="arbitrateRecord.rulingFollows" />
+        </el-form-item>
+        <el-form-item label="核验裁决书意见：" prop="caseStatusName">
+          <el-input type="textarea" autosize placeholder="请输入内容" v-model="arbitrateRecord.verificaOpinion" />
+        </el-form-item>
+        <el-form-item label="审核裁决书意见：" prop="caseStatusName" v-if="flag == 2">
+          <el-input type="textarea" autosize placeholder="请输入内容" v-model="arbitrateRecord.checkOpinion" />
+        </el-form-item>
+      </el-form>
+      <!-- 画布 -->
+      <h4 v-if="flag == 3">签名区域</h4>
+      <div class="esign" v-if="flag == 3">
+        <vue-esign ref="esign" :width="900" :height="300" bgColor="#ffffff" />
+      </div>
+      <!-- 清除画布 -->
+      <el-button v-if="flag == 3" type="info" @click="handleReset">清除画布</el-button>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm(0)" v-if="flag == 1">提 交</el-button>
+        <el-button type="primary" @click="submitForm(1)" v-if="flag == 2">同 意</el-button>
+        <el-button type="danger" @click="submitForm(2)" v-if="flag == 2">驳 回</el-button>
+        <el-button type="primary" @click="submitForm(3)" v-if="flag == 3">提 交</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {
+  verificationArbitrateRecord
+} from "@/api/awardManagement/awardManagement";
+export default {
+  props: ["openDialog", "title", "flag", "detailform"],
+  data() {
+    return {
+      // key: value
+      form: {},
+      arbitrateRecord:{}
+    };
+  },
+  watch: {
+    openDialog: {
+      handler(val) {
+        if (val) {
+          setTimeout(() => {
+            this.form = this.detailform;
+            console.log(this.form, "this.form");
+          }, 1000);
+        }
+      },
+    },
+  },
+  methods: {
+    // 校验裁决书
+    verificationArbitrateRecordFn(parms){
+      verificationArbitrateRecord(parms).then(res=>{
+        this.cancel();
+        this.$emit("updataList");
+        this.$message('成功');
+      })
+    },
+    submitForm(parms) {
+      if(parms == 0){
+        this.verificationArbitrateRecordFn({id:this.form.id,arbitrateRecord:this.arbitrateRecord})
+      }
+    },
+    cancel() {
+      this.$emit("cancelpaymentdetails");
+    },
+    // 清除画布
+    handleReset() {
+      this.$refs['esign'].reset() //清空画布
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+::v-deep .el-dialog {
+  border-radius: 30px;
+}
+
+.esign {
+  border: 1px solid;
+}
+</style>

src/views/awardManagement/listofAwards.vue

@@ -1,15 +1,181 @@
 <template>
     <div class="app-container">
-        裁决书列表
+        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="68px">
+            <el-form-item label="案件编号" prop="caseNum">
+                <el-input v-model="queryParams.caseNum" placeholder="请输入案件编号" clearable @keyup.enter.native="handleQuery" />
+            </el-form-item>
+            <el-form-item label="案件状态" prop="caseStatus">
+                <el-select v-model="queryParams.caseStatus" placeholder="请选择案件状态" clearable
+                    @keyup.enter.native="handleQuery">
+                    <el-option v-for="dict in dict.type.case_status" :key="dict.value" :label="dict.label"
+                        :value="dict.value"></el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item label="开庭日期" prop="hearDate">
+                <el-date-picker v-model="queryParams.hearDate" type="daterange" range-separator="至" start-placeholder="开始日期"
+                    end-placeholder="结束日期">
+                </el-date-picker>
+            </el-form-item>
+            <el-form-item>
+                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+            </el-form-item>
+        </el-form>
+        <el-table v-loading="loading" :data="dataList" style="width: 100%">
+            <el-table-column label="序号" type="index" align="center">
+                <template slot-scope="scope">
+                    <span>{{
+                        (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1
+                    }}</span>
+                </template>
+            </el-table-column>
+            <el-table-column label="案件编号" align="center" prop="caseNum" :show-overflow-tooltip="true" />
+            <el-table-column label="案件标的" align="center" prop="caseSubjectAmount" />
+            <el-table-column label="立案日期" align="center" prop="registerDate" :show-overflow-tooltip="true" />
+            <!-- 缴费人 -->
+            <el-table-column label="案件状态" align="center" prop="caseStatusName" />
+            <el-table-column label="裁决书状态" align="center" prop="caseStatusName" />
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+                <template slot-scope="scope">
+                    <el-button size="mini" type="text" icon="el-icon-reading" v-if="scope.row.caseStatus == 10" @click="showModel(scope.row, 0)"
+                        v-hasPermi="['monitor:online:forceLogout']">生成裁决书</el-button>
+                    <el-button size="mini" type="text" icon="el-icon-edit" v-if="scope.row.caseStatus == 11" @click="showModel(scope.row, 1)"
+                        v-hasPermi="['monitor:online:forceLogout']">核查</el-button>
+                    <el-button size="mini" type="text" icon="el-icon-edit" v-if="scope.row.caseStatus == 12" @click="showModel(scope.row, 2)"
+                        v-hasPermi="['monitor:online:forceLogout']">确认裁决书</el-button>
+                    <el-button size="mini" type="text" icon="el-icon-edit" v-if="scope.row.caseStatus == 13" @click="showModel(scope.row, 3)"
+                        v-hasPermi="['monitor:online:forceLogout']">签名</el-button>
+                    <el-button size="mini" type="text" icon="el-icon-edit" v-if="scope.row.caseStatus == 14" @click="showModel(scope.row, 4)"
+                        v-hasPermi="['monitor:online:forceLogout']">用印申请</el-button>
+                    <el-button size="mini" type="text" icon="el-icon-edit" v-if="scope.row.caseStatus == 15" @click="showModel(scope.row, 5)"
+                        v-hasPermi="['monitor:online:forceLogout']">送达裁决书</el-button>
+                    <el-button size="mini" type="text" icon="el-icon-edit" v-if="scope.row.caseStatus == 16" @click="showModel(scope.row, 6)"
+                        v-hasPermi="['monitor:online:forceLogout']">案件归档</el-button>
+                    <!-- <el-button size="mini" type="text" icon="el-icon-reading" 
+                        @click="showModel(scope.row, 0)" v-hasPermi="['monitor:online:forceLogout']">生成裁决书</el-button>
+                    <el-button size="mini" type="text" icon="el-icon-edit" 
+                        @click="showModel(scope.row, 1)" v-hasPermi="['monitor:online:forceLogout']">核查</el-button>
+                    <el-button size="mini" type="text" icon="el-icon-edit" 
+                        @click="showModel(scope.row, 2)" v-hasPermi="['monitor:online:forceLogout']">确认裁决书</el-button>
+                    <el-button size="mini" type="text" icon="el-icon-edit" 
+                        @click="showModel(scope.row, 3)" v-hasPermi="['monitor:online:forceLogout']">签名</el-button>
+                    <el-button size="mini" type="text" icon="el-icon-edit" 
+                        @click="showModel(scope.row, 4)" v-hasPermi="['monitor:online:forceLogout']">用印申请</el-button>
+                    <el-button size="mini" type="text" icon="el-icon-edit" 
+                        @click="showModel(scope.row, 5)" v-hasPermi="['monitor:online:forceLogout']">送达裁决书</el-button>
+                    <el-button size="mini" type="text" icon="el-icon-edit" 
+                        @click="showModel(scope.row, 6)" v-hasPermi="['monitor:online:forceLogout']">案件归档</el-button> -->
+                </template>
+            </el-table-column>
+        </el-table>
+        <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
+            @pagination="getList(queryParams)" />
+        <!-- 弹窗 -->
+        <paymentdetailsDialog :openDialog="openDialog" :detailform="detailform" :title="title" :flag="flag"
+            @cancelpaymentdetails="cancelpaymentdetails" @updataList="updataList"></paymentdetailsDialog>
     </div>
 </template>
-
+  
 <script>
-    export default {
-        
-    }
-</script>
+import {
+    caseApplicationList,
+    caseApplicationDetail,
+} from "@/api/awardManagement/awardManagement";
+import paymentdetailsDialog from "./components/paymentdetailsDialog.vue";
 
-<style lang="scss" scoped>
+export default {
+    name: "paymentList",
+    dicts: ["case_status"],
+    components: { paymentdetailsDialog },
+    data() {
+        return {
+            queryParams: {
+                pageNum: 1,
+                pageSize: 10,
+            },
+            // 遮罩层
+            loading: false,
+            // 总条数
+            total: 0,
+            // 表格数据
+            list: [],
 
-</style>
+            // 弹出层标题
+            title: "",
+            payTitle: "",
+            // 是否显示弹出层
+            open: false,
+            openPay: false,
+            // 弹出层内容
+            form: {},
+            // 校验表单
+            rules: {},
+            dataList: [],
+            detailform: {}, //缴费详情数据
+            openDialog: false, //缴费详情数据弹框
+            flag: null,
+        };
+    },
+    created() {
+        this.queryParams.caseStatusList = [10, 11, 12, 13, 14, 15, 16]
+        this.getList(this.queryParams);
+    },
+    methods: {
+        updataList(){
+            this.getList(this.queryParams);
+        },
+        /** 搜索按钮操作 */
+        handleQuery() {
+            this.queryParams.pageNum = 1;
+            this.getList(this.queryParams);
+        },
+        /** 重置按钮操作 */
+        resetQuery() {
+            this.resetForm("queryForm");
+            this.handleQuery();
+        },
+        // 查询列表数据
+        getList(parms) {
+            this.loading = true;
+            caseApplicationList(parms).then((response) => {
+                this.dataList = response.rows;
+                this.total = response.total;
+                this.loading = false;
+            });
+        },
+        // model框显示
+        showModel(row, type) {
+            this.getDetail({ id: row.id });
+            this.openDialog = true;
+            switch (type) {
+                case 1:
+                    this.title = "核验裁决书";
+                    this.flag = 1;
+                    break;
+                case 2:
+                    this.title = "审核裁决书";
+                    this.flag = 2;
+                    break;
+                case 3:
+                    this.title = "裁决书签名";
+                    this.flag = 3;
+                    break;
+                default:
+                    break;
+            }
+        },
+        // 关闭弹窗
+        cancelpaymentdetails() {
+            this.openDialog = false;
+        },
+        /** 查询详情 */
+        getDetail(parms) {
+            caseApplicationDetail(parms).then((res) => {
+                this.detailform = res.data;
+            });
+        },
+    },
+};
+</script>
+  
+<style lang="scss" scoped></style>

vue.config.js

@@ -11,8 +11,8 @@ const name = process.env.VUE_APP_TITLE || '智慧仲裁管理系统' // 网页
 
 const port = process.env.port || process.env.npm_config_port || 80 // 端口
 
-// const API = 'http://121.40.189.20:9001'  //测试
-const API = 'http://192.168.3.77:8080' //Q
+const API = 'http://121.40.189.20:9001'  //测试
+// const API = 'http://192.168.3.77:8080' //Q
 
 // vue.config.js 配置说明
 //官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions