Java教程 JavaEE项目 7_旅游网_线路详细图片处理 学习猿地原创

那么接下来呢，我们来实现最后一个功能，旅游线路的详细图片的一个这个功能，就点击我们这一块啊，查看多张图片的时候，这块应该是我们没有了，没有，然后我们来选择一下。当我们选择这边，我们选择四张大图。好，它会显示我们的四张详细大图，这边呢，我们同样的选择，选择我们的四张小图。那么在这一块呢，就是我们提交。提交以后呢，我们再打开。我们这这张图片，我们想换它的时候，它是什么样的，比如说我们在这边呢，我们。来再选择一下，我们选择两两张图片打开。它就变成了两张图片，这边呢，同样的我们选择两张图片。

给它打开这块呢，也是两张图片，那它这这一块的这个实现逻辑是什么呢？它是先将我们之前的四张大图先给它删掉，删掉了以后呢，再给它重新再给它增加上来，我们来写一下这个实验的这个逻辑。那么在我们的。我们来先来看一下叉ML文件当中，之前已经就定义过这个逻辑了，我们来找一下我们的叉ML。这块在这块呢，我们已经查出来，我们就是一个线路多张图片的这个逻辑，然后呢，我们。先来写service，找到我们的service。接口，然后呢，我们这个是叫。

叫我们的。Root。Img root。这块呢，我们给它直接返回Y就行，然后叫save。啊。在这边呢，我们需要先删除它的图片，根据它的ID删除图片，然后我们再进行增加我们的引T，先找到它。找到我们的R。然后呢，我们这边一个list，然后呢是我们的root image。

Img，这个。这个呢是我们处理图片的，呃，处理我们线路图片，然后呢，我们这一块2D呢，是我们的线路的ID，我们的root美景呢，是我们要添加的线路图片列表。这个呢是我们的service，然后呢我们再来。这块有有报错。哪个地方啊，这块是我们的中文。然后呢，来实现我们的。说方法。

看一下这个这一块。啊，这块有。Root image。这块是啊，这怎么还写到这块。没问题，然后呢，找到我们的root service image，然后需要在我们下边添加。我们这个方法，然后呢，我们来实现它的这个service方法，我们叫。Img service。IP。没问题，然后呢，在这边先把它放到我们的容器当中，Service。这块呢，需要去来implement我们的route。Img。

MG。这个，然后呢，我们来。实现它这个方法，首先我们先给它注入。祝我们的DA。我们的root。I'mg。在这一块呢，我们需要用到我们的事物，因为我们在删除的时候同时要添加要保证它这个数据的这个原子性transaction。

我们的RD。然后呢，用调用我们的这边我们叫。DA。调用它的删除的方法，Delete，然后呢，这一块还是用到我们之前的批量删除。我们的WP。S。然后呢，我们这边。是我们的img query。Query，然后呢？一。我们的RD。

然后来循环。我们说直接来写吧，T，我们的RG。啊。这块呢，是我们的img。调用我们的内置的添加方法。然后把我们这个传进来。可以了。那么在这一块呢？我们还涉及到一个就是我们进来修改的时候，我查看这个图的，查看这个大图的时候，它会涉及到一个回显的问题，我们回显的问题的话。

来看一下在我们的XML映射映射文件中。来找一下。在这当我们回显的话，我们会调用我们的发白ID。我们的fight by ID这个方法，然后呢，就会呢，来走我们这个这一块。来看一下我们的controller这一块。我们的肉，Controller在这一块。对，他就会去执行这边，那么在删除的时候呢，他就会走我们这块我们的D这块我们的找一下我们的XML文件。他就会走我们的result map，这个先把它查出来，我们走我们的8ID，然后我们这块的话呢，还缺少一个我们的control controller在这一块下来。

它呢，会根据我们的ID加载我们这个线路，然后存进去。那这个时候呢，我们就会跳到我们的前端页面来回显这个线路图，我们来看一下它是怎么回显的我们的HTML。我们在这块呢，使用我们feel input的回显功能，它是怎么回显的，我们来看一下啊，一个呢是我们的详细大图，那一个呢是我们的详细小图，我们这一块的采用我们内联的方式。得到我们这个root image list，那这个呢，是我们的后台查询的图片列表，那我们得到这个image list这个对象呢，那它传过来的时候是一个我们的精神对象啊，那我们得到了这个对象以后呢，把我们的小图拿出来，放到我们的数组里边，大图呢，拿出来以后也放到我们的数组里边，那然后呢，把它们分别拿出来，把这个大图和小图分别拿出来，放到我们的大图的feel input里边和我们的小图input里边。

那最后呢，来放到我们在这儿，放到我们这个f input。我们回想的这个里边。那这个这个呢，这个overright，我们以你手呢是回呃，覆盖掉我们之前回显的数据。那我们这个mean count呢，是我们上传文件最少的个数，Max count呢，是我们最多能上传的文件的个数，就是说我们这边最少传一张，最多呢只能传上传我们的四张，那这个里边呢，还有一个比较重要的属性，我们往上看来看一下。应该是在我们的这一块，我们这边要需要使用多个文件上传的话，必须得在我们文件域当中啊。

叫叫做我们的这个呢，是我们HH5的属性。那有了这个属性以后呢，就表示我们可以进行多文件来上传，好接下来呢，我们来看一下这个功能，打开我们浏览器。然后我们这个8001选择我们的旅游线路。然后点开。点开以后这个没有，我们来看一下啊，看一下别的。别的这一块的话呢，是有一张我们来选择我们的。选择文件。我们选择两张打开。诶，没问题。我们再来选择文件。两照。

好的可以，然后呢，我们来点击我们的旅游线路。看我们之前的这个上传的这个图片呢，我们也是可以进行回显的，那么我们再来看一个。那么这个。可以看到可以回显的，那接下来的话呢，我们来实现我们图片保存的这个功能。我们的来看一下我们的root ctrl，我们先把方法先放进来。好，我们注入进来。我们来看一下是不是需要导包这个。不需要。这一块呢。

有用。然后这一个呢，我们来看一下。那么这一块的话呢。应该是少了，少倒一个我们的root image service。这款。我出入。好。来我们看保存图片，我们的对也没这个，首先我们得到了这个大图在页面中上传的多张图片，这个是小图在页面中上传的多张图片，那么然后呢，我们对这些数组进行循环，并且呢，来给它做一些随机数字的一些处理，这个逻辑和我们之前写的。

那个是一样的。那么这些构建好了以后呢，我们再构建一个root image对象。这块我们构建完以后，这个root image对象以后呢，把我们这个大图的相对路径和我们小图的相对路径都存储到我们的root image里边，然后呢，放到我们新构建的这个图片里边当中。那最后呢，来调用我们的service方法，它这块呢，是通过我们的ID先查查，查完以后呢，先删掉我们的原图，然后呢，再把我们的新的图片再放进去，然后呢，我们来看一下效果，我们重新启动一下。

好，我们启动完毕，启动完毕以后呢，我们来看一下效果，刷新一下。刷新完以后呢，我们点击旅游线路，然后呢，我们就选择第一个。这没图片，我们来选择一下。重新下载的时候给他删掉了。注意啊，我们这个图片不能超过四张，我们先选择四张大图，然后我们再选择四张小图打开，然后呢，我们进行提交。诶好，然后呢，我们再回来过来再来看我们四张大图。

这个回显也出来了，然后呢，我们再选择文件。它呢是先进行删除，再进行添加，我们选择两兆。打开。厂章，然后呢，我们来进行提交。OK，没有问题，那这个呢，是我们呃，详细图片的这个功能。