useNews.js 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388
  1. import { ref } from 'vue'
  2. import request from '@/utils/request'
  3. import { ElMessage } from 'element-plus'
  4. export function useNews() {
  5. const loading = ref(false)
  6. const articles = ref([])
  7. const article = ref({})
  8. const categories = ref([])
  9. const category = ref({})
  10. const pagination = ref({
  11. page: 1,
  12. limit: 20,
  13. total: 0
  14. })
  15. // 获取文章列表
  16. const getArticleList = async (params = {}) => {
  17. loading.value = true
  18. try {
  19. const response = await request.get('/news/news', {
  20. params: {
  21. page: Number(pagination.value.page),
  22. limit: Number(pagination.value.limit),
  23. ...params
  24. }
  25. })
  26. console.log('Articles API response:', response.data);
  27. // 处理各种可能的响应格式
  28. let articleData = [];
  29. let totalCount = 0;
  30. if (Array.isArray(response.data)) {
  31. // 直接返回数组
  32. articleData = response.data;
  33. totalCount = response.data.length;
  34. } else if (response.data && response.data.data) {
  35. if (Array.isArray(response.data.data)) {
  36. // 返回 {code, data: [...]} 格式
  37. articleData = response.data.data;
  38. totalCount = response.data.data.length;
  39. } else if (response.data.data.list && Array.isArray(response.data.data.list)) {
  40. // 返回 {code, data: {list: [...], total: number}} 格式
  41. articleData = response.data.data.list;
  42. totalCount = response.data.data.total || articleData.length;
  43. }
  44. }
  45. // 转换字段名称为小写
  46. const formattedList = convertKeysToLowerCase(articleData);
  47. console.log('Formatted article data:', formattedList);
  48. articles.value = formattedList;
  49. pagination.value.total = totalCount;
  50. if (articles.value.length === 0) {
  51. console.log('没有文章数据');
  52. } else {
  53. console.log('文章数据加载成功,数量:', articles.value.length);
  54. }
  55. return true; // 返回成功状态
  56. } catch (error) {
  57. console.error('获取文章列表失败:', error)
  58. ElMessage.error('获取文章列表失败')
  59. return false;
  60. } finally {
  61. loading.value = false
  62. }
  63. }
  64. // 获取文章详情
  65. const getArticleDetail = async (id) => {
  66. loading.value = true
  67. try {
  68. console.log('获取文章详情,ID:', id)
  69. const response = await request.get(`/news/news/${id}`)
  70. console.log('文章详情原始响应:', response)
  71. // 响应拦截器已经返回了处理后的数据,不需要再访问 .data
  72. console.log('文章详情响应处理后:', response)
  73. if (response && response.code === 200) {
  74. const articleData = response.data || {}
  75. article.value = articleData
  76. // 转换字段名称
  77. const convertedData = convertKeysToLowerCase(articleData)
  78. console.log('转换后的文章详情:', convertedData)
  79. return convertedData
  80. } else {
  81. ElMessage.error(response?.msg || '获取文章详情失败')
  82. return null
  83. }
  84. } catch (error) {
  85. console.error('获取文章详情失败:', error)
  86. ElMessage.error('获取文章详情失败')
  87. return null
  88. } finally {
  89. loading.value = false
  90. }
  91. }
  92. // 创建文章
  93. const createArticle = async (articleData) => {
  94. loading.value = true
  95. try {
  96. console.log('创建文章数据:', articleData)
  97. const response = await request.post('/news/news', articleData)
  98. console.log('创建文章原始响应:', response)
  99. // 响应拦截器已经返回了处理后的数据,不需要再访问 .data
  100. console.log('创建文章响应处理后:', response)
  101. // 后端返回成功
  102. if (response && response.code === 200) {
  103. ElMessage.success('创建文章成功')
  104. // 存储数据并返回true表示成功
  105. article.value = response.data || {}
  106. return true
  107. } else {
  108. ElMessage.error(response?.msg || '创建文章失败')
  109. return false
  110. }
  111. } catch (error) {
  112. console.error('创建文章失败:', error)
  113. ElMessage.error('创建文章失败')
  114. return false
  115. } finally {
  116. loading.value = false
  117. }
  118. }
  119. // 更新文章
  120. const updateArticle = async (id, articleData) => {
  121. loading.value = true
  122. try {
  123. console.log('更新文章数据:', articleData)
  124. const response = await request.put(`/news/news/${id}`, articleData)
  125. console.log('更新文章原始响应:', response)
  126. // 响应拦截器已经返回了处理后的数据,不需要再访问 .data
  127. console.log('更新文章响应处理后:', response)
  128. // 后端返回成功
  129. if (response && response.code === 200) {
  130. ElMessage.success('更新文章成功')
  131. // 存储数据并返回true表示成功
  132. article.value = response.data || {}
  133. return true
  134. } else {
  135. ElMessage.error(response?.msg || '更新文章失败')
  136. return false
  137. }
  138. } catch (error) {
  139. console.error('更新文章失败:', error)
  140. ElMessage.error('更新文章失败')
  141. return false
  142. } finally {
  143. loading.value = false
  144. }
  145. }
  146. // 删除文章
  147. const deleteArticle = async (id) => {
  148. loading.value = true
  149. try {
  150. const response = await request.delete(`/news/news/${id}`)
  151. console.log('删除文章原始响应:', response)
  152. // 响应拦截器已经返回了处理后的数据,不需要再访问 .data
  153. if (response && response.code === 200) {
  154. ElMessage.success('删除文章成功')
  155. return true
  156. } else {
  157. ElMessage.error(response?.msg || '删除文章失败')
  158. return false
  159. }
  160. } catch (error) {
  161. console.error('删除文章失败:', error)
  162. ElMessage.error('删除文章失败')
  163. return false
  164. } finally {
  165. loading.value = false
  166. }
  167. }
  168. // 转换大写字段为小写
  169. function convertKeysToLowerCase(data) {
  170. if (!data) return [];
  171. if (Array.isArray(data)) {
  172. return data.map(item => {
  173. const newItem = {};
  174. Object.keys(item).forEach(key => {
  175. // 处理大写字段名
  176. // 多种情况处理:ID、Id、NAME、Name等
  177. let newKey = key;
  178. if (key === key.toUpperCase()) {
  179. // 全部大写的情况,如ID -> id
  180. newKey = key.toLowerCase();
  181. } else if (key.charAt(0) === key.charAt(0).toUpperCase()) {
  182. // 首字母大写的情况,如Name -> name
  183. newKey = key.charAt(0).toLowerCase() + key.slice(1);
  184. }
  185. newItem[newKey] = item[key];
  186. });
  187. // 调试日志
  188. if (newItem.id) {
  189. console.log('转换后的分类项:', newItem);
  190. }
  191. return newItem;
  192. });
  193. } else {
  194. const newItem = {};
  195. Object.keys(data).forEach(key => {
  196. let newKey = key;
  197. if (key === key.toUpperCase()) {
  198. newKey = key.toLowerCase();
  199. } else if (key.charAt(0) === key.charAt(0).toUpperCase()) {
  200. newKey = key.charAt(0).toLowerCase() + key.slice(1);
  201. }
  202. newItem[newKey] = data[key];
  203. });
  204. return newItem;
  205. }
  206. }
  207. // 获取分类列表
  208. const getCategoryList = async () => {
  209. loading.value = true
  210. try {
  211. const response = await request.get('/news/category')
  212. console.log('Category API response:', response.data);
  213. // 处理各种可能的响应格式
  214. let categoryData;
  215. if (Array.isArray(response.data)) {
  216. // 直接返回数组
  217. categoryData = response.data;
  218. } else if (response.data && response.data.data && Array.isArray(response.data.data)) {
  219. // 返回 {code, data} 对象
  220. categoryData = response.data.data;
  221. } else if (response.data && response.data.code === 200) {
  222. // 返回 {code, data} 对象
  223. categoryData = response.data.data || [];
  224. } else {
  225. categoryData = [];
  226. }
  227. // 转换字段名称为小写
  228. const formattedData = convertKeysToLowerCase(categoryData);
  229. console.log('Formatted category data:', formattedData);
  230. categories.value = formattedData;
  231. if (categories.value.length === 0) {
  232. console.log('没有分类数据');
  233. } else {
  234. console.log('分类数据加载成功,数量:', categories.value.length);
  235. }
  236. return true;
  237. } catch (error) {
  238. console.error('获取分类列表失败:', error);
  239. ElMessage.error('获取分类列表失败');
  240. return false;
  241. } finally {
  242. loading.value = false;
  243. }
  244. }
  245. // 获取分类详情
  246. const getCategoryDetail = async (id) => {
  247. loading.value = true
  248. try {
  249. const { data } = await request.get(`/news/category/${id}`)
  250. if (data.code === 200) {
  251. const formattedData = convertKeysToLowerCase(data.data);
  252. category.value = formattedData;
  253. return formattedData;
  254. } else {
  255. ElMessage.error(data.msg || '获取分类详情失败')
  256. return null
  257. }
  258. } catch (error) {
  259. console.error('获取分类详情失败:', error)
  260. ElMessage.error('获取分类详情失败')
  261. return null
  262. } finally {
  263. loading.value = false
  264. }
  265. }
  266. // 创建分类
  267. const createCategory = async (categoryData) => {
  268. loading.value = true
  269. try {
  270. const response = await request.post('/news/category', categoryData)
  271. console.log('创建分类原始响应:', response)
  272. // 响应拦截器已经返回了处理后的数据,不需要再访问 .data
  273. if (response && response.code === 200) {
  274. ElMessage.success('创建分类成功')
  275. const formattedData = convertKeysToLowerCase(response.data);
  276. return formattedData;
  277. } else {
  278. ElMessage.error(response?.msg || '创建分类失败')
  279. return null
  280. }
  281. } catch (error) {
  282. console.error('创建分类失败:', error)
  283. ElMessage.error('创建分类失败')
  284. return null
  285. } finally {
  286. loading.value = false
  287. }
  288. }
  289. // 更新分类
  290. const updateCategory = async (id, categoryData) => {
  291. loading.value = true
  292. try {
  293. const response = await request.put(`/news/category/${id}`, categoryData)
  294. console.log('更新分类原始响应:', response)
  295. // 响应拦截器已经返回了处理后的数据,不需要再访问 .data
  296. if (response && response.code === 200) {
  297. ElMessage.success('更新分类成功')
  298. const formattedData = convertKeysToLowerCase(response.data);
  299. return formattedData;
  300. } else {
  301. ElMessage.error(response?.msg || '更新分类失败')
  302. return null
  303. }
  304. } catch (error) {
  305. console.error('更新分类失败:', error)
  306. ElMessage.error('更新分类失败')
  307. return null
  308. } finally {
  309. loading.value = false
  310. }
  311. }
  312. // 删除分类
  313. const deleteCategory = async (id) => {
  314. loading.value = true
  315. try {
  316. const response = await request.delete(`/news/category/${id}`)
  317. console.log('删除分类原始响应:', response)
  318. // 响应拦截器已经返回了处理后的数据,不需要再访问 .data
  319. if (response && response.code === 200) {
  320. ElMessage.success('删除分类成功')
  321. return true
  322. } else {
  323. ElMessage.error(response?.msg || '删除分类失败')
  324. return false
  325. }
  326. } catch (error) {
  327. console.error('删除分类失败:', error)
  328. ElMessage.error('删除分类失败')
  329. return false
  330. } finally {
  331. loading.value = false
  332. }
  333. }
  334. return {
  335. loading,
  336. articles,
  337. article,
  338. categories,
  339. category,
  340. pagination,
  341. getArticleList,
  342. getArticleDetail,
  343. createArticle,
  344. updateArticle,
  345. deleteArticle,
  346. getCategoryList,
  347. getCategoryDetail,
  348. createCategory,
  349. updateCategory,
  350. deleteCategory
  351. }
  352. }