complainantCheckList.vue 6.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176
  1. <template>
  2. <div class="app-container">
  3. <div class="title-container">
  4. <breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
  5. </div>
  6. <y-page-list-layout :page-list="pageData" :page-para="listQuery" :get-page-list="getList">
  7. <template slot="left">
  8. <el-input v-model="listQuery.orderId" placeholder="项目编号" clearable style="width: 200px;float: left;"></el-input>
  9. <el-select v-model="listQuery.complainantId" filterable placeholder="投诉人(可搜索)" style=" width: 180px;margin-left: 10px;float: left;">
  10. <el-option v-for="(u, id) in allUsers" :label="u.name" :value="u.id"></el-option>
  11. </el-select>
  12. <el-select v-model="listQuery.respondentId" filterable placeholder="项目负责人(可搜索)" style=" width: 180px;margin-left: 10px;float: left;">
  13. <el-option v-for="(u, id) in allUsers" :label="u.name" :value="u.id"></el-option>
  14. </el-select>
  15. <el-select v-model="listQuery.complainantType" placeholder="投诉类型" style=" width: 180px;margin-left: 10px;float: left;">
  16. <el-option label="内部投诉" value="INTERNAL"></el-option>
  17. <el-option label="外部投诉" value="EXTERNAL"></el-option>
  18. </el-select>
  19. <el-select v-model="listQuery.state" placeholder="投诉状态" style=" width: 180px;margin-left: 10px;float: left;">
  20. <el-option label="待确认" value="PENDING"></el-option>
  21. <el-option label="已确认" value="CONFIRM"></el-option>
  22. <el-option label="撤销" value="CANCEL"></el-option>
  23. </el-select>
  24. <el-button class="filter-item" style="margin-left:20px;float: left;" type="primary" @click="searchList()" round>搜索</el-button>
  25. <el-button class="filter-item" style="float: left;" round type="success" @click="resetSearch()">重置</el-button>
  26. </template>
  27. <parentTable :data="pageData.records" slot="table" style="width: 100%;">
  28. <el-table-column align="center" prop="complainantType" label="投诉类型" min-width="12.5%">
  29. <template slot-scope="{row}">
  30. <span v-if="row.complainantType == 'INTERNAL'">内部投诉</span>
  31. <span v-if="row.complainantType == 'EXTERNAL'">外部投诉</span>
  32. </template>
  33. </el-table-column>
  34. <el-table-column align="center" prop="complainantName" label="投诉人" min-width="12.5%"></el-table-column>
  35. <el-table-column align="center" prop="respondentName" label="项目负责人" min-width="12.5%"></el-table-column>
  36. <el-table-column align="center" prop="orderId" label="项目编号" min-width="12.5%"></el-table-column>
  37. <el-table-column align="center" prop="reason" label="投诉原因" min-width="25%"></el-table-column>
  38. <el-table-column align="center" prop="state" label="投诉状态" min-width="12.5%">
  39. <template slot-scope="{row}">
  40. <span v-if="row.state == 'PENDING'" style="color:#E6A23C">待确认</span>
  41. <span v-if="row.state == 'CONFIRM'" style="color:red">已确认</span>
  42. <span v-if="row.state == 'CANCEL'" style="color:gray">撤销</span>
  43. </template>
  44. </el-table-column>
  45. <el-table-column align="center" prop="created" label="投诉时间" min-width="15%"></el-table-column>
  46. <el-table-column align="center" prop="checkerName" label="审核人" min-width="12.5%">
  47. <template slot-scope="{row}">
  48. <span>{{ row.checkerName ? row.checkerName : '-' }}</span>
  49. </template>
  50. </el-table-column>
  51. <el-table-column align="center" prop="checkDate" label="审核时间" min-width="12.5%">
  52. <template slot-scope="{row}">
  53. <span>{{ row.checkDate ? row.checkDate : '-' }}</span>
  54. </template>
  55. </el-table-column>
  56. <el-table-column label="操作" align="center" width="100" fixed="right">
  57. <template slot-scope="{row}">
  58. <el-button type="text" @click="cancel(row.id)" :disabled="row.state !== 'PENDING'">撤销</el-button>
  59. <el-button type="text" @click="confirm(row.id)" :disabled="row.state !== 'PENDING'">确认</el-button>
  60. </template>
  61. </el-table-column>
  62. </parentTable>
  63. </y-page-list-layout>
  64. </div>
  65. </template>
  66. <script>
  67. import YPageListLayout from '@/components/YPageListLayout';
  68. import Breadcrumb from '@/components/Breadcrumb';
  69. export default {
  70. name: 'complainantAssetsCheckList',
  71. components: {
  72. Breadcrumb,
  73. YPageListLayout,
  74. },
  75. filters: {},
  76. data() {
  77. return {
  78. allUsers: [],
  79. pageData: { records: [] },
  80. listQuery: {
  81. page: 1,
  82. size: 20,
  83. descs: 'id',
  84. },
  85. };
  86. },
  87. created() {
  88. this.getAllUser();
  89. this.getList();
  90. },
  91. methods: {
  92. // 获取所有用户下拉列表
  93. getAllUser() {
  94. this.$api.user.simpleAll().then((res) => {
  95. if (res.code === 200) {
  96. this.allUsers = res.data;
  97. }
  98. });
  99. },
  100. resetSearch() {
  101. this.$router.push({ query: {} });
  102. this.orderDate = '';
  103. this.listQuery = {
  104. current: 1,
  105. size: 20,
  106. };
  107. this.getList();
  108. },
  109. searchList() {
  110. this.listQuery.current = 1;
  111. this.getList();
  112. },
  113. getList() {
  114. this.$api.assetsComplaint.page(this.listQuery).then((res) => {
  115. if (res.code === 200) {
  116. this.pageData = res.data;
  117. }
  118. });
  119. },
  120. // 撤销投诉
  121. cancel(id) {
  122. this.$confirm('确认撤销投诉?', '警告', {
  123. confirmButtonText: '确定',
  124. cancelButtonText: '取消',
  125. type: 'warning',
  126. }).then(() => {
  127. this.$api.assetsComplaint.cancelComplaint(id).then((res) => {
  128. if (res.code === 200 && res.data) {
  129. this.$notify({
  130. title: '成功',
  131. message: '撤销成功!',
  132. type: 'success',
  133. duration: 3000,
  134. });
  135. this.getList();
  136. }
  137. });
  138. });
  139. },
  140. // 确认投诉
  141. confirm(id) {
  142. this.$confirm('确认投诉属实?', '警告', {
  143. confirmButtonText: '确定',
  144. cancelButtonText: '取消',
  145. type: 'warning',
  146. }).then(() => {
  147. this.$api.assetsComplaint.confirmComplaint(id).then((res) => {
  148. if (res.code === 200 && res.data) {
  149. this.$notify({
  150. title: '成功',
  151. message: '确认成功!',
  152. type: 'success',
  153. duration: 3000,
  154. });
  155. this.getList();
  156. }
  157. });
  158. });
  159. },
  160. },
  161. };
  162. </script>
  163. <style lang="scss" scoped>
  164. /deep/.doWarehouseClass {
  165. border-radius: 10px;
  166. }
  167. .real-amount {
  168. /deep/ .el-form-item__label {
  169. color: red;
  170. font-weight: bold;
  171. }
  172. }
  173. </style>