index.vue 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161
  1. <template>
  2. <div class="mainContentBox">
  3. <avue-crud
  4. ref="crudRef"
  5. v-model:search="search"
  6. v-model="form"
  7. :data="data"
  8. :option="option"
  9. v-model:page="page"
  10. @row-save="createRow"
  11. @row-update="updateRow"
  12. @row-del="deleteRow"
  13. @search-change="searchChange"
  14. @search-reset="resetChange"
  15. @size-change="dataList"
  16. @current-change="dataList"
  17. @selection-change="selectionChange"
  18. >
  19. <template #menu="{ size, row, index }">
  20. <el-button
  21. v-if="row.state === '0' && row.userName === userStore.user.username"
  22. type="primary"
  23. link
  24. size="small"
  25. @click="test(row, 0)"
  26. ><i-ep-edit />处理
  27. </el-button>
  28. </template>
  29. </avue-crud>
  30. <el-dialog
  31. v-model="dialog1.visible"
  32. :title="dialog1.title"
  33. width="950px"
  34. @close="dialog1.visible = false"
  35. >
  36. <choice-item-page enabled="" @materialInfo="materialInfo"/>
  37. </el-dialog>
  38. </div>
  39. </template>
  40. <script setup>
  41. import { ref, getCurrentInstance } from "vue";
  42. import { useCrud } from "@/hooks/userCrud";
  43. import { useCommonStoreHook,useUserStoreHook} from "@/store";
  44. const { isShowTable, tableType } = toRefs(useCommonStoreHook());
  45. const userStore = useUserStoreHook();
  46. const test = (row) => {
  47. ElMessageBox.confirm("你确定要处理当前消息吗", "提示", {
  48. confirmButtonText: "确定",
  49. cancelButtonText: "取消",
  50. type: "warning",
  51. }).then(() => {
  52. row.state = 1;
  53. form.value = row
  54. updateRow(row).then((res)=>{
  55. dataList()
  56. });
  57. });
  58. };
  59. // 传入一个url,后面不带/
  60. const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
  61. useCrud({
  62. src: "/api/v1/warningInfo",
  63. });
  64. const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } = Methords; //增删改查
  65. const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
  66. const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
  67. const dialog1 = reactive({
  68. title: "物料选择",
  69. visible: false,
  70. });
  71. const materialInfo = (value) => {
  72. form.value.code = value.materialCode
  73. form.value.name = value.materialName
  74. form.value.unit = value.unitDictValue
  75. dialog1.visible = false
  76. }
  77. const crudRef = ref(null); //crudRef.value 获取avue-crud对象
  78. // 设置表格列或者其他自定义的option
  79. option.value = Object.assign(option.value, {
  80. delBtn: false,
  81. selection: false,
  82. editBtn: false,
  83. viewBtn: false,
  84. addBtn: false,
  85. column: [
  86. {
  87. label: "物料编码",
  88. prop: "materialCode",
  89. width: 150,
  90. overHidden: true,
  91. search: true,
  92. },
  93. {
  94. label: "物料名称",
  95. prop: "materialName",
  96. search: true,
  97. width: 150,
  98. overHidden: true,
  99. disabled: true,
  100. },
  101. {
  102. label: "物料型号",
  103. prop: "materialModel",
  104. search: true,
  105. width: 150,
  106. overHidden: true,
  107. disabled: true,
  108. rules: [
  109. {
  110. required: true,
  111. message: "物料名称不能为空",
  112. trigger: "trigger",
  113. },
  114. ],
  115. },
  116. {
  117. label: "预警信息",
  118. prop: "warningInfo",
  119. },
  120. {
  121. label: "处理人",
  122. prop: "userName",
  123. search: true,
  124. display: false
  125. },
  126. {
  127. label: "状态",
  128. prop: "state",
  129. type: 'select',
  130. dicData: [{label: '未处理',value : '0'},{label: '已处理', value : '1'}],
  131. },
  132. {
  133. label: "创建时间",
  134. prop: "created",
  135. width: 180,
  136. display: false
  137. },
  138. {
  139. label: "处理时间",
  140. prop: "updated",
  141. width: 180,
  142. html: true,
  143. formatter: (val) => {
  144. if (val.state === "1") {
  145. return val.updated
  146. } else {
  147. return '';
  148. }
  149. },
  150. },
  151. ],
  152. });
  153. onMounted(() => {
  154. // console.log("crudRef", crudRef)
  155. dataList();
  156. });
  157. </script>