09. 开发电影信息管理

583 字约 2 分钟读完1761 次阅读更新于 2026/5/3

先创建数据库 SQL 表

CREATE TABLE `film` (
  `id` int(11) NOT NULL AUTO_INCREMENT COMMENT 'ID',
  `name` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '名称',
  `cover` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '封面',
  `descr` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '描述',
  `year` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '年份',
  `director` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '导演',
  `actors` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '演员',
  `category_id` int(11) DEFAULT NULL COMMENT '分类ID',
  `country` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '国家',
  `language` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '语言',
  `date` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '上映日期',
  `duration` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '片长',
  `imdb` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT 'IMDb',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci COMMENT='电影信息';
INSERT INTO `film` VALUES (1, '凡间天使 Ordinary Angels ', 'http://localhost:9090/files/download/1721894575859-凡间天使.webp', '灵感来自于一个令人难以置信的真实故事:一位美发师单枪匹马地召集整个社区来帮助一位丧偶的父亲拯救他病危小女儿的生命。', '2024', ' 乔·戈恩', '希拉里·斯万克 / 阿兰·里奇森 / 艾米丽·米切尔 / 天行者·休斯 / 塔玛拉·琼斯 / 唐·迈克 / 瑞恩·艾伦 / 德鲁·鲍威尔 / 邓普斯·布瑞克 / 艾米·阿克 / 埃里克·阿塔瓦尔 / 沙龙·巴杰 / 黛安娜·博特尔奥-若班斯基 / DJ·布拉德森 / 大卫·劳伦斯·布朗 / 特里斯坦·卡尔鲁奇 / 劳利格·克莱门茨 / 格温多琳·柯林斯', 9, '美国', '英语', '2024-02-23', '116分钟', 'tt4996328');
INSERT INTO `film` VALUES (2, '头脑特工队2 Inside Out 2 ', 'http://localhost:9090/files/download/1721897318957-头脑特工队2.webp', '影片讲述了刚步入青春期的小女孩莱莉脑海中的复杂情绪进行的一场奇妙冒险。在她的大脑总部,正经历着一场突如其来的大拆迁,为意想不到的新情绪腾出空间。一直以来配合默契的情绪小伙伴乐乐(艾米·波勒 Amy Poehler 配音)、忧忧(菲利丝·史密斯 Phyllis Smith 配音)、怒怒(刘易斯·布莱克 Lewis Black 配音)、怕怕(托尼·海尔 Tony Hale 配音)和厌厌(莉萨·拉皮拉 Liza Lapira 配音),在新情绪焦焦的突然到来时变得不知所措,并且她看起来不是孤身一人。', '2024', '凯尔西·曼', '艾米·波勒 / 玛雅·霍克 / 肯辛顿·托尔曼 / 莉萨·拉皮拉 / 托尼·海尔 / 刘易斯·布莱克 / 菲利丝·史密斯 / 阿尤·艾德维利 / 莉莉玛 / 格蕾丝·陆 / 苏梅亚·努里丁-格林 / 阿黛尔·艾克萨勒霍布洛斯 / 保罗·沃尔特·豪泽 / 朱恩·斯奎布 / 戴安·琳恩 / 凯尔·麦克拉克伦 / 伊薇特·尼科尔·布朗 / 罗恩·芬奇斯 / 詹姆士·奥斯汀·约翰逊 / 叶永 / 史蒂夫·波赛尔', 8, '美国', '英语', '2024-06-14', '100分钟', 'tt22022452');
INSERT INTO `film` VALUES (3, '机器人之梦 Robot Dreams', 'http://localhost:9090/files/download/1721897462531-机器人之梦.webp', '一只孤独的小狗遇到了一个机器人,偌大的城市中,他们互相依靠,温暖彼此。然而一次意外让小狗和机器人遗憾错过,从此他们只能把对彼此的想念藏进梦中。只是,反复梦见的人,还会重逢吗?\n  影片改编自Sara Varon的漫画。', '2023', '巴勃罗·贝格尔', '伊万·拉班达 / 阿尔伯特·特里佛·塞加拉 / 拉法·卡尔沃 / 何塞·加西亚·托斯 / 何塞·路易斯·梅地亚维拉 / 加西埃拉·莫利娜 / 埃斯特·索兰斯', 8, '西班牙 / 法国', '无对白', '2023-12-06', '102分钟', 'tt13429870');
INSERT INTO `film` VALUES (4, '神偷奶爸4 Despicable Me 4', 'http://localhost:9090/files/download/1721897598128-神偷奶爸4.webp', '格鲁(史蒂夫·卡瑞尔 Steve Carell 配音)和露西(克里斯汀·韦格 Kristen Wiig 配音)一家即将展开家庭生活的新篇章,迎接新成员“迷你格鲁”,而这个小宝宝也会用尽方法折磨格鲁这个新手老爸。新反派恶霸麦斯(威尔·法瑞尔 Will Ferrell 配音)和他既致命危险又美丽性感的女友华伦天娜(索菲娅·维加拉 Sofía Vergara 配音)来势汹汹,格鲁一家面临未知危险。此时,全新超级小黄人重磅亮相,成为帮助格鲁一家度过这次危机的“秘密武器”。一场惊险刺激、笑料百出的全新冒险即将展开。', '2024', '克里斯·雷纳德 / 帕特里克·德拉吉', '史蒂夫·卡瑞尔 / 克里斯汀·韦格 / 皮埃尔·柯芬 / 乔伊·金 / 威尔·法瑞尔 / 索菲娅·维加拉 / 克里斯·雷纳德 / 麦迪逊·波兰 / 达纳·盖尔 / 米兰达·卡斯格拉夫 / 史蒂夫·库根 / 史蒂芬·科拜尔 / 克洛伊·菲内曼 / 约翰·迪·马吉欧 / 拉瑞恩·纽曼 / 布拉德·埃布尔森 / Eden Boulton / 凯茜·卡瓦蒂妮 / Will Collyer / Abby Craden', 1, '美国', '英语', '2024-07-03', '97分钟', 'tt7510222');
INSERT INTO `film` VALUES (5, '你的名字。 君の名は。', 'http://localhost:9090/files/download/1721897785262-你的名字.webp', ' 在远离大都会的小山村,住着巫女世家出身的高中女孩宫水三叶(上白石萌音 配音)。校园和家庭的原因本就让她充满烦恼,而近一段时间发生的奇怪事件,又让三叶摸不清头脑。不知从何时起,三叶在梦中就会变成一个住在东京的高中男孩。那里有陌生的同学和朋友,有亲切的前辈和繁华的街道,一切都是如此诱人而真实。另一方面,住在东京的高中男孩立花泷(神木隆之介 配音)则总在梦里来到陌生的小山村,以女孩子的身份过着全新的生活。许是受那颗神秘彗星的影响,立花和三叶在梦中交换了身份。他们以他者的角度体验着对方的人生,这期间有愤怒、有欢笑也有暖心。只是两人并不知道,身份交换的背后隐藏着重大而锥心的秘密……', '2016', '新海诚', '神木隆之介 / 上白石萌音 / 长泽雅美 / 市原悦子 / 成田凌 / 悠木碧 / 岛崎信长 / 石川界人 / 谷花音 / 寺杣昌纪 / 大原沙耶香 / 井上和彦 / 茶风林 / 加藤有花 / 花泽香菜 / 寺崎裕香', 7, '日本', '日语', '2016-08-26', '106分钟', 'tt5311514');
INSERT INTO `film` VALUES (6, '沙丘2 Dune: Part Two', 'http://localhost:9090/files/download/1721897822309-沙丘2.webp', '《沙丘2》承接第一部剧情,讲述保罗·厄崔迪(提莫西·查拉梅 Timothée Chalamet 饰)被帕迪沙皇帝和哈克南人联手灭族后,在厄拉科斯星球遇到弗雷曼女战士契妮(赞达亚 Zendaya 饰)以及加入弗雷曼人后展开的传奇旅程。保罗与让他家破人亡的阴谋家们开战,同时面临着一生所爱与已知宇宙命运的两难选择。', '2024', ' 丹尼斯·维伦纽瓦', '提莫西·查拉梅 / 赞达亚 / 丽贝卡·弗格森 / 哈维尔·巴登 / 乔什·布洛林 / 奥斯汀·巴特勒 / 弗洛伦丝·皮尤 / 戴夫·巴蒂斯塔 / 克里斯托弗·沃肯 / 蕾雅·赛杜 / 斯特兰·斯卡斯加德 / 夏洛特·兰普林 / 安雅·泰勒-乔伊 / 索海拉·雅各布 / 巴布斯·奥卢桑莫昆 / 袁之正 / 艾莉森·霍尔斯特德 / 朱西·梅里 / 凯特·泰森 / 塔拉·布雷思纳克 / Akiko Hitomi', 5, '美国 / 加拿大', '英语', '2024-03-01', '166分钟', 'tt15239678');
INSERT INTO `film` VALUES (7, '疯狂的麦克斯:狂暴女神 Furiosa: A Mad Max Saga', 'http://localhost:9090/files/download/1721898011046-疯狂的麦克斯:狂暴女神.webp', '影片讲述了复仇女神弗瑞奥萨(安雅·泰勒-乔伊 Anya Taylor-Joy 饰)惊心动魄的成长史。年轻的弗瑞奥萨从原本的家园被掠走,落入军阀狄门特斯(克里斯·海姆斯沃斯 Chris Hemsworth 饰)领导的帮派手中,在穿过荒原时,他们来到不死老乔(拉黑·休姆 Lachy H ulme 饰)所掌管的堡垒。在两位暴君争夺统治地位的同时,弗瑞奥萨必须在重重考验中活下来,并想方设法寻找回家的路;她也逐渐成长为利落酷飒的狂暴女神。', '2024', '乔治·米勒', '安雅·泰勒-乔伊 / 克里斯·海姆斯沃斯 / 汤姆·伯克 / 艾莉拉·布朗 / 乔治·谢夫佐夫 / 拉黑·休姆 / 约翰·霍华德 / 安格斯·桑普森 / 查理·弗雷泽 / 埃尔莎·帕塔奇 / 内森·琼斯 / 乔什·赫尔曼 / 大卫·菲尔德 / 拉赫尔·罗曼 / 戴维·科林斯 / 戈兰·D·克鲁特 / CJ·布隆菲尔德 / 马图斯 / 伊恩·罗伯茨', 4, '澳大利亚 / 美国', '英语', '2024-05-24', '148分钟', 'tt12037194');

本节课图片资源

https://pan.baidu.com/s/1UWN3K0rxCLROZaHTTDr2Dg?pwd=3n8c

后端的增删改查接口

entity、controller、service、mapper、mapper.xml

mapper.xml 示例代码:
image.png

前端页面和菜单

table

<el-table :data="data.tableData" stripe>
  <el-table-column prop="name" label="名称" />
  <el-table-column prop="cover" label="封面">
    <template #default="scope">
      <el-image :src="scope.row.cover" style="width: 40px; height: 40px; border-radius: 5px" :preview-src-list="[scope.row.cover]" preview-teleported></el-image>
    </template>
  </el-table-column>
  <el-table-column prop="descr" label="描述" show-overflow-tooltip />
  <el-table-column prop="year" label="年份" />
  <el-table-column prop="director" label="导演" />
  <el-table-column prop="actors" label="演员" show-overflow-tooltip />
  <el-table-column prop="categoryName" label="分类" />
  <el-table-column prop="country" label="国家" />
  <el-table-column prop="language" label="语言" />
  <el-table-column prop="date" label="上映日期" />
  <el-table-column prop="duration" label="片长" />
  <el-table-column prop="imdb" label="IMDb" />
  <el-table-column label="操作" width="160">
    <template #default="scope">
      <el-button type="primary" @click="handleEdit(scope.row)">编辑</el-button>
      <el-button type="danger" @click="del(scope.row.id)">删除</el-button>
    </template>
  </el-table-column>
</el-table>

form

<el-form :model="data.form" label-width="80px" style="padding-right: 20px">
  <el-form-item label="名称">
    <el-input v-model="data.form.name" autocomplete="off" placeholder="请输入名称" />
  </el-form-item>
  <el-form-item label="封面" prop="cover">
    <el-upload :action="uploadUrl" list-type="picture" :on-success="handleImgSuccess">
      <el-button type="primary">上传图片</el-button>
    </el-upload>
  </el-form-item>
  <el-form-item label="描述">
    <el-input v-model="data.form.descr" autocomplete="off" placeholder="请输入描述" />
  </el-form-item>
  <el-form-item label="年份">
    <el-input v-model="data.form.year" autocomplete="off" placeholder="请输入年份" />
  </el-form-item>
  <el-form-item label="导演">
    <el-input v-model="data.form.director" autocomplete="off" placeholder="请输入导演" />
  </el-form-item>
  <el-form-item label="演员">
    <el-input v-model="data.form.actors" autocomplete="off" placeholder="请输入演员" />
  </el-form-item>
  <el-form-item label="分类">
    <el-input v-model="data.form.categoryId" autocomplete="off" placeholder="请输入分类" />
  </el-form-item>
  <el-form-item label="国家">
    <el-input v-model="data.form.country" autocomplete="off" placeholder="请输入国家" />
  </el-form-item>
  <el-form-item label="语言">
    <el-input v-model="data.form.language" autocomplete="off" placeholder="请输入语言" />
  </el-form-item>
  <el-form-item label="上映日期">
    <el-date-picker style="width: 100%" type="date" v-model="data.form.date" placeholder="请选择上映日期" format="YYYY-MM-DD" value-format="YYYY-MM-DD"></el-date-picker>
  </el-form-item>
  <el-form-item label="片长">
    <el-input v-model="data.form.duration" autocomplete="off" placeholder="请输入片长" />
  </el-form-item>
  <el-form-item label="IMDb">
    <el-input v-model="data.form.imdb" autocomplete="off" placeholder="请输入IMDb" />
  </el-form-item>
</el-form>