index.vue 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
  1. <!-- 运营管理 协议管理 -->
  2. <template>
  3. <div class="app-container">
  4. <el-button
  5. type="primary"
  6. icon="el-icon-plus"
  7. size="mini"
  8. @click="getDetail()"
  9. v-hasPermi="['operation:agreement:add']"
  10. >新增</el-button
  11. >
  12. <!-- 列表 -->
  13. <el-table :data="tableData" v-loading="loading">
  14. <el-table-column label="序号" align="center" type="index" />
  15. <el-table-column label="协议名称" align="center" prop="name" />
  16. <el-table-column
  17. label="协议类型"
  18. align="center"
  19. prop="type"
  20. :formatter="typeFormatter"
  21. />
  22. <el-table-column label="更新时间" align="center" prop="updateTime" />
  23. <el-table-column label="创建时间" align="center" prop="createTime" />
  24. <el-table-column label="操作" align="center">
  25. <template slot-scope="scope">
  26. <el-button type="text" @click="getDetail(scope.row.id, true)"
  27. >查看</el-button
  28. >
  29. <el-button
  30. type="text"
  31. @click="getDetail(scope.row.id)"
  32. v-hasPermi="['operation:agreement:edit']"
  33. >编辑</el-button
  34. >
  35. <el-button
  36. type="delete"
  37. @click="getDelete(scope.row)"
  38. v-hasPermi="['operation:agreement:delete']"
  39. >删除</el-button
  40. >
  41. </template>
  42. </el-table-column>
  43. </el-table>
  44. <pagination
  45. v-show="total > 0"
  46. :total="total"
  47. :page.sync="form.pageNum"
  48. :limit.sync="form.pageSize"
  49. @pagination="getList"
  50. />
  51. </div>
  52. </template>
  53. <script>
  54. import { list, remove } from "@/api/operation/agreement";
  55. import { dialogCallBack } from "@/utils/DialogUtil";
  56. export default {
  57. data() {
  58. return {
  59. // 遮罩层
  60. loading: false,
  61. // 表单
  62. form: {
  63. pageNum: 1,
  64. pageSize: 10,
  65. },
  66. // 列表
  67. tableData: [],
  68. // 总数据
  69. total: 0,
  70. // 协议类型
  71. typeOptions: [
  72. {
  73. value: 0,
  74. label: "用户协议",
  75. },
  76. {
  77. value: 1,
  78. label: "隐私协议",
  79. },
  80. {
  81. value: 2,
  82. label: "音乐服务许可协议",
  83. },
  84. {
  85. value: 3,
  86. label: "儿童隐私保护指南",
  87. },
  88. {
  89. value: 4,
  90. label: "VIP音乐服务协议",
  91. },
  92. {
  93. value: 5,
  94. label: "爱听付费协议",
  95. },
  96. {
  97. value: 6,
  98. label: "关于我们",
  99. },
  100. {
  101. value: 7,
  102. label: "第三方信息共享清单",
  103. },
  104. {
  105. value: 8,
  106. label: "已收集个人信息清单",
  107. },
  108. {
  109. value: 9,
  110. label: "连接设备提示",
  111. },
  112. {
  113. value: 10,
  114. label: "联通认证服务协议",
  115. },
  116. {
  117. value: 11,
  118. label: "电信认证服务协议",
  119. },
  120. {
  121. value: 12,
  122. label: "移动认证服务协议",
  123. },
  124. ],
  125. };
  126. },
  127. mounted() {
  128. this.getList();
  129. },
  130. methods: {
  131. // 列表
  132. getList() {
  133. this.loading = true;
  134. list(this.form).then((res) => {
  135. if (res.code === 0) {
  136. this.tableData = res.data.records;
  137. this.total = res.data.total;
  138. this.loading = false;
  139. }
  140. });
  141. },
  142. // 详情
  143. getDetail(id, boolean) {
  144. this.$router.push({
  145. path: `/operation/agreement/detail`,
  146. query: {
  147. id: id,
  148. boolean: boolean,
  149. },
  150. });
  151. },
  152. // 删除
  153. getDelete(row) {
  154. var that = this;
  155. dialogCallBack(that, function () {
  156. that
  157. .$confirm(`是否有删除${row.name}?`, "提示", {
  158. type: "warning",
  159. })
  160. .then(() => {
  161. remove(row.id).then((res) => {
  162. if (res.code === 0) {
  163. that.$message.success("删除成功!");
  164. that.getList();
  165. }
  166. });
  167. })
  168. .catch(() => {});
  169. });
  170. },
  171. // 字典翻译
  172. typeFormatter(row) {
  173. return this.selectDictLabel(this.typeOptions, row.type);
  174. },
  175. },
  176. };
  177. </script>